{"version":3,"file":"Stack.cjs","sources":["../../../../src/components/Layout/Stack/Stack.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithRef,\n  type ComponentType,\n  type PropsWithChildren,\n  forwardRef,\n  useMemo,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { useSectionWrapper } from '../../SectioningContent'\n\nimport type { Gap } from '../../../types'\n\nconst classNameGenerator = tv({\n  base: 'shr-flex-col shr-justify-start [&_>_*]:shr-my-0',\n  variants: {\n    inline: {\n      true: 'shr-inline-flex',\n      false: 'shr-flex',\n    },\n    gap: {\n      0: 'shr-space-y-0',\n      0.25: 'shr-space-y-0.25',\n      0.5: 'shr-space-y-0.5',\n      0.75: 'shr-space-y-0.75',\n      1: 'shr-space-y-1',\n      1.25: 'shr-space-y-1.25',\n      1.5: 'shr-space-y-1.5',\n      2: 'shr-space-y-2',\n      2.5: 'shr-space-y-2.5',\n      3: 'shr-space-y-3',\n      3.5: 'shr-space-y-3.5',\n      4: 'shr-space-y-4',\n      8: 'shr-space-y-8',\n      X3S: 'shr-space-y-0.25',\n      XXS: 'shr-space-y-0.5',\n      XS: 'shr-space-y-1',\n      S: 'shr-space-y-1.5',\n      M: 'shr-space-y-2',\n      L: 'shr-space-y-2.5',\n      XL: 'shr-space-y-3',\n      XXL: 'shr-space-y-3.5',\n      X3L: 'shr-space-y-4',\n    } as { [key in Gap]: string },\n    align: {\n      start: 'shr-items-start',\n      'flex-start': 'shr-items-start',\n      end: 'shr-items-end',\n      'flex-end': 'shr-items-end',\n      center: 'shr-items-center',\n      baseline: 'shr-items-baseline',\n      stretch: 'shr-items-stretch',\n    },\n  },\n})\n\ntype Props = VariantProps<typeof classNameGenerator> &\n  PropsWithChildren<{\n    as?: string | ComponentType<any>\n  }> &\n  ComponentPropsWithRef<'div'>\n\nexport const Stack = forwardRef<HTMLDivElement, Props>(\n  ({ as: Component = 'div', inline = false, gap = 1, align, className, ...rest }, ref) => {\n    const actualClassName = useMemo(\n      () => classNameGenerator({ inline, align, gap, className }),\n      [align, className, gap, inline],\n    )\n\n    const Wrapper = useSectionWrapper(Component)\n    const body = <Component {...rest} ref={ref} className={actualClassName} />\n\n    if (Wrapper) {\n      return <Wrapper>{body}</Wrapper>\n    }\n\n    return body\n  },\n)\n"],"names":[],"mappings":";;;;;;;;;;AAeA;AACE;AACA;AACE;AACE;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAC2B;AAC7B;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACD;AACF;AACF;AAQM;AAEH;AAKA;AACA;;AAGE;;AAGF;AACF;;"}