@postenbring/hedwig-react 0.0.81 → 0.0.82

package/dist/layout/grid/index.mjs

@@ -1,14 +1,13 @@
+import "../../chunk-G65EYZFQ.mjs";
 import {
-  GridComponent
-} from "../../chunk-722MZPXO.mjs";
-import {
+  Grid,
   GridItem
-} from "../../chunk-ES6ISHOV.mjs";
+} from "../../chunk-UP3M3NEZ.mjs";
 import "../../chunk-F4STR6SD.mjs";
 import "../../chunk-NE6W2PCD.mjs";
 import "../../chunk-R4SQKVDQ.mjs";
 export {
-  GridComponent as Grid,
+  Grid,
   GridItem
 };
 //# sourceMappingURL=index.mjs.map

package/dist/layout/index.d.ts

@@ -1,10 +1,4 @@
-export { ContainerProps_alias_2 as ContainerProps } from '../_tsup-dts-rollup';
-export { Container_alias_2 as Container } from '../_tsup-dts-rollup';
-export { Grid_alias_2 as Grid } from '../_tsup-dts-rollup';
-export { GridItem_alias_2 as GridItem } from '../_tsup-dts-rollup';
-export { GridProps_alias_2 as GridProps } from '../_tsup-dts-rollup';
-export { GridItemProps_alias_2 as GridItemProps } 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';
-export { StackProps_alias_2 as StackProps } from '../_tsup-dts-rollup';
+export * from "./container/container";
+export * from "./grid";
+export * from "./stack";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layout/index.tsx"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC"}

package/dist/layout/index.js

