@postenbring/hedwig-react 0.0.65 → 0.0.66

package/dist/index.mjs

@@ -1,9 +1,19 @@
 import "./chunk-YWNVB7TY.mjs";
+import "./chunk-3D2MWIEX.mjs";
+import {
+  WarningBanner
+} from "./chunk-IAS3E2S3.mjs";
 import {
   TabsComponent
-} from "./chunk-VFFIUNR6.mjs";
-import "./chunk-UWTGHSWT.mjs";
-import "./chunk-MUVJAMFN.mjs";
+} from "./chunk-IFGQR4J6.mjs";
+import {
+  TabsContent,
+  TabsContents
+} from "./chunk-UWTGHSWT.mjs";
+import {
+  TabsList,
+  TabsTab
+} from "./chunk-CLXHNRAI.mjs";
 import "./chunk-XVFQWVHO.mjs";
 import {
   TextBody,
@@ -23,38 +33,48 @@ import {
 import {
   Text
 } from "./chunk-57SSGJ4X.mjs";
-import "./chunk-3D2MWIEX.mjs";
 import {
-  WarningBanner
-} from "./chunk-IAS3E2S3.mjs";
+  ModalComponent
+} from "./chunk-MRCE2Q7A.mjs";
+import "./chunk-2ICZ3Q7N.mjs";
 import {
   NavbarComponent
-} from "./chunk-TE5M6GJB.mjs";
+} from "./chunk-2JH4FG63.mjs";
 import {
   useNavbarExpendableMenuContext
-} from "./chunk-DEVTAZKG.mjs";
+} from "./chunk-X46LM2QH.mjs";
 import "./chunk-MGUYIOP2.mjs";
 import "./chunk-625SVQEP.mjs";
+import "./chunk-L4GQJETB.mjs";
+import {
+  Container
+} from "./chunk-I6GDRDYD.mjs";
+import {
+  HStack,
+  Stack,
+  VStack
+} from "./chunk-27XJO7E4.mjs";
+import "./chunk-XLLYMQLW.mjs";
+import {
+  Link
+} from "./chunk-5QL53TR2.mjs";
 import "./chunk-6QV3OV66.mjs";
 import {
   MessageComponent
 } from "./chunk-AR2NOI4U.mjs";
 import "./chunk-ME66RUR6.mjs";
-import {
-  ModalComponent
-} from "./chunk-QSYU64U4.mjs";
-import "./chunk-POJTVNEO.mjs";
 import {
   CardComponent
 } from "./chunk-JC6DBIFE.mjs";
+import "./chunk-X5JERDDU.mjs";
 import "./chunk-2YL2MVWN.mjs";
 import {
   DescriptionList
 } from "./chunk-XMB45ILT.mjs";
 import {
   FooterComponent
-} from "./chunk-U2MRMUB2.mjs";
-import "./chunk-EHUVLDIZ.mjs";
+} from "./chunk-RXIP2JTE.mjs";
+import "./chunk-BZRCDLEW.mjs";
 import {
   LinkList
 } from "./chunk-GJDRW6PA.mjs";
@@ -62,65 +82,60 @@ import {
   OrderedList,
   UnorderedList
 } from "./chunk-PMLDK3VC.mjs";
+import "./chunk-HT2EIJAD.mjs";
 import "./chunk-T24JZIQO.mjs";
+import "./chunk-BYEJZSG5.mjs";
+import {
+  Select
+} from "./chunk-RVJD2UZF.mjs";
 import "./chunk-AGZHQDCQ.mjs";
 import {
   Textarea
 } from "./chunk-RK6BB3HH.mjs";
