@portnet/ui 5.0.32 → 6.0.1

package/dist/v2/tokens/density.d.ts

@@ -0,0 +1,142 @@
+/**
+ * Density & layout tokens — Portnet UI v2
+ * Aligned with Design System v1.0 §02.7 + §07.
+ *
+ * R-DG.11 — Density togglable, preference persisted.
+ * R-7.4   — Tactile targets ≥ 44 × 44 px (WCAG 2.5.5).
+ *
+ * IMPORTANT: in any density tier, the visual button height
+ * (`density.<tier>.btn`) may be below `layout.tactileMin` (44).
+ * Components MUST extend the hit area to 44 via padding or a
+ * pseudo-element (the FieldHelp / Button pattern), so R-7.4 is
+ * satisfied without altering the visual size.
+ * Icon-only buttons MUST set min-width/min-height to `tactileMin`.
+ *
+ * Tier picker (host opt-in via the `data-density` attribute):
+ *   - default                    → comfortable
+ *   - data-density="spacious"    → spacious      (kiosk / TV / a11y-large)
+ *   - data-density="compact"     → compact       (dense workflows)
+ *   - data-density="ultra-compact" → ultraCompact (audit ledgers, dense lists)
+ *
+ *   The kebab-case attribute is the public contract; the camelCase
+ *   key on this object is the JS-side identifier. Don't rename
+ *   either without coordinating cssVariables.js.
+ *
+ * NOTE (Batch 1 — responsive certification): the breakpoint scale used
+ * to be declared here. It now lives in the dedicated ./breakpoints
+ * module (single source shared by the MUI theme, the mq() helpers and
+ * the --bp-* CSS variables) and is re-exported below so that every
+ * `import { breakpoints } from "@portnet/ui/v2/tokens"` and the
+ * densityLayout default shape are unchanged.
+ */
+import breakpoints from "./breakpoints";
+export declare const density: {
+    spacious: {
+        row: number;
+        input: number;
+        btn: number;
+        fontSize: number;
+    };
+    comfortable: {
+        row: number;
+        input: number;
+        btn: number;
+        fontSize: number;
+    };
+    compact: {
+        row: number;
+        input: number;
+        btn: number;
+        fontSize: number;
+    };
+    ultraCompact: {
+        row: number;
+        input: number;
+        btn: number;
+        fontSize: number;
+    };
+};
+export declare const layout: {
+    sidebar: number;
+    sidebarMin: number;
+    topbar: number;
+    contentMax: number;
+    formMax: number;
+    tactileMin: number;
+    /**
+     * Modal max-widths (§03 Modal). MUI-bounded dialogs aligned with
+     * the charter spacing system.
+     */
+    modal: {
+        sm: number;
+        md: number;
+        lg: number;
+        xl: number;
+    };
+    /**
+     * Drawer default width (§03 Drawer). Hosts may override per usage,
+     * but should pull from this scale rather than invent new values.
+     */
+    drawer: number;
+};
+export { breakpoints };
+declare const densityLayout: {
+    density: {
+        spacious: {
+            row: number;
+            input: number;
+            btn: number;
+            fontSize: number;
+        };
+        comfortable: {
+            row: number;
+            input: number;
+            btn: number;
+            fontSize: number;
+        };
+        compact: {
+            row: number;
+            input: number;
+            btn: number;
+            fontSize: number;
+        };
+        ultraCompact: {
+            row: number;
+            input: number;
+            btn: number;
+            fontSize: number;
+        };
+    };
+    layout: {
+        sidebar: number;
+        sidebarMin: number;
+        topbar: number;
+        contentMax: number;
+        formMax: number;
+        tactileMin: number;
+        /**
+         * Modal max-widths (§03 Modal). MUI-bounded dialogs aligned with
+         * the charter spacing system.
+         */
+        modal: {
+            sm: number;
+            md: number;
+            lg: number;
+            xl: number;
+        };
+        /**
+         * Drawer default width (§03 Drawer). Hosts may override per usage,
+         * but should pull from this scale rather than invent new values.
+         */
+        drawer: number;
+    };
+    breakpoints: Readonly<{
+        xs: 0;
+        sm: 481;
+        md: 768;
+        lg: 1024;
+        xl: 1280;
+    }>;
+};
+export default densityLayout;
+//# sourceMappingURL=density.d.ts.map

package/dist/v2/tokens/density.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"density.d.ts","sourceRoot":"","sources":["../../../src/lib/v2/tokens/density.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAEH,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;CAKnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;IAQjB;;;OAGG;;;;;;;IAQH;;;OAGG;;CAEJ,CAAC;AAIF,OAAO,EAAE,WAAW,EAAE,CAAC;AAEvB,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAtBjB;;;WAGG;;;;;;;QAQH;;;WAGG;;;;;;;;;;CAQiD,CAAC;AACvD,eAAe,aAAa,CAAC"}

package/dist/v2/tokens/density.js

