@fragments-sdk/ui 0.9.0 → 0.9.2

package/dist/components/Grid/Grid.module.scss.js

@@ -0,0 +1,177 @@
+const grid = "_grid_1ki22_1";
+const columns1 = "_columns1_1ki22_6";
+const columns2 = "_columns2_1ki22_10";
+const columns3 = "_columns3_1ki22_14";
+const columns4 = "_columns4_1ki22_18";
+const columns5 = "_columns5_1ki22_22";
+const columns6 = "_columns6_1ki22_26";
+const columns7 = "_columns7_1ki22_30";
+const columns8 = "_columns8_1ki22_34";
+const columns9 = "_columns9_1ki22_38";
+const columns10 = "_columns10_1ki22_42";
+const columns11 = "_columns11_1ki22_46";
+const columns12 = "_columns12_1ki22_50";
+const columnsAuto = "_columnsAuto_1ki22_54";
+const columnsResponsive = "_columnsResponsive_1ki22_58";
+const gapNone = "_gapNone_1ki22_83";
+const gapXs = "_gapXs_1ki22_87";
+const gapSm = "_gapSm_1ki22_91";
+const gapMd = "_gapMd_1ki22_95";
+const gapLg = "_gapLg_1ki22_99";
+const gapXl = "_gapXl_1ki22_103";
+const paddingNone = "_paddingNone_1ki22_107";
+const paddingSm = "_paddingSm_1ki22_111";
+const paddingMd = "_paddingMd_1ki22_115";
+const paddingLg = "_paddingLg_1ki22_119";
+const alignStart = "_alignStart_1ki22_123";
+const alignCenter = "_alignCenter_1ki22_127";
+const alignEnd = "_alignEnd_1ki22_131";
+const alignStretch = "_alignStretch_1ki22_135";
+const justifyStart = "_justifyStart_1ki22_139";
+const justifyCenter = "_justifyCenter_1ki22_143";
+const justifyEnd = "_justifyEnd_1ki22_147";
+const justifyStretch = "_justifyStretch_1ki22_151";
+const item = "_item_1ki22_155";
+const colSpan1 = "_colSpan1_1ki22_159";
+const colSpan2 = "_colSpan2_1ki22_163";
+const colSpan3 = "_colSpan3_1ki22_167";
+const colSpan4 = "_colSpan4_1ki22_171";
+const colSpan5 = "_colSpan5_1ki22_175";
+const colSpan6 = "_colSpan6_1ki22_179";
+const colSpan7 = "_colSpan7_1ki22_183";
+const colSpan8 = "_colSpan8_1ki22_187";
+const colSpan9 = "_colSpan9_1ki22_191";
+const colSpan10 = "_colSpan10_1ki22_195";
+const colSpan11 = "_colSpan11_1ki22_199";
+const colSpan12 = "_colSpan12_1ki22_203";
+const colSpanFull = "_colSpanFull_1ki22_207";
+const rowSpan1 = "_rowSpan1_1ki22_211";
+const rowSpan2 = "_rowSpan2_1ki22_215";
+const rowSpan3 = "_rowSpan3_1ki22_219";
+const rowSpan4 = "_rowSpan4_1ki22_223";
+const rowSpan5 = "_rowSpan5_1ki22_227";
+const rowSpan6 = "_rowSpan6_1ki22_231";
+const selfAlignStart = "_selfAlignStart_1ki22_235";
+const selfAlignCenter = "_selfAlignCenter_1ki22_239";
+const selfAlignEnd = "_selfAlignEnd_1ki22_243";
+const selfAlignStretch = "_selfAlignStretch_1ki22_247";
+const styles = {
+  grid,
+  columns1,
+  columns2,
+  columns3,
+  columns4,
+  columns5,
+  columns6,
+  columns7,
+  columns8,
+  columns9,
+  columns10,
+  columns11,
+  columns12,
+  columnsAuto,
+  columnsResponsive,
+  gapNone,
+  gapXs,
+  gapSm,
+  gapMd,
+  gapLg,
+  gapXl,
+  paddingNone,
+  paddingSm,
+  paddingMd,
+  paddingLg,
+  alignStart,
+  alignCenter,
+  alignEnd,
+  alignStretch,
+  justifyStart,
+  justifyCenter,
+  justifyEnd,
+  justifyStretch,
+  item,
+  colSpan1,
+  colSpan2,
+  colSpan3,
+  colSpan4,
+  colSpan5,
+  colSpan6,
+  colSpan7,
+  colSpan8,
+  colSpan9,
+  colSpan10,
+  colSpan11,
+  colSpan12,
+  colSpanFull,
+  rowSpan1,
+  rowSpan2,
+  rowSpan3,
+  rowSpan4,
+  rowSpan5,
+  rowSpan6,
+  selfAlignStart,
+  selfAlignCenter,
+  selfAlignEnd,
+  selfAlignStretch
+};
+export {
+  alignCenter,
+  alignEnd,
+  alignStart,
+  alignStretch,
+  colSpan1,
+  colSpan10,
+  colSpan11,
+  colSpan12,
+  colSpan2,
+  colSpan3,
+  colSpan4,
+  colSpan5,
+  colSpan6,
+  colSpan7,
+  colSpan8,
+  colSpan9,
+  colSpanFull,
+  columns1,
+  columns10,
+  columns11,
+  columns12,
+  columns2,
+  columns3,
+  columns4,
+  columns5,
+  columns6,
+  columns7,
+  columns8,
+  columns9,
+  columnsAuto,
+  columnsResponsive,
+  styles as default,
+  gapLg,
+  gapMd,
+  gapNone,
+  gapSm,
+  gapXl,
+  gapXs,
+  grid,
+  item,
+  justifyCenter,
+  justifyEnd,
+  justifyStart,
+  justifyStretch,
+  paddingLg,
+  paddingMd,
+  paddingNone,
+  paddingSm,
+  rowSpan1,
+  rowSpan2,
+  rowSpan3,
+  rowSpan4,
+  rowSpan5,
+  rowSpan6,
+  selfAlignCenter,
+  selfAlignEnd,
+  selfAlignStart,
+  selfAlignStretch
+};
+//# sourceMappingURL=Grid.module.scss.js.map