+import "./chunk-7LPYJC6S.mjs";
+import {
+  Input
+} from "./chunk-6TI7ACBR.mjs";
+import "./chunk-Y5SUMFYJ.mjs";
+import "./chunk-SKI2APSK.mjs";
 import "./chunk-2KX7VFN2.mjs";
 import {
   Radiobutton
-} from "./chunk-RLUXDZ6X.mjs";
+} from "./chunk-HMB4TY2F.mjs";
 import {
   RadioGroup,
   useRadioGroupContext
-} from "./chunk-XFSZBILE.mjs";
-import "./chunk-BYEJZSG5.mjs";
-import {
-  Select
-} from "./chunk-RVJD2UZF.mjs";
+} from "./chunk-6NGF7FFY.mjs";
 import "./chunk-YJOOSTJC.mjs";
 import {
   Checkbox
-} from "./chunk-X7EKQZNU.mjs";
+} from "./chunk-RHCMBJOT.mjs";
 import "./chunk-LMF3QGSF.mjs";
 import {
   Fieldset,
   useFieldsetContext
-} from "./chunk-HXV2UMEV.mjs";
-import "./chunk-7LPYJC6S.mjs";
-import {
-  Input
-} from "./chunk-6TI7ACBR.mjs";
-import "./chunk-Y5SUMFYJ.mjs";
-import "./chunk-SKI2APSK.mjs";
+} from "./chunk-DM4PJFLG.mjs";
 import "./chunk-NSLSA7F7.mjs";
 import {
   ErrorMessage
 } from "./chunk-IL7576PP.mjs";
-import "./chunk-OIQUYB26.mjs";
-import {
-  Container
-} from "./chunk-I6GDRDYD.mjs";
-import "./chunk-XLLYMQLW.mjs";
-import {
-  Link
-} from "./chunk-5QL53TR2.mjs";
 import {
   AccordionComponent
-} from "./chunk-LIQ3FB56.mjs";
+} from "./chunk-XIHKASNB.mjs";
+import "./chunk-GUB3UCXO.mjs";
+import "./chunk-YXHXRUFX.mjs";
 import "./chunk-62F4I3MQ.mjs";
 import "./chunk-VRIY65P5.mjs";
 import "./chunk-ZOCMUEOX.mjs";
 import {
   Breadcrumbs
 } from "./chunk-YKDKFWP2.mjs";
-import "./chunk-HT2EIJAD.mjs";
 import {
   PrimaryButton,
   SecondaryButton
 } from "./chunk-OUHO4LGN.mjs";
