@jirawatpyk/aura-tokens 4.14.0 → 4.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/aura-tailwind.css +1 -1
- package/aura.css +2 -1
- package/components/aura.bundle.js +86 -10
- package/components/aura.components.css +24 -0
- package/components/index.d.ts +12 -1
- package/figma-variables.csv +1 -0
- package/package.json +1 -1
- package/tokens.json +4 -2
package/aura-tailwind.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* AURA v4.
|
|
1
|
+
/* AURA v4.15.0 — Tailwind v4 theme. GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand.
|
|
2
2
|
* @import "tailwindcss";
|
|
3
3
|
* @import "@jirawatpyk/aura-tokens/tailwind.css";
|
|
4
4
|
* Gives bg-bg-surface, text-fg-primary, border-border-strong, p-aura-6, rounded-aura-xl, shadow-aura-overlay,
|
package/aura.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* AURA v4.
|
|
1
|
+
/* AURA v4.15.0 — GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand. */
|
|
2
2
|
/* Fonts: load aura-fonts.css (or the <link> tags in README) separately, so a blocked Google Fonts never breaks this file. */
|
|
3
3
|
|
|
4
4
|
:root, [data-theme="light"] {
|
|
@@ -310,6 +310,7 @@
|
|
|
310
310
|
--aura-dialog-md: 560px;
|
|
311
311
|
--aura-dialog-lg: 720px;
|
|
312
312
|
--aura-sidenav-width: 240px;
|
|
313
|
+
--aura-sidenav-rail-width: 64px;
|
|
313
314
|
--aura-tooltip-max: 240px;
|
|
314
315
|
--aura-drawer-sm: 360px;
|
|
315
316
|
--aura-drawer-md: 480px;
|
|
@@ -219,7 +219,7 @@ window.Aura = (() => {
|
|
|
219
219
|
|
|
220
220
|
// src/Icon.tsx
|
|
221
221
|
var h = React2.createElement;
|
|
222
|
-
var ICONS = { "check": [["path", { "d": "M20 6 9 17l-5-5" }]], "x": [["path", { "d": "M18 6 6 18" }], ["path", { "d": "m6 6 12 12" }]], "plus": [["path", { "d": "M5 12h14" }], ["path", { "d": "M12 5v14" }]], "minus": [["path", { "d": "M5 12h14" }]], "search": [["path", { "d": "m21 21-4.34-4.34" }], ["circle", { "cx": "11", "cy": "11", "r": "8" }]], "chevron-down": [["path", { "d": "m6 9 6 6 6-6" }]], "chevron-up": [["path", { "d": "m18 15-6-6-6 6" }]], "chevron-left": [["path", { "d": "m15 18-6-6 6-6" }]], "chevron-right": [["path", { "d": "m9 18 6-6-6-6" }]], "arrow-right": [["path", { "d": "M5 12h14" }], ["path", { "d": "m12 5 7 7-7 7" }]], "arrow-up-right": [["path", { "d": "M7 7h10v10" }], ["path", { "d": "M7 17 17 7" }]], "arrow-up-down": [["path", { "d": "m21 16-4 4-4-4" }], ["path", { "d": "M17 20V4" }], ["path", { "d": "m3 8 4-4 4 4" }], ["path", { "d": "M7 4v16" }]], "loader-circle": [["path", { "d": "M21 12a9 9 0 1 1-6.219-8.56" }]], "circle-alert": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["line", { "x1": "12", "x2": "12", "y1": "8", "y2": "12" }], ["line", { "x1": "12", "x2": "12.01", "y1": "16", "y2": "16" }]], "circle-check": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "m16 9-5.5 5.5L8 12" }]], "info": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 16v-4" }], ["path", { "d": "M12 8h.01" }]], "triangle-alert": [["path", { "d": "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }], ["path", { "d": "M12 9v4" }], ["path", { "d": "M12 17h.01" }]], "settings": [["path", { "d": "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "user": [["path", { "d": "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }], ["circle", { "cx": "12", "cy": "7", "r": "4" }]], "users": [["path", { "d": "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }], ["path", { "d": "M16 3.128a4 4 0 0 1 0 7.744" }], ["path", { "d": "M22 21v-2a4 4 0 0 0-3-3.87" }], ["circle", { "cx": "9", "cy": "7", "r": "4" }]], "filter": [["path", { "d": "M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z" }]], "ellipsis": [["circle", { "cx": "12", "cy": "12", "r": "1" }], ["circle", { "cx": "19", "cy": "12", "r": "1" }], ["circle", { "cx": "5", "cy": "12", "r": "1" }]], "external-link": [["path", { "d": "M15 3h6v6" }], ["path", { "d": "M10 14 21 3" }], ["path", { "d": "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]], "copy": [["rect", { "width": "14", "height": "14", "x": "8", "y": "8", "rx": "2", "ry": "2" }], ["path", { "d": "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]], "trash-2": [["path", { "d": "M10 11v6" }], ["path", { "d": "M14 11v6" }], ["path", { "d": "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }], ["path", { "d": "M3 6h18" }], ["path", { "d": "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]], "pencil": [["path", { "d": "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { "d": "m15 5 4 4" }]], "download": [["path", { "d": "M12 15V3" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }], ["path", { "d": "m7 10 5 5 5-5" }]], "upload": [["path", { "d": "M12 3v12" }], ["path", { "d": "m17 8-5-5-5 5" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]], "calendar": [["path", { "d": "M8 2v3" }], ["path", { "d": "M16 2v3" }], ["rect", { "x": "3", "y": "3", "width": "18", "height": "18", "rx": "2" }], ["path", { "d": "M3 9h18" }]], "bell": [["path", { "d": "M10.268 21a2 2 0 0 0 3.464 0" }], ["path", { "d": "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]], "menu": [["path", { "d": "M4 5h16" }], ["path", { "d": "M4 12h16" }], ["path", { "d": "M4 19h16" }]], "eye": [["path", { "d": "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "log-out": [["path", { "d": "m16 17 5-5-5-5" }], ["path", { "d": "M21 12H9" }], ["path", { "d": "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }]], "circle": [["circle", { "cx": "12", "cy": "12", "r": "10" }]], "circle-dot-dashed": [["path", { "d": "M10.1 2.18a9.93 9.93 0 0 1 3.8 0" }], ["path", { "d": "M17.6 3.71a9.95 9.95 0 0 1 2.69 2.7" }], ["path", { "d": "M21.82 10.1a9.93 9.93 0 0 1 0 3.8" }], ["path", { "d": "M20.29 17.6a9.95 9.95 0 0 1-2.7 2.69" }], ["path", { "d": "M13.9 21.82a9.94 9.94 0 0 1-3.8 0" }], ["path", { "d": "M6.4 20.29a9.95 9.95 0 0 1-2.69-2.7" }], ["path", { "d": "M2.18 13.9a9.93 9.93 0 0 1 0-3.8" }], ["path", { "d": "M3.71 6.4a9.95 9.95 0 0 1 2.7-2.69" }], ["circle", { "cx": "12", "cy": "12", "r": "1" }]], "ban": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M4.929 4.929 19.07 19.071" }]], "arrow-up": [["path", { "d": "m5 12 7-7 7 7" }], ["path", { "d": "M12 19V5" }]], "arrow-down": [["path", { "d": "M12 5v14" }], ["path", { "d": "m19 12-7 7-7-7" }]], "inbox": [["polyline", { "points": "22 12 16 12 14 15 10 15 8 12 2 12" }], ["path", { "d": "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" }]], "pin": [["path", { "d": "M12 17v5" }], ["path", { "d": "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }]], "pin-off": [["path", { "d": "M12 17v5" }], ["path", { "d": "M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89" }], ["path", { "d": "m2 2 20 20" }], ["path", { "d": "M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11" }]], "eye-off": [["path", { "d": "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49" }], ["path", { "d": "M14.084 14.158a3 3 0 0 1-4.242-4.242" }], ["path", { "d": "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }], ["path", { "d": "m2 2 20 20" }]], "columns-3": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "M15 3v18" }]], "arrow-left": [["path", { "d": "m12 19-7-7 7-7" }], ["path", { "d": "M19 12H5" }]], "rotate-ccw": [["path", { "d": "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }], ["path", { "d": "M3 3v5h5" }]], "house": [["path", { "d": "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }], ["path", { "d": "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }]], "layout-dashboard": [["rect", { "width": "7", "height": "9", "x": "3", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "14", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "9", "x": "14", "y": "12", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "3", "y": "16", "rx": "1" }]], "folder": [["path", { "d": "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }]], "chart-column": [["path", { "d": "M3 3v16a2 2 0 0 0 2 2h16" }], ["path", { "d": "M18 17V9" }], ["path", { "d": "M13 17V5" }], ["path", { "d": "M8 17v-3" }]], "file-text": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }], ["path", { "d": "M10 9H8" }], ["path", { "d": "M16 13H8" }], ["path", { "d": "M16 17H8" }]], "mail": [["path", { "d": "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" }], ["rect", { "x": "2", "y": "4", "width": "20", "height": "16", "rx": "2" }]], "lock": [["rect", { "width": "18", "height": "11", "x": "3", "y": "11", "rx": "2", "ry": "2" }], ["path", { "d": "M7 11V7a5 5 0 0 1 10 0v4" }]], "clock": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 6v6l4 2" }]], "trending-up": [["path", { "d": "M16 7h6v6" }], ["path", { "d": "m22 7-8.5 8.5-5-5L2 17" }]], "trending-down": [["path", { "d": "M16 17h6v-6" }], ["path", { "d": "m22 17-8.5-8.5-5 5L2 7" }]], "image": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2", "ry": "2" }], ["circle", { "cx": "9", "cy": "9", "r": "2" }], ["path", { "d": "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]], "paperclip": [["path", { "d": "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" }]], "cloud-upload": [["path", { "d": "M12 13v8" }], ["path", { "d": "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }], ["path", { "d": "m8 17 4-4 4 4" }]], "file": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }]], "sun": [["circle", { "cx": "12", "cy": "12", "r": "4" }], ["path", { "d": "M12 2v2" }], ["path", { "d": "M12 20v2" }], ["path", { "d": "m4.93 4.93 1.41 1.41" }], ["path", { "d": "m17.66 17.66 1.41 1.41" }], ["path", { "d": "M2 12h2" }], ["path", { "d": "M20 12h2" }], ["path", { "d": "m6.34 17.66-1.41 1.41" }], ["path", { "d": "m19.07 4.93-1.41 1.41" }]], "moon": [["path", { "d": "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" }]], "monitor": [["rect", { "width": "20", "height": "14", "x": "2", "y": "3", "rx": "2" }], ["line", { "x1": "8", "x2": "16", "y1": "21", "y2": "21" }], ["line", { "x1": "12", "x2": "12", "y1": "17", "y2": "21" }]] };
|
|
222
|
+
var ICONS = { "check": [["path", { "d": "M20 6 9 17l-5-5" }]], "x": [["path", { "d": "M18 6 6 18" }], ["path", { "d": "m6 6 12 12" }]], "plus": [["path", { "d": "M5 12h14" }], ["path", { "d": "M12 5v14" }]], "minus": [["path", { "d": "M5 12h14" }]], "search": [["path", { "d": "m21 21-4.34-4.34" }], ["circle", { "cx": "11", "cy": "11", "r": "8" }]], "chevron-down": [["path", { "d": "m6 9 6 6 6-6" }]], "chevron-up": [["path", { "d": "m18 15-6-6-6 6" }]], "chevron-left": [["path", { "d": "m15 18-6-6 6-6" }]], "chevron-right": [["path", { "d": "m9 18 6-6-6-6" }]], "arrow-right": [["path", { "d": "M5 12h14" }], ["path", { "d": "m12 5 7 7-7 7" }]], "arrow-up-right": [["path", { "d": "M7 7h10v10" }], ["path", { "d": "M7 17 17 7" }]], "arrow-up-down": [["path", { "d": "m21 16-4 4-4-4" }], ["path", { "d": "M17 20V4" }], ["path", { "d": "m3 8 4-4 4 4" }], ["path", { "d": "M7 4v16" }]], "loader-circle": [["path", { "d": "M21 12a9 9 0 1 1-6.219-8.56" }]], "circle-alert": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["line", { "x1": "12", "x2": "12", "y1": "8", "y2": "12" }], ["line", { "x1": "12", "x2": "12.01", "y1": "16", "y2": "16" }]], "circle-check": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "m16 9-5.5 5.5L8 12" }]], "info": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 16v-4" }], ["path", { "d": "M12 8h.01" }]], "triangle-alert": [["path", { "d": "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }], ["path", { "d": "M12 9v4" }], ["path", { "d": "M12 17h.01" }]], "settings": [["path", { "d": "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "user": [["path", { "d": "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }], ["circle", { "cx": "12", "cy": "7", "r": "4" }]], "users": [["path", { "d": "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }], ["path", { "d": "M16 3.128a4 4 0 0 1 0 7.744" }], ["path", { "d": "M22 21v-2a4 4 0 0 0-3-3.87" }], ["circle", { "cx": "9", "cy": "7", "r": "4" }]], "filter": [["path", { "d": "M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z" }]], "ellipsis": [["circle", { "cx": "12", "cy": "12", "r": "1" }], ["circle", { "cx": "19", "cy": "12", "r": "1" }], ["circle", { "cx": "5", "cy": "12", "r": "1" }]], "external-link": [["path", { "d": "M15 3h6v6" }], ["path", { "d": "M10 14 21 3" }], ["path", { "d": "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]], "copy": [["rect", { "width": "14", "height": "14", "x": "8", "y": "8", "rx": "2", "ry": "2" }], ["path", { "d": "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]], "trash-2": [["path", { "d": "M10 11v6" }], ["path", { "d": "M14 11v6" }], ["path", { "d": "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }], ["path", { "d": "M3 6h18" }], ["path", { "d": "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]], "pencil": [["path", { "d": "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { "d": "m15 5 4 4" }]], "download": [["path", { "d": "M12 15V3" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }], ["path", { "d": "m7 10 5 5 5-5" }]], "upload": [["path", { "d": "M12 3v12" }], ["path", { "d": "m17 8-5-5-5 5" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]], "calendar": [["path", { "d": "M8 2v3" }], ["path", { "d": "M16 2v3" }], ["rect", { "x": "3", "y": "3", "width": "18", "height": "18", "rx": "2" }], ["path", { "d": "M3 9h18" }]], "bell": [["path", { "d": "M10.268 21a2 2 0 0 0 3.464 0" }], ["path", { "d": "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]], "menu": [["path", { "d": "M4 5h16" }], ["path", { "d": "M4 12h16" }], ["path", { "d": "M4 19h16" }]], "eye": [["path", { "d": "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "log-out": [["path", { "d": "m16 17 5-5-5-5" }], ["path", { "d": "M21 12H9" }], ["path", { "d": "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }]], "circle": [["circle", { "cx": "12", "cy": "12", "r": "10" }]], "circle-dot-dashed": [["path", { "d": "M10.1 2.18a9.93 9.93 0 0 1 3.8 0" }], ["path", { "d": "M17.6 3.71a9.95 9.95 0 0 1 2.69 2.7" }], ["path", { "d": "M21.82 10.1a9.93 9.93 0 0 1 0 3.8" }], ["path", { "d": "M20.29 17.6a9.95 9.95 0 0 1-2.7 2.69" }], ["path", { "d": "M13.9 21.82a9.94 9.94 0 0 1-3.8 0" }], ["path", { "d": "M6.4 20.29a9.95 9.95 0 0 1-2.69-2.7" }], ["path", { "d": "M2.18 13.9a9.93 9.93 0 0 1 0-3.8" }], ["path", { "d": "M3.71 6.4a9.95 9.95 0 0 1 2.7-2.69" }], ["circle", { "cx": "12", "cy": "12", "r": "1" }]], "ban": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M4.929 4.929 19.07 19.071" }]], "arrow-up": [["path", { "d": "m5 12 7-7 7 7" }], ["path", { "d": "M12 19V5" }]], "arrow-down": [["path", { "d": "M12 5v14" }], ["path", { "d": "m19 12-7 7-7-7" }]], "inbox": [["polyline", { "points": "22 12 16 12 14 15 10 15 8 12 2 12" }], ["path", { "d": "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" }]], "pin": [["path", { "d": "M12 17v5" }], ["path", { "d": "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }]], "pin-off": [["path", { "d": "M12 17v5" }], ["path", { "d": "M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89" }], ["path", { "d": "m2 2 20 20" }], ["path", { "d": "M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11" }]], "eye-off": [["path", { "d": "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49" }], ["path", { "d": "M14.084 14.158a3 3 0 0 1-4.242-4.242" }], ["path", { "d": "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }], ["path", { "d": "m2 2 20 20" }]], "columns-3": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "M15 3v18" }]], "arrow-left": [["path", { "d": "m12 19-7-7 7-7" }], ["path", { "d": "M19 12H5" }]], "rotate-ccw": [["path", { "d": "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }], ["path", { "d": "M3 3v5h5" }]], "house": [["path", { "d": "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }], ["path", { "d": "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }]], "layout-dashboard": [["rect", { "width": "7", "height": "9", "x": "3", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "14", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "9", "x": "14", "y": "12", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "3", "y": "16", "rx": "1" }]], "folder": [["path", { "d": "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }]], "chart-column": [["path", { "d": "M3 3v16a2 2 0 0 0 2 2h16" }], ["path", { "d": "M18 17V9" }], ["path", { "d": "M13 17V5" }], ["path", { "d": "M8 17v-3" }]], "file-text": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }], ["path", { "d": "M10 9H8" }], ["path", { "d": "M16 13H8" }], ["path", { "d": "M16 17H8" }]], "mail": [["path", { "d": "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" }], ["rect", { "x": "2", "y": "4", "width": "20", "height": "16", "rx": "2" }]], "lock": [["rect", { "width": "18", "height": "11", "x": "3", "y": "11", "rx": "2", "ry": "2" }], ["path", { "d": "M7 11V7a5 5 0 0 1 10 0v4" }]], "clock": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 6v6l4 2" }]], "trending-up": [["path", { "d": "M16 7h6v6" }], ["path", { "d": "m22 7-8.5 8.5-5-5L2 17" }]], "trending-down": [["path", { "d": "M16 17h6v-6" }], ["path", { "d": "m22 17-8.5-8.5-5 5L2 7" }]], "image": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2", "ry": "2" }], ["circle", { "cx": "9", "cy": "9", "r": "2" }], ["path", { "d": "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]], "paperclip": [["path", { "d": "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" }]], "cloud-upload": [["path", { "d": "M12 13v8" }], ["path", { "d": "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }], ["path", { "d": "m8 17 4-4 4 4" }]], "file": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }]], "sun": [["circle", { "cx": "12", "cy": "12", "r": "4" }], ["path", { "d": "M12 2v2" }], ["path", { "d": "M12 20v2" }], ["path", { "d": "m4.93 4.93 1.41 1.41" }], ["path", { "d": "m17.66 17.66 1.41 1.41" }], ["path", { "d": "M2 12h2" }], ["path", { "d": "M20 12h2" }], ["path", { "d": "m6.34 17.66-1.41 1.41" }], ["path", { "d": "m19.07 4.93-1.41 1.41" }]], "moon": [["path", { "d": "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" }]], "monitor": [["rect", { "width": "20", "height": "14", "x": "2", "y": "3", "rx": "2" }], ["line", { "x1": "8", "x2": "16", "y1": "21", "y2": "21" }], ["line", { "x1": "12", "x2": "12", "y1": "17", "y2": "21" }]], "panel-left-close": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "m16 15-3-3 3-3" }]], "panel-left-open": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "m14 9 3 3-3 3" }]] };
|
|
223
223
|
var SIZES = { sm: 16, md: 20, lg: 24 };
|
|
224
224
|
var Icon = React2.forwardRef(function Icon2(props, ref) {
|
|
225
225
|
const size = SIZES[props.size] || props.size || 16;
|
|
@@ -296,6 +296,8 @@ window.Aura = (() => {
|
|
|
296
296
|
breadcrumb: "Breadcrumb",
|
|
297
297
|
navigation: "Navigation",
|
|
298
298
|
openNav: "Open navigation",
|
|
299
|
+
collapseNav: "Collapse sidebar",
|
|
300
|
+
expandNav: "Expand sidebar",
|
|
299
301
|
searching: "Searching\u2026",
|
|
300
302
|
noMatches: "No matches",
|
|
301
303
|
clear: function(what) {
|
|
@@ -407,6 +409,8 @@ window.Aura = (() => {
|
|
|
407
409
|
breadcrumb: "\u0E40\u0E2A\u0E49\u0E19\u0E17\u0E32\u0E07",
|
|
408
410
|
navigation: "\u0E40\u0E21\u0E19\u0E39",
|
|
409
411
|
openNav: "\u0E40\u0E1B\u0E34\u0E14\u0E40\u0E21\u0E19\u0E39",
|
|
412
|
+
collapseNav: "\u0E22\u0E48\u0E2D\u0E41\u0E16\u0E1A\u0E40\u0E21\u0E19\u0E39",
|
|
413
|
+
expandNav: "\u0E02\u0E22\u0E32\u0E22\u0E41\u0E16\u0E1A\u0E40\u0E21\u0E19\u0E39",
|
|
410
414
|
searching: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E04\u0E49\u0E19\u0E2B\u0E32\u2026",
|
|
411
415
|
noMatches: "\u0E44\u0E21\u0E48\u0E1E\u0E1A\u0E23\u0E32\u0E22\u0E01\u0E32\u0E23\u0E17\u0E35\u0E48\u0E15\u0E23\u0E07\u0E01\u0E31\u0E19",
|
|
412
416
|
clear: function(what) {
|
|
@@ -518,6 +522,8 @@ window.Aura = (() => {
|
|
|
518
522
|
breadcrumb: "Br\xF6dsmulor",
|
|
519
523
|
navigation: "Navigering",
|
|
520
524
|
openNav: "\xD6ppna menyn",
|
|
525
|
+
collapseNav: "F\xE4ll ihop sidof\xE4ltet",
|
|
526
|
+
expandNav: "F\xE4ll ut sidof\xE4ltet",
|
|
521
527
|
searching: "S\xF6ker\u2026",
|
|
522
528
|
noMatches: "Inga tr\xE4ffar",
|
|
523
529
|
clear: function(what) {
|
|
@@ -4243,6 +4249,7 @@ window.Aura = (() => {
|
|
|
4243
4249
|
|
|
4244
4250
|
// src/SideNav.tsx
|
|
4245
4251
|
var React31 = __toESM(require_react(), 1);
|
|
4252
|
+
var import_react_dom8 = __toESM(require_react_dom(), 1);
|
|
4246
4253
|
function contains(it, id) {
|
|
4247
4254
|
return !!id && !!it.children && it.children.some(function(c) {
|
|
4248
4255
|
return c.id === id || contains(c, id);
|
|
@@ -4258,6 +4265,39 @@ window.Aura = (() => {
|
|
|
4258
4265
|
props.onChange
|
|
4259
4266
|
);
|
|
4260
4267
|
const active = st[0];
|
|
4268
|
+
const col = useMaybeControlled(props.collapsed, !!props.defaultCollapsed, props.onCollapsedChange);
|
|
4269
|
+
const collapsed = col[0];
|
|
4270
|
+
const tipState = React31.useState(null), tip = tipState[0], setTip = tipState[1];
|
|
4271
|
+
React31.useEffect(
|
|
4272
|
+
function() {
|
|
4273
|
+
if (!collapsed) setTip(null);
|
|
4274
|
+
},
|
|
4275
|
+
[collapsed]
|
|
4276
|
+
);
|
|
4277
|
+
React31.useEffect(
|
|
4278
|
+
function() {
|
|
4279
|
+
if (!tip) return;
|
|
4280
|
+
function esc(e) {
|
|
4281
|
+
if (e.key === "Escape") setTip(null);
|
|
4282
|
+
}
|
|
4283
|
+
document.addEventListener("keydown", esc);
|
|
4284
|
+
return function() {
|
|
4285
|
+
document.removeEventListener("keydown", esc);
|
|
4286
|
+
};
|
|
4287
|
+
},
|
|
4288
|
+
[tip]
|
|
4289
|
+
);
|
|
4290
|
+
function tipHandlers(label) {
|
|
4291
|
+
if (!collapsed) return {};
|
|
4292
|
+
function show2(e) {
|
|
4293
|
+
const r = e.currentTarget.getBoundingClientRect();
|
|
4294
|
+
setTip({ text: label, top: r.top + r.height / 2, left: r.right + 8 });
|
|
4295
|
+
}
|
|
4296
|
+
function hide() {
|
|
4297
|
+
setTip(null);
|
|
4298
|
+
}
|
|
4299
|
+
return { onMouseEnter: show2, onFocus: show2, onMouseLeave: hide, onBlur: hide };
|
|
4300
|
+
}
|
|
4261
4301
|
const sections = props.sections || [{ items: props.items || [] }];
|
|
4262
4302
|
const openState = React31.useState({}), toggled = openState[0], setToggled = openState[1];
|
|
4263
4303
|
function isOpen(it) {
|
|
@@ -4303,8 +4343,10 @@ window.Aura = (() => {
|
|
|
4303
4343
|
visible[j].focus();
|
|
4304
4344
|
}
|
|
4305
4345
|
function inner(it, group, open) {
|
|
4346
|
+
const marked = it.count != null && it.count > 0 || it.badge != null;
|
|
4306
4347
|
return [
|
|
4307
|
-
it.icon ? /* @__PURE__ */ React31.createElement(Icon, { key: "i", name: it.icon }) : null,
|
|
4348
|
+
it.icon ? /* @__PURE__ */ React31.createElement(Icon, { key: "i", name: it.icon }) : collapsed ? /* @__PURE__ */ React31.createElement("span", { key: "i", className: "aura-nav__initial", "aria-hidden": "true" }, it.label.charAt(0)) : null,
|
|
4349
|
+
collapsed && marked ? /* @__PURE__ */ React31.createElement("span", { key: "d", className: "aura-nav__dot", "aria-hidden": "true" }) : null,
|
|
4308
4350
|
/* @__PURE__ */ React31.createElement("span", { key: "l", className: "aura-nav__label" }, it.label),
|
|
4309
4351
|
it.badge != null ? /* @__PURE__ */ React31.createElement("span", { key: "b", className: "aura-nav__badge" }, it.badge) : null,
|
|
4310
4352
|
it.count != null ? /* @__PURE__ */ React31.createElement("span", { key: "c", className: "aura-nav__count" }, it.count) : null,
|
|
@@ -4313,7 +4355,7 @@ window.Aura = (() => {
|
|
|
4313
4355
|
}
|
|
4314
4356
|
function item(it, depth) {
|
|
4315
4357
|
if (it.children) {
|
|
4316
|
-
const open = isOpen(it);
|
|
4358
|
+
const open = !collapsed && isOpen(it);
|
|
4317
4359
|
const listId = base + "-" + it.id;
|
|
4318
4360
|
const holdsActive = contains(it, active);
|
|
4319
4361
|
return /* @__PURE__ */ React31.createElement("li", { key: it.id, className: "aura-nav__group" }, /* @__PURE__ */ React31.createElement(
|
|
@@ -4324,10 +4366,15 @@ window.Aura = (() => {
|
|
|
4324
4366
|
"aria-expanded": open,
|
|
4325
4367
|
"aria-controls": listId,
|
|
4326
4368
|
style: depth ? { ["--aura-nav-depth"]: depth } : void 0,
|
|
4369
|
+
...tipHandlers(it.label),
|
|
4327
4370
|
onClick: function() {
|
|
4328
4371
|
const next = Object.assign({}, toggled);
|
|
4329
4372
|
next[it.id] = !open;
|
|
4330
4373
|
setToggled(next);
|
|
4374
|
+
if (collapsed) {
|
|
4375
|
+
setTip(null);
|
|
4376
|
+
col[1](false);
|
|
4377
|
+
}
|
|
4331
4378
|
},
|
|
4332
4379
|
onKeyDown: function(e) {
|
|
4333
4380
|
if (e.key === "ArrowRight" && !open) {
|
|
@@ -4346,6 +4393,7 @@ window.Aura = (() => {
|
|
|
4346
4393
|
}
|
|
4347
4394
|
const on = active === it.id;
|
|
4348
4395
|
const common = {
|
|
4396
|
+
...tipHandlers(it.label),
|
|
4349
4397
|
className: cx("aura-nav__item", on && "is-active"),
|
|
4350
4398
|
"aria-current": on ? "page" : void 0,
|
|
4351
4399
|
style: depth ? { ["--aura-nav-depth"]: depth } : void 0,
|
|
@@ -4364,7 +4412,8 @@ window.Aura = (() => {
|
|
|
4364
4412
|
if (typeof ref === "function") ref(el);
|
|
4365
4413
|
else if (ref) ref.current = el;
|
|
4366
4414
|
},
|
|
4367
|
-
className: cx("aura-nav", props.className),
|
|
4415
|
+
className: cx("aura-nav", collapsed && "aura-nav--collapsed", props.className),
|
|
4416
|
+
"data-collapsed": collapsed ? "" : void 0,
|
|
4368
4417
|
"aria-label": props.label || t.mainNav,
|
|
4369
4418
|
onKeyDown
|
|
4370
4419
|
},
|
|
@@ -4374,7 +4423,31 @@ window.Aura = (() => {
|
|
|
4374
4423
|
return item(it, 0);
|
|
4375
4424
|
})));
|
|
4376
4425
|
})),
|
|
4377
|
-
props.footer ? /* @__PURE__ */ React31.createElement("div", { className: "aura-nav__footer" }, props.footer) : null
|
|
4426
|
+
props.footer ? /* @__PURE__ */ React31.createElement("div", { className: "aura-nav__footer" }, props.footer) : null,
|
|
4427
|
+
props.collapsible ? /* @__PURE__ */ React31.createElement("div", { className: "aura-nav__toggle" }, /* @__PURE__ */ React31.createElement(
|
|
4428
|
+
IconButton,
|
|
4429
|
+
{
|
|
4430
|
+
icon: collapsed ? "panel-left-open" : "panel-left-close",
|
|
4431
|
+
label: collapsed ? t.expandNav : t.collapseNav,
|
|
4432
|
+
size: "md",
|
|
4433
|
+
onClick: function() {
|
|
4434
|
+
setTip(null);
|
|
4435
|
+
col[1](!collapsed);
|
|
4436
|
+
}
|
|
4437
|
+
}
|
|
4438
|
+
)) : null,
|
|
4439
|
+
tip && typeof document !== "undefined" ? (0, import_react_dom8.createPortal)(
|
|
4440
|
+
/* @__PURE__ */ React31.createElement(
|
|
4441
|
+
"div",
|
|
4442
|
+
{
|
|
4443
|
+
className: "aura-tooltip aura-tooltip--right",
|
|
4444
|
+
"aria-hidden": "true",
|
|
4445
|
+
style: { top: tip.top, left: tip.left }
|
|
4446
|
+
},
|
|
4447
|
+
tip.text
|
|
4448
|
+
),
|
|
4449
|
+
document.body
|
|
4450
|
+
) : null
|
|
4378
4451
|
);
|
|
4379
4452
|
});
|
|
4380
4453
|
|
|
@@ -4539,7 +4612,10 @@ window.Aura = (() => {
|
|
|
4539
4612
|
if (navEl.props.onChange) navEl.props.onChange(id);
|
|
4540
4613
|
setOpen(false);
|
|
4541
4614
|
},
|
|
4542
|
-
className: cx(navEl.props.className, "is-in-drawer")
|
|
4615
|
+
className: cx(navEl.props.className, "is-in-drawer"),
|
|
4616
|
+
/* The drawer is already full-size: never a rail, no collapse button. */
|
|
4617
|
+
collapsed: false,
|
|
4618
|
+
collapsible: false
|
|
4543
4619
|
}) : props.nav;
|
|
4544
4620
|
return /* @__PURE__ */ React38.createElement("div", { ref, className: cx("aura-shell", compact && "is-compact", props.className) }, !compact ? /* @__PURE__ */ React38.createElement("div", { className: "aura-shell__nav" }, nav) : null, compact ? /* @__PURE__ */ React38.createElement(
|
|
4545
4621
|
Drawer,
|
|
@@ -4620,7 +4696,7 @@ window.Aura = (() => {
|
|
|
4620
4696
|
|
|
4621
4697
|
// src/TimePicker.tsx
|
|
4622
4698
|
var React41 = __toESM(require_react(), 1);
|
|
4623
|
-
var
|
|
4699
|
+
var import_react_dom9 = __toESM(require_react_dom(), 1);
|
|
4624
4700
|
function pad2(n2) {
|
|
4625
4701
|
return (n2 < 10 ? "0" : "") + n2;
|
|
4626
4702
|
}
|
|
@@ -4817,7 +4893,7 @@ window.Aura = (() => {
|
|
|
4817
4893
|
}
|
|
4818
4894
|
}
|
|
4819
4895
|
const error = errState[0] || props.error;
|
|
4820
|
-
const list = open && mounted && pos[0] ? (0,
|
|
4896
|
+
const list = open && mounted && pos[0] ? (0, import_react_dom9.createPortal)(
|
|
4821
4897
|
/* @__PURE__ */ React41.createElement("div", { ref: listRef, className: "aura-combo__popover aura-time__popover", style: pos[0] }, /* @__PURE__ */ React41.createElement("ul", { id: listId, role: "listbox", "aria-label": props.label, className: "aura-combo__list" }, slots.map(function(s, i) {
|
|
4822
4898
|
const dis = blocked(s), sel = s === value;
|
|
4823
4899
|
return /* @__PURE__ */ React41.createElement(
|
|
@@ -5769,7 +5845,7 @@ window.Aura = (() => {
|
|
|
5769
5845
|
|
|
5770
5846
|
// src/Popover.tsx
|
|
5771
5847
|
var React51 = __toESM(require_react(), 1);
|
|
5772
|
-
var
|
|
5848
|
+
var import_react_dom10 = __toESM(require_react_dom(), 1);
|
|
5773
5849
|
function position(anchor, pop, placement) {
|
|
5774
5850
|
const r = anchor.getBoundingClientRect(), pw = pop.offsetWidth, ph = pop.offsetHeight, vw = window.innerWidth, vh = window.innerHeight, gap = 6;
|
|
5775
5851
|
let side = (placement || "bottom-start").split("-")[0], align = (placement || "bottom-start").split("-")[1] || "start";
|
|
@@ -5833,7 +5909,7 @@ window.Aura = (() => {
|
|
|
5833
5909
|
[open, mounted]
|
|
5834
5910
|
);
|
|
5835
5911
|
const child = React51.Children.only(props.trigger);
|
|
5836
|
-
const panel = open && mounted ? (0,
|
|
5912
|
+
const panel = open && mounted ? (0, import_react_dom10.createPortal)(
|
|
5837
5913
|
/* @__PURE__ */ React51.createElement(
|
|
5838
5914
|
"div",
|
|
5839
5915
|
{
|
|
@@ -596,6 +596,30 @@ a.aura-btn { text-decoration: none; }
|
|
|
596
596
|
.aura-nav__sub { margin-top: 2px; }
|
|
597
597
|
.aura-nav__sub[hidden] { display: none; }
|
|
598
598
|
.aura-nav__footer { padding: var(--aura-space-3); border-top: 1px solid var(--aura-border-default); }
|
|
599
|
+
/* Collapse toggle and the icon-only rail (4.15). */
|
|
600
|
+
.aura-nav { transition: width var(--aura-duration-base) var(--aura-ease); }
|
|
601
|
+
.aura-nav__toggle { display: flex; padding: var(--aura-space-2) var(--aura-space-3); border-top: 1px solid var(--aura-border-default); }
|
|
602
|
+
.aura-nav--collapsed { width: var(--aura-sidenav-rail-width); }
|
|
603
|
+
.aura-nav--collapsed .aura-nav__toggle { justify-content: center; }
|
|
604
|
+
.aura-nav--collapsed .aura-nav__header, .aura-nav--collapsed .aura-nav__footer { padding-left: var(--aura-space-2); padding-right: var(--aura-space-2); overflow: hidden; }
|
|
605
|
+
.aura-nav--collapsed .aura-nav__item { position: relative; justify-content: center; gap: 0; padding: 0; }
|
|
606
|
+
.aura-nav--collapsed .aura-nav__label, .aura-nav--collapsed .aura-nav__count, .aura-nav--collapsed .aura-nav__badge, .aura-nav--collapsed .aura-nav__title {
|
|
607
|
+
position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
|
|
608
|
+
}
|
|
609
|
+
.aura-nav--collapsed .aura-nav__chevron { display: none; }
|
|
610
|
+
.aura-nav--collapsed .aura-nav__section + .aura-nav__section { margin-top: var(--aura-space-3); padding-top: var(--aura-space-3); border-top: 1px solid var(--aura-border-default); }
|
|
611
|
+
.aura-nav--collapsed .aura-nav__item--group.has-active { background: var(--aura-bg-selected); }
|
|
612
|
+
.aura-nav--collapsed .aura-nav__item--group.has-active .aura-icon { color: var(--aura-fg-accent); }
|
|
613
|
+
.aura-nav__initial {
|
|
614
|
+
display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: var(--aura-radius-sm);
|
|
615
|
+
background: var(--aura-status-neutral-bg); color: var(--aura-status-neutral-fg); font-size: 12px; font-weight: 600; text-transform: uppercase;
|
|
616
|
+
}
|
|
617
|
+
.aura-nav__dot {
|
|
618
|
+
position: absolute; top: 6px; left: calc(50% + 5px); width: 8px; height: 8px; border-radius: var(--aura-radius-full);
|
|
619
|
+
background: var(--aura-fg-accent); box-shadow: 0 0 0 2px var(--aura-bg-canvas);
|
|
620
|
+
}
|
|
621
|
+
.aura-tooltip--right { transform: translateY(-50%); white-space: nowrap; }
|
|
622
|
+
@media (prefers-reduced-motion: reduce) { .aura-nav { transition: none; } }
|
|
599
623
|
|
|
600
624
|
/* ---------- Breadcrumb ---------- */
|
|
601
625
|
.aura-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: var(--aura-space-1) var(--aura-space-2); list-style: none; margin: 0; padding: 0; font-family: var(--font-sans); font-size: 13px; }
|
package/components/index.d.ts
CHANGED
|
@@ -157,7 +157,7 @@ export interface DataTableProps {
|
|
|
157
157
|
}
|
|
158
158
|
/** An AURA icon name, or any icon element (e.g. `<Building />` from lucide-react). AURA sizes it and hides it from screen readers. */
|
|
159
159
|
export type IconInput = IconName | React$1.ReactElement;
|
|
160
|
-
export type IconName = "check" | "x" | "plus" | "minus" | "search" | "chevron-down" | "chevron-up" | "chevron-left" | "chevron-right" | "arrow-right" | "arrow-up-right" | "arrow-up-down" | "loader-circle" | "circle-alert" | "circle-check" | "info" | "triangle-alert" | "settings" | "user" | "users" | "filter" | "ellipsis" | "external-link" | "copy" | "trash-2" | "pencil" | "download" | "upload" | "calendar" | "bell" | "menu" | "eye" | "log-out" | "circle" | "circle-dot-dashed" | "ban" | "arrow-up" | "arrow-down" | "inbox" | "pin" | "pin-off" | "eye-off" | "columns-3" | "arrow-left" | "rotate-ccw" | "house" | "layout-dashboard" | "folder" | "chart-column" | "file-text" | "mail" | "lock" | "clock" | "trending-up" | "trending-down" | "image" | "paperclip" | "cloud-upload" | "file" | "sun" | "moon" | "monitor";
|
|
160
|
+
export type IconName = "check" | "x" | "plus" | "minus" | "search" | "chevron-down" | "chevron-up" | "chevron-left" | "chevron-right" | "arrow-right" | "arrow-up-right" | "arrow-up-down" | "loader-circle" | "circle-alert" | "circle-check" | "info" | "triangle-alert" | "settings" | "user" | "users" | "filter" | "ellipsis" | "external-link" | "copy" | "trash-2" | "pencil" | "download" | "upload" | "calendar" | "bell" | "menu" | "eye" | "log-out" | "circle" | "circle-dot-dashed" | "ban" | "arrow-up" | "arrow-down" | "inbox" | "pin" | "pin-off" | "eye-off" | "columns-3" | "arrow-left" | "rotate-ccw" | "house" | "layout-dashboard" | "folder" | "chart-column" | "file-text" | "mail" | "lock" | "clock" | "trending-up" | "trending-down" | "image" | "paperclip" | "cloud-upload" | "file" | "sun" | "moon" | "monitor" | "panel-left-close" | "panel-left-open";
|
|
161
161
|
/** Lucide stroke icon drawn inline in currentColor. */
|
|
162
162
|
export interface IconProps {
|
|
163
163
|
/** A name from the set, or an icon element of your own (sized and styled the same way). */
|
|
@@ -529,6 +529,15 @@ export interface SideNavProps {
|
|
|
529
529
|
label?: string;
|
|
530
530
|
/** Router link for items with `href`; defaults to the AuraProvider's `linkComponent`, then `<a>`. */
|
|
531
531
|
linkComponent?: React$1.ElementType;
|
|
532
|
+
/** Icon-only rail (`aura-sidenav-rail-width`, 64px). Labels show as tooltips and stay the accessible names; a group
|
|
533
|
+
* expands the rail when clicked. Controlled; pair with `onCollapsedChange`. */
|
|
534
|
+
collapsed?: boolean;
|
|
535
|
+
/** Starting state when `collapsed` isn't controlled. Default false. */
|
|
536
|
+
defaultCollapsed?: boolean;
|
|
537
|
+
/** Called by the toggle button, and by a group clicked in the rail (with `false`). Save it to keep the choice. */
|
|
538
|
+
onCollapsedChange?: (collapsed: boolean) => void;
|
|
539
|
+
/** Adds a collapse / expand button at the bottom. AppShell hides it in its phone drawer. */
|
|
540
|
+
collapsible?: boolean;
|
|
532
541
|
className?: string;
|
|
533
542
|
}
|
|
534
543
|
export interface BreadcrumbProps {
|
|
@@ -1151,6 +1160,8 @@ export interface AuraStrings {
|
|
|
1151
1160
|
breadcrumb: string;
|
|
1152
1161
|
navigation: string;
|
|
1153
1162
|
openNav: string;
|
|
1163
|
+
collapseNav: string;
|
|
1164
|
+
expandNav: string;
|
|
1154
1165
|
searching: string;
|
|
1155
1166
|
noMatches: string;
|
|
1156
1167
|
clear: (what?: string) => string;
|
package/figma-variables.csv
CHANGED
|
@@ -239,6 +239,7 @@ size/dialog-sm,number,light,400,,GAP
|
|
|
239
239
|
size/dialog-md,number,light,560,,GAP
|
|
240
240
|
size/dialog-lg,number,light,720,,GAP
|
|
241
241
|
size/sidenav-width,number,light,240,,GAP
|
|
242
|
+
size/sidenav-rail-width,number,light,64,SideNav collapsed to an icon-only rail (`collapsed`). ADDED 4.15.,GAP
|
|
242
243
|
size/tooltip-max,number,light,240,,GAP
|
|
243
244
|
size/drawer-sm,number,light,360,"Drawer width, small (filters, quick detail). ADDED 4.2.",GAP
|
|
244
245
|
size/drawer-md,number,light,480,"Drawer width, default (record detail). ADDED 4.2.",GAP
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jirawatpyk/aura-tokens",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.15.0",
|
|
4
4
|
"description": "AURA Design System — tokens (CSS variables, Tailwind preset, Figma variables), theme contrast checks and token lint.",
|
|
5
5
|
"main": "tailwind.tokens.cjs",
|
|
6
6
|
"types": "components/index.d.ts",
|
package/tokens.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "4.
|
|
2
|
+
"version": "4.15.0",
|
|
3
3
|
"meta": {
|
|
4
4
|
"name": "AURA Design System",
|
|
5
5
|
"tier": "3-tier",
|
|
@@ -279,6 +279,7 @@
|
|
|
279
279
|
"dialog-md": "560px",
|
|
280
280
|
"dialog-lg": "720px",
|
|
281
281
|
"sidenav-width": "240px",
|
|
282
|
+
"sidenav-rail-width": "64px",
|
|
282
283
|
"tooltip-max": "240px",
|
|
283
284
|
"drawer-sm": "360px",
|
|
284
285
|
"drawer-md": "480px",
|
|
@@ -541,6 +542,7 @@
|
|
|
541
542
|
"progress-track-edge": "1px inset edge of Progress / upload tracks: ≥3:1 on bg-surface and bg-canvas in both themes (WCAG 1.4.11), so the track reads without the fill. ADDED 4.11.",
|
|
542
543
|
"input-font-size": "Text size in inputs, textareas, selects and pickers. Phones (<640px) use at least 16px so iOS Safari does not zoom on focus. ADDED 4.11.",
|
|
543
544
|
"touch-target": "Minimum hit area on touch screens (pointer: coarse): IconButton, and Radio / Checkbox / Switch rows (WCAG 2.5.5). ADDED 4.11.",
|
|
544
|
-
"table-row-height": "DataTable row and header height. 40px in compact density on fine pointers; 48px on touch. ADDED 4.14."
|
|
545
|
+
"table-row-height": "DataTable row and header height. 40px in compact density on fine pointers; 48px on touch. ADDED 4.14.",
|
|
546
|
+
"sidenav-rail-width": "SideNav collapsed to an icon-only rail (`collapsed`). ADDED 4.15."
|
|
545
547
|
}
|
|
546
548
|
}
|