// Auto-generated by: pnpm test:stylesheets:update
import { join } from 'node:path';

import { compileLessWithTokens } from '../../../scripts/testStylesheets/compileLessWithTokens';
import { DEFAULT_LESS_PRELUDES, DEFAULT_TOKEN_CSS_FILES } from '../../../scripts/testStylesheets/config';

describe('components/Stack/Stack.less stylesheet snapshot', () => {
  it('compiled CSS with tokens inlined', async () => {
    const css = await compileLessWithTokens(join(__dirname, 'Stack.less'), DEFAULT_TOKEN_CSS_FILES, {
      lessPreludes: DEFAULT_LESS_PRELUDES,
    });
    expect(css).toMatchTokensInlineSnapshot(`
.stack {
  --alignItems: start;
  --gap: 16px;
  --justifyContent: start;
  --maxWidth: min-content;
  --paddingBottom: 0px;
  --paddingLeft: 0px;
  --paddingRight: 0px;
  --paddingTop: 0px;
  display: flex;
  flex-direction: var(--flexDirection);
  flex-grow: var(--flexGrow);
  flex-shrink: var(--flexShrink);
  flex-wrap: var(--flexWrap);
  gap: var(--gap);
  align-items: var(--alignItems);
  justify-content: var(--justifyContent);
  width: min(var(--maxWidth), calc(100% - var(--paddingLeft) - var(--paddingRight)));
  padding: var(--paddingTop) var(--paddingRight) var(--paddingBottom) var(--paddingLeft);
}
.stack--alignItemsStart {
  --alignItems: start;
}
.stack--alignItemsCenter {
  --alignItems: center;
}
.stack--alignItemsEnd {
  --alignItems: end;
}
.stack--alignItemsStretch {
  --alignItems: stretch;
}
.stack--flexDirectionColumn {
  --flexDirection: column;
}
.stack--flexDirectionColumnReverse {
  --flexDirection: column-reverse;
}
.stack--flexDirectionRow {
  --flexDirection: row;
}
.stack--flexDirectionRowReverse {
  --flexDirection: row-reverse;
}
.stack--justifyContentStart {
  --justifyContent: start;
}
.stack--justifyContentCenter {
  --justifyContent: center;
}
.stack--justifyContentEnd {
  --justifyContent: end;
}
.stack--justifyContentSpaceBetween {
  --justifyContent: space-between;
}
.stack--justifyContentSpaceAround {
  --justifyContent: space-around;
}
.stack--justifyContentSpaceEvenly {
  --justifyContent: space-evenly;
}
.stack--noGap {
  --gap: 0px;
}
.stack--gap4xl {
  --gap: 48px;
}
.stack--gap3xl {
  --gap: 40px;
}
.stack--gapXxl {
  --gap: 32px;
}
.stack--gapXl {
  --gap: 24px;
}
.stack--gap,
.stack--gapLg {
  --gap: 16px;
}
.stack--gapMd {
  --gap: 12px;
}
.stack--gapSm {
  --gap: 8px;
}
.stack--gapXs {
  --gap: 4px;
}
.stack--gapXxs {
  --gap: 2px;
}
.stack--grow {
  --flexGrow: 1;
}
.stack--noGrow {
  --flexGrow: 0;
}
.stack--maxWidthFit,
.stack--maxWidthMedium,
.stack--maxWidthLarge {
  margin-right: auto;
  margin-left: auto;
}
.stack--maxWidthLarge {
  --maxWidth: 1150px;
}
.stack--maxWidthMedium {
  --maxWidth: 826px;
}
.stack--noPadding {
  --paddingBottom: 0px;
  --paddingLeft: 0px;
  --paddingRight: 0px;
  --paddingTop: 0px;
}
.stack--padding {
  --paddingBottom: 24px;
  --paddingLeft: 24px;
  --paddingRight: 24px;
  --paddingTop: 24px;
}
.stack--paddingVertical {
  --paddingBottom: 24px;
  --paddingTop: 24px;
}
.stack--paddingHorizontal {
  --paddingLeft: 24px;
  --paddingRight: 24px;
}
.stack--shrink {
  --flexShrink: 1;
}
.stack--noShrink {
  --flexShrink: 0;
}
.stack--wrap {
  --flexWrap: wrap;
}
.stack--noWrap {
  --flexWrap: nowrap;
}
.stack > .v2form,
.stack > .typography,
.stack > .systemMessage,
.stack > .tableWrapper > .table {
  margin-top: unset;
  margin-bottom: unset;
}
`);
  });
});