-import "./chunk-X5JERDDU.mjs";
+import "./chunk-KQITCS3U.mjs";
+import "./chunk-DZNH5JHY.mjs";
 import "./chunk-K6PP3ACJ.mjs";
 import {
   Badge,
@@ -132,14 +147,17 @@ import {
   BoxComponent
 } from "./chunk-BZNDK3KJ.mjs";
 import "./chunk-EGXM575K.mjs";
-import "./chunk-GUB3UCXO.mjs";
-import "./chunk-YXHXRUFX.mjs";
 import "./chunk-WCA2WPFS.mjs";
 import "./chunk-V3PAFMK5.mjs";
+import "./chunk-ZTYEOZLK.mjs";
+import "./chunk-NE6W2PCD.mjs";
 import "./chunk-MSFHJVHD.mjs";
 import {
   ShowMoreButton
 } from "./chunk-ZDPU3N54.mjs";
+import {
+  AutoAnimateHeight
+} from "./chunk-AKYK3XFN.mjs";
 import "./chunk-JTZPQHKD.mjs";
 import {
   Skeleton
@@ -152,11 +170,6 @@ import "./chunk-JKCVB5TR.mjs";
 import {
   StyledHtml
 } from "./chunk-S5RB7KLJ.mjs";
-import "./chunk-KQITCS3U.mjs";
-import "./chunk-DZNH5JHY.mjs";
-import {
-  AutoAnimateHeight
-} from "./chunk-AKYK3XFN.mjs";
 import "./chunk-R4SQKVDQ.mjs";
 
 // src/index.tsx
@@ -175,6 +188,7 @@ export {
   ErrorMessage,
   Fieldset,
   FooterComponent as Footer,
+  HStack,
   Input,
   Link,
   LinkList,
@@ -189,9 +203,14 @@ export {
   Select,
   ShowMoreButton,
   Skeleton,
+  Stack,
   StepIndicator,
   StyledHtml,
   TabsComponent as Tabs,
+  TabsContent,
+  TabsContents,
+  TabsList,
+  TabsTab,
   Text,
   TextBody,
   TextBodySmall,
@@ -208,6 +227,7 @@ export {
   TextTechnicalTitle,
   Textarea,
   UnorderedList,
+  VStack,
   WarningBadge,
   WarningBanner,
   WhiteBadge,

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.tsx"],"sourcesContent":["/**\n * Import the hedwig css file, so the consumers don't have to. Plug and play.\n *\n * NOTE: Importing the full path, not just the package name.\n * For some reason vite did not include the css during development when this file only imported the package name.\n *\n * Consumers using the `@postenbring/hedwig-css` package directly should only need to import the package without a path.\n */\nimport \"@postenbring/hedwig-css/dist/index.css\";\n\nexport * from \"./index-no-css\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,OAAO;","names":[]}
+{"version":3,"sources":["../src/index.tsx"],"sourcesContent":["/**\n * Import the hedwig css file, so the consumers don't have to. Plug and play.\n *\n * NOTE: Importing the full path, not just the package name.\n * For some reason vite did not include the css during development when this file only imported the package name.\n *\n * Consumers using the `@postenbring/hedwig-css` package directly should only need to import the package without a path.\n */\nimport \"@postenbring/hedwig-css/dist/index.css\";\n\nexport * from \"./index-no-css\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,OAAO;","names":[]}

package/dist/layout/index.d.mts

@@ -1,2 +1,6 @@
-export { Container_alias_2 as Container } from '../_tsup-dts-rollup';
 export { ContainerProps_alias_2 as ContainerProps } from '../_tsup-dts-rollup';
+export { Container_alias_2 as Container } from '../_tsup-dts-rollup';
+export { StackProps_alias_2 as StackProps } from '../_tsup-dts-rollup';
+export { Stack_alias_2 as Stack } from '../_tsup-dts-rollup';
+export { HStack_alias_2 as HStack } from '../_tsup-dts-rollup';
+export { VStack_alias_2 as VStack } from '../_tsup-dts-rollup';

package/dist/layout/index.d.ts

@@ -1,2 +1,6 @@
-export { Container_alias_2 as Container } from '../_tsup-dts-rollup';
 export { ContainerProps_alias_2 as ContainerProps } from '../_tsup-dts-rollup';
+export { Container_alias_2 as Container } from '../_tsup-dts-rollup';
+export { StackProps_alias_2 as StackProps } from '../_tsup-dts-rollup';
+export { Stack_alias_2 as Stack } from '../_tsup-dts-rollup';
+export { HStack_alias_2 as HStack } from '../_tsup-dts-rollup';
+export { VStack_alias_2 as VStack } from '../_tsup-dts-rollup';

package/dist/layout/index.js

@@ -49,7 +49,10 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/layout/index.tsx
 var layout_exports = {};
 __export(layout_exports, {
-  Container: () => Container
+  Container: () => Container,
+  HStack: () => HStack,
+  Stack: () => Stack,
+  VStack: () => VStack
 });
 module.exports = __toCommonJS(layout_exports);
 
@@ -75,8 +78,65 @@ var Container = (0, import_react.forwardRef)(
   }
 );
 Container.displayName = "Container";
+
+// src/layout/stack/stack.tsx
+var React = require("react");
+var import_typed_classname2 = require("@postenbring/hedwig-css/typed-classname");
+var import_react2 = require("react");
+var import_react_slot = require("@radix-ui/react-slot");
+
+// src/layout/spacing.ts
+function getSpacingVariable(size) {
+  return `var(--hds-spacing-${size})`;
+}
+
+// src/layout/responsive.ts
+function getResponsiveProps(variable, inputValues, valueTransformer = (value) => String(value)) {
+  if (!inputValues)
+    return {};
+  if (typeof inputValues !== "object") {
+    return { [`${variable}-xsmall`]: valueTransformer(inputValues) };
+  }
+  const result = {};
+  for (const [key, value] of Object.entries(inputValues)) {
+    result[`${variable}-${key}`] = valueTransformer(value);
+  }
+  return result;
+}
+
+// src/layout/stack/stack.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Stack = (0, import_react2.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, asChild, className, style: _style, gap, direction, wrap, align, justify } = _b, rest = __objRest(_b, ["children", "asChild", "className", "style", "gap", "direction", "wrap", "align", "justify"]);
+    const Component = asChild ? import_react_slot.Slot : "div";
+    const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-stack-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-stack-direction", direction)), getResponsiveProps("--hds-stack-wrap", wrap, (value) => value ? "wrap" : "nowrap")), getResponsiveProps("--hds-stack-align", align)), getResponsiveProps("--hds-stack-justify", justify));
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      Component,
+      __spreadProps(__spreadValues({
+        style,
+        className: (0, import_typed_classname2.clsx)("hds-stack", className),
+        ref
+      }, rest), {
+        children
+      })
+    );
+  }
+);
+Stack.displayName = "Stack";
+var HStack = (0, import_react2.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "row" }));
+});
+HStack.displayName = "HStack";
+var VStack = (0, import_react2.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "column" }));
+});
+VStack.displayName = "VStack";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Container
+  Container,
+  HStack,
+  Stack,
+  VStack
 });
 //# sourceMappingURL=index.js.map