@@ -0,0 +1,111 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "breakpoints", {
+  enumerable: true,
+  get: function get() {
+    return _breakpoints["default"];
+  }
+});
+exports.layout = exports.density = exports["default"] = void 0;
+var _breakpoints = _interopRequireDefault(require("./breakpoints"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+/**
+ * Density & layout tokens — Portnet UI v2
+ * Aligned with Design System v1.0 §02.7 + §07.
+ *
+ * R-DG.11 — Density togglable, preference persisted.
+ * R-7.4   — Tactile targets ≥ 44 × 44 px (WCAG 2.5.5).
+ *
+ * IMPORTANT: in any density tier, the visual button height
+ * (`density.<tier>.btn`) may be below `layout.tactileMin` (44).
+ * Components MUST extend the hit area to 44 via padding or a
+ * pseudo-element (the FieldHelp / Button pattern), so R-7.4 is
+ * satisfied without altering the visual size.
+ * Icon-only buttons MUST set min-width/min-height to `tactileMin`.
+ *
+ * Tier picker (host opt-in via the `data-density` attribute):
+ *   - default                    → comfortable
+ *   - data-density="spacious"    → spacious      (kiosk / TV / a11y-large)
+ *   - data-density="compact"     → compact       (dense workflows)
+ *   - data-density="ultra-compact" → ultraCompact (audit ledgers, dense lists)
+ *
+ *   The kebab-case attribute is the public contract; the camelCase
+ *   key on this object is the JS-side identifier. Don't rename
+ *   either without coordinating cssVariables.js.
+ *
+ * NOTE (Batch 1 — responsive certification): the breakpoint scale used
+ * to be declared here. It now lives in the dedicated ./breakpoints
+ * module (single source shared by the MUI theme, the mq() helpers and
+ * the --bp-* CSS variables) and is re-exported below so that every
+ * `import { breakpoints } from "@portnet/ui/v2/tokens"` and the
+ * densityLayout default shape are unchanged.
+ */
+
+var density = exports.density = {
+  spacious: {
+    row: 56,
+    input: 44,
+    btn: 44,
+    fontSize: 15
+  },
+  comfortable: {
+    row: 44,
+    input: 40,
+    btn: 40,
+    fontSize: 14
+  },
+  compact: {
+    row: 36,
+    input: 32,
+    btn: 32,
+    fontSize: 13
+  },
+  ultraCompact: {
+    row: 28,
+    input: 28,
+    btn: 28,
+    fontSize: 12
+  }
+};
+var layout = exports.layout = {
+  sidebar: 248,
+  sidebarMin: 64,
+  // collapsed icons-only
+  topbar: 56,
+  contentMax: 1440,
+  // wide table layouts
+  formMax: 720,
+  // mono-column form
+  tactileMin: 44,
+  // WCAG 2.5.5 — hard floor for any tactile target
+
+  /**
+   * Modal max-widths (§03 Modal). MUI-bounded dialogs aligned with
+   * the charter spacing system.
+   */
+  modal: {
+    sm: 440,
+    md: 640,
+    lg: 840,
+    xl: 1000
+  },
+  /**
+   * Drawer default width (§03 Drawer). Hosts may override per usage,
+   * but should pull from this scale rather than invent new values.
+   */
+  drawer: 560
+};
+
+/* Re-export the canonical breakpoint scale (now owned by ./breakpoints)
+ * so existing consumers and the densityLayout default keep working. */
+
+var densityLayout = {
+  density: density,
+  layout: layout,
+  breakpoints: _breakpoints["default"]
+};
+var _default = exports["default"] = densityLayout;
+//# sourceMappingURL=density.js.map

package/dist/v2/tokens/density.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"density.js","names":["_breakpoints","_interopRequireDefault","require","obj","__esModule","density","exports","spacious","row","input","btn","fontSize","comfortable","compact","ultraCompact","layout","sidebar","sidebarMin","topbar","contentMax","formMax","tactileMin","modal","sm","md","lg","xl","drawer","densityLayout","breakpoints","_default"],"sources":["../../../src/lib/v2/tokens/density.ts"],"sourcesContent":["/**\r\n * Density & layout tokens — Portnet UI v2\r\n * Aligned with Design System v1.0 §02.7 + §07.\r\n *\r\n * R-DG.11 — Density togglable, preference persisted.\r\n * R-7.4   — Tactile targets ≥ 44 × 44 px (WCAG 2.5.5).\r\n *\r\n * IMPORTANT: in any density tier, the visual button height\r\n * (`density.<tier>.btn`) may be below `layout.tactileMin` (44).\r\n * Components MUST extend the hit area to 44 via padding or a\r\n * pseudo-element (the FieldHelp / Button pattern), so R-7.4 is\r\n * satisfied without altering the visual size.\r\n * Icon-only buttons MUST set min-width/min-height to `tactileMin`.\r\n *\r\n * Tier picker (host opt-in via the `data-density` attribute):\r\n *   - default                    → comfortable\r\n *   - data-density=\"spacious\"    → spacious      (kiosk / TV / a11y-large)\r\n *   - data-density=\"compact\"     → compact       (dense workflows)\r\n *   - data-density=\"ultra-compact\" → ultraCompact (audit ledgers, dense lists)\r\n *\r\n *   The kebab-case attribute is the public contract; the camelCase\r\n *   key on this object is the JS-side identifier. Don't rename\r\n *   either without coordinating cssVariables.js.\r\n *\r\n * NOTE (Batch 1 — responsive certification): the breakpoint scale used\r\n * to be declared here. It now lives in the dedicated ./breakpoints\r\n * module (single source shared by the MUI theme, the mq() helpers and\r\n * the --bp-* CSS variables) and is re-exported below so that every\r\n * `import { breakpoints } from \"@portnet/ui/v2/tokens\"` and the\r\n * densityLayout default shape are unchanged.\r\n */\r\n\r\nimport breakpoints from \"./breakpoints\";\r\n\r\nexport const density = {\r\n  spacious:     { row: 56, input: 44, btn: 44, fontSize: 15 },\r\n  comfortable:  { row: 44, input: 40, btn: 40, fontSize: 14 },\r\n  compact:      { row: 36, input: 32, btn: 32, fontSize: 13 },\r\n  ultraCompact: { row: 28, input: 28, btn: 28, fontSize: 12 },\r\n};\r\n\r\nexport const layout = {\r\n  sidebar:    248,\r\n  sidebarMin:  64,    // collapsed icons-only\r\n  topbar:      56,\r\n  contentMax: 1440,   // wide table layouts\r\n  formMax:     720,   // mono-column form\r\n  tactileMin:  44,    // WCAG 2.5.5 — hard floor for any tactile target\r\n\r\n  /**\r\n   * Modal max-widths (§03 Modal). MUI-bounded dialogs aligned with\r\n   * the charter spacing system.\r\n   */\r\n  modal: {\r\n    sm:  440,\r\n    md:  640,\r\n    lg:  840,\r\n    xl: 1000,\r\n  },\r\n\r\n  /**\r\n   * Drawer default width (§03 Drawer). Hosts may override per usage,\r\n   * but should pull from this scale rather than invent new values.\r\n   */\r\n  drawer: 560,\r\n};\r\n\r\n/* Re-export the canonical breakpoint scale (now owned by ./breakpoints)\r\n * so existing consumers and the densityLayout default keep working. */\r\nexport { breakpoints };\r\n\r\nconst densityLayout = { density, layout, breakpoints };\r\nexport default densityLayout;\r\n"],"mappings":";;;;;;;;;;;;AAgCA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAwC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAhCxC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAIO,IAAME,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG;EACrBE,QAAQ,EAAM;IAAEC,GAAG,EAAE,EAAE;IAAEC,KAAK,EAAE,EAAE;IAAEC,GAAG,EAAE,EAAE;IAAEC,QAAQ,EAAE;EAAG,CAAC;EAC3DC,WAAW,EAAG;IAAEJ,GAAG,EAAE,EAAE;IAAEC,KAAK,EAAE,EAAE;IAAEC,GAAG,EAAE,EAAE;IAAEC,QAAQ,EAAE;EAAG,CAAC;EAC3DE,OAAO,EAAO;IAAEL,GAAG,EAAE,EAAE;IAAEC,KAAK,EAAE,EAAE;IAAEC,GAAG,EAAE,EAAE;IAAEC,QAAQ,EAAE;EAAG,CAAC;EAC3DG,YAAY,EAAE;IAAEN,GAAG,EAAE,EAAE;IAAEC,KAAK,EAAE,EAAE;IAAEC,GAAG,EAAE,EAAE;IAAEC,QAAQ,EAAE;EAAG;AAC5D,CAAC;AAEM,IAAMI,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG;EACpBC,OAAO,EAAK,GAAG;EACfC,UAAU,EAAG,EAAE;EAAK;EACpBC,MAAM,EAAO,EAAE;EACfC,UAAU,EAAE,IAAI;EAAI;EACpBC,OAAO,EAAM,GAAG;EAAI;EACpBC,UAAU,EAAG,EAAE;EAAK;;EAEpB;AACF;AACA;AACA;EACEC,KAAK,EAAE;IACLC,EAAE,EAAG,GAAG;IACRC,EAAE,EAAG,GAAG;IACRC,EAAE,EAAG,GAAG;IACRC,EAAE,EAAE;EACN,CAAC;EAED;AACF;AACA;AACA;EACEC,MAAM,EAAE;AACV,CAAC;;AAED;AACA;;AAGA,IAAMC,aAAa,GAAG;EAAEvB,OAAO,EAAPA,OAAO;EAAEU,MAAM,EAANA,MAAM;EAAEc,WAAW,EAAXA;AAAY,CAAC;AAAC,IAAAC,QAAA,GAAAxB,OAAA,cACxCsB,aAAa","ignoreList":[]}