@@ -50,7 +50,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var layout_exports = {};
 __export(layout_exports, {
   Container: () => Container,
-  Grid: () => GridComponent,
+  Grid: () => Grid,
   GridItem: () => GridItem,
   HStack: () => HStack,
   Stack: () => Stack,
@@ -109,16 +109,16 @@ function getSpacingVariable(size) {
 
 // src/layout/grid/grid.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
-var Grid = (0, import_react2.forwardRef)(
+var GridItem = (0, import_react2.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { children, asChild, className, span, center, style: _style, gap, gapX, gapY } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style", "gap", "gapX", "gapY"]);
+    var _b = _a, { children, asChild, className, span, center, style: _style } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style"]);
     const Component = asChild ? import_react_slot2.Slot : "div";
-    const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-grid-span", span)), getResponsiveProps("--hds-grid-center", center, (value) => value ? "1" : "0"));
+    const style = __spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-item-span", span)), getResponsiveProps("--hds-grid-item-center", center, (value) => value ? "1" : "0"));
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
       Component,
       __spreadProps(__spreadValues({
         style,
-        className: (0, import_typed_classname2.clsx)("hds-grid", className),
+        className: (0, import_typed_classname2.clsx)("hds-grid__item", className),
         ref
       }, rest), {
         children
@@ -126,17 +126,17 @@ var Grid = (0, import_react2.forwardRef)(
     );
   }
 );
-Grid.displayName = "Grid";
-var GridItem = (0, import_react2.forwardRef)(
+GridItem.displayName = "Grid.Item";
+var Grid = (0, import_react2.forwardRef)(
   (_a, ref) => {
-    var _b = _a, { children, asChild, className, span, center, style: _style } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style"]);
+    var _b = _a, { children, asChild, className, span, center, style: _style, gap, gapX, gapY } = _b, rest = __objRest(_b, ["children", "asChild", "className", "span", "center", "style", "gap", "gapX", "gapY"]);
     const Component = asChild ? import_react_slot2.Slot : "div";
-    const style = __spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-item-span", span)), getResponsiveProps("--hds-grid-item-center", center, (value) => value ? "1" : "0"));
+    const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-grid-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-grid-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-grid-span", span)), getResponsiveProps("--hds-grid-center", center, (value) => value ? "1" : "0"));
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
       Component,
       __spreadProps(__spreadValues({
         style,
-        className: (0, import_typed_classname2.clsx)("hds-grid__item", className),
+        className: (0, import_typed_classname2.clsx)("hds-grid", className),
         ref
       }, rest), {
         children
@@ -144,11 +144,8 @@ var GridItem = (0, import_react2.forwardRef)(
     );
   }
 );
-GridItem.displayName = "Grid.Item";
-
-// src/layout/grid/index.tsx
-var GridComponent = Grid;
-GridComponent.Item = GridItem;
+Grid.displayName = "Grid";
+Grid.Item = GridItem;
 
 // src/layout/stack/stack.tsx
 var React = require("react");

package/dist/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/layout/index.tsx","../../src/layout/container/container.tsx","../../src/layout/grid/grid.tsx","../../src/layout/responsive.ts","../../src/layout/spacing.ts","../../src/layout/grid/index.tsx","../../src/layout/stack/stack.tsx"],"sourcesContent":["export * from \"./container/container\";\nexport * from \"./grid\";\nexport * from \"./stack\";\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nexport interface ContainerProps extends HTMLAttributes<HTMLDivElement> {\n  variant?: \"default\" | \"slim\";\n  children: ReactNode;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n\n  /**\n   * Convienence prop to change the rendered element.\n   *\n   * Use {@link ContainerProps.asChild} if you need more control of the rendered element.\n   */\n  as?: \"div\" | \"section\" | \"aside\" | \"main\" | \"article\" | \"header\" | \"footer\";\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 = forwardRef<HTMLDivElement, ContainerProps>(\n  ({ as: Tag = \"div\", asChild, className, children, variant, ...rest }, ref) => {\n    const Component = asChild ? Slot : Tag;\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 { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { forwardRef } from \"react\";\nimport { getResponsiveProps, type ResponsiveProp } from \"../responsive\";\nimport { type SpacingSizes, type ResponsiveSpacingSizes, getSpacingVariable } from \"../spacing\";\n\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  /**\n   * Space between grid items. Both horizontal and vertical.\n   *\n   * Use the responsive shorthand `12-16` to jump a level at the `large` breakpoint.\n   *\n   * Or use the responsive object `{ initial: 40, large: 64 }` to set different values at different breakpoints.\n   *\n   * Use `gapX` and `gapY` to set different values for horizontal and vertical spacing.\n   */\n  gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between grid items horizontally\n   */\n  gapX?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between grid items vertically\n   */\n  gapY?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Column span for the grid items\n   *\n   * `default` is `12`\n   */\n  span?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;\n\n  /**\n   * Center grid items horizontally\n   *\n   * Offsets the start position of the grid items relative to their span so that it appears centered.\n   *\n   * assumes a span of 2, 4, 6, 8, or 10\n   *\n   * a span of `12` is 100% width and centering has no effect\n   *\n   * `default` is `false`\n   */\n  center?: ResponsiveProp<boolean>;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * A simple opionated abstraction over CSS Grid.\n *\n * The grid is always a 12 column grid.\n *\n * @example\n * ```tsx\n * <Grid gap=\"12-16\" span={{ small: 6 }}>\n *   <div>6/12</div>\n *   <div>6/12</div>\n *   <Grid.Item span={{ small: 12 }}>12/12</Grid.Item>\n *   <div>6/12</div>\n *   <div>6/12</div>\n * </Grid>\n * ```\n */\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    { children, asChild, className, span, center, style: _style, gap, gapX, gapY, ...rest },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: React.CSSProperties = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-grid-gap\", gap, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-gap-x\", gapX, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-gap-y\", gapY, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-span\", span),\n      ...getResponsiveProps(\"--hds-grid-center\", center, (value) => (value ? \"1\" : \"0\")),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-grid\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nGrid.displayName = \"Grid\";\n\nexport interface GridItemProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  /**\n   * Column span for the grid item\n   *\n   * `default` is `12`\n   */\n  span?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;\n\n  /**\n   * Center the grid item horizontally\n   *\n   * Offsets the start position of the grid item relative to it's span so that it appears centered.\n   *\n   * assumes a span of 2, 4, 6, 8, or 10\n   *\n   * a span of `12` is 100% width and centering has no effect\n   *\n   * `default` is `false`\n   */\n  center?: ResponsiveProp<boolean>;\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 * 🚧 Grid.Item\n *\n * Use as the direct child of a `Grid` to override `span` and `center` for individual items.\n */\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  ({ children, asChild, className, span, center, style: _style, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: React.CSSProperties = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-grid-item-span\", span),\n      ...getResponsiveProps(\"--hds-grid-item-center\", center, (value) => (value ? \"1\" : \"0\")),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-grid__item\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nGridItem.displayName = \"Grid.Item\";\n","type Breakpoints = \"initial\" | \"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}-initial`]: 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","// 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","import { Grid, GridItem } from \"./grid\";\n\nconst GridComponent = Grid as typeof Grid & {\n  Item: typeof GridItem;\n};\n\nGridComponent.Item = GridItem;\n\nexport { GridComponent as Grid, GridItem };\n\nexport type * from \"./grid\";\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  /**\n   * Space between items. Both horizontal and vertical.\n   *\n   * Use the responsive shorthand `12-16` to jump a level at the `large` breakpoint.\n   *\n   * Or use the responsive object `{ initial: 40, large: 64 }` to set different values at different breakpoints.\n   *\n   * Use `gapX` and `gapY` to set different values for horizontal and vertical spacing.\n   */\n  gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between items horizontally\n   */\n  gapX?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between items vertically\n   */\n  gapY?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\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   * @default false\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    {\n      children,\n      asChild,\n      className,\n      style: _style,\n      gap,\n      gapX,\n      gapY,\n      direction,\n      wrap,\n      align,\n      justify,\n      ...rest\n    },\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-gap-x\", gapX, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-stack-gap-y\", gapY, 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"],"mappings":"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","names":["import_typed_classname","import_react_slot","import_react","import_jsx_runtime","import_typed_classname","import_react","import_react_slot","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/layout/index.tsx","../../src/layout/container/container.tsx","../../src/layout/grid/grid.tsx","../../src/layout/responsive.ts","../../src/layout/spacing.ts","../../src/layout/stack/stack.tsx"],"sourcesContent":["export * from \"./container/container\";\nexport * from \"./grid\";\nexport * from \"./stack\";\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nexport interface ContainerProps extends HTMLAttributes<HTMLDivElement> {\n  variant?: \"default\" | \"slim\";\n  children: ReactNode;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n\n  /**\n   * Convienence prop to change the rendered element.\n   *\n   * Use {@link ContainerProps.asChild} if you need more control of the rendered element.\n   */\n  as?: \"div\" | \"section\" | \"aside\" | \"main\" | \"article\" | \"header\" | \"footer\";\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 = forwardRef<HTMLDivElement, ContainerProps>(\n  ({ as: Tag = \"div\", asChild, className, children, variant, ...rest }, ref) => {\n    const Component = asChild ? Slot : Tag;\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 { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { forwardRef } from \"react\";\nimport { getResponsiveProps, type ResponsiveProp } from \"../responsive\";\nimport { type SpacingSizes, type ResponsiveSpacingSizes, getSpacingVariable } from \"../spacing\";\n\nexport interface GridItemProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  /**\n   * Column span for the grid item\n   *\n   * `default` is `12`\n   */\n  span?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;\n\n  /**\n   * Center the grid item horizontally\n   *\n   * Offsets the start position of the grid item relative to it's span so that it appears centered.\n   *\n   * assumes a span of 2, 4, 6, 8, or 10\n   *\n   * a span of `12` is 100% width and centering has no effect\n   *\n   * `default` is `false`\n   */\n  center?: ResponsiveProp<boolean>;\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 * 🚧 Grid.Item\n *\n * Use as the direct child of a `Grid` to override `span` and `center` for individual items.\n */\nexport const GridItem = forwardRef<HTMLDivElement, GridItemProps>(\n  ({ children, asChild, className, span, center, style: _style, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: React.CSSProperties = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-grid-item-span\", span),\n      ...getResponsiveProps(\"--hds-grid-item-center\", center, (value) => (value ? \"1\" : \"0\")),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-grid__item\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nGridItem.displayName = \"Grid.Item\";\n\nexport interface GridProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n\n  /**\n   * Space between grid items. Both horizontal and vertical.\n   *\n   * Use the responsive shorthand `12-16` to jump a level at the `large` breakpoint.\n   *\n   * Or use the responsive object `{ initial: 40, large: 64 }` to set different values at different breakpoints.\n   *\n   * Use `gapX` and `gapY` to set different values for horizontal and vertical spacing.\n   */\n  gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between grid items horizontally\n   */\n  gapX?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between grid items vertically\n   */\n  gapY?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Column span for the grid items\n   *\n   * `default` is `12`\n   */\n  span?: ResponsiveProp<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;\n\n  /**\n   * Center grid items horizontally\n   *\n   * Offsets the start position of the grid items relative to their span so that it appears centered.\n   *\n   * assumes a span of 2, 4, 6, 8, or 10\n   *\n   * a span of `12` is 100% width and centering has no effect\n   *\n   * `default` is `false`\n   */\n  center?: ResponsiveProp<boolean>;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * A simple opionated abstraction over CSS Grid.\n *\n * The grid is always a 12 column grid.\n *\n * @example\n * ```tsx\n * <Grid gap=\"12-16\" span={{ small: 6 }}>\n *   <div>6/12</div>\n *   <div>6/12</div>\n *   <Grid.Item span={{ small: 12 }}>12/12</Grid.Item>\n *   <div>6/12</div>\n *   <div>6/12</div>\n * </Grid>\n * ```\n */\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(\n  (\n    { children, asChild, className, span, center, style: _style, gap, gapX, gapY, ...rest },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : \"div\";\n    const style: React.CSSProperties = {\n      ..._style,\n      ...getResponsiveProps(\"--hds-grid-gap\", gap, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-gap-x\", gapX, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-gap-y\", gapY, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-grid-span\", span),\n      ...getResponsiveProps(\"--hds-grid-center\", center, (value) => (value ? \"1\" : \"0\")),\n    };\n    return (\n      <Component\n        style={style}\n        className={clsx(\"hds-grid\", className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n) as GridType;\nGrid.displayName = \"Grid\";\n\ntype GridType = ReturnType<typeof forwardRef<HTMLDivElement, GridProps>> & {\n  Item: typeof GridItem;\n};\n\nGrid.Item = GridItem;\n","type Breakpoints = \"initial\" | \"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}-initial`]: 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","// 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","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  /**\n   * Space between items. Both horizontal and vertical.\n   *\n   * Use the responsive shorthand `12-16` to jump a level at the `large` breakpoint.\n   *\n   * Or use the responsive object `{ initial: 40, large: 64 }` to set different values at different breakpoints.\n   *\n   * Use `gapX` and `gapY` to set different values for horizontal and vertical spacing.\n   */\n  gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between items horizontally\n   */\n  gapX?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\n  /**\n   * Space between items vertically\n   */\n  gapY?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;\n\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   * @default false\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    {\n      children,\n      asChild,\n      className,\n      style: _style,\n      gap,\n      gapX,\n      gapY,\n      direction,\n      wrap,\n      align,\n      justify,\n      ...rest\n    },\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-gap-x\", gapX, getSpacingVariable),\n      ...getResponsiveProps(\"--hds-stack-gap-y\", gapY, 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"],"mappings":"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","names":["import_typed_classname","import_react_slot","import_react","import_jsx_runtime","import_typed_classname","import_react","import_react_slot","import_jsx_runtime"]}

package/dist/layout/index.mjs

@@ -2,12 +2,11 @@ import "../chunk-BVG5VSZK.mjs";
 import {
   Container
 } from "../chunk-USXU6ULZ.mjs";
+import "../chunk-G65EYZFQ.mjs";
 import {
-  GridComponent
-} from "../chunk-722MZPXO.mjs";
-import {
+  Grid,
   GridItem
-} from "../chunk-ES6ISHOV.mjs";
+} from "../chunk-UP3M3NEZ.mjs";
 import "../chunk-ZQHLYAJU.mjs";
 import {
   HStack,
@@ -19,7 +18,7 @@ import "../chunk-NE6W2PCD.mjs";
 import "../chunk-R4SQKVDQ.mjs";
 export {
   Container,
-  GridComponent as Grid,
+  Grid,
   GridItem,
   HStack,
   Stack,

package/dist/layout/responsive.d.ts

@@ -1,2 +1,10 @@
-export { getResponsiveProps } from '../_tsup-dts-rollup';
-export { ResponsiveProp } from '../_tsup-dts-rollup';
+type Breakpoints = "initial" | "small" | "medium" | "large" | "xlarge";
+type ResponsiveValues<T> = {
+    [Breakpoint in Breakpoints]?: T;
+};
+export type ResponsiveProp<T> = T | ResponsiveValues<T>;
+export declare function getResponsiveProps<T>(variable: `--hds-${string}`, inputValues?: ResponsiveProp<T>, valueTransformer?: (value: T) => string): {
+    [x: string]: string;
+};
+export {};
+//# sourceMappingURL=responsive.d.ts.map

package/dist/layout/responsive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive.d.ts","sourceRoot":"","sources":["../../src/layout/responsive.ts"],"names":[],"mappings":"AAAA,KAAK,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEvE,KAAK,gBAAgB,CAAC,CAAC,IAAI;KACxB,UAAU,IAAI,WAAW,CAAC,CAAC,EAAE,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,CAAC,IAAI,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAC;AAExD,wBAAgB,kBAAkB,CAAC,CAAC,EAClC,QAAQ,EAAE,SAAS,MAAM,EAAE,EAC3B,WAAW,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,EAC/B,gBAAgB,GAAE,CAAC,KAAK,EAAE,CAAC,KAAK,MAAiC;;EAclE"}

package/dist/layout/spacing.d.ts

@@ -1,3 +1,33 @@
-export { getSpacingVariable } from '../_tsup-dts-rollup';
-export { SpacingSizes } from '../_tsup-dts-rollup';
-export { ResponsiveSpacingSizes } from '../_tsup-dts-rollup';
+declare const spacingSizes: {
+    readonly "4": "4";
+    readonly "8": "8";
+    readonly "12": "12";
+    readonly "16": "16";
+    readonly "20": "20";
+    readonly "24": "24";
+    readonly "32": "32";
+    readonly "40": "40";
+    readonly "48": "48";
+    readonly "64": "64";
+    readonly "80": "80";
+    readonly "120": "120";
+};
+export type SpacingSizes = keyof typeof spacingSizes;
+declare const responsiveSpacingSizes: {
+    readonly "4-8": "4-8";
+    readonly "8-12": "8-12";
+    readonly "12-16": "12-16";
+    readonly "16-20": "16-20";
+    readonly "20-24": "20-24";
+    readonly "24-32": "24-32";
+    readonly "32-40": "32-40";
+    readonly "40-48": "40-48";
+    readonly "48-64": "48-64";
+    readonly "64-80": "64-80";
+    readonly "80-120": "80-120";
+    readonly "120-160": "120-160";
+};
+export type ResponsiveSpacingSizes = keyof typeof responsiveSpacingSizes;
+export declare function getSpacingVariable(size: SpacingSizes | ResponsiveSpacingSizes): string;
+export {};
+//# sourceMappingURL=spacing.d.ts.map

package/dist/layout/spacing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"spacing.d.ts","sourceRoot":"","sources":["../../src/layout/spacing.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,YAAY;;;;;;;;;;;;;CAaR,CAAC;AACX,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;AAErD,QAAA,MAAM,sBAAsB;;;;;;;;;;;;;CAalB,CAAC;AACX,MAAM,MAAM,sBAAsB,GAAG,MAAM,OAAO,sBAAsB,CAAC;AAEzE,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,YAAY,GAAG,sBAAsB,UAE7E"}

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

@@ -1,4 +1,3 @@
-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';
+export { Stack, HStack, VStack } from "./stack";
+export type * from "./stack";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/stack/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAChD,mBAAmB,SAAS,CAAC"}

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

@@ -1,4 +1,62 @@
-export { StackProps_alias_4 as StackProps } from '../../_tsup-dts-rollup';
-export { Stack_alias_4 as Stack } from '../../_tsup-dts-rollup';
-export { HStack_alias_4 as HStack } from '../../_tsup-dts-rollup';
-export { VStack_alias_4 as VStack } from '../../_tsup-dts-rollup';
+import * as React from "react";
+import { type ResponsiveSpacingSizes, type SpacingSizes } from "../spacing";
+import { type ResponsiveProp } from "../responsive";
+export interface StackProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+    /**
+     * Space between items. Both horizontal and vertical.
+     *
+     * Use the responsive shorthand `12-16` to jump a level at the `large` breakpoint.
+     *
+     * Or use the responsive object `{ initial: 40, large: 64 }` to set different values at different breakpoints.
+     *
+     * Use `gapX` and `gapY` to set different values for horizontal and vertical spacing.
+     */
+    gap?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;
+    /**
+     * Space between items horizontally
+     */
+    gapX?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;
+    /**
+     * Space between items vertically
+     */
+    gapY?: ResponsiveProp<SpacingSizes> | ResponsiveSpacingSizes;
+    direction?: ResponsiveProp<React.CSSProperties["flexDirection"]>;
+    wrap?: ResponsiveProp<boolean>;
+    align?: ResponsiveProp<React.CSSProperties["alignItems"]>;
+    justify?: ResponsiveProp<React.CSSProperties["justifyContent"]>;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     *
+     * @default false
+     */
+    asChild?: boolean;
+}
+/**
+ * 🚨 WORK IN PROGRESS 🚨
+ *
+ * TODO
+ * - [ ] Add more examples
+ * - [ ] Document usage
+ * - [ ] Document props
+ */
+export declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * 🚨 WORK IN PROGRESS 🚨
+ *
+ * TODO
+ * - [ ] Add more examples
+ * - [ ] Document usage
+ * - [ ] Document props
+ */
+export declare const HStack: React.ForwardRefExoticComponent<Omit<StackProps, "direction"> & React.RefAttributes<HTMLDivElement>>;
+/**
+ * 🚨 WORK IN PROGRESS 🚨
+ *
+ * TODO
+ * - [ ] Add more examples
+ * - [ ] Document usage
+ * - [ ] Document props
+ */
+export declare const VStack: React.ForwardRefExoticComponent<Omit<StackProps, "direction"> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=stack.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"stack.d.ts","sourceRoot":"","sources":["../../../src/layout/stack/stack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAsB,KAAK,sBAAsB,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAChG,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAUxE,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;;;;;;;OAQG;IACH,GAAG,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,GAAG,sBAAsB,CAAC;IAE5D;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,GAAG,sBAAsB,CAAC;IAE7D;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,GAAG,sBAAsB,CAAC;IAE7D,SAAS,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC;IACjE,IAAI,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC;IAC1D,OAAO,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEhE;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,KAAK,mFAwCjB,CAAC;AAGF;;;;;;;GAOG;AACH,eAAO,MAAM,MAAM,sGAEjB,CAAC;AAGH;;;;;;;GAOG;AACH,eAAO,MAAM,MAAM,sGAEjB,CAAC"}

package/dist/link/index.d.ts

@@ -1,2 +1,3 @@
-export { Link_alias_2 as Link } from '../_tsup-dts-rollup';
-export { LinkProps_alias_2 as LinkProps } from '../_tsup-dts-rollup';
+export { Link } from "./link";
+export type * from "./link";
+//# sourceMappingURL=index.d.ts.map

package/dist/link/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/link/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,mBAAmB,QAAQ,CAAC"}

package/dist/link/link.d.ts

@@ -1,2 +1,20 @@
-export { LinkProps_alias_3 as LinkProps } from '../_tsup-dts-rollup';
-export { Link_alias_3 as Link } from '../_tsup-dts-rollup';
+import * as React from "react";
+export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    /**
+     * The visual style of the link
+     */
+    variant?: "underline" | "solid" | "inverted" | "no-underline";
+    /**
+     * Font size of the link
+     */
+    size?: "small" | "medium" | "large";
+    children: React.ReactNode;
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     *
+     * @default false
+     */
+    asChild?: boolean;
+}
+export declare const Link: React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>;
+//# sourceMappingURL=link.d.ts.map

package/dist/link/link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../src/link/link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IAC9E;;OAEG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,cAAc,CAAC;IAE9D;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAEpC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,IAAI,qFAkBhB,CAAC"}

package/dist/list/index.d.ts

@@ -1,5 +1,5 @@
-export { UnorderedList_alias_2 as UnorderedList } from '../_tsup-dts-rollup';
-export { OrderedList_alias_2 as OrderedList } from '../_tsup-dts-rollup';
-export { LinkList_alias_2 as LinkList } from '../_tsup-dts-rollup';
-export { ListProps_alias_2 as ListProps } from '../_tsup-dts-rollup';
-export { LinkListProps_alias_2 as LinkListProps } from '../_tsup-dts-rollup';
+export { UnorderedList, OrderedList } from "./list";
+export type * from "./list";
+export { LinkList } from "./link-list";
+export type * from "./link-list";
+//# sourceMappingURL=index.d.ts.map

package/dist/list/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/list/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AACpD,mBAAmB,QAAQ,CAAC;AAE5B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,mBAAmB,aAAa,CAAC"}

package/dist/list/link-list.d.ts

@@ -1,2 +1,12 @@
-export { LinkListProps_alias_3 as LinkListProps } from '../_tsup-dts-rollup';
-export { LinkList_alias_3 as LinkList } from '../_tsup-dts-rollup';
+/// <reference types="react" />
+import type { ListProps } from "./list";
+export interface LinkListProps extends Omit<ListProps, "listStyle"> {
+    children?: React.ReactElement<HTMLLIElement> | React.ReactElement<HTMLLIElement>[];
+}
+/**
+ * Show a list of links
+ *
+ * For other list types use `UnorderedList` and `OrderedList`, or use your own list component using the semantic `ul` and `ol` tags.
+ */
+export declare const LinkList: import("react").ForwardRefExoticComponent<LinkListProps & import("react").RefAttributes<HTMLUListElement>>;
+//# sourceMappingURL=link-list.d.ts.map

package/dist/list/link-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-list.d.ts","sourceRoot":"","sources":["../../src/list/link-list.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAGxC,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,SAAS,EAAE,WAAW,CAAC;IACjE,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;CACpF;AAED;;;;GAIG;AACH,eAAO,MAAM,QAAQ,4GAUpB,CAAC"}

package/dist/list/list.d.ts

@@ -1,3 +1,40 @@
-export { ListProps_alias_3 as ListProps } from '../_tsup-dts-rollup';
-export { UnorderedList_alias_3 as UnorderedList } from '../_tsup-dts-rollup';
-export { OrderedList_alias_3 as OrderedList } from '../_tsup-dts-rollup';
+import { type HTMLAttributes } from "react";
+export interface ListProps extends HTMLAttributes<HTMLOListElement | HTMLUListElement> {
+    /**
+     * Sets the size of the items (font)
+     *
+     * @default "medium"
+     */
+    size?: "small" | "medium" | "large";
+}
+/**
+ * An unordered list of simple items, often text. You can nest other lists inside this component.
+ *
+ * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.
+ *
+ * @example
+ * ```tsx
+ * <UnorderedList>
+ *  <li>Item 1</li>
+ *  <li>Item 2</li>
+ *  <li>Item 3</li>
+ * </UnorderedList>
+ * ```
+ */
+export declare const UnorderedList: import("react").ForwardRefExoticComponent<ListProps & import("react").RefAttributes<HTMLUListElement>>;
+/**
+ * An ordered list of simple items
+ *
+ * If you have other list needs, you can build your own using the semantic `ul` and `ol` tags.
+ *
+ * @example
+ * ```tsx
+ * <OrderedList>
+ *  <li>Item 1</li>
+ *  <li>Item 2</li>
+ *  <li>Item 3</li>
+ * </OrderedList>
+ * ```
+ */
+export declare const OrderedList: import("react").ForwardRefExoticComponent<ListProps & import("react").RefAttributes<HTMLOListElement>>;
+//# sourceMappingURL=list.d.ts.map

package/dist/list/list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../src/list/list.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAGxD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;IACpF;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,aAAa,wGAUzB,CAAC;AAGF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,WAAW,wGAUvB,CAAC"}

package/dist/message/index.d.ts

@@ -1,3 +1,3 @@
-export { Message_alias_2 as Message } from '../_tsup-dts-rollup';
-export { MessageTitle_alias_2 as MessageTitle } from '../_tsup-dts-rollup';
-export { MessageDescription_alias_2 as MessageDescription } from '../_tsup-dts-rollup';
+export { Message, MessageTitle, MessageDescription } from "./message";
+export type * from "./message";
+//# sourceMappingURL=index.d.ts.map

package/dist/message/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/message/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AACtE,mBAAmB,WAAW,CAAC"}

package/dist/message/index.js

@@ -49,7 +49,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/message/index.tsx
 var message_exports = {};
 __export(message_exports, {
-  Message: () => MessageComponent,
+  Message: () => Message,
   MessageDescription: () => MessageDescription,
   MessageTitle: () => MessageTitle
 });
@@ -65,6 +65,20 @@ var import_react = require("react");
 var import_typed_classname = require("@postenbring/hedwig-css/typed-classname");
 var import_react_slot = require("@radix-ui/react-slot");
 var import_jsx_runtime = require("react/jsx-runtime");
+var BoxCloseButton = (0, import_react.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "button",
+      __spreadValues({
+        className: (0, import_typed_classname.clsx)("hds-box__close-button", className),
+        ref,
+        type: "button"
+      }, rest)
+    );
+  }
+);
+BoxCloseButton.displayName = "Box.CloseButton";
 var Box = (0, import_react.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
@@ -119,41 +133,10 @@ var Box = (0, import_react.forwardRef)(
   }
 );
 Box.displayName = "Box";
-var BoxCloseButton = (0, import_react.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "button",
-      __spreadValues({
-        className: (0, import_typed_classname.clsx)("hds-box__close-button", className),
-        ref,
-        type: "button"
-      }, rest)
-    );
-  }
-);
-BoxCloseButton.displayName = "Box.CloseButton";
+Box.CloseButton = BoxCloseButton;
 
 // src/message/message.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
-var Message = (0, import_react2.forwardRef)(
-  (_a, ref) => {
-    var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-      Box,
-      __spreadProps(__spreadValues({
-        className: (0, import_typed_classname2.clsx)(`hds-message`, `hds-message--${variant}`, className),
-        ref
-      }, rest), {
-        children: [
-          variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: (0, import_typed_classname2.clsx)("hds-message--neutral__icon", iconClassName), children: icon }),
-          children
-        ]
-      })
-    );
-  }
-);
-Message.displayName = "Message";
 var MessageTitle = (0, import_react2.forwardRef)(
   (_a, ref) => {
     var _b = _a, { asChild, className } = _b, rest = __objRest(_b, ["asChild", "className"]);
@@ -182,11 +165,26 @@ var MessageDescription = (0, import_react2.forwardRef)(
   }
 );
 MessageDescription.displayName = "Message.Description";
-
-// src/message/index.tsx
-var MessageComponent = Message;
-MessageComponent.Title = MessageTitle;
-MessageComponent.Description = MessageDescription;
+var Message = (0, import_react2.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      Box,
+      __spreadProps(__spreadValues({
+        className: (0, import_typed_classname2.clsx)(`hds-message`, `hds-message--${variant}`, className),
+        ref
+      }, rest), {
+        children: [
+          variant === "neutral" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: (0, import_typed_classname2.clsx)("hds-message--neutral__icon", iconClassName), children: icon }),
+          children
+        ]
+      })
+    );
+  }
+);
+Message.displayName = "Message";
+Message.Title = MessageTitle;
+Message.Description = MessageDescription;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Message,