package/dist/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/layout/index.tsx","../../src/layout/container/container.tsx"],"sourcesContent":["export { Container } from \"./container/container\";\n\nexport type * from \"./container/container\";\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { OverridableComponent } from \"../../utils\";\n\nexport interface ContainerProps extends HTMLAttributes<HTMLDivElement> {\n  variant?: \"default\" | \"slim\";\n  children: ReactNode;\n}\n\n/**\n * Container is a layout component that is used to wrap content.\n * It ensures a max-width and minimum spacing on the sides.\n */\nexport const Container: OverridableComponent<ContainerProps, HTMLDivElement> = forwardRef(\n  ({ as: Component = \"div\", className, children, variant, ...rest }, ref) => {\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-container\",\n          { \"hds-container--slim\": variant === \"slim\" },\n          className as undefined,\n        )}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nContainer.displayName = \"Container\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,6BAAqB;AAErB,mBAA2B;AAerB;AAHC,IAAM,gBAAkE;AAAA,EAC7E,CAAC,IAAkE,QAAQ;AAA1E,iBAAE,MAAI,YAAY,OAAO,WAAW,UAAU,QAfjD,IAeG,IAA0D,iBAA1D,IAA0D,CAAxD,MAAuB,aAAW,YAAU;AAC7C,WACE;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,eAAW;AAAA,UACT;AAAA,UACA,EAAE,uBAAuB,YAAY,OAAO;AAAA,UAC5C;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,UAAU,cAAc;","names":[]}
+{"version":3,"sources":["../../src/layout/index.tsx","../../src/layout/container/container.tsx","../../src/layout/stack/stack.tsx","../../src/layout/spacing.ts","../../src/layout/responsive.ts"],"sourcesContent":["export * from \"./container/container\";\nexport * from \"./stack/stack\";\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport type { OverridableComponent } from \"../../utils\";\n\nexport interface ContainerProps extends HTMLAttributes<HTMLDivElement> {\n  variant?: \"default\" | \"slim\";\n  children: ReactNode;\n}\n\n/**\n * Container is a layout component that is used to wrap content.\n * It ensures a max-width and minimum spacing on the sides.\n */\nexport const Container: OverridableComponent<ContainerProps, HTMLDivElement> = forwardRef(\n  ({ as: Component = \"div\", className, children, variant, ...rest }, ref) => {\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-container\",\n          { \"hds-container--slim\": variant === \"slim\" },\n          className as undefined,\n        )}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nContainer.displayName = \"Container\";\n","import * as React from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef } from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { getSpacingVariable, type ResponsiveSpacingSizes, type SpacingSizes } from \"../spacing\";\nimport { getResponsiveProps, type ResponsiveProp } from \"../responsive\";\n\ntype CSSPropertiesWithVar = React.CSSProperties & {\n  \"--hds-stack-gap\"?: string;\n  \"--hds-stack-direction\"?: string;\n  \"--hds-stack-wrap\"?: string;\n  \"--hds-stack-align\"?: string;\n  \"--hds-stack-justify\"?: string;\n};\n\nexport interface StackProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n  direction?: ResponsiveProp<React.CSSProperties[\"flexDirection\"]>;\n  wrap?: ResponsiveProp<boolean>;\n  align?: ResponsiveProp<React.CSSProperties[\"alignItems\"]>;\n  justify?: ResponsiveProp<React.CSSProperties[\"justifyContent\"]>;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild?: boolean;\n}\n\n/**\n * 🚨 WORK IN PROGRESS 🚨\n *\n * TODO\n * - [ ] Add more examples\n * - [ ] Document usage\n * - [ ] Document props\n */\nexport const Stack = forwardRef<HTMLDivElement, StackProps>(\n  (\n    { children, asChild, className, style: _style, gap, direction, wrap, align, justify, ...rest },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: CSSPropertiesWithVar = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-stack-gap\", gap, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-stack-direction\", direction),\n      ...getResponsiveProps(\"--hds-stack-wrap\", wrap, (value) => (value ? \"wrap\" : \"nowrap\")),\n      ...getResponsiveProps(\"--hds-stack-align\", align),\n      ...getResponsiveProps(\"--hds-stack-justify\", justify),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-stack\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nStack.displayName = \"Stack\";\n\n/**\n * 🚨 WORK IN PROGRESS 🚨\n *\n * TODO\n * - [ ] Add more examples\n * - [ ] Document usage\n * - [ ] Document props\n */\nexport const HStack = forwardRef<HTMLDivElement, Omit<StackProps, \"direction\">>((props, ref) => {\n  return <Stack ref={ref} {...props} direction=\"row\" />;\n});\nHStack.displayName = \"HStack\";\n\n/**\n * 🚨 WORK IN PROGRESS 🚨\n *\n * TODO\n * - [ ] Add more examples\n * - [ ] Document usage\n * - [ ] Document props\n */\nexport const VStack = forwardRef<HTMLDivElement, Omit<StackProps, \"direction\">>((props, ref) => {\n  return <Stack ref={ref} {...props} direction=\"column\" />;\n});\nVStack.displayName = \"VStack\";\n","// TODO: Get from tokens package\n// For now it's fine, since it's still in this monorepo\nconst spacingSizes = {\n  \"4\": \"4\",\n  \"8\": \"8\",\n  \"12\": \"12\",\n  \"16\": \"16\",\n  \"20\": \"20\",\n  \"24\": \"24\",\n  \"32\": \"32\",\n  \"40\": \"40\",\n  \"48\": \"48\",\n  \"64\": \"64\",\n  \"80\": \"80\",\n  \"120\": \"120\",\n} as const;\nexport type SpacingSizes = keyof typeof spacingSizes;\n\nconst responsiveSpacingSizes = {\n  \"4-8\": \"4-8\",\n  \"8-12\": \"8-12\",\n  \"12-16\": \"12-16\",\n  \"16-20\": \"16-20\",\n  \"20-24\": \"20-24\",\n  \"24-32\": \"24-32\",\n  \"32-40\": \"32-40\",\n  \"40-48\": \"40-48\",\n  \"48-64\": \"48-64\",\n  \"64-80\": \"64-80\",\n  \"80-120\": \"80-120\",\n  \"120-160\": \"120-160\",\n} as const;\nexport type ResponsiveSpacingSizes = keyof typeof responsiveSpacingSizes;\n\nexport function getSpacingVariable(size: SpacingSizes | ResponsiveSpacingSizes) {\n  return `var(--hds-spacing-${size})`;\n}\n","type Breakpoints = \"xsmall\" | \"small\" | \"medium\" | \"large\" | \"xlarge\";\n\ntype ResponsiveValues<T> = {\n  [Breakpoint in Breakpoints]?: T;\n};\n\nexport type ResponsiveProp<T> = T | ResponsiveValues<T>;\n\nexport function getResponsiveProps<T>(\n  variable: `--hds-${string}`,\n  inputValues?: ResponsiveProp<T>,\n  valueTransformer: (value: T) => string = (value) => String(value),\n) {\n  if (!inputValues) return {};\n\n  if (typeof inputValues !== \"object\") {\n    return { [`${variable}-xsmall`]: valueTransformer(inputValues) };\n  }\n\n  const result: Record<string, string> = {};\n  for (const [key, value] of Object.entries(inputValues as ResponsiveValues<T>)) {\n    result[`${variable}-${key}`] = valueTransformer(value);\n  }\n\n  return result;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,6BAAqB;AAErB,mBAA2B;AAerB;AAHC,IAAM,gBAAkE;AAAA,EAC7E,CAAC,IAAkE,QAAQ;AAA1E,iBAAE,MAAI,YAAY,OAAO,WAAW,UAAU,QAfjD,IAeG,IAA0D,iBAA1D,IAA0D,CAAxD,MAAuB,aAAW,YAAU;AAC7C,WACE;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,eAAW;AAAA,UACT;AAAA,UACA,EAAE,uBAAuB,YAAY,OAAO;AAAA,UAC5C;AAAA,QACF;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,UAAU,cAAc;;;AC/BxB,YAAuB;AACvB,IAAAA,0BAAqB;AACrB,IAAAC,gBAA2B;AAC3B,wBAAqB;;;AC+Bd,SAAS,mBAAmB,MAA6C;AAC9E,SAAO,qBAAqB,IAAI;AAClC;;;AC5BO,SAAS,mBACd,UACA,aACA,mBAAyC,CAAC,UAAU,OAAO,KAAK,GAChE;AACA,MAAI,CAAC;AAAa,WAAO,CAAC;AAE1B,MAAI,OAAO,gBAAgB,UAAU;AACnC,WAAO,EAAE,CAAC,GAAG,QAAQ,SAAS,GAAG,iBAAiB,WAAW,EAAE;AAAA,EACjE;AAEA,QAAM,SAAiC,CAAC;AACxC,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,WAAkC,GAAG;AAC7E,WAAO,GAAG,QAAQ,IAAI,GAAG,EAAE,IAAI,iBAAiB,KAAK;AAAA,EACvD;AAEA,SAAO;AACT;;;AF4BM,IAAAC,sBAAA;AAfC,IAAM,YAAQ;AAAA,EACnB,CACE,IACA,QACG;AAFH,iBAAE,YAAU,SAAS,WAAW,OAAO,QAAQ,KAAK,WAAW,MAAM,OAAO,QAxChF,IAwCI,IAAwF,iBAAxF,IAAwF,CAAtF,YAAU,WAAS,aAAW,SAAe,OAAK,aAAW,QAAM,SAAO;AAG5E,UAAM,YAAY,UAAU,yBAAO;AACnC,UAAM,QAA8B,8FAC/B,SACA,mBAAmB,mBAAmB,KAAK,kBAAkB,IAC7D,mBAAmB,yBAAyB,SAAS,IACrD,mBAAmB,oBAAoB,MAAM,CAAC,UAAW,QAAQ,SAAS,QAAS,IACnF,mBAAmB,qBAAqB,KAAK,IAC7C,mBAAmB,uBAAuB,OAAO;AAEtD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,8BAAK,aAAa,SAAsB;AAAA,QACnD;AAAA,SACI,OAJL;AAAA,QAME;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;AAUb,IAAM,aAAS,0BAA0D,CAAC,OAAO,QAAQ;AAC9F,SAAO,6CAAC,sCAAM,OAAc,QAApB,EAA2B,WAAU,QAAM;AACrD,CAAC;AACD,OAAO,cAAc;AAUd,IAAM,aAAS,0BAA0D,CAAC,OAAO,QAAQ;AAC9F,SAAO,6CAAC,sCAAM,OAAc,QAApB,EAA2B,WAAU,WAAS;AACxD,CAAC;AACD,OAAO,cAAc;","names":["import_typed_classname","import_react","import_jsx_runtime"]}

package/dist/layout/index.mjs

@@ -1,9 +1,19 @@
-import "../chunk-OIQUYB26.mjs";
+import "../chunk-L4GQJETB.mjs";
 import {
   Container
 } from "../chunk-I6GDRDYD.mjs";
+import {
+  HStack,
+  Stack,
+  VStack
+} from "../chunk-27XJO7E4.mjs";
+import "../chunk-ZTYEOZLK.mjs";
+import "../chunk-NE6W2PCD.mjs";
 import "../chunk-R4SQKVDQ.mjs";
 export {
-  Container
+  Container,
+  HStack,
+  Stack,
+  VStack
 };
 //# sourceMappingURL=index.mjs.map

package/dist/layout/responsive.d.mts

@@ -0,0 +1,2 @@
+export { getResponsiveProps } from '../_tsup-dts-rollup';
+export { ResponsiveProp } from '../_tsup-dts-rollup';

package/dist/layout/responsive.d.ts

@@ -0,0 +1,2 @@
+export { getResponsiveProps } from '../_tsup-dts-rollup';
+export { ResponsiveProp } from '../_tsup-dts-rollup';

package/dist/layout/responsive.js

@@ -0,0 +1,42 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/responsive.ts
+var responsive_exports = {};
+__export(responsive_exports, {
+  getResponsiveProps: () => getResponsiveProps
+});
+module.exports = __toCommonJS(responsive_exports);
+function getResponsiveProps(variable, inputValues, valueTransformer = (value) => String(value)) {
+  if (!inputValues)
+    return {};
+  if (typeof inputValues !== "object") {
+    return { [`${variable}-xsmall`]: valueTransformer(inputValues) };
+  }
+  const result = {};
+  for (const [key, value] of Object.entries(inputValues)) {
+    result[`${variable}-${key}`] = valueTransformer(value);
+  }
+  return result;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getResponsiveProps
+});
+//# sourceMappingURL=responsive.js.map