package/dist/components/Grid/Grid.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Grid/index.cjs

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const Grid_module = require("./Grid.module.scss.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+function isResponsiveColumns(columns) {
+  return typeof columns === "object" && columns !== null;
+}
+const gapClasses = {
+  none: Grid_module.default.gapNone,
+  xs: Grid_module.default.gapXs,
+  sm: Grid_module.default.gapSm,
+  md: Grid_module.default.gapMd,
+  lg: Grid_module.default.gapLg,
+  xl: Grid_module.default.gapXl
+};
+const paddingClasses = {
+  none: Grid_module.default.paddingNone,
+  sm: Grid_module.default.paddingSm,
+  md: Grid_module.default.paddingMd,
+  lg: Grid_module.default.paddingLg
+};
+const Grid = React__namespace.forwardRef(
+  function Grid2({
+    children,
+    columns = 1,
+    minChildWidth,
+    gap = "md",
+    alignItems,
+    justifyItems,
+    padding = "none",
+    className,
+    style
+  }, ref) {
+    let columnsClass;
+    let inlineStyle;
+    if (columns === "auto") {
+      columnsClass = Grid_module.default.columnsAuto;
+      if (minChildWidth) {
+        inlineStyle = { "--fui-grid-min-child-width": minChildWidth };
+      }
+    } else if (isResponsiveColumns(columns)) {
+      columnsClass = Grid_module.default.columnsResponsive;
+      const vars = {};
+      if (columns.base) vars["--fui-grid-cols"] = String(columns.base);
+      if (columns.sm) vars["--fui-grid-cols-sm"] = String(columns.sm);
+      if (columns.md) vars["--fui-grid-cols-md"] = String(columns.md);
+      if (columns.lg) vars["--fui-grid-cols-lg"] = String(columns.lg);
+      if (columns.xl) vars["--fui-grid-cols-xl"] = String(columns.xl);
+      inlineStyle = vars;
+    } else {
+      columnsClass = Grid_module.default[`columns${columns}`];
+    }
+    const classes = [
+      Grid_module.default.grid,
+      columnsClass,
+      gapClasses[gap],
+      paddingClasses[padding],
+      alignItems && Grid_module.default[`align${cap(alignItems)}`],
+      justifyItems && Grid_module.default[`justify${cap(justifyItems)}`],
+      className
+    ].filter(Boolean).join(" ");
+    const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: classes, style: mergedStyle, children });
+  }
+);
+const GridItem = React__namespace.forwardRef(
+  function GridItem2({
+    children,
+    colSpan,
+    rowSpan,
+    alignSelf,
+    className
+  }, ref) {
+    const classes = [
+      Grid_module.default.item,
+      colSpan && (colSpan === "full" ? Grid_module.default.colSpanFull : Grid_module.default[`colSpan${colSpan}`]),
+      rowSpan && Grid_module.default[`rowSpan${rowSpan}`],
+      alignSelf && Grid_module.default[`selfAlign${cap(alignSelf)}`],
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: classes, children });
+  }
+);
+function cap(s) {
+  return s.charAt(0).toUpperCase() + s.slice(1);
+}
+Grid.Item = GridItem;
+exports.Grid = Grid;
+//# sourceMappingURL=index.cjs.map

