@path58/ui 2.2.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.
- package/dist/atoms/Layout/Layout.d.ts +47 -0
- package/dist/atoms/Layout/Layout.d.ts.map +1 -0
- package/dist/atoms/Layout/index.d.ts +3 -0
- package/dist/atoms/Layout/index.d.ts.map +1 -0
- package/dist/atoms/index.d.ts +1 -0
- package/dist/atoms/index.d.ts.map +1 -1
- package/dist/index.d.ts +6 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1933 -1229
- package/dist/organisms/ToolAuthGate/ToolAuthGate.d.ts +47 -0
- package/dist/organisms/ToolAuthGate/ToolAuthGate.d.ts.map +1 -0
- package/dist/organisms/ToolAuthGate/index.d.ts +3 -0
- package/dist/organisms/ToolAuthGate/index.d.ts.map +1 -0
- package/dist/organisms/ToolFooter/ToolFooter.d.ts +21 -0
- package/dist/organisms/ToolFooter/ToolFooter.d.ts.map +1 -0
- package/dist/organisms/ToolFooter/index.d.ts +3 -0
- package/dist/organisms/ToolFooter/index.d.ts.map +1 -0
- package/dist/organisms/ToolTopbar/ToolTopbar.d.ts +27 -0
- package/dist/organisms/ToolTopbar/ToolTopbar.d.ts.map +1 -0
- package/dist/organisms/ToolTopbar/index.d.ts +3 -0
- package/dist/organisms/ToolTopbar/index.d.ts.map +1 -0
- package/dist/organisms/index.d.ts +4 -0
- package/dist/organisms/index.d.ts.map +1 -1
- package/dist/organisms/inputs/MoneyInput.d.ts +34 -0
- package/dist/organisms/inputs/MoneyInput.d.ts.map +1 -0
- package/dist/organisms/inputs/NumberInput.d.ts +36 -0
- package/dist/organisms/inputs/NumberInput.d.ts.map +1 -0
- package/dist/organisms/inputs/PercentInput.d.ts +36 -0
- package/dist/organisms/inputs/PercentInput.d.ts.map +1 -0
- package/dist/organisms/inputs/TextInput.d.ts +31 -0
- package/dist/organisms/inputs/TextInput.d.ts.map +1 -0
- package/dist/organisms/inputs/index.d.ts +18 -0
- package/dist/organisms/inputs/index.d.ts.map +1 -0
- package/dist/organisms/inputs/useBlurOnEnterEscapeClickOut.d.ts +29 -0
- package/dist/organisms/inputs/useBlurOnEnterEscapeClickOut.d.ts.map +1 -0
- package/dist/organisms/inputs/useNumericInputState.d.ts +23 -0
- package/dist/organisms/inputs/useNumericInputState.d.ts.map +1 -0
- package/dist/primitives/P58Button.d.ts.map +1 -1
- package/dist/primitives/P58Card.d.ts.map +1 -1
- package/dist/primitives/P58Eyebrow.d.ts.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +12 -16
- package/dist/atoms/Alert/Alert.stories.d.ts +0 -12
- package/dist/atoms/Alert/Alert.stories.d.ts.map +0 -1
- package/dist/atoms/Banner/Banner.stories.d.ts +0 -11
- package/dist/atoms/Banner/Banner.stories.d.ts.map +0 -1
- package/dist/atoms/Toast/Toast.stories.d.ts +0 -10
- package/dist/atoms/Toast/Toast.stories.d.ts.map +0 -1
- package/dist/molecules/ConfirmDialog/ConfirmDialog.stories.d.ts +0 -9
- package/dist/molecules/ConfirmDialog/ConfirmDialog.stories.d.ts.map +0 -1
- package/dist/molecules/Modal/Modal.stories.d.ts +0 -11
- package/dist/molecules/Modal/Modal.stories.d.ts.map +0 -1
- package/dist/molecules/PromptDialog/PromptDialog.stories.d.ts +0 -10
- package/dist/molecules/PromptDialog/PromptDialog.stories.d.ts.map +0 -1
- package/dist/primitives/Dialog/Dialog.stories.d.ts +0 -9
- package/dist/primitives/Dialog/Dialog.stories.d.ts.map +0 -1
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import './ToolAuthGate.css';
|
|
2
|
+
/**
|
|
3
|
+
* ToolAuthGate — third chrome organism for Path58 consultancy tools.
|
|
4
|
+
*
|
|
5
|
+
* Joins ToolTopbar + ToolFooter as the canonical pre-authenticated surface
|
|
6
|
+
* for any Path58 consultancy tool that uses Supabase magic-link auth.
|
|
7
|
+
*
|
|
8
|
+
* Replaces 5 ad-hoc per-tool AuthGate implementations (TOOL-002/003/005/006/007)
|
|
9
|
+
* that drifted to 4 different visual treatments before consolidation here.
|
|
10
|
+
*
|
|
11
|
+
* Brand canon:
|
|
12
|
+
* - path58-tool theme (cream-cool / navy / restrained-lime)
|
|
13
|
+
* - Filled navy CTA (var(--p58-blue-900)) — Path58 brand-canon for primary action
|
|
14
|
+
* - Card surface (var(--p58-surface)) on page bg (var(--p58-bg))
|
|
15
|
+
* - Money-moment-utility-aware (path58-light loaded first per DSGN-1.5.3 Finding #8)
|
|
16
|
+
*
|
|
17
|
+
* Source: DSGN-1.5.3 TOOL-002 reference AuthGate (commit 11c3589) — most polished
|
|
18
|
+
* implementation; this organism canonicalizes its visual treatment.
|
|
19
|
+
*
|
|
20
|
+
* Per CLIENT_TOOL_BRANDING_POLICY v1.1.0:
|
|
21
|
+
* - Engagement-context badge ("For {clientName} engagement · {toolId}")
|
|
22
|
+
* - Tool name as h1
|
|
23
|
+
* - Path58 logo top of card (consumer supplies logoSrc; default fallback gracefully)
|
|
24
|
+
*/
|
|
25
|
+
export interface ToolAuthGateProps {
|
|
26
|
+
/** Tool display name (e.g., "Revenue Factory Canvas") */
|
|
27
|
+
toolName: string;
|
|
28
|
+
/** Tool ID (e.g., "TOOL-002") */
|
|
29
|
+
toolId: string;
|
|
30
|
+
/** Client engagement name — caller passes window.__P58_CONFIG__?.clientName ?? 'Client' */
|
|
31
|
+
clientName: string;
|
|
32
|
+
/**
|
|
33
|
+
* Async magic-link send handler.
|
|
34
|
+
* Returns { ok: true } on success or { ok: false, error?: string } on failure.
|
|
35
|
+
* Caller wires this to their tool-local Supabase client + RUNBOOK auth flow.
|
|
36
|
+
*/
|
|
37
|
+
onSendMagicLink: (email: string) => Promise<{
|
|
38
|
+
ok: boolean;
|
|
39
|
+
error?: string;
|
|
40
|
+
}>;
|
|
41
|
+
/** Optional brand logo override; defaults to deploy-time `_brand/path58/assets/path58-logo-wide-text.svg` */
|
|
42
|
+
logoSrc?: string;
|
|
43
|
+
/** Optional className passthrough on the outer container */
|
|
44
|
+
className?: string;
|
|
45
|
+
}
|
|
46
|
+
export declare function ToolAuthGate({ toolName, toolId, clientName, onSendMagicLink, logoSrc, className, }: ToolAuthGateProps): import("react").JSX.Element;
|
|
47
|
+
//# sourceMappingURL=ToolAuthGate.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToolAuthGate.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolAuthGate/ToolAuthGate.tsx"],"names":[],"mappings":"AACA,OAAO,oBAAoB,CAAC;AAE5B;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,iBAAiB;IAChC,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;IACjB,iCAAiC;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,2FAA2F;IAC3F,UAAU,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;QAAE,EAAE,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7E,6GAA6G;IAC7G,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAMD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,MAAM,EACN,UAAU,EACV,eAAe,EACf,OAA0B,EAC1B,SAAS,GACV,EAAE,iBAAiB,+BAmFnB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolAuthGate/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './ToolFooter.css';
|
|
3
|
+
export interface ToolFooterProps {
|
|
4
|
+
/** Tool display name (e.g., "Revenue Factory Canvas"). Required. Renders emphasized inline in attribution prose. */
|
|
5
|
+
toolName: string;
|
|
6
|
+
/** Tool version semver string (e.g., "0.3.0"). Required. Renders as "v{toolVersion}" in attribution. */
|
|
7
|
+
toolVersion: string;
|
|
8
|
+
/** Client engagement name (e.g., "Nimble"). Required. Renders as "For {clientName} engagement" in attribution. */
|
|
9
|
+
clientName: string;
|
|
10
|
+
/** Show the path58-mark icon left of attribution. Default: true. */
|
|
11
|
+
showMark?: boolean;
|
|
12
|
+
/** "About this tool" callback. When undefined, the About button does NOT render.
|
|
13
|
+
* When defined: tool's thin Footer.tsx wrapper hosts modal state + renders tool-local <AboutThisTool>
|
|
14
|
+
* per CLIENT_TOOL_BRANDING_POLICY v1.0.0. */
|
|
15
|
+
onAbout?: () => void;
|
|
16
|
+
/** Show the Print button (internally calls `window.print()`). Default: true. */
|
|
17
|
+
showPrint?: boolean;
|
|
18
|
+
}
|
|
19
|
+
export declare const ToolFooter: React.FC<ToolFooterProps>;
|
|
20
|
+
export default ToolFooter;
|
|
21
|
+
//# sourceMappingURL=ToolFooter.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToolFooter.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolFooter/ToolFooter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,kBAAkB,CAAC;AAE1B,MAAM,WAAW,eAAe;IAC9B,oHAAoH;IACpH,QAAQ,EAAE,MAAM,CAAC;IAEjB,wGAAwG;IACxG,WAAW,EAAE,MAAM,CAAC;IAEpB,kHAAkH;IAClH,UAAU,EAAE,MAAM,CAAC;IAEnB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;kDAE8C;IAC9C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,gFAAgF;IAChF,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAuChD,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolFooter/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './ToolTopbar.css';
|
|
3
|
+
export interface ToolTopbarProps {
|
|
4
|
+
/** Tool display name shown LEFT after the divider. Required. */
|
|
5
|
+
toolName: string;
|
|
6
|
+
/** Canonical tool ID (e.g., "TOOL-002"). Shown in the meta cluster on RIGHT. Required. */
|
|
7
|
+
toolId: string;
|
|
8
|
+
/** Client engagement name (e.g., "Nimble"). Renders inside the engagement chip on RIGHT as "For {clientName} engagement". Required. */
|
|
9
|
+
clientName: string;
|
|
10
|
+
/** Last-saved ISO timestamp. `null` or `undefined` triggers save-state UI:
|
|
11
|
+
* - `undefined` (prop omitted) AND `saving === undefined` → no save UI at all (TOOL-001 static-tool path).
|
|
12
|
+
* - `null` AND `!saving` → "Not saved yet" idle state.
|
|
13
|
+
* - String AND `!saving` → "Auto-saved · HH:MM" saved state.
|
|
14
|
+
*/
|
|
15
|
+
savedAt?: string | null;
|
|
16
|
+
/** Save in flight. Renders "Saving…" state with amber pulsing dot when true. */
|
|
17
|
+
saving?: boolean;
|
|
18
|
+
/** Sign-out handler. When undefined, Sign out button does NOT render (TOOL-001 static-tool path). */
|
|
19
|
+
onSignOut?: () => void;
|
|
20
|
+
/** Tool-specific action buttons (and selects, attribution chips, etc.) slotted into RIGHT cluster between meta and Sign out.
|
|
21
|
+
* Convention: use `<Button variant="secondary" size="sm">` for actions, `<Button variant="primary" size="sm">` for THE tool's primary CTA (e.g., "Save version").
|
|
22
|
+
* TOOL-001 uses this slot for the WbD attribution chip. */
|
|
23
|
+
children?: React.ReactNode;
|
|
24
|
+
}
|
|
25
|
+
export declare const ToolTopbar: React.FC<ToolTopbarProps>;
|
|
26
|
+
export default ToolTopbar;
|
|
27
|
+
//# sourceMappingURL=ToolTopbar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToolTopbar.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolTopbar/ToolTopbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,kBAAkB,CAAC;AAE1B,MAAM,WAAW,eAAe;IAC9B,gEAAgE;IAChE,QAAQ,EAAE,MAAM,CAAC;IAEjB,0FAA0F;IAC1F,MAAM,EAAE,MAAM,CAAC;IAEf,uIAAuI;IACvI,UAAU,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAExB,gFAAgF;IAChF,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,qGAAqG;IACrG,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IAEvB;;gEAE4D;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AA8BD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAyDhD,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organisms/ToolTopbar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -8,4 +8,8 @@ export * from './TagFilterList';
|
|
|
8
8
|
export * from './CategoryGroup';
|
|
9
9
|
export * from './ArtifactList';
|
|
10
10
|
export * from './ToastProvider';
|
|
11
|
+
export * from './ToolTopbar';
|
|
12
|
+
export * from './ToolFooter';
|
|
13
|
+
export * from './ToolAuthGate';
|
|
14
|
+
export * from './inputs';
|
|
11
15
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/organisms/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAI/B,cAAc,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/organisms/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAI/B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAK7B,cAAc,gBAAgB,CAAC;AAI/B,cAAc,UAAU,CAAC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import type { FocusEvent, InputHTMLAttributes } from 'react';
|
|
2
|
+
import './TextInput.css';
|
|
3
|
+
export type MoneyInputSize = 'sm' | 'md' | 'lg';
|
|
4
|
+
export interface MoneyInputProps {
|
|
5
|
+
/** Visible label text. Required for a11y; never omit. */
|
|
6
|
+
label: string;
|
|
7
|
+
/** Controlled numeric value. null = empty (renders as "0" per Tsvika 2026-06-19 spec). */
|
|
8
|
+
value: number | null;
|
|
9
|
+
/** Fires on commit (Enter blur OR click-outside blur) with the parsed value. */
|
|
10
|
+
onChange: (next: number | null) => void;
|
|
11
|
+
hint?: string;
|
|
12
|
+
errorMessage?: string;
|
|
13
|
+
size?: MoneyInputSize;
|
|
14
|
+
required?: boolean;
|
|
15
|
+
invalid?: boolean;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
/** Hide the visible label (sr-only). For table-cell consumption. Default: false. */
|
|
18
|
+
hideLabel?: boolean;
|
|
19
|
+
min?: number;
|
|
20
|
+
max?: number;
|
|
21
|
+
/** Step for rounding on commit. Default 1 = integer-only (cents → step=0.01). */
|
|
22
|
+
step?: number;
|
|
23
|
+
/** BCP-47 locale tag for Intl.NumberFormat (default 'en-US'). */
|
|
24
|
+
locale?: string;
|
|
25
|
+
/** Prefix character — default '$'. Currency-parameterization deferred per REQ-19-003. */
|
|
26
|
+
prefix?: string;
|
|
27
|
+
id?: string;
|
|
28
|
+
name?: string;
|
|
29
|
+
autoComplete?: InputHTMLAttributes<HTMLInputElement>['autoComplete'];
|
|
30
|
+
onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
31
|
+
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
32
|
+
}
|
|
33
|
+
export declare function MoneyInput({ label, value, onChange, hint, errorMessage, size, required, invalid, disabled, hideLabel, min, max, step, locale, prefix, id: providedId, name, autoComplete, onFocus, onBlur, }: MoneyInputProps): import("react").JSX.Element;
|
|
34
|
+
//# sourceMappingURL=MoneyInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MoneyInput.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/MoneyInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,iBAAiB,CAAC;AAEzB,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhD,MAAM,WAAW,eAAe;IAC9B,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,0FAA0F;IAC1F,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,gFAAgF;IAChF,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAExC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,yFAAyF;IACzF,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,CAAC,cAAc,CAAC,CAAC;IAErE,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,IAAW,EACX,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,IAAQ,EACR,MAAgB,EAChB,MAAY,EACZ,EAAE,EAAE,UAAU,EACd,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,MAAM,GACP,EAAE,eAAe,+BAwGjB"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { FocusEvent, InputHTMLAttributes } from 'react';
|
|
2
|
+
import './TextInput.css';
|
|
3
|
+
export type NumberInputSize = 'sm' | 'md' | 'lg';
|
|
4
|
+
export interface NumberInputProps {
|
|
5
|
+
/** Visible label text. Required for a11y; never omit. */
|
|
6
|
+
label: string;
|
|
7
|
+
/** Controlled numeric value. null = empty. */
|
|
8
|
+
value: number | null;
|
|
9
|
+
/** Fires on commit (Enter blur OR click-outside blur) with the parsed value. */
|
|
10
|
+
onChange: (next: number | null) => void;
|
|
11
|
+
placeholder?: string;
|
|
12
|
+
hint?: string;
|
|
13
|
+
/** Shown below input when invalid; replaces hint while invalid. */
|
|
14
|
+
errorMessage?: string;
|
|
15
|
+
size?: NumberInputSize;
|
|
16
|
+
required?: boolean;
|
|
17
|
+
invalid?: boolean;
|
|
18
|
+
disabled?: boolean;
|
|
19
|
+
/** Hide the visible label (sr-only). For table-cell consumption. Default: false. */
|
|
20
|
+
hideLabel?: boolean;
|
|
21
|
+
/** Inclusive lower bound. Omit to allow negatives. */
|
|
22
|
+
min?: number;
|
|
23
|
+
/** Inclusive upper bound. */
|
|
24
|
+
max?: number;
|
|
25
|
+
/** Step for rounding on commit. Default 1 = integer-only. */
|
|
26
|
+
step?: number;
|
|
27
|
+
/** BCP-47 locale tag for Intl.NumberFormat (default 'en-US'). */
|
|
28
|
+
locale?: string;
|
|
29
|
+
id?: string;
|
|
30
|
+
name?: string;
|
|
31
|
+
autoComplete?: InputHTMLAttributes<HTMLInputElement>['autoComplete'];
|
|
32
|
+
onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
33
|
+
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
34
|
+
}
|
|
35
|
+
export declare function NumberInput({ label, value, onChange, placeholder, hint, errorMessage, size, required, invalid, disabled, hideLabel, min, max, step, locale, id: providedId, name, autoComplete, onFocus, onBlur, }: NumberInputProps): import("react").JSX.Element;
|
|
36
|
+
//# sourceMappingURL=NumberInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/NumberInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,iBAAiB,CAAC;AAEzB,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEjD,MAAM,WAAW,gBAAgB;IAC/B,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,gFAAgF;IAChF,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAExC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,sDAAsD;IACtD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6BAA6B;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,6DAA6D;IAC7D,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,CAAC,cAAc,CAAC,CAAC;IAErE,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,YAAY,EACZ,IAAW,EACX,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,IAAQ,EACR,MAAgB,EAChB,EAAE,EAAE,UAAU,EACd,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,MAAM,GACP,EAAE,gBAAgB,+BA8FlB"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { FocusEvent, InputHTMLAttributes } from 'react';
|
|
2
|
+
import './TextInput.css';
|
|
3
|
+
export type PercentInputSize = 'sm' | 'md' | 'lg';
|
|
4
|
+
export interface PercentInputProps {
|
|
5
|
+
/** Visible label text. Required for a11y; never omit. */
|
|
6
|
+
label: string;
|
|
7
|
+
/** Controlled numeric value. null = empty (renders as "0" per Tsvika 2026-06-19 spec). */
|
|
8
|
+
value: number | null;
|
|
9
|
+
/** Fires on commit (Enter blur OR click-outside blur) with the parsed value. */
|
|
10
|
+
onChange: (next: number | null) => void;
|
|
11
|
+
hint?: string;
|
|
12
|
+
errorMessage?: string;
|
|
13
|
+
size?: PercentInputSize;
|
|
14
|
+
required?: boolean;
|
|
15
|
+
invalid?: boolean;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
/** Hide the visible label (sr-only). For table-cell consumption. Default: false. */
|
|
18
|
+
hideLabel?: boolean;
|
|
19
|
+
/** Default 0. Override to allow negatives. */
|
|
20
|
+
min?: number;
|
|
21
|
+
/** Default 100. Override for basis-point-style or unbounded use. */
|
|
22
|
+
max?: number;
|
|
23
|
+
/** Step for rounding on commit. Default 1 = integer percent. */
|
|
24
|
+
step?: number;
|
|
25
|
+
/** BCP-47 locale tag for Intl.NumberFormat (default 'en-US'). */
|
|
26
|
+
locale?: string;
|
|
27
|
+
/** Suffix character — default '%'. */
|
|
28
|
+
suffix?: string;
|
|
29
|
+
id?: string;
|
|
30
|
+
name?: string;
|
|
31
|
+
autoComplete?: InputHTMLAttributes<HTMLInputElement>['autoComplete'];
|
|
32
|
+
onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
33
|
+
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
34
|
+
}
|
|
35
|
+
export declare function PercentInput({ label, value, onChange, hint, errorMessage, size, required, invalid, disabled, hideLabel, min, max, step, locale, suffix, id: providedId, name, autoComplete, onFocus, onBlur, }: PercentInputProps): import("react").JSX.Element;
|
|
36
|
+
//# sourceMappingURL=PercentInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PercentInput.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/PercentInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,iBAAiB,CAAC;AAEzB,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAElD,MAAM,WAAW,iBAAiB;IAChC,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,0FAA0F;IAC1F,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,gFAAgF;IAChF,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAExC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oFAAoF;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,8CAA8C;IAC9C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oEAAoE;IACpE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,gEAAgE;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,CAAC,cAAc,CAAC,CAAC;IAErE,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,YAAY,EACZ,IAAW,EACX,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,SAAiB,EACjB,GAAO,EACP,GAAS,EACT,IAAQ,EACR,MAAgB,EAChB,MAAY,EACZ,EAAE,EAAE,UAAU,EACd,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,MAAM,GACP,EAAE,iBAAiB,+BAuGnB"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import type { FocusEvent, InputHTMLAttributes } from 'react';
|
|
2
|
+
import './TextInput.css';
|
|
3
|
+
export type TextInputSize = 'sm' | 'md' | 'lg';
|
|
4
|
+
export type TextInputType = 'text' | 'email' | 'tel' | 'url' | 'password';
|
|
5
|
+
export interface TextInputProps {
|
|
6
|
+
/** Visible label text. Required for a11y; never omit. */
|
|
7
|
+
label: string;
|
|
8
|
+
/** Controlled value. */
|
|
9
|
+
value: string;
|
|
10
|
+
/** Fires on every keystroke AND on Escape revert (with the pre-focus snapshot). */
|
|
11
|
+
onChange: (next: string) => void;
|
|
12
|
+
placeholder?: string;
|
|
13
|
+
hint?: string;
|
|
14
|
+
size?: TextInputSize;
|
|
15
|
+
required?: boolean;
|
|
16
|
+
invalid?: boolean;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
/** Hide the visible label (sr-only). For table-cell consumption where the column header is the visible label. Default: false. */
|
|
19
|
+
hideLabel?: boolean;
|
|
20
|
+
/** Shown below input when invalid; replaces hint while invalid. */
|
|
21
|
+
errorMessage?: string;
|
|
22
|
+
id?: string;
|
|
23
|
+
name?: string;
|
|
24
|
+
autoComplete?: InputHTMLAttributes<HTMLInputElement>['autoComplete'];
|
|
25
|
+
inputMode?: InputHTMLAttributes<HTMLInputElement>['inputMode'];
|
|
26
|
+
type?: TextInputType;
|
|
27
|
+
onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
28
|
+
onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
|
|
29
|
+
}
|
|
30
|
+
export declare function TextInput({ label, value, onChange, placeholder, hint, size, required, invalid, disabled, hideLabel, errorMessage, id: providedId, name, autoComplete, inputMode, type, onFocus: userOnFocus, onBlur: userOnBlur, }: TextInputProps): import("react").JSX.Element;
|
|
31
|
+
//# sourceMappingURL=TextInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../src/organisms/inputs/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,UAAU,EACV,mBAAmB,EACpB,MAAM,OAAO,CAAC;AAGf,OAAO,iBAAiB,CAAC;AAEzB,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC/C,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,UAAU,CAAC;AAE1E,MAAM,WAAW,cAAc;IAC7B,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,mFAAmF;IACnF,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iIAAiI;IACjI,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mEAAmE;IACnE,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,CAAC,cAAc,CAAC,CAAC;IACrE,SAAS,CAAC,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,CAAC,WAAW,CAAC,CAAC;IAC/D,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACpD;AAED,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,IAAW,EACX,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,SAAiB,EACjB,YAAY,EACZ,EAAE,EAAE,UAAU,EACd,IAAI,EACJ,YAAY,EACZ,SAAS,EACT,IAAa,EACb,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,GACnB,EAAE,cAAc,+BA8GhB"}
|
|
@@ -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"}
|
|
@@ -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;
|
|
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,
|
|
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,
|
|
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"}
|
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-overlay-backdrop: color-mix(in srgb, var(--p58-bg) 65%, transparent);--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-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: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-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}
|
|
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)}
|