@adminiumjs/ui 0.1.0-rc.1 → 0.1.2
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/components/auth-layout/AuthLayout.d.ts +3 -3
- package/dist/components/auth-layout/AuthLayout.js +4 -4
- package/dist/components/auth-screens/ForgotPasswordForm.d.ts +3 -3
- package/dist/components/auth-screens/ForgotPasswordForm.js +2 -2
- package/dist/components/auth-screens/ResetPasswordForm.d.ts +1 -1
- package/dist/components/auth-screens/ResetPasswordForm.js +1 -1
- package/dist/components/auth-screens/SignInForm.d.ts +1 -1
- package/dist/components/auth-screens/SignInForm.js +1 -1
- package/dist/components/auth-screens/TwoFactorForm.d.ts +1 -1
- package/dist/components/auth-screens/TwoFactorForm.js +1 -1
- package/dist/components/button/Button.d.ts +1 -1
- package/dist/components/button/Button.d.ts.map +1 -1
- package/dist/components/button/Button.js +5 -2
- package/dist/components/button/Button.js.map +1 -1
- package/dist/components/empty-state/EmptyState.js +1 -1
- package/dist/components/mono-text/MonoText.d.ts +1 -1
- package/dist/components/mono-text/MonoText.js +1 -1
- package/dist/components/otp-input/OtpInput.d.ts +1 -1
- package/dist/components/otp-input/OtpInput.js +1 -1
- package/dist/components/permission-matrix/PermissionMatrix.d.ts +1 -1
- package/dist/components/permission-matrix/PermissionMatrix.js +1 -1
- package/dist/components/runtime-chip/RuntimeChip.js +1 -1
- package/dist/components/skeleton/Skeleton.d.ts +1 -1
- package/dist/components/skeleton/Skeleton.js +1 -1
- package/dist/components/stepper/Stepper.d.ts.map +1 -1
- package/dist/components/stepper/Stepper.js +34 -3
- package/dist/components/stepper/Stepper.js.map +1 -1
- package/dist/components/success-state/SuccessState.d.ts +1 -1
- package/dist/components/success-state/SuccessState.js +1 -1
- package/dist/components/toast/useToastQueue.d.ts +2 -2
- package/dist/components/toast/useToastQueue.d.ts.map +1 -1
- package/dist/components/toast/useToastQueue.js +2 -2
- package/dist/components/toast/useToastQueue.js.map +1 -1
- package/dist/components/toggle-matrix/ToggleMatrix.d.ts +1 -1
- package/dist/components/toggle-matrix/ToggleMatrix.js +1 -1
- package/dist/components/two-phase-modal/TwoPhaseModal.d.ts +2 -2
- package/dist/components/two-phase-modal/TwoPhaseModal.js +2 -2
- package/dist/hooks/useUndoableAction.d.ts +2 -2
- package/dist/hooks/useUndoableAction.js +2 -2
- package/dist/lib/cn.d.ts +2 -2
- package/dist/lib/cn.js +2 -2
- package/dist/lib/tones.d.ts +17 -4
- package/dist/lib/tones.d.ts.map +1 -1
- package/dist/lib/tones.js +21 -8
- package/dist/lib/tones.js.map +1 -1
- package/dist/theme/ThemeProvider.js +1 -1
- package/dist/theme/subscribe.d.ts +1 -1
- package/dist/theme/types.d.ts +1 -1
- package/dist/theme/useTheme.js +1 -1
- package/package.json +2 -2
|
@@ -2,7 +2,7 @@ import type { ComponentPropsWithRef, ReactNode } from 'react';
|
|
|
2
2
|
export interface AuthLayoutProps extends Omit<ComponentPropsWithRef<'div'>, 'style'> {
|
|
3
3
|
/**
|
|
4
4
|
* `split` (default) renders the 44% brand panel + form side per
|
|
5
|
-
*
|
|
5
|
+
* Login.dc.html; `single` renders only the centered 380px form
|
|
6
6
|
* column (narrow contexts: modals, Electron sign-in, mobile web).
|
|
7
7
|
*/
|
|
8
8
|
variant?: 'split' | 'single' | undefined;
|
|
@@ -27,7 +27,7 @@ export interface AuthLayoutProps extends Omit<ComponentPropsWithRef<'div'>, 'sty
|
|
|
27
27
|
}
|
|
28
28
|
/**
|
|
29
29
|
* AuthLayout — Tier-5 auth shell (research/design-system.md §3 Tier 5,
|
|
30
|
-
*
|
|
30
|
+
* Login.dc.html + Auth & Onboarding.dc.html): split
|
|
31
31
|
* brand panel with the accent gradient, logo block, testimonial + trust-badge
|
|
32
32
|
* slots, and a 380px form column. The brand panel is purely decorative
|
|
33
33
|
* marketing surface: it is `aria-hidden`, collapses away below `lg`, and the
|
|
@@ -46,7 +46,7 @@ export interface AuthTestimonialProps extends Omit<ComponentPropsWithRef<'figure
|
|
|
46
46
|
}
|
|
47
47
|
/**
|
|
48
48
|
* AuthTestimonial — the translucent testimonial card that lives on the
|
|
49
|
-
* AuthLayout brand panel (
|
|
49
|
+
* AuthLayout brand panel (Login.dc.html): white/10 card, quote,
|
|
50
50
|
* attribution line. Colors are fixed white alphas because the card always
|
|
51
51
|
* sits on the accent gradient.
|
|
52
52
|
*/
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from '../../lib/cn.js';
|
|
3
3
|
/**
|
|
4
|
-
* The brand-panel accent gradient from
|
|
5
|
-
*
|
|
4
|
+
* The brand-panel accent gradient from Login.dc.html /
|
|
5
|
+
* Auth & Onboarding.dc.html: `linear-gradient(155deg, accent,
|
|
6
6
|
* color-mix(accent 62%, black))`. A static class over token vars, so it
|
|
7
7
|
* follows every accent palette at runtime.
|
|
8
8
|
*/
|
|
9
9
|
const brandGradientClass = 'bg-accent bg-[linear-gradient(155deg,var(--accent),color-mix(in_srgb,var(--accent)_62%,#000))]';
|
|
10
10
|
/**
|
|
11
11
|
* AuthLayout — Tier-5 auth shell (research/design-system.md §3 Tier 5,
|
|
12
|
-
*
|
|
12
|
+
* Login.dc.html + Auth & Onboarding.dc.html): split
|
|
13
13
|
* brand panel with the accent gradient, logo block, testimonial + trust-badge
|
|
14
14
|
* slots, and a 380px form column. The brand panel is purely decorative
|
|
15
15
|
* marketing surface: it is `aria-hidden`, collapses away below `lg`, and the
|
|
@@ -20,7 +20,7 @@ export function AuthLayout({ variant = 'split', logo, headline, description, bra
|
|
|
20
20
|
}
|
|
21
21
|
/**
|
|
22
22
|
* AuthTestimonial — the translucent testimonial card that lives on the
|
|
23
|
-
* AuthLayout brand panel (
|
|
23
|
+
* AuthLayout brand panel (Login.dc.html): white/10 card, quote,
|
|
24
24
|
* attribution line. Colors are fixed white alphas because the card always
|
|
25
25
|
* sits on the accent gradient.
|
|
26
26
|
*/
|
|
@@ -32,7 +32,7 @@ export interface ForgotPasswordFormProps extends Omit<ComponentPropsWithRef<'for
|
|
|
32
32
|
* ("Enabled only when SMTP is configured in settings; otherwise buttons
|
|
33
33
|
* disabled"). Distinct from `loading`, which means "wait"; this means "not
|
|
34
34
|
* from here". Pair it with {@link ForgotPasswordFormProps.notice} — a disabled
|
|
35
|
-
* button with no explanation is the exact thing `
|
|
35
|
+
* button with no explanation is the exact thing `Empty States.dc.html`
|
|
36
36
|
* forbids.
|
|
37
37
|
*/
|
|
38
38
|
disabled?: boolean | undefined;
|
|
@@ -47,7 +47,7 @@ export interface ForgotPasswordFormProps extends Omit<ComponentPropsWithRef<'for
|
|
|
47
47
|
}
|
|
48
48
|
/**
|
|
49
49
|
* ForgotPasswordForm — request-a-reset-link screen per
|
|
50
|
-
*
|
|
50
|
+
* Login.dc.html (FORGOT state). Controlled composition: zero
|
|
51
51
|
* fetching. On success the host swaps in `ForgotSentState`.
|
|
52
52
|
*
|
|
53
53
|
* Endpoint contract (apps/server/src/routes/auth):
|
|
@@ -71,7 +71,7 @@ export interface ForgotSentStateProps extends Omit<ComponentPropsWithRef<'div'>,
|
|
|
71
71
|
resendHint?: ReactNode;
|
|
72
72
|
}
|
|
73
73
|
/**
|
|
74
|
-
* ForgotSentState — the SENT confirmation from
|
|
74
|
+
* ForgotSentState — the SENT confirmation from Login.dc.html,
|
|
75
75
|
* reusing `SuccessState` (pos mail-check tile + heading + copy + Done) with a
|
|
76
76
|
* resend link line. Re-submitting hits the same
|
|
77
77
|
* `POST /api/v1/auth/password/forgot` endpoint (3/hour rate bucket).
|
|
@@ -11,7 +11,7 @@ import { SuccessState } from '../success-state/index.js';
|
|
|
11
11
|
const looksLikeEmail = (value) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
|
|
12
12
|
/**
|
|
13
13
|
* ForgotPasswordForm — request-a-reset-link screen per
|
|
14
|
-
*
|
|
14
|
+
* Login.dc.html (FORGOT state). Controlled composition: zero
|
|
15
15
|
* fetching. On success the host swaps in `ForgotSentState`.
|
|
16
16
|
*
|
|
17
17
|
* Endpoint contract (apps/server/src/routes/auth):
|
|
@@ -39,7 +39,7 @@ export function ForgotPasswordForm({ labels, onSubmit, onBack, error, loading =
|
|
|
39
39
|
return (_jsxs("form", { noValidate: true, "data-part": "forgot-password-form", className: cn('flex w-full flex-col', className), onSubmit: handleSubmit, ...props, children: [onBack === undefined || labels.back === undefined ? null : (_jsx(Button, { variant: "link", onClick: onBack, iconLeft: _jsx(ArrowLeft, { className: "size-3.5 rtl:rotate-180" }), className: "mb-5 self-start text-body-sm font-bold text-fg-muted hover:text-accent", children: labels.back })), _jsx(IconTile, { tone: "accent", size: "lg", icon: _jsx(KeyRound, {}) }), _jsx("h1", { className: "mt-4 text-[23px] font-extrabold tracking-[-0.02em] text-fg", children: labels.title }), labels.subtitle === undefined ? null : (_jsx("p", { className: "mt-1.5 text-[13.5px] leading-relaxed text-fg-muted", children: labels.subtitle })), error === undefined || error === null ? null : (_jsx(Alert, { tone: "danger", role: "alert", title: error, className: "mt-4" })), notice === undefined || notice === null ? null : (_jsx(Alert, { tone: "info", title: notice, className: "mt-4" })), _jsxs("div", { className: "mt-6 flex flex-col gap-4", children: [_jsx(FormField, { label: labels.email, error: fieldError, children: _jsx(InputGroup, { type: "email", name: "email", autoComplete: "email", iconLeading: _jsx(Mail, {}), placeholder: labels.emailPlaceholder, value: email, disabled: loading || disabled, onChange: (event) => setEmail(event.target.value) }) }), _jsx(Button, { type: "submit", loading: loading, disabled: disabled, className: "w-full", children: labels.submit })] })] }));
|
|
40
40
|
}
|
|
41
41
|
/**
|
|
42
|
-
* ForgotSentState — the SENT confirmation from
|
|
42
|
+
* ForgotSentState — the SENT confirmation from Login.dc.html,
|
|
43
43
|
* reusing `SuccessState` (pos mail-check tile + heading + copy + Done) with a
|
|
44
44
|
* resend link line. Re-submitting hits the same
|
|
45
45
|
* `POST /api/v1/auth/password/forgot` endpoint (3/hour rate bucket).
|
|
@@ -39,7 +39,7 @@ export interface ResetPasswordFormProps extends Omit<ComponentPropsWithRef<'form
|
|
|
39
39
|
score?: ((password: string) => PasswordScore) | undefined;
|
|
40
40
|
}
|
|
41
41
|
/**
|
|
42
|
-
* ResetPasswordForm — set-a-new-password screen per
|
|
42
|
+
* ResetPasswordForm — set-a-new-password screen per Login.dc.html
|
|
43
43
|
* (RESET state): password + segmented strength meter + confirm field with
|
|
44
44
|
* mismatch validation. Controlled composition: zero fetching.
|
|
45
45
|
*
|
|
@@ -10,7 +10,7 @@ import { IconTile } from '../icon-tile/index.js';
|
|
|
10
10
|
import { InputGroup } from '../input-group/index.js';
|
|
11
11
|
import { PasswordStrength } from '../password-strength/index.js';
|
|
12
12
|
/**
|
|
13
|
-
* ResetPasswordForm — set-a-new-password screen per
|
|
13
|
+
* ResetPasswordForm — set-a-new-password screen per Login.dc.html
|
|
14
14
|
* (RESET state): password + segmented strength meter + confirm field with
|
|
15
15
|
* mismatch validation. Controlled composition: zero fetching.
|
|
16
16
|
*
|
|
@@ -51,7 +51,7 @@ export interface SignInFormProps extends Omit<ComponentPropsWithRef<'form'>, 'st
|
|
|
51
51
|
defaultRemember?: boolean | undefined;
|
|
52
52
|
}
|
|
53
53
|
/**
|
|
54
|
-
* SignInForm — email + password screen per
|
|
54
|
+
* SignInForm — email + password screen per Login.dc.html. Controlled
|
|
55
55
|
* composition: zero fetching; the host app owns the request and feeds back
|
|
56
56
|
* `error`/`loading`.
|
|
57
57
|
*
|
|
@@ -11,7 +11,7 @@ import { IconButton } from '../icon-button/index.js';
|
|
|
11
11
|
import { InputGroup } from '../input-group/index.js';
|
|
12
12
|
const looksLikeEmail = (value) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value);
|
|
13
13
|
/**
|
|
14
|
-
* SignInForm — email + password screen per
|
|
14
|
+
* SignInForm — email + password screen per Login.dc.html. Controlled
|
|
15
15
|
* composition: zero fetching; the host app owns the request and feeds back
|
|
16
16
|
* `error`/`loading`.
|
|
17
17
|
*
|
|
@@ -39,7 +39,7 @@ export interface TwoFactorFormProps extends Omit<ComponentPropsWithRef<'form'>,
|
|
|
39
39
|
autoSubmit?: boolean | undefined;
|
|
40
40
|
}
|
|
41
41
|
/**
|
|
42
|
-
* TwoFactorForm — the 2FA step-up challenge per
|
|
42
|
+
* TwoFactorForm — the 2FA step-up challenge per Auth &
|
|
43
43
|
* Onboarding.dc.html: invisible-input OTP over 6 cells, with a toggle to a
|
|
44
44
|
* recovery-code input. Controlled composition: zero fetching.
|
|
45
45
|
*
|
|
@@ -9,7 +9,7 @@ import { IconTile } from '../icon-tile/index.js';
|
|
|
9
9
|
import { Input } from '../input/index.js';
|
|
10
10
|
import { OtpInput } from '../otp-input/index.js';
|
|
11
11
|
/**
|
|
12
|
-
* TwoFactorForm — the 2FA step-up challenge per
|
|
12
|
+
* TwoFactorForm — the 2FA step-up challenge per Auth &
|
|
13
13
|
* Onboarding.dc.html: invisible-input OTP over 6 cells, with a toggle to a
|
|
14
14
|
* recovery-code input. Controlled composition: zero fetching.
|
|
15
15
|
*
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { VariantProps } from 'class-variance-authority';
|
|
2
2
|
import type * as React from 'react';
|
|
3
3
|
/**
|
|
4
|
-
* Button CVA map per
|
|
4
|
+
* Button CVA map per 03-component-library.md §3.1 and
|
|
5
5
|
* research/design-system.md §3 Tier 1. `size` is declared before `variant` so
|
|
6
6
|
* the `link` variant's `h-auto p-0` wins the tailwind-merge conflict.
|
|
7
7
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAKpC;;;;GAIG;AACH,eAAO,MAAM,cAAc;;;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAKpC;;;;GAIG;AACH,eAAO,MAAM,cAAc;;;8EA6B1B,CAAC;AAIF,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,EAC1D,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,8EAA8E;IAC9E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,oCAAoC;IACpC,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,wBAAgB,MAAM,CAAC,EACrB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,OAAe,EACf,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,qBAyBb"}
|
|
@@ -4,7 +4,7 @@ import { cva } from 'class-variance-authority';
|
|
|
4
4
|
import { cn } from '../../lib/cn.js';
|
|
5
5
|
import { Spinner } from '../spinner/Spinner.js';
|
|
6
6
|
/**
|
|
7
|
-
* Button CVA map per
|
|
7
|
+
* Button CVA map per 03-component-library.md §3.1 and
|
|
8
8
|
* research/design-system.md §3 Tier 1. `size` is declared before `variant` so
|
|
9
9
|
* the `link` variant's `h-auto p-0` wins the tailwind-merge conflict.
|
|
10
10
|
*/
|
|
@@ -23,7 +23,10 @@ export const buttonVariants = cva('nb-press inline-flex select-none items-center
|
|
|
23
23
|
secondary: 'border border-border-strong bg-surface text-fg hover:bg-surface-2',
|
|
24
24
|
ghost: 'text-fg-muted hover:bg-surface-3 hover:text-fg',
|
|
25
25
|
outline: 'border border-border-strong text-fg hover:bg-surface-2',
|
|
26
|
-
|
|
26
|
+
// text-accent-fg, not text-white: --accent-fg is the theme's inverted
|
|
27
|
+
// foreground for every solid fill (5.24:1 on the light --danger,
|
|
28
|
+
// 6.89:1 on the dark one; white on the dark --danger is 2.78:1).
|
|
29
|
+
destructive: 'bg-danger text-accent-fg hover:brightness-105',
|
|
27
30
|
destructiveSoft: 'bg-danger-soft text-danger hover:brightness-97',
|
|
28
31
|
soft: 'bg-accent-soft text-accent hover:brightness-97',
|
|
29
32
|
link: 'h-auto p-0 text-accent underline-offset-2 hover:underline',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAI/C,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,kHAAkH;IAChH,8DAA8D;IAC9D,sFAAsF;IACtF,mEAAmE,EACrE;IACE,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,EAAE,EAAE,oBAAoB;YACxB,EAAE,EAAE,6BAA6B;YACjC,EAAE,EAAE,mBAAmB;SACxB;QACD,OAAO,EAAE;YACP,OAAO,EAAE,2DAA2D;YACpE,SAAS,EAAE,mEAAmE;YAC9E,KAAK,EAAE,gDAAgD;YACvD,OAAO,EAAE,wDAAwD;YACjE,WAAW,EAAE
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAI/C,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,kHAAkH;IAChH,8DAA8D;IAC9D,sFAAsF;IACtF,mEAAmE,EACrE;IACE,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,EAAE,EAAE,oBAAoB;YACxB,EAAE,EAAE,6BAA6B;YACjC,EAAE,EAAE,mBAAmB;SACxB;QACD,OAAO,EAAE;YACP,OAAO,EAAE,2DAA2D;YACpE,SAAS,EAAE,mEAAmE;YAC9E,KAAK,EAAE,gDAAgD;YACvD,OAAO,EAAE,wDAAwD;YACjE,sEAAsE;YACtE,iEAAiE;YACjE,iEAAiE;YACjE,WAAW,EAAE,+CAA+C;YAC5D,eAAe,EAAE,gDAAgD;YACjE,IAAI,EAAE,gDAAgD;YACtD,IAAI,EAAE,2DAA2D;YACjE,OAAO,EAAE,oCAAoC;SAC9C;KACF;IACD,eAAe,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE;CACpD,CACF,CAAC;AAEF,MAAM,YAAY,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAW,CAAC;AAmB/D,MAAM,UAAU,MAAM,CAAC,EACrB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAO,GAAG,KAAK,EACf,OAAO,GAAG,KAAK,EACf,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACI;IACZ,MAAM,OAAO,GAAG,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC;IAEjE,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,OAAO,KAAM,KAAK,YAChC,QAAQ,GACJ,CACR,CAAC;IACJ,CAAC;IAED,OAAO,CACL,kBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,QAAQ,IAAI,OAAO,eAClB,OAAO,IAAI,SAAS,kBACjB,OAAO,IAAI,SAAS,KAC9B,KAAK,aAER,OAAO,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,IAAI,EAAE,YAAY,CAAC,IAAI,IAAI,IAAI,CAAC,GAAI,CAAC,CAAC,CAAC,QAAQ,EAClE,QAAQ,EACR,SAAS,IACH,CACV,CAAC;AACJ,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { CalendarX2, CheckCircle2, Inbox, SearchX } from 'lucide-react';
|
|
|
3
3
|
import { cn } from '../../lib/cn.js';
|
|
4
4
|
import { IconTile } from '../icon-tile/IconTile.js';
|
|
5
5
|
/**
|
|
6
|
-
* Preset → default icon + tile tone (
|
|
6
|
+
* Preset → default icon + tile tone (Empty States anatomy). Text is
|
|
7
7
|
* always supplied via props — presets carry icons + spacing only.
|
|
8
8
|
*/
|
|
9
9
|
const presetDefaults = {
|
|
@@ -6,7 +6,7 @@ export interface MonoTextProps extends Omit<React.ComponentPropsWithRef<'span'>,
|
|
|
6
6
|
/**
|
|
7
7
|
* JetBrains Mono + `tabular-nums` wrapper (the comps' `.nb-num`) — mandatory
|
|
8
8
|
* for money, KPIs, IDs, timestamps, counts, connection strings
|
|
9
|
-
* (
|
|
9
|
+
* (03-component-library.md §7.4). Never applies locale formatting;
|
|
10
10
|
* that is the caller's job.
|
|
11
11
|
*/
|
|
12
12
|
export declare function MonoText({ className, asChild, ...props }: MonoTextProps): React.JSX.Element;
|
|
@@ -4,7 +4,7 @@ import { cn } from '../../lib/cn.js';
|
|
|
4
4
|
/**
|
|
5
5
|
* JetBrains Mono + `tabular-nums` wrapper (the comps' `.nb-num`) — mandatory
|
|
6
6
|
* for money, KPIs, IDs, timestamps, counts, connection strings
|
|
7
|
-
* (
|
|
7
|
+
* (03-component-library.md §7.4). Never applies locale formatting;
|
|
8
8
|
* that is the caller's job.
|
|
9
9
|
*/
|
|
10
10
|
export function MonoText({ className, asChild = false, ...props }) {
|
|
@@ -21,7 +21,7 @@ export interface OtpInputProps extends Omit<ComponentPropsWithRef<'div'>, 'onCha
|
|
|
21
21
|
}
|
|
22
22
|
/**
|
|
23
23
|
* OtpInput — 6-cell one-time-code input rendered over a single invisible
|
|
24
|
-
* `<input autocomplete="one-time-code">` (
|
|
24
|
+
* `<input autocomplete="one-time-code">` (Auth & Onboarding pattern):
|
|
25
25
|
* typing auto-advances, paste fills all cells, Backspace clears backwards —
|
|
26
26
|
* all native single-input behaviors; the cells are a purely visual projection
|
|
27
27
|
* with the caret cell highlighted.
|
|
@@ -5,7 +5,7 @@ import { MonoText } from '../mono-text/MonoText.js';
|
|
|
5
5
|
const sanitize = (raw, length) => raw.replace(/\D/g, '').slice(0, length);
|
|
6
6
|
/**
|
|
7
7
|
* OtpInput — 6-cell one-time-code input rendered over a single invisible
|
|
8
|
-
* `<input autocomplete="one-time-code">` (
|
|
8
|
+
* `<input autocomplete="one-time-code">` (Auth & Onboarding pattern):
|
|
9
9
|
* typing auto-advances, paste fills all cells, Backspace clears backwards —
|
|
10
10
|
* all native single-input behaviors; the cells are a purely visual projection
|
|
11
11
|
* with the caret cell highlighted.
|
|
@@ -69,7 +69,7 @@ export interface PermissionMatrixProps extends Omit<React.ComponentPropsWithRef<
|
|
|
69
69
|
disabled?: boolean | undefined;
|
|
70
70
|
}
|
|
71
71
|
/**
|
|
72
|
-
* PermissionMatrix — the RBAC preset over `ToggleMatrix` per
|
|
72
|
+
* PermissionMatrix — the RBAC preset over `ToggleMatrix` per Roles
|
|
73
73
|
* Permissions.dc.html: roles as columns (locked roles render the
|
|
74
74
|
* hard-locked Owner column), permission rows grouped by category under
|
|
75
75
|
* uppercase `Eyebrow` labels, diff-aware accent dots against a baseline, and
|
|
@@ -5,7 +5,7 @@ const slug = (value) => value
|
|
|
5
5
|
.replace(/[^a-z0-9]+/g, '-')
|
|
6
6
|
.replace(/^-+|-+$/g, '');
|
|
7
7
|
/**
|
|
8
|
-
* PermissionMatrix — the RBAC preset over `ToggleMatrix` per
|
|
8
|
+
* PermissionMatrix — the RBAC preset over `ToggleMatrix` per Roles
|
|
9
9
|
* Permissions.dc.html: roles as columns (locked roles render the
|
|
10
10
|
* hard-locked Owner column), permission rows grouped by category under
|
|
11
11
|
* uppercase `Eyebrow` labels, diff-aware accent dots against a baseline, and
|
|
@@ -9,7 +9,7 @@ import { badgeVariants } from '../badge/Badge.js';
|
|
|
9
9
|
* the vocabulary is that a chip cannot invent a colour.
|
|
10
10
|
*
|
|
11
11
|
* ICONS: `hard-drive` for `local` is specified. The rest follow
|
|
12
|
-
* `
|
|
12
|
+
* `System States.dc.html`, whose "Database unreachable" state is a
|
|
13
13
|
* `database` glyph, and whose disconnected idiom is a slashed/broken plug —
|
|
14
14
|
* hence `Unplug` for the warn state, so the two remote states differ by more
|
|
15
15
|
* than colour at 11px. (They also differ by label, which is what keeps this
|
|
@@ -3,7 +3,7 @@ import type * as React from 'react';
|
|
|
3
3
|
/**
|
|
4
4
|
* Shimmer placeholder using the tokens `.nb-skel` sweep (surface-3 ↔
|
|
5
5
|
* surface-2, 1.4s; static under reduced motion). `aria-hidden` — the loading
|
|
6
|
-
* *container* carries `aria-busy` (
|
|
6
|
+
* *container* carries `aria-busy` (03-component-library.md §5.1).
|
|
7
7
|
*/
|
|
8
8
|
export declare const skeletonVariants: (props?: ({
|
|
9
9
|
rounded?: "sm" | "md" | "lg" | "full" | null | undefined;
|
|
@@ -4,7 +4,7 @@ import { cn } from '../../lib/cn.js';
|
|
|
4
4
|
/**
|
|
5
5
|
* Shimmer placeholder using the tokens `.nb-skel` sweep (surface-3 ↔
|
|
6
6
|
* surface-2, 1.4s; static under reduced motion). `aria-hidden` — the loading
|
|
7
|
-
* *container* carries `aria-busy` (
|
|
7
|
+
* *container* carries `aria-busy` (03-component-library.md §5.1).
|
|
8
8
|
*/
|
|
9
9
|
export const skeletonVariants = cva('nb-skel block', {
|
|
10
10
|
variants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper.d.ts","sourceRoot":"","sources":["../../../src/components/stepper/Stepper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM9D,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5E,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,kDAAkD;IAClD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAC/B;AAED,MAAM,WAAW,YAAa,SAAQ,qBAAqB,CAAC,IAAI,CAAC;IAC/D,KAAK,EAAE,SAAS,IAAI,EAAE,CAAC;IACvB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC;IACpD;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACpD,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B;
|
|
1
|
+
{"version":3,"file":"Stepper.d.ts","sourceRoot":"","sources":["../../../src/components/stepper/Stepper.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM9D,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAE5E,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,kDAAkD;IAClD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAC/B;AAED,MAAM,WAAW,YAAa,SAAQ,qBAAqB,CAAC,IAAI,CAAC;IAC/D,KAAK,EAAE,SAAS,IAAI,EAAE,CAAC;IACvB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC;IACpD;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IACpD,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B;AAoED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,WAAe,EACf,WAA0B,EAC1B,WAAW,EACX,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,YAAY,+BAmGd"}
|
|
@@ -3,6 +3,21 @@ import { Check, X } from 'lucide-react';
|
|
|
3
3
|
import { cn } from '../../lib/cn.js';
|
|
4
4
|
import { MonoText } from '../mono-text/MonoText.js';
|
|
5
5
|
import { Spinner } from '../spinner/Spinner.js';
|
|
6
|
+
/**
|
|
7
|
+
* Above this many horizontal steps, only the step you are ON keeps a visible
|
|
8
|
+
* label. Seven labels never fit the 760px column the connect wizard renders in,
|
|
9
|
+
* and the previous answer — let every label truncate — degraded all of them at
|
|
10
|
+
* once into "Int… So… An… Ta… M… En…".
|
|
11
|
+
*
|
|
12
|
+
* The threshold is on the STEP COUNT, not a viewport breakpoint, because the
|
|
13
|
+
* constraint is the container's width and `md:` cannot see that: the wizard is
|
|
14
|
+
* 760px wide on a 2560px monitor.
|
|
15
|
+
*/
|
|
16
|
+
const COMPACT_STEP_COUNT = 5;
|
|
17
|
+
/** Is this step's label collapsed to screen-reader-only? */
|
|
18
|
+
function labelCollapsed(compact, state) {
|
|
19
|
+
return compact && state !== 'active' && state !== 'loading';
|
|
20
|
+
}
|
|
6
21
|
function deriveState(step, index, activeIndex) {
|
|
7
22
|
if (step.state !== undefined)
|
|
8
23
|
return step.state;
|
|
@@ -17,7 +32,9 @@ const circleClasses = {
|
|
|
17
32
|
active: 'border-2 border-accent bg-surface text-accent',
|
|
18
33
|
loading: 'border border-border-strong bg-surface text-accent',
|
|
19
34
|
done: 'border border-transparent bg-accent text-accent-fg',
|
|
20
|
-
|
|
35
|
+
// text-accent-fg matches the `done` row above: one inverted foreground per
|
|
36
|
+
// theme for every solid fill (white on the dark --danger is only 2.78:1).
|
|
37
|
+
error: 'border border-transparent bg-danger text-accent-fg',
|
|
21
38
|
};
|
|
22
39
|
const labelClasses = {
|
|
23
40
|
pending: 'text-fg-subtle',
|
|
@@ -37,13 +54,27 @@ function StepCircle({ state, index }) {
|
|
|
37
54
|
*/
|
|
38
55
|
export function Stepper({ steps, activeIndex = 0, orientation = 'horizontal', onStepClick, label, className, ...props }) {
|
|
39
56
|
const vertical = orientation === 'vertical';
|
|
57
|
+
const compact = !vertical && steps.length > COMPACT_STEP_COUNT;
|
|
40
58
|
return (_jsx("ol", { "aria-label": label, "data-orientation": orientation, className: cn(vertical ? 'flex flex-col' : 'flex items-center', className), ...props, children: steps.map((step, index) => {
|
|
41
59
|
const state = deriveState(step, index, activeIndex);
|
|
42
60
|
const clickable = onStepClick !== undefined && state !== 'pending';
|
|
43
61
|
const isLast = index === steps.length - 1;
|
|
44
62
|
const connectorDone = index < activeIndex;
|
|
45
|
-
const content = (_jsxs(_Fragment, { children: [_jsx(StepCircle, { state: state, index: index }), _jsxs("span", { className: cn('min-w-0
|
|
46
|
-
|
|
63
|
+
const content = (_jsxs(_Fragment, { children: [_jsx(StepCircle, { state: state, index: index }), _jsxs("span", { className: cn(vertical ? 'min-w-0 pt-1' : undefined), children: [_jsx("span", { className: cn(
|
|
64
|
+
// `sr-only`, never `hidden`: a collapsed label is a layout
|
|
65
|
+
// decision, not a content one — the step names must stay in
|
|
66
|
+
// the accessibility tree for the <ol> to still describe the
|
|
67
|
+
// flow. Sighted users get them back via the `title` below.
|
|
68
|
+
labelCollapsed(compact, state)
|
|
69
|
+
? 'sr-only'
|
|
70
|
+
: cn('block text-body-sm transition-colors duration-150',
|
|
71
|
+
// Labels must NOT shrink. Every non-last <li> is
|
|
72
|
+
// `flex-1`, so with `min-w-0 truncate` the label was
|
|
73
|
+
// what gave way, rendering "Int… So… An…".
|
|
74
|
+
vertical ? 'truncate' : 'whitespace-nowrap', labelClasses[state])), children: step.label }), vertical && step.description !== undefined && step.description !== null ? (_jsx("span", { className: "mt-0.5 block text-caption text-fg-subtle", children: step.description })) : null] })] }));
|
|
75
|
+
return (_jsxs("li", { "aria-current": state === 'active' ? 'step' : undefined, "data-state": state, "data-compact": compact ? '' : undefined, ...(labelCollapsed(compact, state) && typeof step.label === 'string'
|
|
76
|
+
? { title: step.label }
|
|
77
|
+
: {}), className: cn(vertical ? 'relative flex gap-3 pb-6 last:pb-0' : 'flex items-center', !vertical && !isLast ? 'flex-1' : undefined), children: [vertical && !isLast ? (_jsx("span", { "aria-hidden": "true", "data-part": "connector", className: cn('absolute bottom-0 start-[13px] top-8 w-px', connectorDone ? 'bg-accent' : 'bg-border') })) : null, clickable ? (_jsx("button", { type: "button", onClick: () => onStepClick(index), className: cn('flex items-center gap-2.5 rounded-md text-start', 'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent'), children: content })) : (_jsx("span", { className: cn('flex gap-2.5', vertical ? 'min-w-0' : 'items-center'), children: content })), !vertical && !isLast ? (_jsx("span", { "aria-hidden": "true", "data-part": "connector", className: cn('mx-3 h-px min-w-4 flex-1', connectorDone ? 'bg-accent' : 'bg-border') })) : null] }, step.id));
|
|
47
78
|
}) }));
|
|
48
79
|
}
|
|
49
80
|
//# sourceMappingURL=Stepper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/Stepper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGxC,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2BhD,SAAS,WAAW,CAAC,IAAU,EAAE,KAAa,EAAE,WAAmB;IACjE,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS;QAAE,OAAO,IAAI,CAAC,KAAK,CAAC;IAChD,IAAI,KAAK,GAAG,WAAW;QAAE,OAAO,MAAM,CAAC;IACvC,IAAI,KAAK,KAAK,WAAW;QAAE,OAAO,QAAQ,CAAC;IAC3C,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,MAAM,aAAa,GAA8B;IAC/C,OAAO,EAAE,uDAAuD;IAChE,MAAM,EAAE,+CAA+C;IACvD,OAAO,EAAE,oDAAoD;IAC7D,IAAI,EAAE,oDAAoD;IAC1D,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Stepper.js","sourceRoot":"","sources":["../../../src/components/stepper/Stepper.tsx"],"names":[],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ export interface SuccessStateProps extends Omit<ComponentPropsWithRef<'div'>, 't
|
|
|
21
21
|
/**
|
|
22
22
|
* SuccessState — 56px pos-soft check tile + heading + copy + Done button;
|
|
23
23
|
* modal phase 2 everywhere and wizard terminal step
|
|
24
|
-
* (
|
|
24
|
+
* (03-component-library.md §5.3, §7.1).
|
|
25
25
|
*/
|
|
26
26
|
export declare function SuccessState({ title, body, doneLabel, onDone, autoFocusDone, icon, tone, actions, className, children, ...props }: SuccessStateProps): import("react").JSX.Element;
|
|
27
27
|
//# sourceMappingURL=SuccessState.d.ts.map
|
|
@@ -6,7 +6,7 @@ import { IconTile } from '../icon-tile/IconTile.js';
|
|
|
6
6
|
/**
|
|
7
7
|
* SuccessState — 56px pos-soft check tile + heading + copy + Done button;
|
|
8
8
|
* modal phase 2 everywhere and wizard terminal step
|
|
9
|
-
* (
|
|
9
|
+
* (03-component-library.md §5.3, §7.1).
|
|
10
10
|
*/
|
|
11
11
|
export function SuccessState({ title, body, doneLabel, onDone, autoFocusDone = true, icon, tone = 'pos', actions, className, children, ...props }) {
|
|
12
12
|
return (_jsxs("div", { "data-part": "success-state", className: cn('flex flex-col items-center px-6 py-8 text-center', className), ...props, children: [_jsx(IconTile, { size: "xl", tone: tone, icon: icon ?? _jsx(Check, {}) }), _jsx("h2", { className: "mt-4 text-modal text-fg", children: title }), body === undefined || body === null ? null : (_jsx("p", { className: "mt-1.5 max-w-[340px] text-body-sm text-fg-muted", children: body })), children, _jsxs("div", { className: "mt-6 flex items-center gap-2", children: [_jsx(Button, { autoFocus: autoFocusDone, onClick: onDone, className: "min-w-[120px]", children: doneLabel }), actions] })] }));
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
2
|
import type { ToastActionSpec, ToastItem, ToastVariant } from './Toast.js';
|
|
3
|
-
/** Max simultaneously visible toasts (
|
|
3
|
+
/** Max simultaneously visible toasts (03-component-library.md §7.2). */
|
|
4
4
|
export declare const MAX_VISIBLE_TOASTS = 4;
|
|
5
5
|
/** Auto-dismiss duration for toasts carrying an action (Undo/Download). */
|
|
6
6
|
export declare const TOAST_ACTION_DURATION = 5200;
|
|
@@ -63,7 +63,7 @@ export interface UseToastQueueReturn {
|
|
|
63
63
|
}
|
|
64
64
|
/**
|
|
65
65
|
* useToastQueue — imperative toast queue manager
|
|
66
|
-
* (
|
|
66
|
+
* (03-component-library.md §7.2): max 4 visible newest-first,
|
|
67
67
|
* overflow queues FIFO and enters as older toasts dismiss, per-variant
|
|
68
68
|
* auto-dismiss, pause-on-hover (JS timers + CSS timer bar), undo-action
|
|
69
69
|
* toasts and promise toasts (loading → success/error). Mount one queue per
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useToastQueue.d.ts","sourceRoot":"","sources":["../../../src/components/toast/useToastQueue.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE3E,
|
|
1
|
+
{"version":3,"file":"useToastQueue.d.ts","sourceRoot":"","sources":["../../../src/components/toast/useToastQueue.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,eAAe,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE3E,wEAAwE;AACxE,eAAO,MAAM,kBAAkB,IAAI,CAAC;AAEpC,2EAA2E;AAC3E,eAAO,MAAM,qBAAqB,OAAO,CAAC;AAE1C;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,0EACqC,CAAC;AAE1E,MAAM,WAAW,gBAAgB;IAC/B,OAAO,CAAC,EAAE,YAAY,GAAG,SAAS,CAAC;IACnC,KAAK,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,6FAA6F;IAC7F,MAAM,CAAC,EAAE,eAAe,GAAG,SAAS,CAAC;IACrC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACrC,yEAAyE;IACzE,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC,wEAAwE;IACxE,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACzB;AAED,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,CAAC,CAAC,CAAC;AAErE,MAAM,WAAW,oBAAoB,CAAC,CAAC;IACrC,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,EAAE,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,SAAS,CAAC,CAAC;IAC/C,KAAK,EAAE,SAAS,GAAG,CAAC,CAAC,MAAM,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC;CACrD;AAED,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,sEAAsE;IACtE,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,sEAAsE;IACtE,IAAI,EAAE,CAAC,OAAO,EAAE,gBAAgB,KAAK,MAAM,CAAC;IAC5C,4EAA4E;IAC5E,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,iFAAiF;IACjF,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACtD,qEAAqE;IACrE,OAAO,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,oBAAoB,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;IACnF,4DAA4D;IAC5D,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,+CAA+C;IAC/C,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,UAAU,EAAE,kBAAkB,CAAC;CAChC;AAoBD;;;;;;;GAOG;AACH,wBAAgB,aAAa,IAAI,mBAAmB,CAmMnD"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
2
2
|
import { TOAST_DEFAULT_DURATIONS } from './Toast.js';
|
|
3
|
-
/** Max simultaneously visible toasts (
|
|
3
|
+
/** Max simultaneously visible toasts (03-component-library.md §7.2). */
|
|
4
4
|
export const MAX_VISIBLE_TOASTS = 4;
|
|
5
5
|
/** Auto-dismiss duration for toasts carrying an action (Undo/Download). */
|
|
6
6
|
export const TOAST_ACTION_DURATION = 5200;
|
|
@@ -20,7 +20,7 @@ function resolveDuration(options) {
|
|
|
20
20
|
}
|
|
21
21
|
/**
|
|
22
22
|
* useToastQueue — imperative toast queue manager
|
|
23
|
-
* (
|
|
23
|
+
* (03-component-library.md §7.2): max 4 visible newest-first,
|
|
24
24
|
* overflow queues FIFO and enters as older toasts dismiss, per-variant
|
|
25
25
|
* auto-dismiss, pause-on-hover (JS timers + CSS timer bar), undo-action
|
|
26
26
|
* toasts and promise toasts (loading → success/error). Mount one queue per
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useToastQueue.js","sourceRoot":"","sources":["../../../src/components/toast/useToastQueue.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG1E,OAAO,EAAE,uBAAuB,EAAE,MAAM,YAAY,CAAC;AAGrD,
|
|
1
|
+
{"version":3,"file":"useToastQueue.js","sourceRoot":"","sources":["../../../src/components/toast/useToastQueue.ts"],"names":[],"mappings":"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"}
|
|
@@ -48,7 +48,7 @@ export interface ToggleMatrixProps extends Omit<React.ComponentPropsWithRef<'div
|
|
|
48
48
|
}
|
|
49
49
|
/**
|
|
50
50
|
* ToggleMatrix — generic row-entities × column-capabilities grid with
|
|
51
|
-
* tri-state cells per
|
|
51
|
+
* tri-state cells per Roles Permissions.dc.html. Column and row
|
|
52
52
|
* headers are sticky (logical `start`, so RTL mirrors), group labels render
|
|
53
53
|
* as uppercase `Eyebrow` rows, and the cells form a roving-tabindex ARIA
|
|
54
54
|
* grid: arrow keys move cell focus (direction-aware), Home/End jump within
|
|
@@ -7,7 +7,7 @@ import { Eyebrow } from '../label/index.js';
|
|
|
7
7
|
const cellKey = (rowId, columnId) => `${rowId}\x00${columnId}`;
|
|
8
8
|
/**
|
|
9
9
|
* ToggleMatrix — generic row-entities × column-capabilities grid with
|
|
10
|
-
* tri-state cells per
|
|
10
|
+
* tri-state cells per Roles Permissions.dc.html. Column and row
|
|
11
11
|
* headers are sticky (logical `start`, so RTL mirrors), group labels render
|
|
12
12
|
* as uppercase `Eyebrow` rows, and the cells form a roving-tabindex ARIA
|
|
13
13
|
* grid: arrow keys move cell focus (direction-aware), Home/End jump within
|
|
@@ -14,7 +14,7 @@ export interface ModalFlow<T> {
|
|
|
14
14
|
}
|
|
15
15
|
/**
|
|
16
16
|
* useModalFlow — state machine for the canonical two-phase (form → success)
|
|
17
|
-
* modal (
|
|
17
|
+
* modal (03-component-library.md §7.1, research/ia-mapping.md §5.3).
|
|
18
18
|
*/
|
|
19
19
|
export declare function useModalFlow<T>(): ModalFlow<T>;
|
|
20
20
|
/** Modal exit animation length — `flow.reset()` is deferred past it (§7.1). */
|
|
@@ -39,7 +39,7 @@ export interface TwoPhaseModalProps<T> extends Omit<ModalProps, 'children'> {
|
|
|
39
39
|
* preserving focus; harvested inputs echo into the success copy; Done and
|
|
40
40
|
* Esc/backdrop close, and `flow.reset()` runs after the exit animation so the
|
|
41
41
|
* success phase never flashes back to the form while closing
|
|
42
|
-
* (
|
|
42
|
+
* (03-component-library.md §7.1).
|
|
43
43
|
*/
|
|
44
44
|
export declare function TwoPhaseModal<T>({ flow, children, successTitle, successBody, doneLabel, successProps, onOpenChange, ...modalProps }: TwoPhaseModalProps<T>): import("react").JSX.Element;
|
|
45
45
|
//# sourceMappingURL=TwoPhaseModal.d.ts.map
|
|
@@ -4,7 +4,7 @@ import { Modal } from '../modal/Modal.js';
|
|
|
4
4
|
import { SuccessState } from '../success-state/SuccessState.js';
|
|
5
5
|
/**
|
|
6
6
|
* useModalFlow — state machine for the canonical two-phase (form → success)
|
|
7
|
-
* modal (
|
|
7
|
+
* modal (03-component-library.md §7.1, research/ia-mapping.md §5.3).
|
|
8
8
|
*/
|
|
9
9
|
export function useModalFlow() {
|
|
10
10
|
const [state, setState] = useState({
|
|
@@ -30,7 +30,7 @@ function resolve(value, payload) {
|
|
|
30
30
|
* preserving focus; harvested inputs echo into the success copy; Done and
|
|
31
31
|
* Esc/backdrop close, and `flow.reset()` runs after the exit animation so the
|
|
32
32
|
* success phase never flashes back to the form while closing
|
|
33
|
-
* (
|
|
33
|
+
* (03-component-library.md §7.1).
|
|
34
34
|
*/
|
|
35
35
|
export function TwoPhaseModal({ flow, children, successTitle, successBody, doneLabel, successProps, onOpenChange, ...modalProps }) {
|
|
36
36
|
const resetTimer = useRef(null);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Duration of the undo window, matching the undo-toast auto-dismiss
|
|
3
|
-
* (
|
|
3
|
+
* (03-component-library.md §7.2 — action/Undo 5200ms).
|
|
4
4
|
*/
|
|
5
5
|
export declare const UNDO_WINDOW_MS = 5200;
|
|
6
6
|
export type UndoableState = 'idle' | 'pending' | 'committed' | 'undone';
|
|
@@ -43,7 +43,7 @@ export interface UseUndoableActionReturn<T> {
|
|
|
43
43
|
}
|
|
44
44
|
/**
|
|
45
45
|
* useUndoableAction — the perform-with-undo primitive behind destructive
|
|
46
|
-
* mutations (
|
|
46
|
+
* mutations (03-component-library.md §7.2 Undo pattern): `run()`
|
|
47
47
|
* applies the mutation optimistically, then either `undo()` reverts it within
|
|
48
48
|
* the window or `commit()` finalizes it (called automatically when the window
|
|
49
49
|
* elapses, and on unmount while pending).
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
2
2
|
/**
|
|
3
3
|
* Duration of the undo window, matching the undo-toast auto-dismiss
|
|
4
|
-
* (
|
|
4
|
+
* (03-component-library.md §7.2 — action/Undo 5200ms).
|
|
5
5
|
*/
|
|
6
6
|
export const UNDO_WINDOW_MS = 5200;
|
|
7
7
|
/**
|
|
8
8
|
* useUndoableAction — the perform-with-undo primitive behind destructive
|
|
9
|
-
* mutations (
|
|
9
|
+
* mutations (03-component-library.md §7.2 Undo pattern): `run()`
|
|
10
10
|
* applies the mutation optimistically, then either `undo()` reverts it within
|
|
11
11
|
* the window or `commit()` finalizes it (called automatically when the window
|
|
12
12
|
* elapses, and on unmount while pending).
|
package/dist/lib/cn.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* `cn()` — the single class-composition utility for `@adminium/ui`
|
|
3
|
-
* (
|
|
3
|
+
* (03-component-library.md §2, §3.1).
|
|
4
4
|
*
|
|
5
5
|
* clsx handles conditional/array inputs; tailwind-merge resolves conflicting
|
|
6
6
|
* Tailwind utilities so the consumer `className` (always passed last by
|
|
@@ -18,7 +18,7 @@ export declare function cn(...inputs: ClassValue[]): string;
|
|
|
18
18
|
export type CssVarMap = Record<`--${string}`, string | number | null | undefined>;
|
|
19
19
|
/**
|
|
20
20
|
* `cssVars()` — typed builder for CSS-custom-property bags
|
|
21
|
-
* (
|
|
21
|
+
* (03-component-library.md §3.4).
|
|
22
22
|
*
|
|
23
23
|
* The JSX `style` prop is banned (`adminium/no-style-prop`); its single
|
|
24
24
|
* sanctioned escape hatch is an INLINE object literal whose every key is a
|
package/dist/lib/cn.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* `cn()` — the single class-composition utility for `@adminium/ui`
|
|
3
|
-
* (
|
|
3
|
+
* (03-component-library.md §2, §3.1).
|
|
4
4
|
*
|
|
5
5
|
* clsx handles conditional/array inputs; tailwind-merge resolves conflicting
|
|
6
6
|
* Tailwind utilities so the consumer `className` (always passed last by
|
|
@@ -37,7 +37,7 @@ export function cn(...inputs) {
|
|
|
37
37
|
}
|
|
38
38
|
/**
|
|
39
39
|
* `cssVars()` — typed builder for CSS-custom-property bags
|
|
40
|
-
* (
|
|
40
|
+
* (03-component-library.md §3.4).
|
|
41
41
|
*
|
|
42
42
|
* The JSX `style` prop is banned (`adminium/no-style-prop`); its single
|
|
43
43
|
* sanctioned escape hatch is an INLINE object literal whose every key is a
|
package/dist/lib/tones.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* lib/tones.ts — the canonical home of the semantic tone vocabulary and the
|
|
3
|
-
* status→tone registry (
|
|
3
|
+
* status→tone registry (03-component-library.md §3.3, §7.6).
|
|
4
4
|
*
|
|
5
5
|
* The SINGLE source of truth: components/icon-tile, components/badge and
|
|
6
6
|
* components/status-pill re-export from here (their wave-1 local copies are
|
|
@@ -13,7 +13,20 @@ export type Tone = 'neutral' | 'accent' | 'pos' | 'warn' | 'danger' | 'info';
|
|
|
13
13
|
export declare const TONES: readonly Tone[];
|
|
14
14
|
/** Tone → soft background + strong tone foreground utility pairs. */
|
|
15
15
|
export declare const toneSoftClasses: Record<Tone, string>;
|
|
16
|
-
/**
|
|
16
|
+
/**
|
|
17
|
+
* Tone → solid background + on-tone foreground utility pairs.
|
|
18
|
+
*
|
|
19
|
+
* Every filled tone takes `text-accent-fg`, not `text-white`. `--accent-fg` is
|
|
20
|
+
* the theme's single inverted foreground (#ffffff light, #0f0f14 dark — see the
|
|
21
|
+
* "One --accent-fg per theme" note in tokens/src/accents.css), so it is the
|
|
22
|
+
* on-filled-surface colour for ALL solid fills, not just the accent one.
|
|
23
|
+
* Hardcoding white here failed the dark theme outright: white measures 2.00:1
|
|
24
|
+
* on --pos #3ecf8e, 2.18:1 on --warn #e0a458, 2.78:1 on --danger #ff6b6b and
|
|
25
|
+
* 2.41:1 on --info #6ea8ff, against a WCAG 2.1 AA floor of 4.5:1.
|
|
26
|
+
* `text-accent-fg` measures 5.13-5.91:1 light and 6.89-9.58:1 dark on the same
|
|
27
|
+
* four fills, and stays correct inside the `.adm-always-dark` /
|
|
28
|
+
* `.adm-always-light` exception scopes, which re-declare both sides together.
|
|
29
|
+
*/
|
|
17
30
|
export declare const toneSolidClasses: Record<Tone, string>;
|
|
18
31
|
/**
|
|
19
32
|
* Tone → `color-mix` border utilities used by Alert/Banner callouts
|
|
@@ -21,13 +34,13 @@ export declare const toneSolidClasses: Record<Tone, string>;
|
|
|
21
34
|
*/
|
|
22
35
|
export declare const toneMixBorderClasses: Record<Tone, string>;
|
|
23
36
|
/**
|
|
24
|
-
* Sticky translucent bar recipe (
|
|
37
|
+
* Sticky translucent bar recipe (03-component-library.md §7.5) —
|
|
25
38
|
* used by `Topbar`, `WizardLayout` footer and sticky table headers. Exported
|
|
26
39
|
* from here so the color-mix recipe lives in exactly one place.
|
|
27
40
|
*/
|
|
28
41
|
export declare const glassBar = "sticky top-0 z-40 border-b border-border bg-[color-mix(in_srgb,var(--surface)_82%,transparent)] backdrop-blur-[8px]";
|
|
29
42
|
/**
|
|
30
|
-
* Default status→tone registry (
|
|
43
|
+
* Default status→tone registry (03-component-library.md §7.6).
|
|
31
44
|
* Extended at runtime via `registerStatusTones` (widgets/manifests register
|
|
32
45
|
* domain statuses); tints always derive from the tone — never hardcoded per
|
|
33
46
|
* feature (the "Ticket Queue hardcoded priority tint" defect fix).
|
package/dist/lib/tones.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tones.d.ts","sourceRoot":"","sources":["../../src/lib/tones.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,0DAA0D;AAC1D,MAAM,MAAM,IAAI,GAAG,SAAS,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE7E,kEAAkE;AAClE,eAAO,MAAM,KAAK,EAAE,SAAS,IAAI,EAA2D,CAAC;AAE7F,qEAAqE;AACrE,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAOhD,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"tones.d.ts","sourceRoot":"","sources":["../../src/lib/tones.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,0DAA0D;AAC1D,MAAM,MAAM,IAAI,GAAG,SAAS,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE7E,kEAAkE;AAClE,eAAO,MAAM,KAAK,EAAE,SAAS,IAAI,EAA2D,CAAC;AAE7F,qEAAqE;AACrE,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAOhD,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAOjD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAOrD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,QAAQ,wHACkG,CAAC;AAExH;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAyB9D,CAAC;AAIH,yEAAyE;AACzE,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,IAAI,CAInE;AAED,qEAAqE;AACrE,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAE,IAAgB,GAAG,IAAI,CAE3E"}
|
package/dist/lib/tones.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* lib/tones.ts — the canonical home of the semantic tone vocabulary and the
|
|
3
|
-
* status→tone registry (
|
|
3
|
+
* status→tone registry (03-component-library.md §3.3, §7.6).
|
|
4
4
|
*
|
|
5
5
|
* The SINGLE source of truth: components/icon-tile, components/badge and
|
|
6
6
|
* components/status-pill re-export from here (their wave-1 local copies are
|
|
@@ -18,14 +18,27 @@ export const toneSoftClasses = {
|
|
|
18
18
|
danger: 'bg-danger-soft text-danger',
|
|
19
19
|
info: 'bg-info-soft text-info',
|
|
20
20
|
};
|
|
21
|
-
/**
|
|
21
|
+
/**
|
|
22
|
+
* Tone → solid background + on-tone foreground utility pairs.
|
|
23
|
+
*
|
|
24
|
+
* Every filled tone takes `text-accent-fg`, not `text-white`. `--accent-fg` is
|
|
25
|
+
* the theme's single inverted foreground (#ffffff light, #0f0f14 dark — see the
|
|
26
|
+
* "One --accent-fg per theme" note in tokens/src/accents.css), so it is the
|
|
27
|
+
* on-filled-surface colour for ALL solid fills, not just the accent one.
|
|
28
|
+
* Hardcoding white here failed the dark theme outright: white measures 2.00:1
|
|
29
|
+
* on --pos #3ecf8e, 2.18:1 on --warn #e0a458, 2.78:1 on --danger #ff6b6b and
|
|
30
|
+
* 2.41:1 on --info #6ea8ff, against a WCAG 2.1 AA floor of 4.5:1.
|
|
31
|
+
* `text-accent-fg` measures 5.13-5.91:1 light and 6.89-9.58:1 dark on the same
|
|
32
|
+
* four fills, and stays correct inside the `.adm-always-dark` /
|
|
33
|
+
* `.adm-always-light` exception scopes, which re-declare both sides together.
|
|
34
|
+
*/
|
|
22
35
|
export const toneSolidClasses = {
|
|
23
36
|
neutral: 'bg-surface-3 text-fg',
|
|
24
37
|
accent: 'bg-accent text-accent-fg',
|
|
25
|
-
pos: 'bg-pos text-
|
|
26
|
-
warn: 'bg-warn text-
|
|
27
|
-
danger: 'bg-danger text-
|
|
28
|
-
info: 'bg-info text-
|
|
38
|
+
pos: 'bg-pos text-accent-fg',
|
|
39
|
+
warn: 'bg-warn text-accent-fg',
|
|
40
|
+
danger: 'bg-danger text-accent-fg',
|
|
41
|
+
info: 'bg-info text-accent-fg',
|
|
29
42
|
};
|
|
30
43
|
/**
|
|
31
44
|
* Tone → `color-mix` border utilities used by Alert/Banner callouts
|
|
@@ -40,13 +53,13 @@ export const toneMixBorderClasses = {
|
|
|
40
53
|
info: 'border-[color-mix(in_srgb,var(--info)_30%,transparent)]',
|
|
41
54
|
};
|
|
42
55
|
/**
|
|
43
|
-
* Sticky translucent bar recipe (
|
|
56
|
+
* Sticky translucent bar recipe (03-component-library.md §7.5) —
|
|
44
57
|
* used by `Topbar`, `WizardLayout` footer and sticky table headers. Exported
|
|
45
58
|
* from here so the color-mix recipe lives in exactly one place.
|
|
46
59
|
*/
|
|
47
60
|
export const glassBar = 'sticky top-0 z-40 border-b border-border bg-[color-mix(in_srgb,var(--surface)_82%,transparent)] backdrop-blur-[8px]';
|
|
48
61
|
/**
|
|
49
|
-
* Default status→tone registry (
|
|
62
|
+
* Default status→tone registry (03-component-library.md §7.6).
|
|
50
63
|
* Extended at runtime via `registerStatusTones` (widgets/manifests register
|
|
51
64
|
* domain statuses); tints always derive from the tone — never hardcoded per
|
|
52
65
|
* feature (the "Ticket Queue hardcoded priority tint" defect fix).
|
package/dist/lib/tones.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tones.js","sourceRoot":"","sources":["../../src/lib/tones.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAKH,kEAAkE;AAClE,MAAM,CAAC,MAAM,KAAK,GAAoB,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;AAE7F,qEAAqE;AACrE,MAAM,CAAC,MAAM,eAAe,GAAyB;IACnD,OAAO,EAAE,4BAA4B;IACrC,MAAM,EAAE,4BAA4B;IACpC,GAAG,EAAE,sBAAsB;IAC3B,IAAI,EAAE,wBAAwB;IAC9B,MAAM,EAAE,4BAA4B;IACpC,IAAI,EAAE,wBAAwB;CAC/B,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"tones.js","sourceRoot":"","sources":["../../src/lib/tones.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAKH,kEAAkE;AAClE,MAAM,CAAC,MAAM,KAAK,GAAoB,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;AAE7F,qEAAqE;AACrE,MAAM,CAAC,MAAM,eAAe,GAAyB;IACnD,OAAO,EAAE,4BAA4B;IACrC,MAAM,EAAE,4BAA4B;IACpC,GAAG,EAAE,sBAAsB;IAC3B,IAAI,EAAE,wBAAwB;IAC9B,MAAM,EAAE,4BAA4B;IACpC,IAAI,EAAE,wBAAwB;CAC/B,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAyB;IACpD,OAAO,EAAE,sBAAsB;IAC/B,MAAM,EAAE,0BAA0B;IAClC,GAAG,EAAE,uBAAuB;IAC5B,IAAI,EAAE,wBAAwB;IAC9B,MAAM,EAAE,0BAA0B;IAClC,IAAI,EAAE,wBAAwB;CAC/B,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAyB;IACxD,OAAO,EAAE,eAAe;IACxB,MAAM,EAAE,2DAA2D;IACnE,GAAG,EAAE,wDAAwD;IAC7D,IAAI,EAAE,yDAAyD;IAC/D,MAAM,EAAE,2DAA2D;IACnE,IAAI,EAAE,yDAAyD;CAChE,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,QAAQ,GACnB,qHAAqH,CAAC;AAExH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAmC,MAAM,CAAC,MAAM,CAAC;IAChF,IAAI,EAAE,KAAK;IACX,MAAM,EAAE,KAAK;IACb,SAAS,EAAE,KAAK;IAChB,SAAS,EAAE,KAAK;IAChB,SAAS,EAAE,KAAK;IAChB,OAAO,EAAE,KAAK;IACd,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,MAAM;IAChB,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,MAAM;IAChB,QAAQ,EAAE,MAAM;IAChB,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,QAAQ;IACf,SAAS,EAAE,QAAQ;IACnB,OAAO,EAAE,QAAQ;IACjB,QAAQ,EAAE,QAAQ;IAClB,QAAQ,EAAE,MAAM;IAChB,OAAO,EAAE,MAAM;IACf,OAAO,EAAE,MAAM;IACf,SAAS,EAAE,MAAM;IACjB,KAAK,EAAE,SAAS;IAChB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;CACpB,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAe,MAAM,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC;AAE7E,yEAAyE;AACzE,MAAM,UAAU,mBAAmB,CAAC,GAAyB;IAC3D,KAAK,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;QACjD,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,WAAW,EAAE,EAAE,IAAI,CAAC,CAAC;IAC3C,CAAC;AACH,CAAC;AAED,qEAAqE;AACrE,MAAM,UAAU,UAAU,CAAC,MAAc,EAAE,WAAiB,SAAS;IACnE,OAAO,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,IAAI,QAAQ,CAAC;AACxD,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
/**
|
|
3
3
|
* ThemeProvider — runtime for the four theming axes (theme/accent/density/locale→dir),
|
|
4
|
-
* per
|
|
4
|
+
* per 02-design-system.md §4 and 03-component-library.md §3.6.
|
|
5
5
|
*
|
|
6
6
|
* Responsibilities:
|
|
7
7
|
* 1. Resolve effective prefs per-axis (§4.2): baseline ← localStorage pre-paint
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Non-React theme subscription (
|
|
2
|
+
* Non-React theme subscription (02-design-system.md §4.1) — for
|
|
3
3
|
* Leaflet tile swaps, chart re-tints, Electron `nativeTheme` mirroring.
|
|
4
4
|
* ThemeProvider emits AFTER the DOM attributes are committed (§4 behavior 5).
|
|
5
5
|
*/
|
package/dist/theme/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Theming axis types for ThemeProvider (
|
|
2
|
+
* Theming axis types for ThemeProvider (02-design-system.md §4.1).
|
|
3
3
|
* Axis value unions come from `@adminium/tokens` so the DOM attributes,
|
|
4
4
|
* Storybook toolbar and provider can never drift apart; the locale union and
|
|
5
5
|
* the pref/resolved shapes live here because they are UI-runtime concerns.
|
package/dist/theme/useTheme.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adminiumjs/ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
}
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@adminium/tokens": "npm:@adminiumjs/tokens@0.1.
|
|
26
|
+
"@adminium/tokens": "npm:@adminiumjs/tokens@0.1.2",
|
|
27
27
|
"@radix-ui/react-checkbox": "^1.3.3",
|
|
28
28
|
"@radix-ui/react-dialog": "^1.1.15",
|
|
29
29
|
"@radix-ui/react-direction": "^1.1.1",
|