@iris-ui-kit/vue 0.1.0

package/dist/layouts.cjs

@@ -0,0 +1,392 @@
+'use strict';
+
+var vue = require('vue');
+
+// src/layouts/SidebarLayout.ts
+var IrisSidebarLayout = vue.defineComponent({
+  name: "IrisSidebarLayout",
+  inheritAttrs: false,
+  props: {
+    collapsed: { type: Boolean, default: void 0 },
+    defaultCollapsed: { type: Boolean, default: false },
+    /** Sidebar width when expanded (px or CSS length). */
+    width: { type: [Number, String], default: 240 },
+    /** Sidebar width when collapsed. */
+    collapsedWidth: { type: [Number, String], default: 60 },
+    /** Sidebar position. */
+    side: { type: String, default: "left" }
+  },
+  emits: {
+    "update:collapsed": (_value) => true
+  },
+  setup(props, { slots, attrs, emit }) {
+    const isControlled = vue.computed(() => props.collapsed !== void 0);
+    const internalCollapsed = vue.ref(props.defaultCollapsed);
+    const collapsed = vue.computed(
+      () => isControlled.value ? Boolean(props.collapsed) : internalCollapsed.value
+    );
+    vue.watch(
+      () => props.collapsed,
+      (value) => {
+        if (value !== void 0) internalCollapsed.value = value;
+      }
+    );
+    const setCollapsed = (value) => {
+      if (!isControlled.value) internalCollapsed.value = value;
+      emit("update:collapsed", value);
+    };
+    const asLen = (v) => typeof v === "number" ? `${v}px` : v;
+    return () => {
+      const sidebarStyle = {
+        width: collapsed.value ? asLen(props.collapsedWidth) : asLen(props.width),
+        flexShrink: "0",
+        background: "var(--iris-surface)",
+        borderRight: props.side === "left" ? "1px solid var(--iris-border)" : "none",
+        borderLeft: props.side === "right" ? "1px solid var(--iris-border)" : "none",
+        transition: "width 180ms ease",
+        overflow: "hidden",
+        display: "flex",
+        flexDirection: "column"
+      };
+      const mainStyle = {
+        flex: "1",
+        minWidth: "0",
+        overflow: "auto",
+        background: "var(--iris-background)"
+      };
+      const direction = props.side === "right" ? "row-reverse" : "row";
+      return vue.h(
+        "div",
+        {
+          ...attrs,
+          "data-iris-sidebar-layout": "",
+          "data-collapsed": collapsed.value ? "" : void 0,
+          "data-side": props.side,
+          style: {
+            display: "flex",
+            flexDirection: direction,
+            width: "100%",
+            height: "100%",
+            minHeight: "0",
+            color: "var(--iris-foreground)",
+            ...attrs.style ?? {}
+          }
+        },
+        [
+          vue.h(
+            "aside",
+            {
+              role: "complementary",
+              "data-iris-sidebar": "",
+              "data-collapsed": collapsed.value ? "" : void 0,
+              style: sidebarStyle
+            },
+            slots.sidebar?.({ collapsed: collapsed.value, setCollapsed })
+          ),
+          vue.h("div", { "data-iris-sidebar-main": "", style: mainStyle }, slots.default?.())
+        ]
+      );
+    };
+  }
+});
+var IrisHeaderLayout = vue.defineComponent({
+  name: "IrisHeaderLayout",
+  inheritAttrs: false,
+  props: {
+    /** Header height (px or CSS length). Default `'auto'`. */
+    headerHeight: { type: [Number, String], default: "auto" },
+    /** Footer height (px or CSS length). Default `'auto'`. */
+    footerHeight: { type: [Number, String], default: "auto" },
+    /** When true, header sticks via `position: sticky` instead of static. */
+    sticky: { type: Boolean, default: true }
+  },
+  setup(props, { slots, attrs }) {
+    const asLen = (v) => typeof v === "number" ? `${v}px` : v;
+    return () => vue.h(
+      "div",
+      {
+        ...attrs,
+        "data-iris-header-layout": "",
+        style: {
+          display: "flex",
+          flexDirection: "column",
+          width: "100%",
+          height: "100%",
+          minHeight: "0",
+          background: "var(--iris-background)",
+          color: "var(--iris-foreground)",
+          ...attrs.style ?? {}
+        }
+      },
+      [
+        slots.header ? vue.h(
+          "header",
+          {
+            role: "banner",
+            "data-iris-header": "",
+            style: {
+              flexShrink: "0",
+              height: asLen(props.headerHeight),
+              borderBottom: "1px solid var(--iris-border)",
+              background: "var(--iris-surface)",
+              position: props.sticky ? "sticky" : "static",
+              top: "0",
+              zIndex: "50"
+            }
+          },
+          slots.header()
+        ) : null,
+        vue.h(
+          "main",
+          {
+            role: "main",
+            "data-iris-header-main": "",
+            style: { flex: "1", minHeight: "0", overflow: "auto" }
+          },
+          slots.default?.()
+        ),
+        slots.footer ? vue.h(
+          "footer",
+          {
+            role: "contentinfo",
+            "data-iris-footer": "",
+            style: {
+              flexShrink: "0",
+              height: asLen(props.footerHeight),
+              borderTop: "1px solid var(--iris-border)",
+              background: "var(--iris-surface)"
+            }
+          },
+          slots.footer()
+        ) : null
+      ]
+    );
+  }
+});
+var IrisDashboardGrid = vue.defineComponent({
+  name: "IrisDashboardGrid",
+  inheritAttrs: false,
+  props: {
+    columns: { type: Number, default: 12 },
+    gap: { type: [Number, String], default: 16 },
+    /** Minimum column width via `grid-template-columns: repeat(auto-fill, minmax(...))`. */
+    minColWidth: { type: [Number, String], default: void 0 }
+  },
+  setup(props, { slots, attrs }) {
+    const gap = typeof props.gap === "number" ? `${props.gap}px` : props.gap;
+    return () => {
+      const gridTemplateColumns = props.minColWidth ? `repeat(auto-fill, minmax(${typeof props.minColWidth === "number" ? `${props.minColWidth}px` : props.minColWidth}, 1fr))` : `repeat(${props.columns}, 1fr)`;
+      return vue.h(
+        "div",
+        {
+          ...attrs,
+          "data-iris-dashboard-grid": "",
+          style: {
+            display: "grid",
+            gap,
+            gridTemplateColumns,
+            width: "100%",
+            ...attrs.style ?? {}
+          }
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
+var IrisDashboardCard = vue.defineComponent({
+  name: "IrisDashboardCard",
+  inheritAttrs: false,
+  props: {
+    colSpan: { type: [Number, String], default: 1 },
+    rowSpan: { type: Number, default: 1 },
+    /** Show a styled card surface (background + border). Default `true`. */
+    surface: { type: Boolean, default: true }
+  },
+  setup(props, { slots, attrs }) {
+    return () => {
+      const colSpan = props.colSpan === "full" ? "1 / -1" : `span ${props.colSpan}`;
+      const rowSpan = props.rowSpan > 1 ? `span ${props.rowSpan}` : void 0;
+      return vue.h(
+        "div",
+        {
+          ...attrs,
+          "data-iris-dashboard-card": "",
+          style: {
+            gridColumn: colSpan,
+            gridRow: rowSpan,
+            background: props.surface ? "var(--iris-surface)" : "transparent",
+            border: props.surface ? "1px solid var(--iris-border)" : "none",
+            borderRadius: "var(--iris-radius-md)",
+            padding: props.surface ? "var(--iris-padding-lg)" : "0",
+            minWidth: "0",
+            ...attrs.style ?? {}
+          }
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
+var ALIGN_MAP = {
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  stretch: "stretch"
+};
+var JUSTIFY_MAP = {
+  start: "flex-start",
+  center: "center",
+  end: "flex-end",
+  between: "space-between",
+  around: "space-around"
+};
+function toCssSpacing(spacing) {
+  if (typeof spacing === "number") return `${spacing}px`;
+  if (spacing === "sm" || spacing === "md" || spacing === "lg") {
+    return `var(--iris-gap-${spacing})`;
+  }
+  return spacing;
+}
+var IrisStack = vue.defineComponent({
+  name: "IrisStack",
+  inheritAttrs: false,
+  props: {
+    direction: { type: String, default: "column" },
+    spacing: { type: [String, Number], default: "md" },
+    align: { type: String, default: "stretch" },
+    justify: { type: String, default: "start" },
+    wrap: { type: Boolean, default: false },
+    /** When true, renders as an inline-flex container. */
+    inline: { type: Boolean, default: false }
+  },
+  setup(props, { slots, attrs }) {
+    const style = vue.computed(() => ({
+      display: props.inline ? "inline-flex" : "flex",
+      flexDirection: props.direction,
+      gap: toCssSpacing(props.spacing),
+      alignItems: ALIGN_MAP[props.align],
+      justifyContent: JUSTIFY_MAP[props.justify],
+      flexWrap: props.wrap ? "wrap" : "nowrap"
+    }));
+    return () => vue.h(
+      "div",
+      {
+        ...attrs,
+        "data-iris-stack": "",
+        "data-iris-stack-direction": props.direction,
+        style: { ...style.value, ...attrs.style ?? {} }
+      },
+      slots.default?.()
+    );
+  }
+});
+var WIDTH_MAP = {
+  sm: "640px",
+  md: "768px",
+  lg: "1024px",
+  xl: "1280px",
+  full: "100%"
+};
+function resolveMaxWidth(input) {
+  if (input === "sm" || input === "md" || input === "lg" || input === "xl" || input === "full") {
+    return WIDTH_MAP[input];
+  }
+  return input;
+}
+function resolvePadding(input) {
+  if (typeof input === "number") return `${input}px`;
+  if (input === "sm" || input === "md" || input === "lg") {
+    return `var(--iris-padding-${input})`;
+  }
+  return input;
+}
+var IrisContainer = vue.defineComponent({
+  name: "IrisContainer",
+  inheritAttrs: false,
+  props: {
+    maxWidth: { type: String, default: "lg" },
+    padding: { type: [String, Number], default: "md" },
+    center: { type: Boolean, default: true }
+  },
+  setup(props, { slots, attrs }) {
+    const style = vue.computed(() => ({
+      width: "100%",
+      maxWidth: resolveMaxWidth(props.maxWidth),
+      padding: `0 ${resolvePadding(props.padding)}`,
+      ...props.center ? { marginInlineStart: "auto", marginInlineEnd: "auto" } : {}
+    }));
+    return () => vue.h(
+      "div",
+      {
+        ...attrs,
+        "data-iris-container": "",
+        "data-iris-container-max-width": props.maxWidth,
+        style: { ...style.value, ...attrs.style ?? {} }
+      },
+      slots.default?.()
+    );
+  }
+});
+function resolveColumns(columns, minColWidth) {
+  if (typeof columns === "number") return `repeat(${columns}, minmax(0, 1fr))`;
+  if (columns === "auto-fit") return `repeat(auto-fit, minmax(${minColWidth}, 1fr))`;
+  if (columns === "auto-fill") return `repeat(auto-fill, minmax(${minColWidth}, 1fr))`;
+  return columns;
+}
+function toCssSpacing2(spacing) {
+  if (typeof spacing === "number") return `${spacing}px`;
+  if (spacing === "sm" || spacing === "md" || spacing === "lg") {
+    return `var(--iris-gap-${spacing})`;
+  }
+  return spacing;
+}
+var IrisGrid = vue.defineComponent({
+  name: "IrisGrid",
+  inheritAttrs: false,
+  props: {
+    columns: { type: [Number, String], default: "auto-fit" },
+    /** Min width per column for `auto-fit` / `auto-fill`. */
+    minColWidth: { type: String, default: "200px" },
+    /** Row gap (token / px / CSS). */
+    rowGap: { type: [String, Number], default: void 0 },
+    /** Column gap (token / px / CSS). */
+    columnGap: { type: [String, Number], default: void 0 },
+    /** Shorthand for both row + column gap. Overridden if rowGap/columnGap given. */
+    gap: { type: [String, Number], default: "md" },
+    inline: { type: Boolean, default: false }
+  },
+  setup(props, { slots, attrs }) {
+    const style = vue.computed(() => {
+      const colTemplate = resolveColumns(props.columns, props.minColWidth);
+      const rowGap = props.rowGap !== void 0 ? toCssSpacing2(props.rowGap) : toCssSpacing2(props.gap);
+      const colGap = props.columnGap !== void 0 ? toCssSpacing2(props.columnGap) : toCssSpacing2(props.gap);
+      return {
+        display: props.inline ? "inline-grid" : "grid",
+        gridTemplateColumns: colTemplate,
+        rowGap,
+        columnGap: colGap
+      };
+    });
+    return () => vue.h(
+      "div",
+      {
+        ...attrs,
+        "data-iris-grid": "",
+        "data-iris-grid-columns": String(props.columns),
+        style: { ...style.value, ...attrs.style ?? {} }
+      },
+      slots.default?.()
+    );
+  }
+});
+
+exports.IrisContainer = IrisContainer;
+exports.IrisDashboardCard = IrisDashboardCard;
+exports.IrisDashboardGrid = IrisDashboardGrid;
+exports.IrisGrid = IrisGrid;
+exports.IrisHeaderLayout = IrisHeaderLayout;
+exports.IrisSidebarLayout = IrisSidebarLayout;
+exports.IrisStack = IrisStack;
+//# sourceMappingURL=layouts.cjs.map
+//# sourceMappingURL=layouts.cjs.map

package/dist/layouts.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/layouts/SidebarLayout.ts","../src/layouts/HeaderLayout.ts","../src/layouts/DashboardGrid.ts","../src/layouts/Stack.ts","../src/layouts/Container.ts","../src/layouts/Grid.ts"],"names":["defineComponent","computed","ref","watch","h","toCssSpacing"],"mappings":";;;;;AAaO,IAAM,oBAAoBA,mBAAA,CAAgB;AAAA,EAC/C,IAAA,EAAM,mBAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA,IACL,SAAA,EAAW,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,MAAA,EAAU;AAAA,IAC/C,gBAAA,EAAkB,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,KAAA,EAAM;AAAA;AAAA,IAElD,KAAA,EAAO,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,GAAA,EAAI;AAAA;AAAA,IAE9C,cAAA,EAAgB,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,EAAA,EAAG;AAAA;AAAA,IAEtD,IAAA,EAAM,EAAE,IAAA,EAAM,MAAA,EAAkC,SAAS,MAAA;AAAO,GAClE;AAAA,EACA,KAAA,EAAO;AAAA,IACL,kBAAA,EAAoB,CAAC,MAAA,KAAoB;AAAA,GAC3C;AAAA,EACA,MAAM,KAAA,EAAO,EAAE,KAAA,EAAO,KAAA,EAAO,MAAK,EAAG;AACnC,IAAA,MAAM,YAAA,GAAeC,YAAA,CAAS,MAAM,KAAA,CAAM,cAAc,MAAS,CAAA;AACjE,IAAA,MAAM,iBAAA,GAAoBC,OAAA,CAAI,KAAA,CAAM,gBAAgB,CAAA;AACpD,IAAA,MAAM,SAAA,GAAYD,YAAA;AAAA,MAAS,MACzB,YAAA,CAAa,KAAA,GAAQ,QAAQ,KAAA,CAAM,SAAS,IAAI,iBAAA,CAAkB;AAAA,KACpE;AAIA,IAAAE,SAAA;AAAA,MACE,MAAM,KAAA,CAAM,SAAA;AAAA,MACZ,CAAC,KAAA,KAAU;AACT,QAAA,IAAI,KAAA,KAAU,MAAA,EAAW,iBAAA,CAAkB,KAAA,GAAQ,KAAA;AAAA,MACrD;AAAA,KACF;AAEA,IAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAAmB;AACvC,MAAA,IAAI,CAAC,YAAA,CAAa,KAAA,EAAO,iBAAA,CAAkB,KAAA,GAAQ,KAAA;AACnD,MAAA,IAAA,CAAK,oBAAoB,KAAK,CAAA;AAAA,IAChC,CAAA;AAEA,IAAA,MAAM,KAAA,GAAQ,CAAC,CAAA,KAAwB,OAAO,MAAM,QAAA,GAAW,CAAA,EAAG,CAAC,CAAA,EAAA,CAAA,GAAO,CAAA;AAE1E,IAAA,OAAO,MAAM;AACX,MAAA,MAAM,YAAA,GAAuC;AAAA,QAC3C,KAAA,EAAO,UAAU,KAAA,GAAQ,KAAA,CAAM,MAAM,cAAc,CAAA,GAAI,KAAA,CAAM,KAAA,CAAM,KAAK,CAAA;AAAA,QACxE,UAAA,EAAY,GAAA;AAAA,QACZ,UAAA,EAAY,qBAAA;AAAA,QACZ,WAAA,EAAa,KAAA,CAAM,IAAA,KAAS,MAAA,GAAS,8BAAA,GAAiC,MAAA;AAAA,QACtE,UAAA,EAAY,KAAA,CAAM,IAAA,KAAS,OAAA,GAAU,8BAAA,GAAiC,MAAA;AAAA,QACtE,UAAA,EAAY,kBAAA;AAAA,QACZ,QAAA,EAAU,QAAA;AAAA,QACV,OAAA,EAAS,MAAA;AAAA,QACT,aAAA,EAAe;AAAA,OACjB;AACA,MAAA,MAAM,SAAA,GAAoC;AAAA,QACxC,IAAA,EAAM,GAAA;AAAA,QACN,QAAA,EAAU,GAAA;AAAA,QACV,QAAA,EAAU,MAAA;AAAA,QACV,UAAA,EAAY;AAAA,OACd;AACA,MAAA,MAAM,SAAA,GAAY,KAAA,CAAM,IAAA,KAAS,OAAA,GAAU,aAAA,GAAgB,KAAA;AAE3D,MAAA,OAAOC,KAAA;AAAA,QACL,KAAA;AAAA,QACA;AAAA,UACE,GAAG,KAAA;AAAA,UACH,0BAAA,EAA4B,EAAA;AAAA,UAC5B,gBAAA,EAAkB,SAAA,CAAU,KAAA,GAAQ,EAAA,GAAK,MAAA;AAAA,UACzC,aAAa,KAAA,CAAM,IAAA;AAAA,UACnB,KAAA,EAAO;AAAA,YACL,OAAA,EAAS,MAAA;AAAA,YACT,aAAA,EAAe,SAAA;AAAA,YACf,KAAA,EAAO,MAAA;AAAA,YACP,MAAA,EAAQ,MAAA;AAAA,YACR,SAAA,EAAW,GAAA;AAAA,YACX,KAAA,EAAO,wBAAA;AAAA,YACP,GAAK,KAAA,CAAM,KAAA,IAAgD;AAAC;AAC9D,SACF;AAAA,QACA;AAAA,UACEA,KAAA;AAAA,YACE,OAAA;AAAA,YACA;AAAA,cACE,IAAA,EAAM,eAAA;AAAA,cACN,mBAAA,EAAqB,EAAA;AAAA,cACrB,gBAAA,EAAkB,SAAA,CAAU,KAAA,GAAQ,EAAA,GAAK,MAAA;AAAA,cACzC,KAAA,EAAO;AAAA,aACT;AAAA,YACA,MAAM,OAAA,GAAU,EAAE,WAAW,SAAA,CAAU,KAAA,EAAO,cAAc;AAAA,WAC9D;AAAA,UACAA,KAAA,CAAE,KAAA,EAAO,EAAE,wBAAA,EAA0B,EAAA,EAAI,OAAO,SAAA,EAAU,EAAG,KAAA,CAAM,OAAA,IAAW;AAAA;AAChF,OACF;AAAA,IACF,CAAA;AAAA,EACF;AACF,CAAC;AC/FM,IAAM,mBAAmBJ,mBAAAA,CAAgB;AAAA,EAC9C,IAAA,EAAM,kBAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA;AAAA,IAEL,YAAA,EAAc,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAgC,SAAS,MAAA,EAAO;AAAA;AAAA,IAErF,YAAA,EAAc,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAgC,SAAS,MAAA,EAAO;AAAA;AAAA,IAErF,MAAA,EAAQ,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA;AAAK,GACzC;AAAA,EACA,KAAA,CAAM,KAAA,EAAO,EAAE,KAAA,EAAO,OAAM,EAAG;AAC7B,IAAA,MAAM,KAAA,GAAQ,CAAC,CAAA,KAAwB,OAAO,MAAM,QAAA,GAAW,CAAA,EAAG,CAAC,CAAA,EAAA,CAAA,GAAO,CAAA;AAC1E,IAAA,OAAO,MACLI,KAAAA;AAAA,MACE,KAAA;AAAA,MACA;AAAA,QACE,GAAG,KAAA;AAAA,QACH,yBAAA,EAA2B,EAAA;AAAA,QAC3B,KAAA,EAAO;AAAA,UACL,OAAA,EAAS,MAAA;AAAA,UACT,aAAA,EAAe,QAAA;AAAA,UACf,KAAA,EAAO,MAAA;AAAA,UACP,MAAA,EAAQ,MAAA;AAAA,UACR,SAAA,EAAW,GAAA;AAAA,UACX,UAAA,EAAY,wBAAA;AAAA,UACZ,KAAA,EAAO,wBAAA;AAAA,UACP,GAAK,KAAA,CAAM,KAAA,IAAgD;AAAC;AAC9D,OACF;AAAA,MACA;AAAA,QACE,MAAM,MAAA,GACFA,KAAAA;AAAA,UACE,QAAA;AAAA,UACA;AAAA,YACE,IAAA,EAAM,QAAA;AAAA,YACN,kBAAA,EAAoB,EAAA;AAAA,YACpB,KAAA,EAAO;AAAA,cACL,UAAA,EAAY,GAAA;AAAA,cACZ,MAAA,EAAQ,KAAA,CAAM,KAAA,CAAM,YAAY,CAAA;AAAA,cAChC,YAAA,EAAc,8BAAA;AAAA,cACd,UAAA,EAAY,qBAAA;AAAA,cACZ,QAAA,EAAU,KAAA,CAAM,MAAA,GAAS,QAAA,GAAW,QAAA;AAAA,cACpC,GAAA,EAAK,GAAA;AAAA,cACL,MAAA,EAAQ;AAAA;AACV,WACF;AAAA,UACA,MAAM,MAAA;AAAO,SACf,GACA,IAAA;AAAA,QACJA,KAAAA;AAAA,UACE,MAAA;AAAA,UACA;AAAA,YACE,IAAA,EAAM,MAAA;AAAA,YACN,uBAAA,EAAyB,EAAA;AAAA,YACzB,OAAO,EAAE,IAAA,EAAM,KAAK,SAAA,EAAW,GAAA,EAAK,UAAU,MAAA;AAAO,WACvD;AAAA,UACA,MAAM,OAAA;AAAU,SAClB;AAAA,QACA,MAAM,MAAA,GACFA,KAAAA;AAAA,UACE,QAAA;AAAA,UACA;AAAA,YACE,IAAA,EAAM,aAAA;AAAA,YACN,kBAAA,EAAoB,EAAA;AAAA,YACpB,KAAA,EAAO;AAAA,cACL,UAAA,EAAY,GAAA;AAAA,cACZ,MAAA,EAAQ,KAAA,CAAM,KAAA,CAAM,YAAY,CAAA;AAAA,cAChC,SAAA,EAAW,8BAAA;AAAA,cACX,UAAA,EAAY;AAAA;AACd,WACF;AAAA,UACA,MAAM,MAAA;AAAO,SACf,GACA;AAAA;AACN,KACF;AAAA,EACJ;AACF,CAAC;AC9EM,IAAM,oBAAoBJ,mBAAAA,CAAgB;AAAA,EAC/C,IAAA,EAAM,mBAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA,IACL,OAAA,EAAS,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,EAAA,EAAG;AAAA,IACrC,GAAA,EAAK,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,EAAA,EAAG;AAAA;AAAA,IAE3C,WAAA,EAAa,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,MAAA;AAAU,GAC5D;AAAA,EACA,KAAA,CAAM,KAAA,EAAO,EAAE,KAAA,EAAO,OAAM,EAAG;AAC7B,IAAA,MAAM,GAAA,GAAM,OAAO,KAAA,CAAM,GAAA,KAAQ,WAAW,CAAA,EAAG,KAAA,CAAM,GAAG,CAAA,EAAA,CAAA,GAAO,KAAA,CAAM,GAAA;AACrE,IAAA,OAAO,MAAM;AACX,MAAA,MAAM,sBAAsB,KAAA,CAAM,WAAA,GAC9B,CAAA,yBAAA,EAA4B,OAAO,MAAM,WAAA,KAAgB,QAAA,GAAW,CAAA,EAAG,KAAA,CAAM,WAAW,CAAA,EAAA,CAAA,GAAO,KAAA,CAAM,WAAW,CAAA,OAAA,CAAA,GAChH,CAAA,OAAA,EAAU,MAAM,OAAO,CAAA,MAAA,CAAA;AAC3B,MAAA,OAAOI,KAAAA;AAAA,QACL,KAAA;AAAA,QACA;AAAA,UACE,GAAG,KAAA;AAAA,UACH,0BAAA,EAA4B,EAAA;AAAA,UAC5B,KAAA,EAAO;AAAA,YACL,OAAA,EAAS,MAAA;AAAA,YACT,GAAA;AAAA,YACA,mBAAA;AAAA,YACA,KAAA,EAAO,MAAA;AAAA,YACP,GAAK,KAAA,CAAM,KAAA,IAAgD;AAAC;AAC9D,SACF;AAAA,QACA,MAAM,OAAA;AAAU,OAClB;AAAA,IACF,CAAA;AAAA,EACF;AACF,CAAC;AAOM,IAAM,oBAAoBJ,mBAAAA,CAAgB;AAAA,EAC/C,IAAA,EAAM,mBAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA,IACL,OAAA,EAAS,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,CAAA,EAAE;AAAA,IAC9C,OAAA,EAAS,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,CAAA,EAAE;AAAA;AAAA,IAEpC,OAAA,EAAS,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA;AAAK,GAC1C;AAAA,EACA,KAAA,CAAM,KAAA,EAAO,EAAE,KAAA,EAAO,OAAM,EAAG;AAC7B,IAAA,OAAO,MAAM;AACX,MAAA,MAAM,UAAU,KAAA,CAAM,OAAA,KAAY,SAAS,QAAA,GAAW,CAAA,KAAA,EAAQ,MAAM,OAAO,CAAA,CAAA;AAC3E,MAAA,MAAM,UAAU,KAAA,CAAM,OAAA,GAAU,IAAI,CAAA,KAAA,EAAQ,KAAA,CAAM,OAAO,CAAA,CAAA,GAAK,MAAA;AAC9D,MAAA,OAAOI,KAAAA;AAAA,QACL,KAAA;AAAA,QACA;AAAA,UACE,GAAG,KAAA;AAAA,UACH,0BAAA,EAA4B,EAAA;AAAA,UAC5B,KAAA,EAAO;AAAA,YACL,UAAA,EAAY,OAAA;AAAA,YACZ,OAAA,EAAS,OAAA;AAAA,YACT,UAAA,EAAY,KAAA,CAAM,OAAA,GAAU,qBAAA,GAAwB,aAAA;AAAA,YACpD,MAAA,EAAQ,KAAA,CAAM,OAAA,GAAU,8BAAA,GAAiC,MAAA;AAAA,YACzD,YAAA,EAAc,uBAAA;AAAA,YACd,OAAA,EAAS,KAAA,CAAM,OAAA,GAAU,wBAAA,GAA2B,GAAA;AAAA,YACpD,QAAA,EAAU,GAAA;AAAA,YACV,GAAK,KAAA,CAAM,KAAA,IAAgD;AAAC;AAC9D,SACF;AAAA,QACA,MAAM,OAAA;AAAU,OAClB;AAAA,IACF,CAAA;AAAA,EACF;AACF,CAAC;AC5ED,IAAM,SAAA,GAA4C;AAAA,EAChD,KAAA,EAAO,YAAA;AAAA,EACP,MAAA,EAAQ,QAAA;AAAA,EACR,GAAA,EAAK,UAAA;AAAA,EACL,OAAA,EAAS;AACX,CAAA;AAEA,IAAM,WAAA,GAAgD;AAAA,EACpD,KAAA,EAAO,YAAA;AAAA,EACP,MAAA,EAAQ,QAAA;AAAA,EACR,GAAA,EAAK,UAAA;AAAA,EACL,OAAA,EAAS,eAAA;AAAA,EACT,MAAA,EAAQ;AACV,CAAA;AAEA,SAAS,aAAa,OAAA,EAAkC;AACtD,EAAA,IAAI,OAAO,OAAA,KAAY,QAAA,EAAU,OAAO,GAAG,OAAO,CAAA,EAAA,CAAA;AAElD,EAAA,IAAI,OAAA,KAAY,IAAA,IAAQ,OAAA,KAAY,IAAA,IAAQ,YAAY,IAAA,EAAM;AAC5D,IAAA,OAAO,kBAAkB,OAAO,CAAA,CAAA,CAAA;AAAA,EAClC;AACA,EAAA,OAAO,OAAA;AACT;AAUO,IAAM,YAAYJ,mBAAAA,CAAgB;AAAA,EACvC,IAAA,EAAM,WAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA,IACL,SAAA,EAAW,EAAE,IAAA,EAAM,MAAA,EAAwC,SAAS,QAAA,EAAS;AAAA,IAC7E,OAAA,EAAS,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,IAAA,EAAK;AAAA,IACjD,KAAA,EAAO,EAAE,IAAA,EAAM,MAAA,EAAoC,SAAS,SAAA,EAAU;AAAA,IACtE,OAAA,EAAS,EAAE,IAAA,EAAM,MAAA,EAAsC,SAAS,OAAA,EAAQ;AAAA,IACxE,IAAA,EAAM,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,KAAA,EAAM;AAAA;AAAA,IAEtC,MAAA,EAAQ,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,KAAA;AAAM,GAC1C;AAAA,EACA,KAAA,CAAM,KAAA,EAAO,EAAE,KAAA,EAAO,OAAM,EAAG;AAC7B,IAAA,MAAM,KAAA,GAAQC,aAAiC,OAAO;AAAA,MACpD,OAAA,EAAS,KAAA,CAAM,MAAA,GAAS,aAAA,GAAgB,MAAA;AAAA,MACxC,eAAe,KAAA,CAAM,SAAA;AAAA,MACrB,GAAA,EAAK,YAAA,CAAa,KAAA,CAAM,OAAO,CAAA;AAAA,MAC/B,UAAA,EAAY,SAAA,CAAU,KAAA,CAAM,KAAK,CAAA;AAAA,MACjC,cAAA,EAAgB,WAAA,CAAY,KAAA,CAAM,OAAO,CAAA;AAAA,MACzC,QAAA,EAAU,KAAA,CAAM,IAAA,GAAO,MAAA,GAAS;AAAA,KAClC,CAAE,CAAA;AAEF,IAAA,OAAO,MACLG,KAAAA;AAAA,MACE,KAAA;AAAA,MACA;AAAA,QACE,GAAG,KAAA;AAAA,QACH,iBAAA,EAAmB,EAAA;AAAA,QACnB,6BAA6B,KAAA,CAAM,SAAA;AAAA,QACnC,KAAA,EAAO,EAAE,GAAG,KAAA,CAAM,OAAO,GAAK,KAAA,CAAM,KAAA,IAAgD,EAAC;AAAG,OAC1F;AAAA,MACA,MAAM,OAAA;AAAU,KAClB;AAAA,EACJ;AACF,CAAC;ACpED,IAAM,SAAA,GAAgE;AAAA,EACpE,EAAA,EAAI,OAAA;AAAA,EACJ,EAAA,EAAI,OAAA;AAAA,EACJ,EAAA,EAAI,QAAA;AAAA,EACJ,EAAA,EAAI,QAAA;AAAA,EACJ,IAAA,EAAM;AACR,CAAA;AAEA,SAAS,gBAAgB,KAAA,EAAsC;AAC7D,EAAA,IAAI,KAAA,KAAU,QAAQ,KAAA,KAAU,IAAA,IAAQ,UAAU,IAAA,IAAQ,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,MAAA,EAAQ;AAC5F,IAAA,OAAO,UAAU,KAAK,CAAA;AAAA,EACxB;AACA,EAAA,OAAO,KAAA;AACT;AAEA,SAAS,eAAe,KAAA,EAAgC;AACtD,EAAA,IAAI,OAAO,KAAA,KAAU,QAAA,EAAU,OAAO,GAAG,KAAK,CAAA,EAAA,CAAA;AAC9C,EAAA,IAAI,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,IAAA,IAAQ,UAAU,IAAA,EAAM;AACtD,IAAA,OAAO,sBAAsB,KAAK,CAAA,CAAA,CAAA;AAAA,EACpC;AACA,EAAA,OAAO,KAAA;AACT;AASO,IAAM,gBAAgBJ,mBAAAA,CAAgB;AAAA,EAC3C,IAAA,EAAM,eAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA,IACL,QAAA,EAAU,EAAE,IAAA,EAAM,MAAA,EAA2C,SAAS,IAAA,EAAK;AAAA,IAC3E,OAAA,EAAS,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,IAAA,EAAK;AAAA,IACjD,MAAA,EAAQ,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,IAAA;AAAK,GACzC;AAAA,EACA,KAAA,CAAM,KAAA,EAAO,EAAE,KAAA,EAAO,OAAM,EAAG;AAC7B,IAAA,MAAM,KAAA,GAAQC,aAAiC,OAAO;AAAA,MACpD,KAAA,EAAO,MAAA;AAAA,MACP,QAAA,EAAU,eAAA,CAAgB,KAAA,CAAM,QAAQ,CAAA;AAAA,MACxC,OAAA,EAAS,CAAA,EAAA,EAAK,cAAA,CAAe,KAAA,CAAM,OAAO,CAAC,CAAA,CAAA;AAAA,MAC3C,GAAI,MAAM,MAAA,GAAS,EAAE,mBAAmB,MAAA,EAAQ,eAAA,EAAiB,MAAA,EAAO,GAAI;AAAC,KAC/E,CAAE,CAAA;AAEF,IAAA,OAAO,MACLG,KAAAA;AAAA,MACE,KAAA;AAAA,MACA;AAAA,QACE,GAAG,KAAA;AAAA,QACH,qBAAA,EAAuB,EAAA;AAAA,QACvB,iCAAiC,KAAA,CAAM,QAAA;AAAA,QACvC,KAAA,EAAO,EAAE,GAAG,KAAA,CAAM,OAAO,GAAK,KAAA,CAAM,KAAA,IAAgD,EAAC;AAAG,OAC1F;AAAA,MACA,MAAM,OAAA;AAAU,KAClB;AAAA,EACJ;AACF,CAAC;ACtDD,SAAS,cAAA,CAAe,SAA0B,WAAA,EAA6B;AAC7E,EAAA,IAAI,OAAO,OAAA,KAAY,QAAA,EAAU,OAAO,UAAU,OAAO,CAAA,iBAAA,CAAA;AACzD,EAAA,IAAI,OAAA,KAAY,UAAA,EAAY,OAAO,CAAA,wBAAA,EAA2B,WAAW,CAAA,OAAA,CAAA;AACzE,EAAA,IAAI,OAAA,KAAY,WAAA,EAAa,OAAO,CAAA,yBAAA,EAA4B,WAAW,CAAA,OAAA,CAAA;AAC3E,EAAA,OAAO,OAAA;AACT;AAEA,SAASC,cAAa,OAAA,EAAkC;AACtD,EAAA,IAAI,OAAO,OAAA,KAAY,QAAA,EAAU,OAAO,GAAG,OAAO,CAAA,EAAA,CAAA;AAClD,EAAA,IAAI,OAAA,KAAY,IAAA,IAAQ,OAAA,KAAY,IAAA,IAAQ,YAAY,IAAA,EAAM;AAC5D,IAAA,OAAO,kBAAkB,OAAO,CAAA,CAAA,CAAA;AAAA,EAClC;AACA,EAAA,OAAO,OAAA;AACT;AAaO,IAAM,WAAWL,mBAAAA,CAAgB;AAAA,EACtC,IAAA,EAAM,UAAA;AAAA,EACN,YAAA,EAAc,KAAA;AAAA,EACd,KAAA,EAAO;AAAA,IACL,OAAA,EAAS,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAgC,SAAS,UAAA,EAAW;AAAA;AAAA,IAEpF,WAAA,EAAa,EAAE,IAAA,EAAM,MAAA,EAAQ,SAAS,OAAA,EAAQ;AAAA;AAAA,IAE9C,MAAA,EAAQ,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,MAAA,EAAU;AAAA;AAAA,IAErD,SAAA,EAAW,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,MAAA,EAAU;AAAA;AAAA,IAExD,GAAA,EAAK,EAAE,IAAA,EAAM,CAAC,QAAQ,MAAM,CAAA,EAAG,SAAS,IAAA,EAAK;AAAA,IAC7C,MAAA,EAAQ,EAAE,IAAA,EAAM,OAAA,EAAS,SAAS,KAAA;AAAM,GAC1C;AAAA,EACA,KAAA,CAAM,KAAA,EAAO,EAAE,KAAA,EAAO,OAAM,EAAG;AAC7B,IAAA,MAAM,KAAA,GAAQC,aAAiC,MAAM;AACnD,MAAA,MAAM,WAAA,GAAc,cAAA,CAAe,KAAA,CAAM,OAAA,EAAS,MAAM,WAAW,CAAA;AACnE,MAAA,MAAM,MAAA,GACJ,KAAA,CAAM,MAAA,KAAW,MAAA,GAAYI,aAAAA,CAAa,MAAM,MAAM,CAAA,GAAIA,aAAAA,CAAa,KAAA,CAAM,GAAG,CAAA;AAClF,MAAA,MAAM,MAAA,GACJ,KAAA,CAAM,SAAA,KAAc,MAAA,GAAYA,aAAAA,CAAa,MAAM,SAAS,CAAA,GAAIA,aAAAA,CAAa,KAAA,CAAM,GAAG,CAAA;AACxF,MAAA,OAAO;AAAA,QACL,OAAA,EAAS,KAAA,CAAM,MAAA,GAAS,aAAA,GAAgB,MAAA;AAAA,QACxC,mBAAA,EAAqB,WAAA;AAAA,QACrB,MAAA;AAAA,QACA,SAAA,EAAW;AAAA,OACb;AAAA,IACF,CAAC,CAAA;AAED,IAAA,OAAO,MACLD,KAAAA;AAAA,MACE,KAAA;AAAA,MACA;AAAA,QACE,GAAG,KAAA;AAAA,QACH,gBAAA,EAAkB,EAAA;AAAA,QAClB,wBAAA,EAA0B,MAAA,CAAO,KAAA,CAAM,OAAO,CAAA;AAAA,QAC9C,KAAA,EAAO,EAAE,GAAG,KAAA,CAAM,OAAO,GAAK,KAAA,CAAM,KAAA,IAAgD,EAAC;AAAG,OAC1F;AAAA,MACA,MAAM,OAAA;AAAU,KAClB;AAAA,EACJ;AACF,CAAC","file":"layouts.cjs","sourcesContent":["import { computed, defineComponent, h, ref, watch } from 'vue'\n\n/**\n * Two-column layout with a collapsible sidebar.\n *\n * Slots:\n *   - `sidebar` — content rendered in the sidebar (kept mounted across collapses).\n *   - `default` — the main content area.\n *\n * Use `:collapsed` for controlled mode or `:default-collapsed` for the\n * uncontrolled initial state. When collapsed, the sidebar shrinks to\n * `:collapsed-width` so icon-only navigation still fits.\n */\nexport const IrisSidebarLayout = defineComponent({\n  name: 'IrisSidebarLayout',\n  inheritAttrs: false,\n  props: {\n    collapsed: { type: Boolean, default: undefined },\n    defaultCollapsed: { type: Boolean, default: false },\n    /** Sidebar width when expanded (px or CSS length). */\n    width: { type: [Number, String], default: 240 },\n    /** Sidebar width when collapsed. */\n    collapsedWidth: { type: [Number, String], default: 60 },\n    /** Sidebar position. */\n    side: { type: String as () => 'left' | 'right', default: 'left' },\n  },\n  emits: {\n    'update:collapsed': (_value: boolean) => true,\n  },\n  setup(props, { slots, attrs, emit }) {\n    const isControlled = computed(() => props.collapsed !== undefined)\n    const internalCollapsed = ref(props.defaultCollapsed)\n    const collapsed = computed(() =>\n      isControlled.value ? Boolean(props.collapsed) : internalCollapsed.value,\n    )\n\n    // Sync controlled prop changes into internal state on first run so a later\n    // detach to uncontrolled mode preserves the last-known value.\n    watch(\n      () => props.collapsed,\n      (value) => {\n        if (value !== undefined) internalCollapsed.value = value\n      },\n    )\n\n    const setCollapsed = (value: boolean) => {\n      if (!isControlled.value) internalCollapsed.value = value\n      emit('update:collapsed', value)\n    }\n\n    const asLen = (v: number | string) => (typeof v === 'number' ? `${v}px` : v)\n\n    return () => {\n      const sidebarStyle: Record<string, string> = {\n        width: collapsed.value ? asLen(props.collapsedWidth) : asLen(props.width),\n        flexShrink: '0',\n        background: 'var(--iris-surface)',\n        borderRight: props.side === 'left' ? '1px solid var(--iris-border)' : 'none',\n        borderLeft: props.side === 'right' ? '1px solid var(--iris-border)' : 'none',\n        transition: 'width 180ms ease',\n        overflow: 'hidden',\n        display: 'flex',\n        flexDirection: 'column',\n      }\n      const mainStyle: Record<string, string> = {\n        flex: '1',\n        minWidth: '0',\n        overflow: 'auto',\n        background: 'var(--iris-background)',\n      }\n      const direction = props.side === 'right' ? 'row-reverse' : 'row'\n\n      return h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-sidebar-layout': '',\n          'data-collapsed': collapsed.value ? '' : undefined,\n          'data-side': props.side,\n          style: {\n            display: 'flex',\n            flexDirection: direction,\n            width: '100%',\n            height: '100%',\n            minHeight: '0',\n            color: 'var(--iris-foreground)',\n            ...((attrs.style as Record<string, string> | undefined) ?? {}),\n          },\n        },\n        [\n          h(\n            'aside',\n            {\n              role: 'complementary',\n              'data-iris-sidebar': '',\n              'data-collapsed': collapsed.value ? '' : undefined,\n              style: sidebarStyle,\n            },\n            slots.sidebar?.({ collapsed: collapsed.value, setCollapsed }),\n          ),\n          h('div', { 'data-iris-sidebar-main': '', style: mainStyle }, slots.default?.()),\n        ],\n      )\n    }\n  },\n})\n","import { defineComponent, h, type PropType } from 'vue'\n\n/**\n * Two-region vertical layout: a sticky header on top, scrollable main below.\n *\n * Slots:\n *   - `header` — fixed at top.\n *   - `footer` — optional fixed at bottom.\n *   - `default` — scrollable main region.\n */\nexport const IrisHeaderLayout = defineComponent({\n  name: 'IrisHeaderLayout',\n  inheritAttrs: false,\n  props: {\n    /** Header height (px or CSS length). Default `'auto'`. */\n    headerHeight: { type: [Number, String] as PropType<number | string>, default: 'auto' },\n    /** Footer height (px or CSS length). Default `'auto'`. */\n    footerHeight: { type: [Number, String] as PropType<number | string>, default: 'auto' },\n    /** When true, header sticks via `position: sticky` instead of static. */\n    sticky: { type: Boolean, default: true },\n  },\n  setup(props, { slots, attrs }) {\n    const asLen = (v: number | string) => (typeof v === 'number' ? `${v}px` : v)\n    return () =>\n      h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-header-layout': '',\n          style: {\n            display: 'flex',\n            flexDirection: 'column',\n            width: '100%',\n            height: '100%',\n            minHeight: '0',\n            background: 'var(--iris-background)',\n            color: 'var(--iris-foreground)',\n            ...((attrs.style as Record<string, string> | undefined) ?? {}),\n          },\n        },\n        [\n          slots.header\n            ? h(\n                'header',\n                {\n                  role: 'banner',\n                  'data-iris-header': '',\n                  style: {\n                    flexShrink: '0',\n                    height: asLen(props.headerHeight),\n                    borderBottom: '1px solid var(--iris-border)',\n                    background: 'var(--iris-surface)',\n                    position: props.sticky ? 'sticky' : 'static',\n                    top: '0',\n                    zIndex: '50',\n                  },\n                },\n                slots.header(),\n              )\n            : null,\n          h(\n            'main',\n            {\n              role: 'main',\n              'data-iris-header-main': '',\n              style: { flex: '1', minHeight: '0', overflow: 'auto' },\n            },\n            slots.default?.(),\n          ),\n          slots.footer\n            ? h(\n                'footer',\n                {\n                  role: 'contentinfo',\n                  'data-iris-footer': '',\n                  style: {\n                    flexShrink: '0',\n                    height: asLen(props.footerHeight),\n                    borderTop: '1px solid var(--iris-border)',\n                    background: 'var(--iris-surface)',\n                  },\n                },\n                slots.footer(),\n              )\n            : null,\n        ],\n      )\n  },\n})\n","import { defineComponent, h } from 'vue'\n\n/**\n * 12-column responsive grid for dashboard composition. Each child should be\n * an `IrisDashboardCard` (or any element with `grid-column: span N`).\n *\n * Children control their span via inline `style=\"grid-column: span N\"` or\n * by wrapping with `IrisDashboardCard` whose `col-span` / `row-span` props\n * compile to the same CSS.\n */\nexport const IrisDashboardGrid = defineComponent({\n  name: 'IrisDashboardGrid',\n  inheritAttrs: false,\n  props: {\n    columns: { type: Number, default: 12 },\n    gap: { type: [Number, String], default: 16 },\n    /** Minimum column width via `grid-template-columns: repeat(auto-fill, minmax(...))`. */\n    minColWidth: { type: [Number, String], default: undefined },\n  },\n  setup(props, { slots, attrs }) {\n    const gap = typeof props.gap === 'number' ? `${props.gap}px` : props.gap\n    return () => {\n      const gridTemplateColumns = props.minColWidth\n        ? `repeat(auto-fill, minmax(${typeof props.minColWidth === 'number' ? `${props.minColWidth}px` : props.minColWidth}, 1fr))`\n        : `repeat(${props.columns}, 1fr)`\n      return h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-dashboard-grid': '',\n          style: {\n            display: 'grid',\n            gap,\n            gridTemplateColumns,\n            width: '100%',\n            ...((attrs.style as Record<string, string> | undefined) ?? {}),\n          },\n        },\n        slots.default?.(),\n      )\n    }\n  },\n})\n\n/**\n * A single grid cell — wraps content in a styled card with optional span\n * controls. `col-span` accepts a number (column count) or `'full'` to fill\n * the entire row.\n */\nexport const IrisDashboardCard = defineComponent({\n  name: 'IrisDashboardCard',\n  inheritAttrs: false,\n  props: {\n    colSpan: { type: [Number, String], default: 1 },\n    rowSpan: { type: Number, default: 1 },\n    /** Show a styled card surface (background + border). Default `true`. */\n    surface: { type: Boolean, default: true },\n  },\n  setup(props, { slots, attrs }) {\n    return () => {\n      const colSpan = props.colSpan === 'full' ? '1 / -1' : `span ${props.colSpan}`\n      const rowSpan = props.rowSpan > 1 ? `span ${props.rowSpan}` : undefined\n      return h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-dashboard-card': '',\n          style: {\n            gridColumn: colSpan,\n            gridRow: rowSpan,\n            background: props.surface ? 'var(--iris-surface)' : 'transparent',\n            border: props.surface ? '1px solid var(--iris-border)' : 'none',\n            borderRadius: 'var(--iris-radius-md)',\n            padding: props.surface ? 'var(--iris-padding-lg)' : '0',\n            minWidth: '0',\n            ...((attrs.style as Record<string, string> | undefined) ?? {}),\n          },\n        },\n        slots.default?.(),\n      )\n    }\n  },\n})\n","import { computed, defineComponent, h, type PropType } from 'vue'\n\nexport type IrisStackDirection = 'row' | 'column'\nexport type IrisStackAlign = 'start' | 'center' | 'end' | 'stretch'\nexport type IrisStackJustify = 'start' | 'center' | 'end' | 'between' | 'around'\n\nconst ALIGN_MAP: Record<IrisStackAlign, string> = {\n  start: 'flex-start',\n  center: 'center',\n  end: 'flex-end',\n  stretch: 'stretch',\n}\n\nconst JUSTIFY_MAP: Record<IrisStackJustify, string> = {\n  start: 'flex-start',\n  center: 'center',\n  end: 'flex-end',\n  between: 'space-between',\n  around: 'space-around',\n}\n\nfunction toCssSpacing(spacing: string | number): string {\n  if (typeof spacing === 'number') return `${spacing}px`\n  // Token shorthand: \"sm\" / \"md\" / \"lg\" → var(--iris-gap-X)\n  if (spacing === 'sm' || spacing === 'md' || spacing === 'lg') {\n    return `var(--iris-gap-${spacing})`\n  }\n  return spacing\n}\n\n/**\n * Flex container with token-driven spacing. The lightest possible layout\n * primitive — most pages need a horizontal or vertical stack and this saves\n * hand-writing `display: flex` everywhere.\n *\n * Use `direction`/`spacing`/`align`/`justify`/`wrap` to configure; children\n * are arranged in document order with `gap: <spacing>`.\n */\nexport const IrisStack = defineComponent({\n  name: 'IrisStack',\n  inheritAttrs: false,\n  props: {\n    direction: { type: String as PropType<IrisStackDirection>, default: 'column' },\n    spacing: { type: [String, Number], default: 'md' },\n    align: { type: String as PropType<IrisStackAlign>, default: 'stretch' },\n    justify: { type: String as PropType<IrisStackJustify>, default: 'start' },\n    wrap: { type: Boolean, default: false },\n    /** When true, renders as an inline-flex container. */\n    inline: { type: Boolean, default: false },\n  },\n  setup(props, { slots, attrs }) {\n    const style = computed<Record<string, string>>(() => ({\n      display: props.inline ? 'inline-flex' : 'flex',\n      flexDirection: props.direction,\n      gap: toCssSpacing(props.spacing),\n      alignItems: ALIGN_MAP[props.align],\n      justifyContent: JUSTIFY_MAP[props.justify],\n      flexWrap: props.wrap ? 'wrap' : 'nowrap',\n    }))\n\n    return () =>\n      h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-stack': '',\n          'data-iris-stack-direction': props.direction,\n          style: { ...style.value, ...((attrs.style as Record<string, string> | undefined) ?? {}) },\n        },\n        slots.default?.(),\n      )\n  },\n})\n","import { computed, defineComponent, h, type PropType } from 'vue'\n\nexport type IrisContainerMaxWidth = 'sm' | 'md' | 'lg' | 'xl' | 'full' | string\n\nconst WIDTH_MAP: Record<'sm' | 'md' | 'lg' | 'xl' | 'full', string> = {\n  sm: '640px',\n  md: '768px',\n  lg: '1024px',\n  xl: '1280px',\n  full: '100%',\n}\n\nfunction resolveMaxWidth(input: IrisContainerMaxWidth): string {\n  if (input === 'sm' || input === 'md' || input === 'lg' || input === 'xl' || input === 'full') {\n    return WIDTH_MAP[input]\n  }\n  return input // arbitrary CSS length\n}\n\nfunction resolvePadding(input: string | number): string {\n  if (typeof input === 'number') return `${input}px`\n  if (input === 'sm' || input === 'md' || input === 'lg') {\n    return `var(--iris-padding-${input})`\n  }\n  return input\n}\n\n/**\n * Centered max-width wrapper. Use to bound content width on large screens\n * without rewriting flex/grid plumbing.\n *\n * `maxWidth='lg'` (≈1024px) is the most common default for marketing /\n * docs / app pages.\n */\nexport const IrisContainer = defineComponent({\n  name: 'IrisContainer',\n  inheritAttrs: false,\n  props: {\n    maxWidth: { type: String as PropType<IrisContainerMaxWidth>, default: 'lg' },\n    padding: { type: [String, Number], default: 'md' },\n    center: { type: Boolean, default: true },\n  },\n  setup(props, { slots, attrs }) {\n    const style = computed<Record<string, string>>(() => ({\n      width: '100%',\n      maxWidth: resolveMaxWidth(props.maxWidth),\n      padding: `0 ${resolvePadding(props.padding)}`,\n      ...(props.center ? { marginInlineStart: 'auto', marginInlineEnd: 'auto' } : {}),\n    }))\n\n    return () =>\n      h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-container': '',\n          'data-iris-container-max-width': props.maxWidth,\n          style: { ...style.value, ...((attrs.style as Record<string, string> | undefined) ?? {}) },\n        },\n        slots.default?.(),\n      )\n  },\n})\n","import { computed, defineComponent, h, type PropType } from 'vue'\n\nexport type IrisGridColumns =\n  | number\n  | 'auto-fit'\n  | 'auto-fill'\n  | string /* raw grid-template-columns value */\n\nfunction resolveColumns(columns: IrisGridColumns, minColWidth: string): string {\n  if (typeof columns === 'number') return `repeat(${columns}, minmax(0, 1fr))`\n  if (columns === 'auto-fit') return `repeat(auto-fit, minmax(${minColWidth}, 1fr))`\n  if (columns === 'auto-fill') return `repeat(auto-fill, minmax(${minColWidth}, 1fr))`\n  return columns\n}\n\nfunction toCssSpacing(spacing: string | number): string {\n  if (typeof spacing === 'number') return `${spacing}px`\n  if (spacing === 'sm' || spacing === 'md' || spacing === 'lg') {\n    return `var(--iris-gap-${spacing})`\n  }\n  return spacing\n}\n\n/**\n * Two-dimensional grid layout primitive. Three column modes:\n *\n *   - **Fixed integer** — `columns={3}` → three equal-width columns.\n *   - **Responsive auto-fit** — `columns=\"auto-fit\"` + `minColWidth` → fluid\n *     grid where columns add/remove with container width. Most common.\n *   - **Raw CSS** — pass any `grid-template-columns` string.\n *\n * Spacing accepts token shorthand (`sm` / `md` / `lg`), numeric px, or any\n * CSS length string. `gap` is a shortcut for both row + column gap.\n */\nexport const IrisGrid = defineComponent({\n  name: 'IrisGrid',\n  inheritAttrs: false,\n  props: {\n    columns: { type: [Number, String] as PropType<IrisGridColumns>, default: 'auto-fit' },\n    /** Min width per column for `auto-fit` / `auto-fill`. */\n    minColWidth: { type: String, default: '200px' },\n    /** Row gap (token / px / CSS). */\n    rowGap: { type: [String, Number], default: undefined },\n    /** Column gap (token / px / CSS). */\n    columnGap: { type: [String, Number], default: undefined },\n    /** Shorthand for both row + column gap. Overridden if rowGap/columnGap given. */\n    gap: { type: [String, Number], default: 'md' },\n    inline: { type: Boolean, default: false },\n  },\n  setup(props, { slots, attrs }) {\n    const style = computed<Record<string, string>>(() => {\n      const colTemplate = resolveColumns(props.columns, props.minColWidth)\n      const rowGap =\n        props.rowGap !== undefined ? toCssSpacing(props.rowGap) : toCssSpacing(props.gap)\n      const colGap =\n        props.columnGap !== undefined ? toCssSpacing(props.columnGap) : toCssSpacing(props.gap)\n      return {\n        display: props.inline ? 'inline-grid' : 'grid',\n        gridTemplateColumns: colTemplate,\n        rowGap,\n        columnGap: colGap,\n      }\n    })\n\n    return () =>\n      h(\n        'div',\n        {\n          ...attrs,\n          'data-iris-grid': '',\n          'data-iris-grid-columns': String(props.columns),\n          style: { ...style.value, ...((attrs.style as Record<string, string> | undefined) ?? {}) },\n        },\n        slots.default?.(),\n      )\n  },\n})\n"]}