@path58/ui 2.0.0 → 2.6.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.
Files changed (84) hide show
  1. package/dist/atoms/Alert/Alert.d.ts +39 -0
  2. package/dist/atoms/Alert/Alert.d.ts.map +1 -0
  3. package/dist/atoms/Alert/index.d.ts +3 -0
  4. package/dist/atoms/Alert/index.d.ts.map +1 -0
  5. package/dist/atoms/Banner/Banner.d.ts +48 -0
  6. package/dist/atoms/Banner/Banner.d.ts.map +1 -0
  7. package/dist/atoms/Banner/index.d.ts +3 -0
  8. package/dist/atoms/Banner/index.d.ts.map +1 -0
  9. package/dist/atoms/Layout/Layout.d.ts +47 -0
  10. package/dist/atoms/Layout/Layout.d.ts.map +1 -0
  11. package/dist/atoms/Layout/index.d.ts +3 -0
  12. package/dist/atoms/Layout/index.d.ts.map +1 -0
  13. package/dist/atoms/StatusPill/StatusPill.d.ts +47 -0
  14. package/dist/atoms/StatusPill/StatusPill.d.ts.map +1 -0
  15. package/dist/atoms/StatusPill/index.d.ts +3 -0
  16. package/dist/atoms/StatusPill/index.d.ts.map +1 -0
  17. package/dist/atoms/Toast/Toast.d.ts +49 -0
  18. package/dist/atoms/Toast/Toast.d.ts.map +1 -0
  19. package/dist/atoms/Toast/index.d.ts +3 -0
  20. package/dist/atoms/Toast/index.d.ts.map +1 -0
  21. package/dist/atoms/index.d.ts +5 -0
  22. package/dist/atoms/index.d.ts.map +1 -1
  23. package/dist/index.d.ts +21 -0
  24. package/dist/index.d.ts.map +1 -1
  25. package/dist/index.js +2561 -294
  26. package/dist/molecules/ConfirmDialog/ConfirmDialog.d.ts +43 -0
  27. package/dist/molecules/ConfirmDialog/ConfirmDialog.d.ts.map +1 -0
  28. package/dist/molecules/ConfirmDialog/index.d.ts +3 -0
  29. package/dist/molecules/ConfirmDialog/index.d.ts.map +1 -0
  30. package/dist/molecules/Modal/Modal.d.ts +39 -0
  31. package/dist/molecules/Modal/Modal.d.ts.map +1 -0
  32. package/dist/molecules/Modal/index.d.ts +3 -0
  33. package/dist/molecules/Modal/index.d.ts.map +1 -0
  34. package/dist/molecules/PromptDialog/PromptDialog.d.ts +46 -0
  35. package/dist/molecules/PromptDialog/PromptDialog.d.ts.map +1 -0
  36. package/dist/molecules/PromptDialog/index.d.ts +3 -0
  37. package/dist/molecules/PromptDialog/index.d.ts.map +1 -0
  38. package/dist/molecules/index.d.ts +3 -0
  39. package/dist/molecules/index.d.ts.map +1 -1
  40. package/dist/organisms/ToastProvider/ToastProvider.d.ts +53 -0
  41. package/dist/organisms/ToastProvider/ToastProvider.d.ts.map +1 -0
  42. package/dist/organisms/ToastProvider/index.d.ts +4 -0
  43. package/dist/organisms/ToastProvider/index.d.ts.map +1 -0
  44. package/dist/organisms/ToastProvider/useToast.d.ts +28 -0
  45. package/dist/organisms/ToastProvider/useToast.d.ts.map +1 -0
  46. package/dist/organisms/ToolAuthGate/ToolAuthGate.d.ts +47 -0
  47. package/dist/organisms/ToolAuthGate/ToolAuthGate.d.ts.map +1 -0
  48. package/dist/organisms/ToolAuthGate/index.d.ts +3 -0
  49. package/dist/organisms/ToolAuthGate/index.d.ts.map +1 -0
  50. package/dist/organisms/ToolFooter/ToolFooter.d.ts +21 -0
  51. package/dist/organisms/ToolFooter/ToolFooter.d.ts.map +1 -0
  52. package/dist/organisms/ToolFooter/index.d.ts +3 -0
  53. package/dist/organisms/ToolFooter/index.d.ts.map +1 -0
  54. package/dist/organisms/ToolTopbar/ToolTopbar.d.ts +27 -0
  55. package/dist/organisms/ToolTopbar/ToolTopbar.d.ts.map +1 -0
  56. package/dist/organisms/ToolTopbar/index.d.ts +3 -0
  57. package/dist/organisms/ToolTopbar/index.d.ts.map +1 -0
  58. package/dist/organisms/index.d.ts +5 -0
  59. package/dist/organisms/index.d.ts.map +1 -1
  60. package/dist/organisms/inputs/MoneyInput.d.ts +34 -0
  61. package/dist/organisms/inputs/MoneyInput.d.ts.map +1 -0
  62. package/dist/organisms/inputs/NumberInput.d.ts +36 -0
  63. package/dist/organisms/inputs/NumberInput.d.ts.map +1 -0
  64. package/dist/organisms/inputs/PercentInput.d.ts +36 -0
  65. package/dist/organisms/inputs/PercentInput.d.ts.map +1 -0
  66. package/dist/organisms/inputs/TextInput.d.ts +31 -0
  67. package/dist/organisms/inputs/TextInput.d.ts.map +1 -0
  68. package/dist/organisms/inputs/index.d.ts +18 -0
  69. package/dist/organisms/inputs/index.d.ts.map +1 -0
  70. package/dist/organisms/inputs/useBlurOnEnterEscapeClickOut.d.ts +29 -0
  71. package/dist/organisms/inputs/useBlurOnEnterEscapeClickOut.d.ts.map +1 -0
  72. package/dist/organisms/inputs/useNumericInputState.d.ts +23 -0
  73. package/dist/organisms/inputs/useNumericInputState.d.ts.map +1 -0
  74. package/dist/primitives/Dialog/Dialog.d.ts +63 -0
  75. package/dist/primitives/Dialog/Dialog.d.ts.map +1 -0
  76. package/dist/primitives/Dialog/index.d.ts +3 -0
  77. package/dist/primitives/Dialog/index.d.ts.map +1 -0
  78. package/dist/primitives/P58Button.d.ts.map +1 -1
  79. package/dist/primitives/P58Card.d.ts.map +1 -1
  80. package/dist/primitives/P58Eyebrow.d.ts.map +1 -1
  81. package/dist/primitives/index.d.ts +1 -0
  82. package/dist/primitives/index.d.ts.map +1 -1
  83. package/dist/styles.css +1 -1
  84. package/package.json +14 -3