package/dist/layout/responsive.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/layout/responsive.ts"],"sourcesContent":["type Breakpoints = \"xsmall\" | \"small\" | \"medium\" | \"large\" | \"xlarge\";\n\ntype ResponsiveValues<T> = {\n  [Breakpoint in Breakpoints]?: T;\n};\n\nexport type ResponsiveProp<T> = T | ResponsiveValues<T>;\n\nexport function getResponsiveProps<T>(\n  variable: `--hds-${string}`,\n  inputValues?: ResponsiveProp<T>,\n  valueTransformer: (value: T) => string = (value) => String(value),\n) {\n  if (!inputValues) return {};\n\n  if (typeof inputValues !== \"object\") {\n    return { [`${variable}-xsmall`]: valueTransformer(inputValues) };\n  }\n\n  const result: Record<string, string> = {};\n  for (const [key, value] of Object.entries(inputValues as ResponsiveValues<T>)) {\n    result[`${variable}-${key}`] = valueTransformer(value);\n  }\n\n  return result;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAQO,SAAS,mBACd,UACA,aACA,mBAAyC,CAAC,UAAU,OAAO,KAAK,GAChE;AACA,MAAI,CAAC;AAAa,WAAO,CAAC;AAE1B,MAAI,OAAO,gBAAgB,UAAU;AACnC,WAAO,EAAE,CAAC,GAAG,QAAQ,SAAS,GAAG,iBAAiB,WAAW,EAAE;AAAA,EACjE;AAEA,QAAM,SAAiC,CAAC;AACxC,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,WAAkC,GAAG;AAC7E,WAAO,GAAG,QAAQ,IAAI,GAAG,EAAE,IAAI,iBAAiB,KAAK;AAAA,EACvD;AAEA,SAAO;AACT;","names":[]}