package/dist/components/Grid/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/Grid/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './Grid.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\ntype ColumnCount = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n\n/** Responsive value — either a single value or per-breakpoint overrides */\nexport interface ResponsiveColumns {\n  /** Default (mobile-first) */\n  base?: ColumnCount;\n  /** ≥640px */\n  sm?: ColumnCount;\n  /** ≥768px */\n  md?: ColumnCount;\n  /** ≥1024px */\n  lg?: ColumnCount;\n  /** ≥1280px */\n  xl?: ColumnCount;\n}\n\nexport interface GridProps {\n  children?: React.ReactNode;\n  /**\n   * Number of columns.\n   * - A number (1-12) for fixed columns at all sizes\n   * - An object for responsive columns: `{ base: 1, md: 2, lg: 3 }`\n   * - `\"auto\"` for responsive auto-fill based on minChildWidth\n   */\n  columns?: ColumnCount | ResponsiveColumns | 'auto';\n  /** Minimum width for auto-fill columns (only used with columns=\"auto\") */\n  minChildWidth?: string;\n  /** Gap between grid items */\n  gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** Vertical alignment of items within their cells */\n  alignItems?: 'start' | 'center' | 'end' | 'stretch';\n  /** Horizontal alignment of items within their cells */\n  justifyItems?: 'start' | 'center' | 'end' | 'stretch';\n  /** Padding inside the grid container */\n  padding?: 'none' | 'sm' | 'md' | 'lg';\n  /** Additional class name */\n  className?: string;\n  /** Inline styles */\n  style?: React.CSSProperties;\n}\n\nexport interface GridItemProps {\n  children?: React.ReactNode;\n  /** Number of columns this item spans */\n  colSpan?: ColumnCount | 'full';\n  /** Number of rows this item spans */\n  rowSpan?: 1 | 2 | 3 | 4 | 5 | 6;\n  /** Override alignment for this item */\n  alignSelf?: 'start' | 'center' | 'end' | 'stretch';\n  /** Additional class name */\n  className?: string;\n}\n\n// ============================================\n// Helpers\n// ============================================\n\nfunction isResponsiveColumns(\n  columns: GridProps['columns']\n): columns is ResponsiveColumns {\n  return typeof columns === 'object' && columns !== null;\n}\n\nconst gapClasses: Record<NonNullable<GridProps['gap']>, string> = {\n  none: styles.gapNone,\n  xs: styles.gapXs,\n  sm: styles.gapSm,\n  md: styles.gapMd,\n  lg: styles.gapLg,\n  xl: styles.gapXl,\n};\n\nconst paddingClasses: Record<NonNullable<GridProps['padding']>, string> = {\n  none: styles.paddingNone,\n  sm: styles.paddingSm,\n  md: styles.paddingMd,\n  lg: styles.paddingLg,\n};\n\n// ============================================\n// Grid Component\n// ============================================\n\nexport const Grid = React.forwardRef<HTMLDivElement, GridProps>(\n  function Grid(\n    {\n      children,\n      columns = 1,\n      minChildWidth,\n      gap = 'md',\n      alignItems,\n      justifyItems,\n      padding = 'none',\n      className,\n      style,\n    },\n    ref\n  ) {\n    // Determine classes and style based on columns type\n    let columnsClass: string;\n    let inlineStyle: React.CSSProperties | undefined;\n\n    if (columns === 'auto') {\n      columnsClass = styles.columnsAuto;\n      if (minChildWidth) {\n        inlineStyle = { '--fui-grid-min-child-width': minChildWidth } as React.CSSProperties;\n      }\n    } else if (isResponsiveColumns(columns)) {\n      columnsClass = styles.columnsResponsive;\n      const vars: Record<string, string> = {};\n      if (columns.base) vars['--fui-grid-cols'] = String(columns.base);\n      if (columns.sm) vars['--fui-grid-cols-sm'] = String(columns.sm);\n      if (columns.md) vars['--fui-grid-cols-md'] = String(columns.md);\n      if (columns.lg) vars['--fui-grid-cols-lg'] = String(columns.lg);\n      if (columns.xl) vars['--fui-grid-cols-xl'] = String(columns.xl);\n      inlineStyle = vars as unknown as React.CSSProperties;\n    } else {\n      columnsClass = styles[`columns${columns}`];\n    }\n\n    const classes = [\n      styles.grid,\n      columnsClass,\n      gapClasses[gap],\n      paddingClasses[padding],\n      alignItems && styles[`align${cap(alignItems)}`],\n      justifyItems && styles[`justify${cap(justifyItems)}`],\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;\n\n    return (\n      <div ref={ref} className={classes} style={mergedStyle}>\n        {children}\n      </div>\n    );\n  }\n) as GridComponent;\n\n// ============================================\n// Grid.Item Sub-component\n// ============================================\n\nconst GridItem = React.forwardRef<HTMLDivElement, GridItemProps>(\n  function GridItem(\n    {\n      children,\n      colSpan,\n      rowSpan,\n      alignSelf,\n      className,\n    },\n    ref\n  ) {\n    const classes = [\n      styles.item,\n      colSpan && (colSpan === 'full' ? styles.colSpanFull : styles[`colSpan${colSpan}`]),\n      rowSpan && styles[`rowSpan${rowSpan}`],\n      alignSelf && styles[`selfAlign${cap(alignSelf)}`],\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div ref={ref} className={classes}>\n        {children}\n      </div>\n    );\n  }\n);\n\n// ============================================\n// Utilities\n// ============================================\n\nfunction cap(s: string): string {\n  return s.charAt(0).toUpperCase() + s.slice(1);\n}\n\n// ============================================\n// Compound component type\n// ============================================\n\ninterface GridComponent\n  extends React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>> {\n  Item: typeof GridItem;\n}\n\n(Grid as GridComponent).Item = GridItem;\n"],"names":["styles","React","Grid","GridItem","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAgEA,SAAS,oBACP,SAC8B;AAC9B,SAAO,OAAO,YAAY,YAAY,YAAY;AACpD;AAEA,MAAM,aAA4D;AAAA,EAChE,MAAMA,YAAAA,QAAO;AAAA,EACb,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AACb;AAEA,MAAM,iBAAoE;AAAA,EACxE,MAAMA,YAAAA,QAAO;AAAA,EACb,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AACb;AAMO,MAAM,OAAOC,iBAAM;AAAA,EACxB,SAASC,MACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,EAAA,GAEF,KACA;AAEA,QAAI;AACJ,QAAI;AAEJ,QAAI,YAAY,QAAQ;AACtB,qBAAeF,YAAAA,QAAO;AACtB,UAAI,eAAe;AACjB,sBAAc,EAAE,8BAA8B,cAAA;AAAA,MAChD;AAAA,IACF,WAAW,oBAAoB,OAAO,GAAG;AACvC,qBAAeA,YAAAA,QAAO;AACtB,YAAM,OAA+B,CAAA;AACrC,UAAI,QAAQ,KAAM,MAAK,iBAAiB,IAAI,OAAO,QAAQ,IAAI;AAC/D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,oBAAc;AAAA,IAChB,OAAO;AACL,qBAAeA,YAAAA,QAAO,UAAU,OAAO,EAAE;AAAA,IAC3C;AAEA,UAAM,UAAU;AAAA,MACdA,YAAAA,QAAO;AAAA,MACP;AAAA,MACA,WAAW,GAAG;AAAA,MACd,eAAe,OAAO;AAAA,MACtB,cAAcA,YAAAA,QAAO,QAAQ,IAAI,UAAU,CAAC,EAAE;AAAA,MAC9C,gBAAgBA,YAAAA,QAAO,UAAU,IAAI,YAAY,CAAC,EAAE;AAAA,MACpD;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,UAAM,cAAc,cAAc,EAAE,GAAG,aAAa,GAAG,UAAU;AAEjE,0CACG,OAAA,EAAI,KAAU,WAAW,SAAS,OAAO,aACvC,UACH;AAAA,EAEJ;AACF;AAMA,MAAM,WAAWC,iBAAM;AAAA,EACrB,SAASE,UACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEF,KACA;AACA,UAAM,UAAU;AAAA,MACdH,YAAAA,QAAO;AAAA,MACP,YAAY,YAAY,SAASA,oBAAO,cAAcA,YAAAA,QAAO,UAAU,OAAO,EAAE;AAAA,MAChF,WAAWA,YAAAA,QAAO,UAAU,OAAO,EAAE;AAAA,MACrC,aAAaA,YAAAA,QAAO,YAAY,IAAI,SAAS,CAAC,EAAE;AAAA,MAChD;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACEI,2BAAAA,IAAC,OAAA,EAAI,KAAU,WAAW,SACvB,UACH;AAAA,EAEJ;AACF;AAMA,SAAS,IAAI,GAAmB;AAC9B,SAAO,EAAE,OAAO,CAAC,EAAE,gBAAgB,EAAE,MAAM,CAAC;AAC9C;AAWC,KAAuB,OAAO;;"}