@@ -0,0 +1,18 @@
1
+ /**
2
+ * @path58/ui — input molecules (DSGN-2.7)
3
+ *
4
+ * Foundation: TextInput + useBlurOnEnterEscapeClickOut hook (2.7.1).
5
+ * Extensions land in 2.7.2 (NumberInput), 2.7.3 (MoneyInput), 2.7.4 (PercentInput).
6
+ */
7
+ export { TextInput } from './TextInput';
8
+ export type { TextInputProps, TextInputSize, TextInputType, } from './TextInput';
9
+ export { NumberInput } from './NumberInput';
10
+ export type { NumberInputProps, NumberInputSize, } from './NumberInput';
11
+ export { MoneyInput } from './MoneyInput';
12
+ export type { MoneyInputProps, MoneyInputSize, } from './MoneyInput';
13
+ export { PercentInput } from './PercentInput';
14
+ export type { PercentInputProps, PercentInputSize, } from './PercentInput';
15
+ export { useBlurOnEnterEscapeClickOut } from './useBlurOnEnterEscapeClickOut';
16
+ export type { UseBlurOnEnterEscapeClickOutOptions } from './useBlurOnEnterEscapeClickOut';
17
+ export { formatValue, parseNumber, clampAndStep } from './useNumericInputState';
18
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,cAAc,EACd,aAAa,EACb,aAAa,GACd,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EACV,gBAAgB,EAChB,eAAe,GAChB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EACV,eAAe,EACf,cAAc,GACf,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EACV,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAC9E,YAAY,EAAE,mCAAmC,EAAE,MAAM,gCAAgC,CAAC;AAG1F,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC"}
@@ -0,0 +1,29 @@
1
+ import type { FocusEvent, KeyboardEvent, RefObject } from 'react';
2
+ type InputLike = HTMLInputElement | HTMLTextAreaElement;
3
+ export interface UseBlurOnEnterEscapeClickOutOptions {
4
+ /** Fires on Enter blur OR click-outside blur (the "commit" path). */
5
+ onCommit?: () => void;
6
+ /** Fires on Escape blur (the "revert" path). */
7
+ onRevert?: () => void;
8
+ }
9
+ /**
10
+ * Wires Enter/Escape/click-out blur semantics for a controlled input.
11
+ *
12
+ * - Enter → preventDefault (avoid surrounding form submit) → blur → onCommit
13
+ * - Escape → blur → onRevert (caller restores the pre-focus snapshot via onChange)
14
+ * - Click-outside → native browser blur → onCommit (no override needed)
15
+ *
16
+ * The consumer wires the returned `onKeyDown` to the input AND the returned
17
+ * `onBlur` (composing with any consumer-side onBlur via the standard pattern).
18
+ *
19
+ * Esc semantics ratified blur+revert per Tsvika 2026-06-25 design discovery
20
+ * (matches Excel / Sheets / IDE convention; safer for accidental keystrokes).
21
+ *
22
+ * Genesis: REQ-2026-06-19-003 § Behavioral contract; DSGN-2.7.1 SPEC § 7.
23
+ */
24
+ export declare function useBlurOnEnterEscapeClickOut<T extends InputLike>(ref: RefObject<T>, options?: UseBlurOnEnterEscapeClickOutOptions): {
25
+ onKeyDown: (e: KeyboardEvent<T>) => void;
26
+ onBlur: (_e: FocusEvent<T>) => void;
27
+ };
28
+ export {};
29
+ //# sourceMappingURL=useBlurOnEnterEscapeClickOut.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useBlurOnEnterEscapeClickOut.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/useBlurOnEnterEscapeClickOut.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElE,KAAK,SAAS,GAAG,gBAAgB,GAAG,mBAAmB,CAAC;AAExD,MAAM,WAAW,mCAAmC;IAClD,qEAAqE;IACrE,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,4BAA4B,CAAC,CAAC,SAAS,SAAS,EAC9D,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,EACjB,OAAO,GAAE,mCAAwC;mBAM3C,aAAa,CAAC,CAAC,CAAC;iBAaf,UAAU,CAAC,CAAC,CAAC;EAYrB"}
@@ -0,0 +1,23 @@
1
+ import type { ChangeEvent, FocusEvent, RefObject } from 'react';
2
+ export declare function formatValue(value: number | null, locale: string): string;
3
+ export declare function parseNumber(raw: string): number | null;
4
+ export declare function clampAndStep(n: number | null, min: number | undefined, max: number | undefined, step: number): number | null;
5
+ export interface UseNumericInputStateOptions {
6
+ value: number | null;
7
+ onChange: (next: number | null) => void;
8
+ min?: number;
9
+ max?: number;
10
+ step: number;
11
+ locale: string;
12
+ inputRef: RefObject<HTMLInputElement>;
13
+ userOnFocus?: (e: FocusEvent<HTMLInputElement>) => void;
14
+ userOnBlur?: (e: FocusEvent<HTMLInputElement>) => void;
15
+ }
16
+ export declare function useNumericInputState(opts: UseNumericInputStateOptions): {
17
+ displayValue: string;
18
+ handleFocus: (e: FocusEvent<HTMLInputElement>) => void;
19
+ handleBlur: (e: FocusEvent<HTMLInputElement>) => void;
20
+ handleChange: (e: ChangeEvent<HTMLInputElement>) => void;
21
+ onKeyDown: (e: import("react").KeyboardEvent<HTMLInputElement>) => void;
22
+ };
23
+ //# sourceMappingURL=useNumericInputState.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useNumericInputState.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/useNumericInputState.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAchE,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAGxE;AAED,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAMtD;AAED,wBAAgB,YAAY,CAC1B,CAAC,EAAE,MAAM,GAAG,IAAI,EAChB,GAAG,EAAE,MAAM,GAAG,SAAS,EACvB,GAAG,EAAE,MAAM,GAAG,SAAS,EACvB,IAAI,EAAE,MAAM,GACX,MAAM,GAAG,IAAI,CAOf;AAED,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACxC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACtC,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxD,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACxD;AAED,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,2BAA2B;;qBAU9D,UAAU,CAAC,gBAAgB,CAAC;oBA0B5B,UAAU,CAAC,gBAAgB,CAAC;sBAOG,WAAW,CAAC,gBAAgB,CAAC;;EAWnE"}
@@ -0,0 +1,63 @@
1
+ import React from 'react';
2
+ import './Dialog.css';
3
+ export interface DialogProps {
4
+ /** Whether the dialog is open. Render is a no-op when false. */
5
+ open: boolean;
6
+ /** Called when the dialog should close (ESC, backdrop click, programmatic). */
7
+ onClose: () => void;
8
+ /** Content rendered inside the dialog surface. */
9
+ children: React.ReactNode;
10
+ /**
11
+ * Required: id of the element labelling this dialog. Pair with `<h2 id="...">`
12
+ * or similar inside `children`. Enables WCAG 4.1.2 "Name, Role, Value".
13
+ */
14
+ 'aria-labelledby': string;
15
+ /** Optional: id of the element describing this dialog (typically the body paragraph). */
16
+ 'aria-describedby'?: string;
17
+ /**
18
+ * Optional initial focus target. If omitted, focus-trap-react chooses the
19
+ * first focusable child. Pass a ref when the consumer wants explicit control
20
+ * (e.g. focusing an input when a Prompt opens).
21
+ */
22
+ initialFocus?: React.RefObject<HTMLElement>;
23
+ /** Whether ESC closes the dialog. Default true. */
24
+ closeOnEscape?: boolean;
25
+ /** Whether clicking the backdrop closes the dialog. Default true. */
26
+ closeOnBackdropClick?: boolean;
27
+ /** Whether to lock body scroll while open. Default true. */
28
+ lockScroll?: boolean;
29
+ /**
30
+ * Portal mount target. Default `document.body`. Override when the consumer
31
+ * has a dedicated portal-root (e.g. for stacking-context isolation in
32
+ * embedded surfaces). DSGN-1.5 / DSGN-2.8 integration risk: may need to
33
+ * override under their portal infrastructure — contract documented.
34
+ */
35
+ portalRoot?: HTMLElement;
36
+ /** Additional className applied to the backdrop. */
37
+ className?: string;
38
+ }
39
+ /**
40
+ * Dialog Primitive — DSGN-3.6.2
41
+ *
42
+ * Neutral overlay container. Brand-agnostic at the substrate level: renders
43
+ * correctly under any active theme via token-driven CSS — no per-theme
44
+ * branching. Composed by Modal / ConfirmDialog / PromptDialog (DSGN-3.6.3).
45
+ *
46
+ * Behaviour:
47
+ * - Portal-mounts to `portalRoot` (default `document.body`).
48
+ * - Focus-trap engages while `open=true` (via `focus-trap-react`).
49
+ * - On unmount, focus restores to the element that opened the dialog.
50
+ * - ESC closes (unless `closeOnEscape=false`).
51
+ * - Backdrop click closes (unless `closeOnBackdropClick=false`).
52
+ * - Body scroll locks while open (unless `lockScroll=false`).
53
+ *
54
+ * A11y:
55
+ * - `role="dialog"` + `aria-modal="true"` on the surface.
56
+ * - `aria-labelledby` is REQUIRED. Dev build emits a `console.warn` if missing.
57
+ * - `aria-describedby` is optional; route to the body paragraph's id.
58
+ *
59
+ * Token consumption: per DSGN-3.6.1 D1 (token-consumption-table.md) Dialog row.
60
+ */
61
+ export declare const Dialog: React.FC<DialogProps>;
62
+ export default Dialog;
63
+ //# sourceMappingURL=Dialog.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/primitives/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,WAAW;IAC1B,gEAAgE;IAChE,IAAI,EAAE,OAAO,CAAC;IACd,+EAA+E;IAC/E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kDAAkD;IAClD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,iBAAiB,EAAE,MAAM,CAAC;IAC1B,yFAAyF;IACzF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC5C,mDAAmD;IACnD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qEAAqE;IACrE,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,4DAA4D;IAC5D,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAuFxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
@@ -0,0 +1,3 @@
1
+ export { Dialog, type DialogProps } from './Dialog';
2
+ export { default } from './Dialog';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/Dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"P58Button.d.ts","sourceRoot":"","sources":["../../src/primitives/P58Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC5E,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC7B,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AA+CD;;;;;;GAMG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA2C9C,CAAC;AAEF,eAAe,SAAS,CAAC"}
1
+ {"version":3,"file":"P58Button.d.ts","sourceRoot":"","sources":["../../src/primitives/P58Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC5E,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC7B,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,2DAA2D;IAC3D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAmDD;;;;;;GAMG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA2C9C,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"P58Card.d.ts","sourceRoot":"","sources":["../../src/primitives/P58Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iDAAiD;IACjD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAMD;;;;;;GAMG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA0B1C,CAAC;AAEF,eAAe,OAAO,CAAC"}
1
+ {"version":3,"file":"P58Card.d.ts","sourceRoot":"","sources":["../../src/primitives/P58Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iDAAiD;IACjD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAMD;;;;;;GAMG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA+B1C,CAAC;AAEF,eAAe,OAAO,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"P58Eyebrow.d.ts","sourceRoot":"","sources":["../../src/primitives/P58Eyebrow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAahD,CAAC;AAEF,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"P58Eyebrow.d.ts","sourceRoot":"","sources":["../../src/primitives/P58Eyebrow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAchD,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -14,6 +14,7 @@ export { P58Button } from './P58Button';
14
14
  export { P58Card } from './P58Card';
15
15
  export { P58Eyebrow } from './P58Eyebrow';
16
16
  export { P58Metric } from './P58Metric';
17
+ export { Dialog, type DialogProps } from './Dialog';
17
18
  export type { P58IconProps } from './P58Icon';
18
19
  export type { P58ButtonProps, P58ButtonVariant, P58ButtonSize } from './P58Button';
19
20
  export type { P58CardProps } from './P58Card';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/primitives/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,YAAY,EAAE,cAAc,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACnF,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,YAAY,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/primitives/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAIxC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEpD,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,YAAY,EAAE,cAAc,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACnF,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,YAAY,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC"}
package/dist/styles.css CHANGED
@@ -1 +1 @@
1
- :root{--p58-bg: #0a0a1a;--p58-surface: #0e0e24;--p58-surface-2: #14142e;--p58-surface-3: #1b1b3a;--p58-fg-1: #f5f6fb;--p58-fg-2: #b8bad0;--p58-fg-3: #7b7e9c;--p58-fg-4: #4a4d6b;--p58-border: rgba(255, 255, 255, .08);--p58-border-strong: rgba(255, 255, 255, .14);--p58-border-subtle: rgba(255, 255, 255, .04);--p58-teal: #00d4aa;--p58-teal-hover: #1ee5bd;--p58-teal-press: #00b892;--p58-teal-dim: #00d4aa22;--p58-teal-glow: #00d4aa44;--p58-teal-text-on-light: #007a63;--p58-on-accent: #0d1d4d;--p58-accent-fg: var(--p58-teal);--p58-accent: var(--p58-teal);--p58-accent-hover: var(--p58-teal-hover);--p58-accent-press: var(--p58-teal-press);--p58-accent-dim: var(--p58-teal-dim);--p58-accent-glow: var(--p58-teal-glow);--p58-icon-accent-soft: color-mix(in srgb, var(--p58-teal) 70%, transparent);--p58-blue-50: #f8f8fa;--p58-blue-100: #eeeff3;--p58-blue-200: #e0e2e8;--p58-blue-300: #c7cbd6;--p58-blue-400: #adb2c2;--p58-blue-500: #9097ad;--p58-blue-600: #6e7794;--p58-blue-700: #4c587b;--p58-blue-800: #2c3a64;--p58-blue-900: #0d1d4d;--p58-lime: #9ab64a;--p58-lime-text-on-light: #5e8a23;--p58-lime-wash: rgba(154, 182, 74, .32);--p58-lime-300: #c7d79b;--p58-lime-700: #6c7f34;--p58-success: #00d4aa;--p58-success-dim: #00d4aa1a;--p58-warning: #f5a623;--p58-warning-dim: #f5a6231a;--p58-danger: #ff4757;--p58-danger-dim: #ff47571a;--p58-info: #5aa9ff;--p58-info-dim: #5aa9ff1a;--p58-trend-neutral: var(--p58-fg-2);--p58-trend-muted: var(--p58-fg-3);--p58-trend-negative: #ff4757;--p58-trend-positive: var(--p58-accent);--p58-viz-1: #00d4aa;--p58-viz-2: #5aa9ff;--p58-viz-3: #c084fc;--p58-viz-4: #f5a623;--p58-viz-5: #ff4757;--p58-viz-6: #7b7e9c;--p58-font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--p58-font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--p58-font-mono: "JetBrains Mono", ui-monospace, "Menlo", "Monaco", monospace;--p58-text-2xs: 10px;--p58-text-xs: 11px;--p58-text-sm: 12px;--p58-text-md: 13px;--p58-text-base:14px;--p58-text-lg: 16px;--p58-text-xl: 20px;--p58-text-2xl: 24px;--p58-text-3xl: 32px;--p58-text-4xl: 40px;--p58-text-5xl: 56px;--p58-text-6xl: 72px;--p58-weight-light: 300;--p58-weight-regular: 400;--p58-weight-medium: 500;--p58-weight-semibold:600;--p58-weight-bold: 700;--p58-leading-tight: 1.15;--p58-leading-snug: 1.3;--p58-leading-normal: 1.5;--p58-leading-loose: 1.7;--p58-tracking-tight: -.02em;--p58-tracking-normal: 0;--p58-tracking-wide: .04em;--p58-tracking-caps: .12em;--p58-space-0: 0;--p58-space-1: 4px;--p58-space-2: 8px;--p58-space-3: 12px;--p58-space-4: 16px;--p58-space-5: 20px;--p58-space-6: 24px;--p58-space-8: 32px;--p58-space-10: 40px;--p58-space-12: 48px;--p58-space-16: 64px;--p58-space-20: 80px;--p58-space-24: 96px;--p58-radius-none: 0;--p58-radius-sm: 2px;--p58-radius-md: 4px;--p58-radius-lg: 6px;--p58-radius-xl: 10px;--p58-radius-full: 999px;--p58-elev-1-bg: #0e0e24;--p58-elev-1-border: rgba(255, 255, 255, .08);--p58-elev-2-bg: #13132f;--p58-elev-2-border: rgba(255, 255, 255, .15);--p58-elev-3-bg: #16163a;--p58-elev-3-border: rgba(255, 255, 255, .22);--p58-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .03);--p58-glow-accent: 0 0 0 1px var(--p58-accent), 0 0 16px var(--p58-accent-glow);--p58-ring-focus: 0 0 0 2px var(--p58-bg), 0 0 0 4px var(--p58-accent);--p58-ease: cubic-bezier(.2, .6, .2, 1);--p58-ease-in: cubic-bezier(.4, 0, 1, 1);--p58-duration-fast: .12s;--p58-duration-base: .18s;--p58-duration-slow: .26s;--p58-z-base: 1;--p58-z-sticky: 10;--p58-z-dropdown:100;--p58-z-modal: 1000;--p58-z-toast: 2000;--p58-brand-3p-react: #61DAFB;--p58-brand-3p-react-hover: #4DD0E1;--p58-brand-3p-html5: #E34F26;--p58-brand-3p-html5-hover: #F06529}html,body{background:var(--p58-bg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);line-height:var(--p58-leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.p58-h1,h1.p58{font-family:var(--p58-font-display);font-size:var(--p58-text-5xl);font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h2,h2.p58{font-family:var(--p58-font-display);font-size:var(--p58-text-3xl);font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h3,h3.p58{font-family:var(--p58-font-display);font-size:var(--p58-text-2xl);font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-h4,h4.p58{font-family:var(--p58-font-display);font-size:var(--p58-text-xl);font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-body{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:var(--p58-weight-regular);line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-body-lg{font-family:var(--p58-font-ui);font-size:var(--p58-text-lg);line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-small{font-size:var(--p58-text-sm);color:var(--p58-fg-3)}.p58-eyebrow{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-weight:var(--p58-weight-medium);text-transform:uppercase;letter-spacing:var(--p58-tracking-caps);color:var(--p58-fg-3)}.p58-code,code.p58,kbd.p58{font-family:var(--p58-font-mono);font-size:.92em;color:var(--p58-fg-1);background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-sm);padding:1px 5px}.p58-metric{font-family:var(--p58-font-mono);font-size:var(--p58-text-4xl);font-weight:var(--p58-weight-medium);line-height:1;letter-spacing:-.01em;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-metric-sm{font-family:var(--p58-font-mono);font-size:var(--p58-text-xl);font-weight:var(--p58-weight-medium);line-height:1;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-scroll::-webkit-scrollbar{width:10px;height:10px}.p58-scroll::-webkit-scrollbar-track{background:transparent}.p58-scroll::-webkit-scrollbar-thumb{background:var(--p58-border-strong);border-radius:var(--p58-radius-full);border:2px solid var(--p58-bg)}.p58-scroll::-webkit-scrollbar-thumb:hover{background:var(--p58-fg-4)}::selection{background:var(--p58-accent-dim);color:var(--p58-fg-1)}.p58-trend,.p58-trend-neutral,.p58-trend-negative,.p58-trend-positive{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:4px;line-height:1}.p58-trend,.p58-trend-neutral{color:var(--p58-trend-neutral)}.p58-trend-negative{color:var(--p58-trend-negative)}.p58-trend-positive{color:var(--p58-trend-positive)}.p58-trend-muted{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:var(--p58-text-xs)}.p58-trend-baseline{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-left:2px}.path58-scrollbar{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable;padding-right:8px}.path58-scrollbar::-webkit-scrollbar{width:8px!important;height:8px!important;-webkit-appearance:none!important;display:block!important}.path58-scrollbar::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;margin:2px 0;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-scrollbar::-webkit-scrollbar:horizontal{height:8px!important}.path58-scrollbar::-webkit-scrollbar-track:horizontal{margin:0 2px}.path58-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s;outline:none;font-family:inherit}.path58-button:focus-visible{outline:2px solid color-mix(in srgb,var(--p58-teal) 50%,transparent);outline-offset:2px}.path58-button:disabled{opacity:.5;cursor:not-allowed}.path58-button--sm{padding:.375rem .75rem;font-size:.75rem;min-height:28px}.path58-button--md{padding:.5rem 1rem;font-size:.875rem;min-height:36px}.path58-button--lg{padding:.75rem 1.5rem;font-size:1rem;min-height:44px}.path58-button--primary{background:color-mix(in srgb,var(--p58-teal) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);color:var(--p58-accent-fg)}.path58-button--primary:hover:not(:disabled){background:color-mix(in srgb,var(--p58-teal) 25%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)}.path58-button--secondary{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-button--secondary:hover:not(:disabled){background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 30%,transparent);color:var(--p58-fg-1)}.path58-button--ghost{background:transparent;border:1px solid transparent;color:var(--p58-fg-3)}.path58-button--ghost:hover:not(:disabled){background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 10%,transparent);color:var(--p58-fg-2)}.path58-button--danger{background:color-mix(in srgb,var(--p58-danger) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-danger) 30%,transparent);color:var(--p58-danger)}.path58-button--danger:hover:not(:disabled){background:color-mix(in srgb,var(--p58-danger) 25%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-button--with-icon{gap:.5rem}.path58-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-button-text{flex:1;text-align:center}.path58-input{width:100%;padding:.625rem .75rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:6px;color:var(--p58-fg-1);font-size:.875rem;outline:none;transition:all .2s;font-family:inherit}.path58-input::placeholder{color:var(--p58-fg-4)}.path58-input:focus{border-color:var(--p58-accent-fg);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-teal) 10%,transparent);background:color-mix(in srgb,var(--p58-bg) 50%,transparent)}.path58-input:disabled{opacity:.5;cursor:not-allowed}.path58-input--search{padding:.625rem 2.5rem .625rem .75rem}.path58-input--error{border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-input--error:focus{border-color:var(--p58-danger);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-danger) 10%,transparent)}.path58-badge{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .75rem;border-radius:6px;font-size:.75rem;font-weight:400;transition:all .2s;cursor:default}.path58-badge--tag{background:transparent;border:1px solid;color:inherit;cursor:pointer}.path58-badge--tag:hover{opacity:.8;transform:translateY(-1px);box-shadow:0 2px 4px color-mix(in srgb,var(--p58-bg) 20%,transparent)}.path58-badge--tag.path58-badge--active{font-weight:600;box-shadow:0 2px 8px color-mix(in srgb,var(--p58-bg) 30%,transparent)}.path58-badge--filter{display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .5rem;background:color-mix(in srgb,var(--p58-teal) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:4px;font-size:.75rem;color:var(--p58-accent-fg)}.path58-badge--default{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.path58-icon--html{color:var(--p58-brand-3p-html5)}.path58-icon--html:hover{color:var(--p58-brand-3p-html5-hover)}.path58-icon--tsx{color:var(--p58-brand-3p-react)}.path58-icon--tsx:hover{color:var(--p58-brand-3p-react-hover)}.path58-icon--primary{color:var(--p58-accent-fg)}.path58-icon--default{color:var(--p58-fg-3)}.path58-icon-container{display:flex;align-items:center;justify-content:center;border-radius:6px;flex-shrink:0}.path58-icon-container--sm{width:24px;height:24px}.path58-icon-container--md{width:32px;height:32px}.path58-icon-container--lg{width:40px;height:40px}.path58-icon-container--default{background:color-mix(in srgb,var(--p58-teal) 6%,transparent);color:var(--p58-icon-accent-soft)}.path58-icon-container--primary{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-accent-fg)}.path58-icon-container--html{background:color-mix(in srgb,var(--p58-brand-3p-html5) 15%,transparent);color:var(--p58-brand-3p-html5)}.path58-icon-container--tsx{background:color-mix(in srgb,var(--p58-brand-3p-react) 15%,transparent);color:var(--p58-brand-3p-react)}.path58-label{display:flex;align-items:center;gap:.5rem;font-weight:500}.path58-label--section{font-size:.75rem;font-weight:600;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em}.path58-label--section .path58-label-icon,.path58-label--section .path58-label-text{color:var(--p58-accent-fg)}.path58-label--card{font-size:.625rem;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.path58-label--default{font-size:.875rem;color:var(--p58-fg-2)}.path58-label-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-label-text{flex:1}.path58-container{display:flex;flex-direction:column;border-radius:8px}.path58-container--section{padding:.875rem;background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);gap:.75rem}.path58-container--card{padding:.875rem 1rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 12%,transparent);min-width:120px;min-height:56px;transition:all .2s}.path58-container--card:hover{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-bg) 40%,transparent);transform:translateY(-2px);box-shadow:0 4px 12px color-mix(in srgb,var(--p58-teal) 15%,transparent)}.path58-container--default{padding:1rem;background:transparent}.path58-list{display:flex;overflow-y:auto;overflow-x:hidden;min-height:0;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable}.path58-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-list--vertical{flex-direction:column;padding:.5rem}.path58-list--horizontal{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:.5rem}.path58-list--wrap{flex-wrap:wrap;gap:.375rem;padding:0}.path58-list-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--p58-fg-2);cursor:pointer;font-size:.8125rem;font-weight:400;text-align:left;transition:all .2s;text-transform:none;letter-spacing:normal}.path58-list-item:hover{background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-1)}.path58-list-item--selected{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border-color:var(--p58-accent-fg);color:var(--p58-accent-fg);font-weight:500}.path58-search-input{position:relative;display:flex;align-items:center;width:100%}.path58-search-input .path58-input{width:100%;padding-right:2.5rem}.path58-search-input-clear{position:absolute;right:.5rem;background:transparent;border:none;color:var(--p58-fg-3);padding:.25rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.path58-search-input-clear:hover{color:var(--p58-fg-1);background:color-mix(in srgb,var(--p58-fg-1) 10%,transparent)}.path58-info-card{display:flex;align-items:center;gap:.75rem;position:relative;margin-top:.25rem}.path58-info-card-content{display:flex;flex-direction:column;gap:.125rem;min-width:0;flex:1}.path58-info-card-value{font-size:.9375rem;color:var(--p58-fg-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path58-info-card-value{display:flex;flex-wrap:wrap;gap:.25rem}.path58-info-card--filters{border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent)}.path58-info-card--selected{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-teal) 3%,transparent)}.path58-info-card--category{transition:all .2s}.path58-info-card--clickable{cursor:pointer}.path58-category-header{width:100%;display:flex;align-items:center;gap:.5rem;padding:.75rem;background:color-mix(in srgb,var(--p58-teal) 8%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 15%,transparent);color:var(--p58-accent-fg);cursor:pointer;border-radius:6px;font-size:.875rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;transition:all .2s;margin-bottom:.25rem}.path58-category-header svg{color:var(--p58-accent-fg)}.path58-category-header:hover{background:color-mix(in srgb,var(--p58-teal) 12%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);color:var(--p58-accent-fg)}.path58-category-name{flex:1;text-align:left}.path58-category-count{color:var(--p58-fg-3);font-weight:400}.path58-category-chevron{transition:transform .2s}.path58-category-chevron--expanded{transform:rotate(90deg)}.path58-file-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.path58-search-input-wrapper{position:relative;display:flex;align-items:center;width:100%}.path58-tag-filter{display:flex;flex-direction:column;gap:.5rem;min-width:200px;height:110px;max-height:110px;overflow-y:scroll;overflow-x:hidden;position:relative;padding-right:0}.path58-tag-filter-header{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--p58-accent-fg);flex-shrink:0}.path58-tag-filter-clear{margin-left:auto}.path58-tag-filter-list{flex:1;min-height:0}.path58-tag-filter-scroll-hint{padding:.25rem .5rem;font-size:.625rem;color:var(--p58-fg-3);text-align:center;font-style:italic;border-top:1px solid color-mix(in srgb,var(--p58-teal) 10%,transparent);margin-top:.25rem;flex-shrink:0}.path58-category-group{margin-bottom:.5rem}.path58-category-file-list{display:flex;flex-direction:column;gap:.25rem;padding-left:.5rem}.path58-artifact-list.path58-list{flex:1 1 0!important;min-height:0!important;overflow-y:scroll!important;overflow-x:hidden!important;scrollbar-width:thin!important;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;scrollbar-gutter:stable!important;-webkit-overflow-scrolling:touch;padding:.5rem!important;display:flex!important;flex-direction:column!important;height:100%!important}.path58-artifact-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-artifact-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}
1
+ :root{--p58-bg: #0a0a1a;--p58-surface: #0e0e24;--p58-surface-2: #14142e;--p58-surface-3: #1b1b3a;--p58-fg-1: #f5f6fb;--p58-fg-2: #b8bad0;--p58-fg-3: #7b7e9c;--p58-fg-4: #4a4d6b;--p58-border: rgba(255, 255, 255, .08);--p58-border-strong: rgba(255, 255, 255, .14);--p58-border-subtle: rgba(255, 255, 255, .04);--p58-overlay-backdrop: color-mix(in srgb, var(--p58-bg) 65%, transparent);--p58-surface-disabled: color-mix(in srgb, var(--p58-surface-2) 60%, var(--p58-bg) 40%);--p58-teal: #00d4aa;--p58-teal-hover: #1ee5bd;--p58-teal-press: #00b892;--p58-teal-dim: #00d4aa22;--p58-teal-glow: #00d4aa44;--p58-teal-text-on-light: #007a63;--p58-on-accent: #0d1d4d;--p58-accent-fg: var(--p58-teal);--p58-accent: var(--p58-teal);--p58-accent-hover: var(--p58-teal-hover);--p58-accent-press: var(--p58-teal-press);--p58-accent-dim: var(--p58-teal-dim);--p58-accent-glow: var(--p58-teal-glow);--p58-icon-accent-soft: color-mix(in srgb, var(--p58-teal) 70%, transparent);--p58-accent-tint: color-mix(in srgb, var(--p58-teal) 12%, transparent);--p58-primary: var(--p58-teal);--p58-primary-hover: var(--p58-teal-hover);--p58-primary-press: var(--p58-teal-press);--p58-primary-fg: var(--p58-on-accent);--p58-blue-50: #f8f8fa;--p58-blue-100: #eeeff3;--p58-blue-200: #e0e2e8;--p58-blue-300: #c7cbd6;--p58-blue-400: #adb2c2;--p58-blue-500: #9097ad;--p58-blue-600: #6e7794;--p58-blue-700: #4c587b;--p58-blue-800: #2c3a64;--p58-blue-900: #0d1d4d;--p58-lime: #9ab64a;--p58-lime-text-on-light: #5e8a23;--p58-lime-wash: rgba(154, 182, 74, .32);--p58-lime-300: #c7d79b;--p58-lime-700: #6c7f34;--p58-axe-accent: #a78bfa;--p58-axe-accent-hover: #baa5fb;--p58-axe-accent-press: #967de1;--p58-axe-accent-dim: color-mix(in srgb, #a78bfa 13%, transparent);--p58-axe-accent-glow: color-mix(in srgb, #a78bfa 27%, transparent);--p58-success-axe: #4ade80;--p58-success-axe-dim: color-mix(in srgb, #4ade80 14%, transparent);--p58-axe-density-card-padding: 14px 16px;--p58-axe-density-tile-padding: 10px 12px;--p58-axe-density-grid-gap: 8px;--p58-axe-density-section-gap: 14px;--p58-axe-density-row-height: 28px;--p58-axe-density-tile-value-fontsize: 18px;--p58-axe-density-tile-label-fontsize: 10.5px;--p58-axe-density-mono-letter-spacing: .005em;--p58-success: #00d4aa;--p58-success-dim: #00d4aa1a;--p58-warning: #f5a623;--p58-warning-dim: #f5a6231a;--p58-danger: #ff4757;--p58-danger-dim: #ff47571a;--p58-info: #5aa9ff;--p58-info-dim: #5aa9ff1a;--p58-trend-neutral: var(--p58-fg-2);--p58-trend-muted: var(--p58-fg-3);--p58-trend-negative: #ff4757;--p58-trend-positive: var(--p58-accent);--p58-viz-1: #00d4aa;--p58-viz-2: #5aa9ff;--p58-viz-3: #c084fc;--p58-viz-4: #f5a623;--p58-viz-5: #ff4757;--p58-viz-6: #7b7e9c;--p58-font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--p58-font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;--p58-font-mono: "JetBrains Mono", ui-monospace, "Menlo", "Monaco", monospace;--p58-text-2xs: 10px;--p58-text-xs: 11px;--p58-text-sm: 12px;--p58-text-md: 13px;--p58-text-base:14px;--p58-text-lg: 16px;--p58-text-xl: 20px;--p58-text-2xl: 24px;--p58-text-3xl: 32px;--p58-text-4xl: 40px;--p58-text-5xl: 56px;--p58-text-6xl: 72px;--p58-weight-light: 300;--p58-weight-regular: 400;--p58-weight-medium: 500;--p58-weight-semibold:600;--p58-weight-bold: 700;--p58-leading-tight: 1.15;--p58-leading-snug: 1.3;--p58-leading-normal: 1.5;--p58-leading-loose: 1.7;--p58-tracking-tight: -.02em;--p58-tracking-normal: 0;--p58-tracking-wide: .04em;--p58-tracking-caps: .12em;--p58-space-0: 0;--p58-space-1: 4px;--p58-space-2: 8px;--p58-space-3: 12px;--p58-space-4: 16px;--p58-space-5: 20px;--p58-space-6: 24px;--p58-space-8: 32px;--p58-space-10: 40px;--p58-space-12: 48px;--p58-space-16: 64px;--p58-space-20: 80px;--p58-space-24: 96px;--p58-radius-none: 0;--p58-radius-sm: 2px;--p58-radius-md: 4px;--p58-radius-lg: 6px;--p58-radius-xl: 10px;--p58-radius-full: 999px;--p58-elev-1-bg: #0e0e24;--p58-elev-1-border: rgba(255, 255, 255, .08);--p58-elev-2-bg: #13132f;--p58-elev-2-border: rgba(255, 255, 255, .15);--p58-elev-3-bg: #16163a;--p58-elev-3-border: rgba(255, 255, 255, .22);--p58-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .03);--p58-glow-accent: 0 0 0 1px var(--p58-accent), 0 0 16px var(--p58-accent-glow);--p58-ring-focus: 0 0 0 2px var(--p58-bg), 0 0 0 4px var(--p58-accent);--p58-ease: cubic-bezier(.2, .6, .2, 1);--p58-ease-in: cubic-bezier(.4, 0, 1, 1);--p58-duration-fast: .12s;--p58-duration-base: .18s;--p58-duration-slow: .26s;--p58-z-base: 1;--p58-z-sticky: 10;--p58-z-dropdown:100;--p58-z-modal: 1000;--p58-z-toast: 2000;--p58-brand-3p-react: #61DAFB;--p58-brand-3p-react-hover: #4DD0E1;--p58-brand-3p-html5: #E34F26;--p58-brand-3p-html5-hover: #F06529}html,body{background:var(--p58-bg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);line-height:var(--p58-leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.p58-h1,h1.p58{font-family:var(--p58-font-display);font-size:clamp(28px,2.2vw + 16px,var(--p58-text-5xl));font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h2,h2.p58{font-family:var(--p58-font-display);font-size:clamp(22px,1.2vw + 16px,var(--p58-text-3xl));font-weight:var(--p58-weight-semibold);line-height:var(--p58-leading-tight);letter-spacing:var(--p58-tracking-tight);color:var(--p58-fg-1)}.p58-h3,h3.p58{font-family:var(--p58-font-display);font-size:clamp(17px,.8vw + 14px,var(--p58-text-2xl));font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-h4,h4.p58{font-family:var(--p58-font-display);font-size:clamp(16px,.5vw + 14px,var(--p58-text-xl));font-weight:var(--p58-weight-medium);line-height:var(--p58-leading-snug);color:var(--p58-fg-1)}.p58-body{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:var(--p58-weight-regular);line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-body-lg{font-family:var(--p58-font-ui);font-size:clamp(15px,.2vw + 13px,var(--p58-text-lg));line-height:var(--p58-leading-normal);color:var(--p58-fg-2)}.p58-small{font-size:var(--p58-text-sm);color:var(--p58-fg-3)}.p58-eyebrow{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-weight:var(--p58-weight-medium);text-transform:uppercase;letter-spacing:var(--p58-tracking-caps);color:var(--p58-fg-3)}.p58-code,code.p58,kbd.p58{font-family:var(--p58-font-mono);font-size:.92em;color:var(--p58-fg-1);background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-sm);padding:1px 5px}.p58-metric{font-family:var(--p58-font-mono);font-size:var(--p58-text-4xl);font-weight:var(--p58-weight-medium);line-height:1;letter-spacing:-.01em;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-metric-sm{font-family:var(--p58-font-mono);font-size:var(--p58-text-xl);font-weight:var(--p58-weight-medium);line-height:1;color:var(--p58-fg-1);font-variant-numeric:tabular-nums}.p58-scroll::-webkit-scrollbar{width:10px;height:10px}.p58-scroll::-webkit-scrollbar-track{background:transparent}.p58-scroll::-webkit-scrollbar-thumb{background:var(--p58-border-strong);border-radius:var(--p58-radius-full);border:2px solid var(--p58-bg)}.p58-scroll::-webkit-scrollbar-thumb:hover{background:var(--p58-fg-4)}::selection{background:var(--p58-accent-dim);color:var(--p58-fg-1)}.p58-trend,.p58-trend-neutral,.p58-trend-negative,.p58-trend-positive{font-family:var(--p58-font-mono);font-size:var(--p58-text-xs);font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:4px;line-height:1}.p58-trend,.p58-trend-neutral{color:var(--p58-trend-neutral)}.p58-trend-negative{color:var(--p58-trend-negative)}.p58-trend-positive{color:var(--p58-trend-positive)}.p58-trend-muted{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:var(--p58-text-xs)}.p58-trend-baseline{color:var(--p58-trend-muted);font-family:var(--p58-font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-left:2px}.path58-scrollbar{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable;padding-right:8px}.path58-scrollbar::-webkit-scrollbar{width:8px!important;height:8px!important;-webkit-appearance:none!important;display:block!important}.path58-scrollbar::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;margin:2px 0;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-scrollbar::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-scrollbar::-webkit-scrollbar:horizontal{height:8px!important}.path58-scrollbar::-webkit-scrollbar-track:horizontal{margin:0 2px}.path58-button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s;outline:none;font-family:inherit}.path58-button:focus-visible{outline:2px solid color-mix(in srgb,var(--p58-primary) 50%,transparent);outline-offset:2px}.path58-button:disabled{opacity:.5;cursor:not-allowed}.path58-button--sm{padding:.375rem .75rem;font-size:.75rem;min-height:28px}.path58-button--md{padding:.5rem 1rem;font-size:.875rem;min-height:36px}.path58-button--lg{padding:.75rem 1.5rem;font-size:1rem;min-height:44px}.path58-button--primary{background:var(--p58-primary);border:1px solid var(--p58-primary);color:var(--p58-primary-fg)}.path58-button--primary:hover:not(:disabled){background:var(--p58-primary-hover);border-color:var(--p58-primary-hover)}.path58-button--primary:active:not(:disabled){background:var(--p58-primary-press);border-color:var(--p58-primary-press)}.path58-button--secondary{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-button--secondary:hover:not(:disabled){background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 30%,transparent);color:var(--p58-fg-1)}.path58-button--ghost{background:transparent;border:1px solid transparent;color:var(--p58-fg-3)}.path58-button--ghost:hover:not(:disabled){background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 10%,transparent);color:var(--p58-fg-2)}.path58-button--danger{background:color-mix(in srgb,var(--p58-danger) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-danger) 30%,transparent);color:var(--p58-danger)}.path58-button--danger:hover:not(:disabled){background:color-mix(in srgb,var(--p58-danger) 25%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-button--with-icon{gap:.5rem}.path58-button-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-button-text{flex:1;text-align:center}.path58-input{width:100%;padding:.625rem .75rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:6px;color:var(--p58-fg-1);font-size:.875rem;outline:none;transition:all .2s;font-family:inherit}.path58-input:focus{border-color:var(--p58-accent-fg);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-teal) 10%,transparent);background:color-mix(in srgb,var(--p58-bg) 50%,transparent)}.path58-input:disabled{opacity:.5;cursor:not-allowed}.path58-input--search{padding:.625rem 2.5rem .625rem .75rem}.path58-input--error{border-color:color-mix(in srgb,var(--p58-danger) 50%,transparent)}.path58-input--error:focus{border-color:var(--p58-danger);box-shadow:0 0 0 2px color-mix(in srgb,var(--p58-danger) 10%,transparent)}.path58-badge{display:inline-flex;align-items:center;justify-content:center;padding:.375rem .75rem;border-radius:6px;font-size:.75rem;font-weight:400;transition:all .2s;cursor:default}.path58-badge--tag{background:transparent;border:1px solid;color:inherit;cursor:pointer}.path58-badge--tag:hover{opacity:.8;transform:translateY(-1px);box-shadow:0 2px 4px color-mix(in srgb,var(--p58-bg) 20%,transparent)}.path58-badge--tag.path58-badge--active{font-weight:600;box-shadow:0 2px 8px color-mix(in srgb,var(--p58-bg) 30%,transparent)}.path58-badge--filter{display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .5rem;background:color-mix(in srgb,var(--p58-teal) 15%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent);border-radius:4px;font-size:.75rem;color:var(--p58-accent-fg)}.path58-badge--default{background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-2)}.path58-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}.path58-icon--html{color:var(--p58-brand-3p-html5)}.path58-icon--html:hover{color:var(--p58-brand-3p-html5-hover)}.path58-icon--tsx{color:var(--p58-brand-3p-react)}.path58-icon--tsx:hover{color:var(--p58-brand-3p-react-hover)}.path58-icon--primary{color:var(--p58-accent-fg)}.path58-icon--default{color:var(--p58-fg-3)}.path58-icon-container{display:flex;align-items:center;justify-content:center;border-radius:6px;flex-shrink:0}.path58-icon-container--sm{width:24px;height:24px}.path58-icon-container--md{width:32px;height:32px}.path58-icon-container--lg{width:40px;height:40px}.path58-icon-container--default{background:color-mix(in srgb,var(--p58-teal) 6%,transparent);color:var(--p58-icon-accent-soft)}.path58-icon-container--primary{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-accent-fg)}.path58-icon-container--html{background:color-mix(in srgb,var(--p58-brand-3p-html5) 15%,transparent);color:var(--p58-brand-3p-html5)}.path58-icon-container--tsx{background:color-mix(in srgb,var(--p58-brand-3p-react) 15%,transparent);color:var(--p58-brand-3p-react)}.path58-label{display:flex;align-items:center;gap:.5rem;font-weight:500}.path58-label--section{font-size:.75rem;font-weight:600;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em}.path58-label--section .path58-label-icon,.path58-label--section .path58-label-text{color:var(--p58-accent-fg)}.path58-label--card{font-size:.625rem;color:var(--p58-fg-3);text-transform:uppercase;letter-spacing:.05em;font-weight:500}.path58-label--default{font-size:.875rem;color:var(--p58-fg-2)}.path58-label-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}.path58-label-text{flex:1}.path58-container{display:flex;flex-direction:column;border-radius:8px}.path58-container--section{padding:.875rem;background:color-mix(in srgb,var(--p58-bg) 40%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent);gap:.75rem}.path58-container--card{padding:.875rem 1rem;background:color-mix(in srgb,var(--p58-bg) 30%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 12%,transparent);min-width:120px;min-height:56px;transition:all .2s}.path58-container--card:hover{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-bg) 40%,transparent);transform:translateY(-2px);box-shadow:0 4px 12px color-mix(in srgb,var(--p58-teal) 15%,transparent)}.path58-container--default{padding:1rem;background:transparent}.path58-list{display:flex;overflow-y:auto;overflow-x:hidden;min-height:0;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent);scrollbar-gutter:stable}.path58-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-list--vertical{flex-direction:column;padding:.5rem}.path58-list--horizontal{flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:.5rem}.path58-list--wrap{flex-wrap:wrap;gap:.375rem;padding:0}.path58-list-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--p58-fg-2);cursor:pointer;font-size:.8125rem;font-weight:400;text-align:left;transition:all .2s;text-transform:none;letter-spacing:normal}.path58-list-item:hover{background:color-mix(in srgb,var(--p58-teal) 5%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent);color:var(--p58-fg-1)}.path58-list-item--selected{background:color-mix(in srgb,var(--p58-teal) 10%,transparent);border-color:var(--p58-accent-fg);color:var(--p58-accent-fg);font-weight:500}.p58-section{padding-top:72px;padding-bottom:72px}.p58-section--bordered{border-top:1px solid var(--p58-border-subtle)}.p58-section--first{border-top:0}@media (max-width: 768px){.p58-section{padding-top:48px;padding-bottom:48px}}@media (max-width: 600px){.p58-section{padding-top:40px;padding-bottom:40px}}.p58-grid{display:grid;gap:var(--p58-grid-gap, 20px)}.p58-grid--cols-2{grid-template-columns:repeat(2,1fr)}.p58-grid--cols-3{grid-template-columns:repeat(3,1fr)}.p58-grid--cols-4{grid-template-columns:repeat(4,1fr)}.p58-grid--gap-sm{--p58-grid-gap: 12px}.p58-grid--gap-lg{--p58-grid-gap: 32px}@media (max-width: 880px){.p58-grid--cols-3,.p58-grid--cols-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.p58-grid--cols-2,.p58-grid--cols-3,.p58-grid--cols-4{grid-template-columns:1fr}}.p58-money-moment{font-family:var(--p58-font-display);font-weight:600;color:var(--p58-fg-1);background-image:linear-gradient(180deg,transparent 65%,var(--p58-lime-wash) 65%);padding:0 4px;font-feature-settings:"tnum" 1,"lnum" 1}.p58-catchphrase{color:var(--p58-fg-3);font-weight:500;letter-spacing:.02em;font-size:12px}.p58-link{color:var(--p58-fg-1);text-decoration:none;border-bottom:1px solid var(--p58-fg-1);padding-bottom:1px;transition:opacity .12s ease}.p58-link:hover{opacity:.7}.p58-link:focus-visible{outline:none;box-shadow:var(--p58-ring-focus);border-radius:var(--p58-radius-sm)}.path58-toast{display:flex;align-items:flex-start;gap:var(--p58-space-3);background:var(--p58-surface-2);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left:4px solid var(--p58-border-strong);border-radius:var(--p58-radius-lg);padding:var(--p58-space-3) var(--p58-space-4);min-width:280px;max-width:420px;animation:path58-toast-slide-in .2s ease-out;pointer-events:auto}.path58-toast__message{flex:1;min-width:0;color:var(--p58-fg-1);font-size:.875rem;line-height:1.5;word-break:break-word}.path58-toast__action{flex-shrink:0}.path58-toast__dismiss{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:32px;min-height:32px;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-toast__dismiss:hover{color:var(--p58-fg-1)}.path58-toast__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-toast--success{border-left-color:var(--p58-success)}.path58-toast--warning{border-left-color:var(--p58-warning)}.path58-toast--danger{border-left-color:var(--p58-danger)}.path58-toast--info{border-left-color:var(--p58-info)}@keyframes path58-toast-slide-in{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:translate(0)}}@media (prefers-reduced-motion: reduce){.path58-toast{animation:none}}.path58-banner{display:flex;align-items:flex-start;gap:var(--p58-space-3);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left-width:4px;border-radius:var(--p58-radius-lg);padding:var(--p58-space-4);font-size:.9375rem;line-height:1.5}.path58-banner__icon{flex-shrink:0;display:inline-flex;align-items:center;margin-top:2px}.path58-banner__content{flex:1;min-width:0}.path58-banner__title{font-weight:500;color:var(--p58-fg-1);margin-bottom:var(--p58-space-1)}.path58-banner__message{color:var(--p58-fg-2);word-break:break-word}.path58-banner__action{flex-shrink:0}.path58-banner__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:44px;min-height:44px;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-banner__dismiss:hover{color:var(--p58-fg-1)}.path58-banner__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-banner--success{background:color-mix(in srgb,var(--p58-success) 12%,transparent);border-color:color-mix(in srgb,var(--p58-success) 30%,transparent);border-left-color:var(--p58-success)}.path58-banner--success .path58-banner__icon{color:var(--p58-success)}.path58-banner--warning{background:color-mix(in srgb,var(--p58-warning) 12%,transparent);border-color:color-mix(in srgb,var(--p58-warning) 30%,transparent);border-left-color:var(--p58-warning)}.path58-banner--warning .path58-banner__icon{color:var(--p58-warning)}.path58-banner--danger{background:color-mix(in srgb,var(--p58-danger) 12%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 30%,transparent);border-left-color:var(--p58-danger)}.path58-banner--danger .path58-banner__icon{color:var(--p58-danger)}.path58-banner--info{background:color-mix(in srgb,var(--p58-info) 12%,transparent);border-color:color-mix(in srgb,var(--p58-info) 30%,transparent);border-left-color:var(--p58-info)}.path58-banner--info .path58-banner__icon{color:var(--p58-info)}.path58-banner--sticky-top{position:sticky;top:0;z-index:200;border-radius:0}.path58-alert{display:flex;align-items:flex-start;gap:var(--p58-space-2);color:var(--p58-fg-1);border:1px solid var(--p58-border);border-left-width:3px;border-radius:var(--p58-radius-md);line-height:1.5}.path58-alert__icon{flex-shrink:0;display:inline-flex;align-items:center}.path58-alert__content{flex:1;min-width:0}.path58-alert__title{font-weight:500;color:var(--p58-fg-1)}.path58-alert__message{color:var(--p58-fg-2);word-break:break-word}.path58-alert__dismiss{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--p58-fg-3);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out;flex-shrink:0}.path58-alert__dismiss:hover{color:var(--p58-fg-1)}.path58-alert__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-alert--md{padding:var(--p58-space-3) var(--p58-space-4);font-size:.875rem;gap:var(--p58-space-3)}.path58-alert--md .path58-alert__icon{margin-top:2px}.path58-alert--md .path58-alert__dismiss{width:24px;height:24px;min-width:32px;min-height:32px}.path58-alert--sm{padding:var(--p58-space-2) var(--p58-space-3);font-size:.8125rem;gap:var(--p58-space-2)}.path58-alert--sm .path58-alert__icon{margin-top:1px}.path58-alert--sm .path58-alert__dismiss{width:20px;height:20px;min-width:28px;min-height:28px}.path58-alert--success{background:color-mix(in srgb,var(--p58-success) 10%,transparent);border-color:color-mix(in srgb,var(--p58-success) 28%,transparent);border-left-color:var(--p58-success)}.path58-alert--success .path58-alert__icon{color:var(--p58-success)}.path58-alert--warning{background:color-mix(in srgb,var(--p58-warning) 10%,transparent);border-color:color-mix(in srgb,var(--p58-warning) 28%,transparent);border-left-color:var(--p58-warning)}.path58-alert--warning .path58-alert__icon{color:var(--p58-warning)}.path58-alert--danger{background:color-mix(in srgb,var(--p58-danger) 10%,transparent);border-color:color-mix(in srgb,var(--p58-danger) 28%,transparent);border-left-color:var(--p58-danger)}.path58-alert--danger .path58-alert__icon{color:var(--p58-danger)}.path58-alert--info{background:color-mix(in srgb,var(--p58-info) 10%,transparent);border-color:color-mix(in srgb,var(--p58-info) 28%,transparent);border-left-color:var(--p58-info)}.path58-alert--info .path58-alert__icon{color:var(--p58-info)}.path58-search-input{position:relative;display:flex;align-items:center;width:100%}.path58-search-input .path58-input{width:100%;padding-right:2.5rem}.path58-search-input-clear{position:absolute;right:.5rem;background:transparent;border:none;color:var(--p58-fg-3);padding:.25rem;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.path58-search-input-clear:hover{color:var(--p58-fg-1);background:color-mix(in srgb,var(--p58-fg-1) 10%,transparent)}.path58-info-card{display:flex;align-items:center;gap:.75rem;position:relative;margin-top:.25rem}.path58-info-card-content{display:flex;flex-direction:column;gap:.125rem;min-width:0;flex:1}.path58-info-card-value{font-size:.9375rem;color:var(--p58-fg-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.path58-info-card-value{display:flex;flex-wrap:wrap;gap:.25rem}.path58-info-card--filters{border-color:color-mix(in srgb,var(--p58-teal) 20%,transparent)}.path58-info-card--selected{border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);background:color-mix(in srgb,var(--p58-teal) 3%,transparent)}.path58-info-card--category{transition:all .2s}.path58-info-card--clickable{cursor:pointer}.path58-category-header{width:100%;display:flex;align-items:center;gap:.5rem;padding:.75rem;background:color-mix(in srgb,var(--p58-teal) 8%,transparent);border:1px solid color-mix(in srgb,var(--p58-teal) 15%,transparent);color:var(--p58-accent-fg);cursor:pointer;border-radius:6px;font-size:.875rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;transition:all .2s;margin-bottom:.25rem}.path58-category-header svg{color:var(--p58-accent-fg)}.path58-category-header:hover{background:color-mix(in srgb,var(--p58-teal) 12%,transparent);border-color:color-mix(in srgb,var(--p58-teal) 25%,transparent);color:var(--p58-accent-fg)}.path58-category-name{flex:1;text-align:left}.path58-category-count{color:var(--p58-fg-3);font-weight:400}.path58-category-chevron{transition:transform .2s}.path58-category-chevron--expanded{transform:rotate(90deg)}.path58-file-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.path58-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--p58-overlay-backdrop);display:flex;align-items:center;justify-content:center;padding:var(--p58-space-6);z-index:1000;animation:path58-dialog-fade-in .15s ease-out}.path58-dialog-surface{background:var(--p58-surface);color:var(--p58-fg-1);border:1px solid var(--p58-border-strong);border-radius:var(--p58-radius-xl);padding:var(--p58-space-6);max-width:480px;width:100%;max-height:calc(100vh - var(--p58-space-12));overflow-y:auto;animation:path58-dialog-slide-up .2s ease-out}.path58-dialog-surface :focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px;border-radius:var(--p58-radius-sm)}@keyframes path58-dialog-fade-in{0%{opacity:0}to{opacity:1}}@keyframes path58-dialog-slide-up{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion: reduce){.path58-dialog-backdrop,.path58-dialog-surface{animation:none}}.path58-modal{display:flex;flex-direction:column;gap:var(--p58-space-4);margin:calc(var(--p58-space-6) * -1)}.path58-modal__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--p58-space-3);padding:var(--p58-space-5) var(--p58-space-6);border-bottom:1px solid var(--p58-border)}.path58-modal__header-content{flex:1;min-width:0;color:var(--p58-fg-1);font-size:1rem;font-weight:500;line-height:1.4}.path58-modal__dismiss{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:44px;min-height:44px;background:transparent;border:none;color:var(--p58-fg-2);cursor:pointer;border-radius:var(--p58-radius-sm);transition:color .12s ease-out}.path58-modal__dismiss:hover{color:var(--p58-fg-1)}.path58-modal__dismiss:focus-visible{outline:2px solid var(--p58-accent-fg);outline-offset:2px}.path58-modal__body{padding:0 var(--p58-space-6);color:var(--p58-fg-1);font-size:.9375rem;line-height:1.6}.path58-modal__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--p58-space-2);padding:var(--p58-space-4) var(--p58-space-6);border-top:1px solid var(--p58-border)}.path58-modal--sm{--path58-modal-max-width: 360px}.path58-modal--md{--path58-modal-max-width: 480px}.path58-modal--lg{--path58-modal-max-width: 640px}.path58-dialog-surface:has(.path58-modal--sm){max-width:360px}.path58-dialog-surface:has(.path58-modal--lg){max-width:640px}.path58-confirm-dialog__message{color:var(--p58-fg-2);font-size:.9375rem;line-height:1.6;padding:var(--p58-space-3) 0}.path58-confirm-dialog__spinner{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:var(--p58-radius-full);margin-right:var(--p58-space-2);animation:path58-confirm-dialog-spin .6s linear infinite}@keyframes path58-confirm-dialog-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.path58-confirm-dialog__spinner{animation-duration:1.5s}}.path58-prompt-dialog__field{display:flex;flex-direction:column;gap:var(--p58-space-2);padding:var(--p58-space-3) 0}.path58-prompt-dialog__label{color:var(--p58-fg-2);font-size:.8125rem;font-weight:500;line-height:1.4}.path58-prompt-dialog__error{color:var(--p58-danger);font-size:.8125rem;line-height:1.4}.path58-search-input-wrapper{position:relative;display:flex;align-items:center;width:100%}.path58-tag-filter{display:flex;flex-direction:column;gap:.5rem;min-width:200px;height:110px;max-height:110px;overflow-y:scroll;overflow-x:hidden;position:relative;padding-right:0}.path58-tag-filter-header{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--p58-accent-fg);flex-shrink:0}.path58-tag-filter-clear{margin-left:auto}.path58-tag-filter-list{flex:1;min-height:0}.path58-tag-filter-scroll-hint{padding:.25rem .5rem;font-size:.625rem;color:var(--p58-fg-3);text-align:center;font-style:italic;border-top:1px solid color-mix(in srgb,var(--p58-teal) 10%,transparent);margin-top:.25rem;flex-shrink:0}.path58-category-group{margin-bottom:.5rem}.path58-category-file-list{display:flex;flex-direction:column;gap:.25rem;padding-left:.5rem}.path58-artifact-list.path58-list{flex:1 1 0!important;min-height:0!important;overflow-y:scroll!important;overflow-x:hidden!important;scrollbar-width:thin!important;scrollbar-color:color-mix(in srgb,var(--p58-teal) 60%,transparent) color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;scrollbar-gutter:stable!important;-webkit-overflow-scrolling:touch;padding:.5rem!important;display:flex!important;flex-direction:column!important;height:100%!important}.path58-artifact-list::-webkit-scrollbar{width:8px!important;-webkit-appearance:none!important;display:block!important}.path58-artifact-list::-webkit-scrollbar-track{background:color-mix(in srgb,var(--p58-bg) 40%,transparent)!important;border-radius:4px;margin:2px 0;border:1px solid color-mix(in srgb,var(--p58-teal) 20%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--p58-teal) 60%,transparent)!important;border-radius:4px;min-height:30px;border:1px solid color-mix(in srgb,var(--p58-teal) 30%,transparent)!important;-webkit-appearance:none!important}.path58-artifact-list::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--p58-teal) 80%,transparent)!important;border-color:color-mix(in srgb,var(--p58-teal) 50%,transparent)!important}.path58-toast-stack{position:fixed;display:flex;flex-direction:column;gap:var(--p58-space-2);z-index:1100;padding:var(--p58-space-4);pointer-events:none;max-width:calc(100vw - var(--p58-space-8))}.path58-toast-stack--top-right{top:0;right:0;align-items:flex-end}.path58-toast-stack--top-left{top:0;left:0;align-items:flex-start}.path58-toast-stack--bottom-right{bottom:0;right:0;align-items:flex-end;flex-direction:column-reverse}.path58-toast-stack--bottom-left{bottom:0;left:0;align-items:flex-start;flex-direction:column-reverse}.path58-tool-topbar{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--p58-space-6);background:var(--p58-surface);border-bottom:1px solid var(--p58-border);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-md);gap:var(--p58-space-4)}.path58-tool-topbar__left{display:flex;align-items:center;gap:var(--p58-space-3);min-width:0}.path58-tool-topbar__right{display:flex;align-items:center;gap:var(--p58-space-3);flex-shrink:0}.path58-tool-topbar__mark{display:block;height:28px;width:auto;max-width:110px;flex-shrink:0}.path58-tool-topbar__wordmark{font-family:var(--p58-font-display, var(--p58-font-ui));font-weight:700;font-size:var(--p58-text-md, 16px);letter-spacing:var(--p58-tracking-tight, -.01em);color:var(--p58-blue-900, var(--p58-primary));line-height:1;flex-shrink:0}.path58-tool-topbar__divider{width:1px;height:18px;background:var(--p58-border-strong)}.path58-tool-topbar__tool-name{font-family:var(--p58-font-ui);font-size:var(--p58-text-md);font-weight:600;color:var(--p58-fg-1);white-space:nowrap}.path58-tool-topbar__engagement-chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900, var(--p58-primary));border:1px solid var(--p58-blue-900, var(--p58-primary));border-radius:var(--p58-radius-md);font-family:var(--p58-font-ui);font-size:var(--p58-text-xs);font-weight:500;letter-spacing:0;white-space:nowrap}.path58-tool-topbar__meta{display:inline-flex;align-items:center;gap:6px;font-family:var(--p58-font-mono);font-size:var(--p58-text-sm);white-space:nowrap;font-variant-numeric:tabular-nums}.path58-tool-topbar__meta-tool-id{color:var(--p58-fg-3);font-weight:500}.path58-tool-topbar__meta-sep{color:var(--p58-fg-4)}.path58-tool-topbar__meta-state{color:var(--p58-fg-2)}.path58-tool-topbar__save-dot{width:6px;height:6px;border-radius:var(--p58-radius-full);flex-shrink:0}.path58-tool-topbar__save-dot--idle{background:var(--p58-fg-4)}.path58-tool-topbar__save-dot--saving{background:var(--p58-warning);animation:path58-tool-topbar-pulse 1.2s ease-in-out infinite}.path58-tool-topbar__save-dot--saved{background:var(--p58-success)}@keyframes path58-tool-topbar-pulse{0%,to{opacity:.6}50%{opacity:1}}.path58-tool-topbar__engagement-chip:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}@media print{.path58-tool-topbar.no-print{display:none}}.path58-tool-footer{background:var(--p58-surface);border-top:1px solid var(--p58-border);color:var(--p58-fg-3);font-family:var(--p58-font-ui);font-size:var(--p58-text-sm)}.path58-tool-footer__inner{display:flex;align-items:center;gap:var(--p58-space-3);padding:12px var(--p58-space-6)}.path58-tool-footer__mark{width:18px;height:18px;flex-shrink:0;opacity:.7}.path58-tool-footer__text{flex:1;color:var(--p58-fg-3);font-size:var(--p58-text-sm);line-height:1.4}.path58-tool-footer__text strong{color:var(--p58-fg-2);font-weight:500}@media print{.path58-tool-footer{background:transparent;border-top-color:#000;color:#000}.path58-tool-footer__text{color:#000}.path58-tool-footer__text strong{color:#000;font-weight:600}.path58-tool-footer .no-print{display:none}}.path58-tool-authgate{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--p58-bg);gap:14px}.path58-tool-authgate__card{background:var(--p58-surface);border:1px solid var(--p58-border);border-radius:var(--p58-radius-lg, 12px);padding:44px;width:400px;display:flex;flex-direction:column;align-items:center;gap:8px}.path58-tool-authgate__brand{display:flex;align-items:center;justify-content:center;margin-bottom:24px;width:100%}.path58-tool-authgate__logo{display:block;height:84px;width:auto;max-width:280px}.path58-tool-authgate__title{margin:0 0 14px;font-size:22px;font-weight:700;color:var(--p58-fg-1);text-align:center;letter-spacing:var(--p58-tracking-tight, -.01em)}.path58-tool-authgate__chip{display:inline-flex;align-items:center;height:22px;padding:0 10px;background:transparent;color:var(--p58-blue-900);border:1px solid var(--p58-blue-900);border-radius:var(--p58-radius-md, 6px);font-family:var(--p58-font-ui);font-size:12px;font-weight:500;letter-spacing:0}.path58-tool-authgate__footer{font-family:var(--p58-font-ui);font-size:12px;color:var(--p58-fg-3);text-align:left;width:400px;line-height:1.5;padding:0 4px}.path58-tool-authgate__form{display:flex;flex-direction:column;gap:10px;margin-top:14px;width:100%}.path58-tool-authgate__label{font-size:13px;font-weight:600;color:var(--p58-fg-2)}.path58-tool-authgate__input{box-sizing:border-box;width:100%;padding:9px 12px;border:1px solid var(--p58-border);border-radius:var(--p58-radius-md, 8px);background:var(--p58-surface-2);color:var(--p58-fg-1);font-size:14px;font-family:inherit}.path58-tool-authgate__input:focus{outline:none;border-color:var(--p58-blue-900);box-shadow:var(--p58-ring-focus)}.path58-tool-authgate__input:disabled{opacity:.55;cursor:not-allowed}.path58-tool-authgate__submit{box-sizing:border-box;width:100%;margin-top:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--p58-blue-900);color:#fff;border:none;border-radius:var(--p58-radius-md, 6px);font-family:inherit;font-weight:600;font-size:14px;padding:10px 18px;cursor:pointer;transition:background var(--p58-duration-fast, .12s) var(--p58-ease, ease)}.path58-tool-authgate__submit:hover{background:var(--p58-blue-700)}.path58-tool-authgate__submit:active{background:var(--p58-blue-900)}.path58-tool-authgate__submit:focus-visible{outline:none;box-shadow:var(--p58-ring-focus)}.path58-tool-authgate__submit:disabled{opacity:.55;cursor:not-allowed}.path58-tool-authgate__error{margin:0;font-size:13px;color:var(--p58-danger)}.path58-tool-authgate__sent p{margin:0 0 6px;font-size:14px}.path58-tool-authgate__hint{color:var(--p58-fg-3);font-size:13px}.path58-input-field{display:flex;flex-direction:column;gap:5px;font-family:var(--p58-font-ui)}.path58-input-field--no-label{gap:0}.path58-input__label{font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:500;color:var(--p58-fg-2);display:flex;align-items:baseline;gap:4px}.path58-input__label.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.path58-input__required{color:var(--p58-fg-2);font-weight:500}.path58-input__shell{position:relative;display:block}.path58-input{width:100%;box-sizing:border-box;background:var(--p58-surface-2);border:1px solid var(--p58-border);border-radius:var(--p58-radius-lg);color:var(--p58-fg-1);font-family:var(--p58-font-ui);font-size:var(--p58-text-base);outline:none;transition:background var(--p58-duration-fast) var(--p58-ease),border-color var(--p58-duration-fast) var(--p58-ease),box-shadow var(--p58-duration-fast) var(--p58-ease)}.path58-input::placeholder{color:var(--p58-fg-4)}.path58-input--sm{padding:7px 12px}.path58-input--md{padding:9px 14px}.path58-input--lg{padding:13px 16px;font-size:var(--p58-text-lg)}.path58-input:hover:not(:disabled):not(.path58-input--invalid){border-color:#0d1d4d66;background:#fafbfd}.path58-input:focus,.path58-input:focus-visible{border-color:var(--p58-blue-900);box-shadow:var(--p58-ring-focus);background:var(--p58-surface-2)}.path58-input--invalid,.path58-input--invalid:hover{border-color:var(--p58-danger);background:var(--p58-surface-2);padding-right:36px}.path58-input--invalid:focus,.path58-input--invalid:focus-visible{border-color:var(--p58-danger);box-shadow:0 0 0 2px var(--p58-bg),0 0 0 4px var(--p58-danger)}.path58-input__invalid-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--p58-danger);pointer-events:none}.path58-input--disabled,.path58-input:disabled{background:var(--p58-surface-disabled);border-color:var(--p58-border-subtle);color:var(--p58-fg-3);cursor:not-allowed}.path58-input--disabled::placeholder,.path58-input:disabled::placeholder{color:var(--p58-fg-4)}.path58-input--mono{font-family:var(--p58-font-mono);font-variant-numeric:tabular-nums}.path58-input--with-prefix.path58-input--sm{padding-left:28px}.path58-input--with-prefix.path58-input--md{padding-left:30px}.path58-input--with-prefix.path58-input--lg{padding-left:32px}.path58-input--with-suffix.path58-input--sm{padding-right:28px}.path58-input--with-suffix.path58-input--md{padding-right:30px}.path58-input--with-suffix.path58-input--lg{padding-right:32px}.path58-input__adornment{position:absolute;top:50%;transform:translateY(-50%);font-family:var(--p58-font-mono);font-size:var(--p58-text-base);font-weight:400;color:var(--p58-fg-3);pointer-events:none;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums}.path58-input__adornment--prefix{left:14px}.path58-input__adornment--suffix{right:14px}.path58-input__hint{margin:4px 0 0;font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:400;color:var(--p58-fg-3);line-height:var(--p58-leading-normal)}.path58-input__error{margin:4px 0 0;font-family:var(--p58-font-ui);font-size:var(--p58-text-sm);font-weight:400;color:var(--p58-danger);line-height:var(--p58-leading-normal)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@path58/ui",
3
- "version": "2.0.0",
3
+ "version": "2.6.0",
4
4
  "description": "Path58 UI — React component library (atoms, molecules, organisms, primitives). Consumes @path58/tokens at runtime via CSS variables.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -34,14 +34,22 @@
34
34
  "react-dom": "^18.2.0"
35
35
  },
36
36
  "dependencies": {
37
+ "focus-trap-react": "^12.0.2",
37
38
  "lucide-react": "^0.294.0",
38
39
  "react-icons": "^5.5.0",
39
- "@path58/tokens": "^1.0.0"
40
+ "@path58/tokens": "^1.1.0"
40
41
  },
41
42
  "devDependencies": {
43
+ "@storybook/addon-a11y": "8.6.14",
44
+ "@storybook/addon-essentials": "8.6.14",
45
+ "@storybook/addon-interactions": "8.6.14",
46
+ "@storybook/react": "8.6.18",
47
+ "@storybook/react-vite": "8.6.18",
48
+ "@storybook/test": "8.6.18",
42
49
  "@types/react": "^18.2.43",
43
50
  "@types/react-dom": "^18.2.17",
44
51
  "@vitejs/plugin-react": "^4.2.1",
52
+ "storybook": "8.6.18",
45
53
  "typescript": "^5.3.3",
46
54
  "vite": "^5.0.8"
47
55
  },
@@ -62,6 +70,9 @@
62
70
  },
63
71
  "scripts": {
64
72
  "build": "vite build && tsc --emitDeclarationOnly --outDir dist",
65
- "dev": "vite build --watch"
73
+ "dev": "vite build --watch",
74
+ "typecheck": "tsc --noEmit",
75
+ "storybook": "pnpm exec storybook dev -p 6006",
76
+ "build-storybook": "pnpm exec storybook build"
66
77
  }
67
78
  }