package/dist/layout/responsive.mjs

@@ -0,0 +1,8 @@
+import {
+  getResponsiveProps
+} from "../chunk-ZTYEOZLK.mjs";
+import "../chunk-R4SQKVDQ.mjs";
+export {
+  getResponsiveProps
+};
+//# sourceMappingURL=responsive.mjs.map

package/dist/layout/responsive.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/layout/spacing.d.mts

@@ -0,0 +1,3 @@
+export { getSpacingVariable } from '../_tsup-dts-rollup';
+export { SpacingSizes } from '../_tsup-dts-rollup';
+export { ResponsiveSpacingSizes } from '../_tsup-dts-rollup';

package/dist/layout/spacing.d.ts

@@ -0,0 +1,3 @@
+export { getSpacingVariable } from '../_tsup-dts-rollup';
+export { SpacingSizes } from '../_tsup-dts-rollup';
+export { ResponsiveSpacingSizes } from '../_tsup-dts-rollup';

package/dist/layout/spacing.js

@@ -0,0 +1,33 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/spacing.ts
+var spacing_exports = {};
+__export(spacing_exports, {
+  getSpacingVariable: () => getSpacingVariable
+});
+module.exports = __toCommonJS(spacing_exports);
+function getSpacingVariable(size) {
+  return `var(--hds-spacing-${size})`;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getSpacingVariable
+});
+//# sourceMappingURL=spacing.js.map