package/dist/components/Grid/index.d.ts

@@ -0,0 +1,57 @@
+import * as React from 'react';
+type ColumnCount = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+/** Responsive value — either a single value or per-breakpoint overrides */
+export interface ResponsiveColumns {
+    /** Default (mobile-first) */
+    base?: ColumnCount;
+    /** ≥640px */
+    sm?: ColumnCount;
+    /** ≥768px */
+    md?: ColumnCount;
+    /** ≥1024px */
+    lg?: ColumnCount;
+    /** ≥1280px */
+    xl?: ColumnCount;
+}
+export interface GridProps {
+    children?: React.ReactNode;
+    /**
+     * Number of columns.
+     * - A number (1-12) for fixed columns at all sizes
+     * - An object for responsive columns: `{ base: 1, md: 2, lg: 3 }`
+     * - `"auto"` for responsive auto-fill based on minChildWidth
+     */
+    columns?: ColumnCount | ResponsiveColumns | 'auto';
+    /** Minimum width for auto-fill columns (only used with columns="auto") */
+    minChildWidth?: string;
+    /** Gap between grid items */
+    gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /** Vertical alignment of items within their cells */
+    alignItems?: 'start' | 'center' | 'end' | 'stretch';
+    /** Horizontal alignment of items within their cells */
+    justifyItems?: 'start' | 'center' | 'end' | 'stretch';
+    /** Padding inside the grid container */
+    padding?: 'none' | 'sm' | 'md' | 'lg';
+    /** Additional class name */
+    className?: string;
+    /** Inline styles */
+    style?: React.CSSProperties;
+}
+export interface GridItemProps {
+    children?: React.ReactNode;
+    /** Number of columns this item spans */
+    colSpan?: ColumnCount | 'full';
+    /** Number of rows this item spans */
+    rowSpan?: 1 | 2 | 3 | 4 | 5 | 6;
+    /** Override alignment for this item */
+    alignSelf?: 'start' | 'center' | 'end' | 'stretch';
+    /** Additional class name */
+    className?: string;
+}
+export declare const Grid: GridComponent;
+declare const GridItem: React.ForwardRefExoticComponent<GridItemProps & React.RefAttributes<HTMLDivElement>>;
+interface GridComponent extends React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>> {
+    Item: typeof GridItem;
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Grid/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Grid/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,KAAK,WAAW,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAEpE,2EAA2E;AAC3E,MAAM,WAAW,iBAAiB;IAChC,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,aAAa;IACb,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,aAAa;IACb,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,cAAc;IACd,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB,cAAc;IACd,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB;AAED,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,iBAAiB,GAAG,MAAM,CAAC;IACnD,0EAA0E;IAC1E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,6BAA6B;IAC7B,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAChD,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACpD,uDAAuD;IACvD,YAAY,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACtD,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACtC,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,wCAAwC;IACxC,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAC/B,qCAAqC;IACrC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAChC,uCAAuC;IACvC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IACnD,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgCD,eAAO,MAAM,IAAI,EAyDZ,aAAa,CAAC;AAMnB,QAAA,MAAM,QAAQ,sFA2Bb,CAAC;AAcF,UAAU,aACR,SAAQ,KAAK,CAAC,yBAAyB,CAAC,SAAS,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;IACxF,IAAI,EAAE,OAAO,QAAQ,CAAC;CACvB"}

package/dist/components/Grid/index.js

@@ -0,0 +1,90 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import styles from "./Grid.module.scss.js";
+function isResponsiveColumns(columns) {
+  return typeof columns === "object" && columns !== null;
+}
+const gapClasses = {
+  none: styles.gapNone,
+  xs: styles.gapXs,
+  sm: styles.gapSm,
+  md: styles.gapMd,
+  lg: styles.gapLg,
+  xl: styles.gapXl
+};
+const paddingClasses = {
+  none: styles.paddingNone,
+  sm: styles.paddingSm,
+  md: styles.paddingMd,
+  lg: styles.paddingLg
+};
+const Grid = React.forwardRef(
+  function Grid2({
+    children,
+    columns = 1,
+    minChildWidth,
+    gap = "md",
+    alignItems,
+    justifyItems,
+    padding = "none",
+    className,
+    style
+  }, ref) {
+    let columnsClass;
+    let inlineStyle;
+    if (columns === "auto") {
+      columnsClass = styles.columnsAuto;
+      if (minChildWidth) {
+        inlineStyle = { "--fui-grid-min-child-width": minChildWidth };
+      }
+    } else if (isResponsiveColumns(columns)) {
+      columnsClass = styles.columnsResponsive;
+      const vars = {};
+      if (columns.base) vars["--fui-grid-cols"] = String(columns.base);
+      if (columns.sm) vars["--fui-grid-cols-sm"] = String(columns.sm);
+      if (columns.md) vars["--fui-grid-cols-md"] = String(columns.md);
+      if (columns.lg) vars["--fui-grid-cols-lg"] = String(columns.lg);
+      if (columns.xl) vars["--fui-grid-cols-xl"] = String(columns.xl);
+      inlineStyle = vars;
+    } else {
+      columnsClass = styles[`columns${columns}`];
+    }
+    const classes = [
+      styles.grid,
+      columnsClass,
+      gapClasses[gap],
+      paddingClasses[padding],
+      alignItems && styles[`align${cap(alignItems)}`],
+      justifyItems && styles[`justify${cap(justifyItems)}`],
+      className
+    ].filter(Boolean).join(" ");
+    const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;
+    return /* @__PURE__ */ jsx("div", { ref, className: classes, style: mergedStyle, children });
+  }
+);
+const GridItem = React.forwardRef(
+  function GridItem2({
+    children,
+    colSpan,
+    rowSpan,
+    alignSelf,
+    className
+  }, ref) {
+    const classes = [
+      styles.item,
+      colSpan && (colSpan === "full" ? styles.colSpanFull : styles[`colSpan${colSpan}`]),
+      rowSpan && styles[`rowSpan${rowSpan}`],
+      alignSelf && styles[`selfAlign${cap(alignSelf)}`],
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsx("div", { ref, className: classes, children });
+  }
+);
+function cap(s) {
+  return s.charAt(0).toUpperCase() + s.slice(1);
+}
+Grid.Item = GridItem;
+export {
+  Grid
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Grid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/Grid/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './Grid.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\ntype ColumnCount = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n\n/** Responsive value — either a single value or per-breakpoint overrides */\nexport interface ResponsiveColumns {\n  /** Default (mobile-first) */\n  base?: ColumnCount;\n  /** ≥640px */\n  sm?: ColumnCount;\n  /** ≥768px */\n  md?: ColumnCount;\n  /** ≥1024px */\n  lg?: ColumnCount;\n  /** ≥1280px */\n  xl?: ColumnCount;\n}\n\nexport interface GridProps {\n  children?: React.ReactNode;\n  /**\n   * Number of columns.\n   * - A number (1-12) for fixed columns at all sizes\n   * - An object for responsive columns: `{ base: 1, md: 2, lg: 3 }`\n   * - `\"auto\"` for responsive auto-fill based on minChildWidth\n   */\n  columns?: ColumnCount | ResponsiveColumns | 'auto';\n  /** Minimum width for auto-fill columns (only used with columns=\"auto\") */\n  minChildWidth?: string;\n  /** Gap between grid items */\n  gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** Vertical alignment of items within their cells */\n  alignItems?: 'start' | 'center' | 'end' | 'stretch';\n  /** Horizontal alignment of items within their cells */\n  justifyItems?: 'start' | 'center' | 'end' | 'stretch';\n  /** Padding inside the grid container */\n  padding?: 'none' | 'sm' | 'md' | 'lg';\n  /** Additional class name */\n  className?: string;\n  /** Inline styles */\n  style?: React.CSSProperties;\n}\n\nexport interface GridItemProps {\n  children?: React.ReactNode;\n  /** Number of columns this item spans */\n  colSpan?: ColumnCount | 'full';\n  /** Number of rows this item spans */\n  rowSpan?: 1 | 2 | 3 | 4 | 5 | 6;\n  /** Override alignment for this item */\n  alignSelf?: 'start' | 'center' | 'end' | 'stretch';\n  /** Additional class name */\n  className?: string;\n}\n\n// ============================================\n// Helpers\n// ============================================\n\nfunction isResponsiveColumns(\n  columns: GridProps['columns']\n): columns is ResponsiveColumns {\n  return typeof columns === 'object' && columns !== null;\n}\n\nconst gapClasses: Record<NonNullable<GridProps['gap']>, string> = {\n  none: styles.gapNone,\n  xs: styles.gapXs,\n  sm: styles.gapSm,\n  md: styles.gapMd,\n  lg: styles.gapLg,\n  xl: styles.gapXl,\n};\n\nconst paddingClasses: Record<NonNullable<GridProps['padding']>, string> = {\n  none: styles.paddingNone,\n  sm: styles.paddingSm,\n  md: styles.paddingMd,\n  lg: styles.paddingLg,\n};\n\n// ============================================\n// Grid Component\n// ============================================\n\nexport const Grid = React.forwardRef<HTMLDivElement, GridProps>(\n  function Grid(\n    {\n      children,\n      columns = 1,\n      minChildWidth,\n      gap = 'md',\n      alignItems,\n      justifyItems,\n      padding = 'none',\n      className,\n      style,\n    },\n    ref\n  ) {\n    // Determine classes and style based on columns type\n    let columnsClass: string;\n    let inlineStyle: React.CSSProperties | undefined;\n\n    if (columns === 'auto') {\n      columnsClass = styles.columnsAuto;\n      if (minChildWidth) {\n        inlineStyle = { '--fui-grid-min-child-width': minChildWidth } as React.CSSProperties;\n      }\n    } else if (isResponsiveColumns(columns)) {\n      columnsClass = styles.columnsResponsive;\n      const vars: Record<string, string> = {};\n      if (columns.base) vars['--fui-grid-cols'] = String(columns.base);\n      if (columns.sm) vars['--fui-grid-cols-sm'] = String(columns.sm);\n      if (columns.md) vars['--fui-grid-cols-md'] = String(columns.md);\n      if (columns.lg) vars['--fui-grid-cols-lg'] = String(columns.lg);\n      if (columns.xl) vars['--fui-grid-cols-xl'] = String(columns.xl);\n      inlineStyle = vars as unknown as React.CSSProperties;\n    } else {\n      columnsClass = styles[`columns${columns}`];\n    }\n\n    const classes = [\n      styles.grid,\n      columnsClass,\n      gapClasses[gap],\n      paddingClasses[padding],\n      alignItems && styles[`align${cap(alignItems)}`],\n      justifyItems && styles[`justify${cap(justifyItems)}`],\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const mergedStyle = inlineStyle ? { ...inlineStyle, ...style } : style;\n\n    return (\n      <div ref={ref} className={classes} style={mergedStyle}>\n        {children}\n      </div>\n    );\n  }\n) as GridComponent;\n\n// ============================================\n// Grid.Item Sub-component\n// ============================================\n\nconst GridItem = React.forwardRef<HTMLDivElement, GridItemProps>(\n  function GridItem(\n    {\n      children,\n      colSpan,\n      rowSpan,\n      alignSelf,\n      className,\n    },\n    ref\n  ) {\n    const classes = [\n      styles.item,\n      colSpan && (colSpan === 'full' ? styles.colSpanFull : styles[`colSpan${colSpan}`]),\n      rowSpan && styles[`rowSpan${rowSpan}`],\n      alignSelf && styles[`selfAlign${cap(alignSelf)}`],\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div ref={ref} className={classes}>\n        {children}\n      </div>\n    );\n  }\n);\n\n// ============================================\n// Utilities\n// ============================================\n\nfunction cap(s: string): string {\n  return s.charAt(0).toUpperCase() + s.slice(1);\n}\n\n// ============================================\n// Compound component type\n// ============================================\n\ninterface GridComponent\n  extends React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>> {\n  Item: typeof GridItem;\n}\n\n(Grid as GridComponent).Item = GridItem;\n"],"names":["Grid","GridItem"],"mappings":";;;AAgEA,SAAS,oBACP,SAC8B;AAC9B,SAAO,OAAO,YAAY,YAAY,YAAY;AACpD;AAEA,MAAM,aAA4D;AAAA,EAChE,MAAM,OAAO;AAAA,EACb,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AACb;AAEA,MAAM,iBAAoE;AAAA,EACxE,MAAM,OAAO;AAAA,EACb,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AACb;AAMO,MAAM,OAAO,MAAM;AAAA,EACxB,SAASA,MACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,EAAA,GAEF,KACA;AAEA,QAAI;AACJ,QAAI;AAEJ,QAAI,YAAY,QAAQ;AACtB,qBAAe,OAAO;AACtB,UAAI,eAAe;AACjB,sBAAc,EAAE,8BAA8B,cAAA;AAAA,MAChD;AAAA,IACF,WAAW,oBAAoB,OAAO,GAAG;AACvC,qBAAe,OAAO;AACtB,YAAM,OAA+B,CAAA;AACrC,UAAI,QAAQ,KAAM,MAAK,iBAAiB,IAAI,OAAO,QAAQ,IAAI;AAC/D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,UAAI,QAAQ,GAAI,MAAK,oBAAoB,IAAI,OAAO,QAAQ,EAAE;AAC9D,oBAAc;AAAA,IAChB,OAAO;AACL,qBAAe,OAAO,UAAU,OAAO,EAAE;AAAA,IAC3C;AAEA,UAAM,UAAU;AAAA,MACd,OAAO;AAAA,MACP;AAAA,MACA,WAAW,GAAG;AAAA,MACd,eAAe,OAAO;AAAA,MACtB,cAAc,OAAO,QAAQ,IAAI,UAAU,CAAC,EAAE;AAAA,MAC9C,gBAAgB,OAAO,UAAU,IAAI,YAAY,CAAC,EAAE;AAAA,MACpD;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,UAAM,cAAc,cAAc,EAAE,GAAG,aAAa,GAAG,UAAU;AAEjE,+BACG,OAAA,EAAI,KAAU,WAAW,SAAS,OAAO,aACvC,UACH;AAAA,EAEJ;AACF;AAMA,MAAM,WAAW,MAAM;AAAA,EACrB,SAASC,UACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEF,KACA;AACA,UAAM,UAAU;AAAA,MACd,OAAO;AAAA,MACP,YAAY,YAAY,SAAS,OAAO,cAAc,OAAO,UAAU,OAAO,EAAE;AAAA,MAChF,WAAW,OAAO,UAAU,OAAO,EAAE;AAAA,MACrC,aAAa,OAAO,YAAY,IAAI,SAAS,CAAC,EAAE;AAAA,MAChD;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACE,oBAAC,OAAA,EAAI,KAAU,WAAW,SACvB,UACH;AAAA,EAEJ;AACF;AAMA,SAAS,IAAI,GAAmB;AAC9B,SAAO,EAAE,OAAO,CAAC,EAAE,gBAAgB,EAAE,MAAM,CAAC;AAC9C;AAWC,KAAuB,OAAO;"}

package/dist/components/Header/Header.module.scss.cjs

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const header = "_header_8fsw3_1";
+const fixed = "_fixed_8fsw3_11";
+const sticky = "_sticky_8fsw3_18";
+const container = "_container_8fsw3_23";
+const brand = "_brand_8fsw3_36";
+const nav = "_nav_8fsw3_54";
+const navList = "_navList_8fsw3_64";
+const navItem = "_navItem_8fsw3_73";
+const navItemActive = "_navItemActive_8fsw3_121";
+const navMenuTrigger = "_navMenuTrigger_8fsw3_135";
+const navMenuChevron = "_navMenuChevron_8fsw3_140";
+const navMenuPositioner = "_navMenuPositioner_8fsw3_148";
+const navMenuPopup = "_navMenuPopup_8fsw3_153";
+const navMenuItem = "_navMenuItem_8fsw3_174";
+const navMenuItemActive = "_navMenuItemActive_8fsw3_210";
+const search = "_search_8fsw3_232";
+const searchExpandable = "_searchExpandable_8fsw3_242";
+const actions = "_actions_8fsw3_246";
+const trigger = "_trigger_8fsw3_253";
+const spacer = "_spacer_8fsw3_295";
+const skipLink = "_skipLink_8fsw3_299";
+const styles = {
+  header,
+  fixed,
+  sticky,
+  container,
+  brand,
+  nav,
+  navList,
+  navItem,
+  navItemActive,
+  navMenuTrigger,
+  navMenuChevron,
+  navMenuPositioner,
+  navMenuPopup,
+  navMenuItem,
+  navMenuItemActive,
+  search,
+  searchExpandable,
+  actions,
+  trigger,
+  spacer,
+  skipLink
+};
+exports.actions = actions;
+exports.brand = brand;
+exports.container = container;
+exports.default = styles;
+exports.fixed = fixed;
+exports.header = header;
+exports.nav = nav;
+exports.navItem = navItem;
+exports.navItemActive = navItemActive;
+exports.navList = navList;
+exports.navMenuChevron = navMenuChevron;
+exports.navMenuItem = navMenuItem;
+exports.navMenuItemActive = navMenuItemActive;
+exports.navMenuPopup = navMenuPopup;
+exports.navMenuPositioner = navMenuPositioner;
+exports.navMenuTrigger = navMenuTrigger;
+exports.search = search;
+exports.searchExpandable = searchExpandable;
+exports.skipLink = skipLink;
+exports.spacer = spacer;
+exports.sticky = sticky;
+exports.trigger = trigger;
+//# sourceMappingURL=Header.module.scss.cjs.map

package/dist/components/Header/Header.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Header/Header.module.scss.js

@@ -0,0 +1,69 @@
+const header = "_header_8fsw3_1";
+const fixed = "_fixed_8fsw3_11";
+const sticky = "_sticky_8fsw3_18";
+const container = "_container_8fsw3_23";
+const brand = "_brand_8fsw3_36";
+const nav = "_nav_8fsw3_54";
+const navList = "_navList_8fsw3_64";
+const navItem = "_navItem_8fsw3_73";
+const navItemActive = "_navItemActive_8fsw3_121";
+const navMenuTrigger = "_navMenuTrigger_8fsw3_135";
+const navMenuChevron = "_navMenuChevron_8fsw3_140";
+const navMenuPositioner = "_navMenuPositioner_8fsw3_148";
+const navMenuPopup = "_navMenuPopup_8fsw3_153";
+const navMenuItem = "_navMenuItem_8fsw3_174";
+const navMenuItemActive = "_navMenuItemActive_8fsw3_210";
+const search = "_search_8fsw3_232";
+const searchExpandable = "_searchExpandable_8fsw3_242";
+const actions = "_actions_8fsw3_246";
+const trigger = "_trigger_8fsw3_253";
+const spacer = "_spacer_8fsw3_295";
+const skipLink = "_skipLink_8fsw3_299";
+const styles = {
+  header,
+  fixed,
+  sticky,
+  container,
+  brand,
+  nav,
+  navList,
+  navItem,
+  navItemActive,
+  navMenuTrigger,
+  navMenuChevron,
+  navMenuPositioner,
+  navMenuPopup,
+  navMenuItem,
+  navMenuItemActive,
+  search,
+  searchExpandable,
+  actions,
+  trigger,
+  spacer,
+  skipLink
+};
+export {
+  actions,
+  brand,
+  container,
+  styles as default,
+  fixed,
+  header,
+  nav,
+  navItem,
+  navItemActive,
+  navList,
+  navMenuChevron,
+  navMenuItem,
+  navMenuItemActive,
+  navMenuPopup,
+  navMenuPositioner,
+  navMenuTrigger,
+  search,
+  searchExpandable,
+  skipLink,
+  spacer,
+  sticky,
+  trigger
+};
+//# sourceMappingURL=Header.module.scss.js.map

package/dist/components/Header/Header.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}