package/dist/layout/spacing.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/layout/spacing.ts"],"sourcesContent":["// TODO: Get from tokens package\n// For now it's fine, since it's still in this monorepo\nconst spacingSizes = {\n  \"4\": \"4\",\n  \"8\": \"8\",\n  \"12\": \"12\",\n  \"16\": \"16\",\n  \"20\": \"20\",\n  \"24\": \"24\",\n  \"32\": \"32\",\n  \"40\": \"40\",\n  \"48\": \"48\",\n  \"64\": \"64\",\n  \"80\": \"80\",\n  \"120\": \"120\",\n} as const;\nexport type SpacingSizes = keyof typeof spacingSizes;\n\nconst responsiveSpacingSizes = {\n  \"4-8\": \"4-8\",\n  \"8-12\": \"8-12\",\n  \"12-16\": \"12-16\",\n  \"16-20\": \"16-20\",\n  \"20-24\": \"20-24\",\n  \"24-32\": \"24-32\",\n  \"32-40\": \"32-40\",\n  \"40-48\": \"40-48\",\n  \"48-64\": \"48-64\",\n  \"64-80\": \"64-80\",\n  \"80-120\": \"80-120\",\n  \"120-160\": \"120-160\",\n} as const;\nexport type ResponsiveSpacingSizes = keyof typeof responsiveSpacingSizes;\n\nexport function getSpacingVariable(size: SpacingSizes | ResponsiveSpacingSizes) {\n  return `var(--hds-spacing-${size})`;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCO,SAAS,mBAAmB,MAA6C;AAC9E,SAAO,qBAAqB,IAAI;AAClC;","names":[]}

package/dist/layout/spacing.mjs

@@ -0,0 +1,8 @@
+import {
+  getSpacingVariable
+} from "../chunk-NE6W2PCD.mjs";
+import "../chunk-R4SQKVDQ.mjs";
+export {
+  getSpacingVariable
+};
+//# sourceMappingURL=spacing.mjs.map

package/dist/layout/spacing.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/layout/stack/index.d.mts

@@ -0,0 +1,4 @@
+export { Stack_alias_3 as Stack } from '../../_tsup-dts-rollup';
+export { HStack_alias_3 as HStack } from '../../_tsup-dts-rollup';
+export { VStack_alias_3 as VStack } from '../../_tsup-dts-rollup';
+export { StackProps_alias_3 as StackProps } from '../../_tsup-dts-rollup';

package/dist/layout/stack/index.d.ts

@@ -0,0 +1,4 @@
+export { Stack_alias_3 as Stack } from '../../_tsup-dts-rollup';
+export { HStack_alias_3 as HStack } from '../../_tsup-dts-rollup';
+export { VStack_alias_3 as VStack } from '../../_tsup-dts-rollup';
+export { StackProps_alias_3 as StackProps } from '../../_tsup-dts-rollup';

package/dist/layout/stack/index.js

@@ -0,0 +1,117 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/layout/stack/index.tsx
+var stack_exports = {};
+__export(stack_exports, {
+  HStack: () => HStack,
+  Stack: () => Stack,
+  VStack: () => VStack
+});
+module.exports = __toCommonJS(stack_exports);
+
+// src/layout/stack/stack.tsx
+var React = require("react");
+var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
+var import_react = require("react");
+var import_react_slot = require("@radix-ui/react-slot");
+
+// src/layout/spacing.ts
+function getSpacingVariable(size) {
+  return `var(--hds-spacing-${size})`;
+}
+
+// src/layout/responsive.ts
+function getResponsiveProps(variable, inputValues, valueTransformer = (value) => String(value)) {
+  if (!inputValues)
+    return {};
+  if (typeof inputValues !== "object") {
+    return { [`${variable}-xsmall`]: valueTransformer(inputValues) };
+  }
+  const result = {};
+  for (const [key, value] of Object.entries(inputValues)) {
+    result[`${variable}-${key}`] = valueTransformer(value);
+  }
+  return result;
+}
+
+// src/layout/stack/stack.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Stack = (0, import_react.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, asChild, className, style: _style, gap, direction, wrap, align, justify } = _b, rest = __objRest(_b, ["children", "asChild", "className", "style", "gap", "direction", "wrap", "align", "justify"]);
+    const Component = asChild ? import_react_slot.Slot : "div";
+    const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-stack-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-stack-direction", direction)), getResponsiveProps("--hds-stack-wrap", wrap, (value) => value ? "wrap" : "nowrap")), getResponsiveProps("--hds-stack-align", align)), getResponsiveProps("--hds-stack-justify", justify));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      Component,
+      __spreadProps(__spreadValues({
+        style,
+        className: (0, import_typed_classname.clsx)("hds-stack", className),
+        ref
+      }, rest), {
+        children
+      })
+    );
+  }
+);
+Stack.displayName = "Stack";
+var HStack = (0, import_react.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "row" }));
+});
+HStack.displayName = "HStack";
+var VStack = (0, import_react.forwardRef)((props, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "column" }));
+});
+VStack.displayName = "VStack";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  HStack,
+  Stack,
+  VStack
+});
+//# sourceMappingURL=index.js.map