@path58/ui 2.0.0 → 2.2.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/Alert/Alert.d.ts +39 -0
- package/dist/atoms/Alert/Alert.d.ts.map +1 -0
- package/dist/atoms/Alert/Alert.stories.d.ts +12 -0
- package/dist/atoms/Alert/Alert.stories.d.ts.map +1 -0
- package/dist/atoms/Alert/index.d.ts +3 -0
- package/dist/atoms/Alert/index.d.ts.map +1 -0
- package/dist/atoms/Banner/Banner.d.ts +48 -0
- package/dist/atoms/Banner/Banner.d.ts.map +1 -0
- package/dist/atoms/Banner/Banner.stories.d.ts +11 -0
- package/dist/atoms/Banner/Banner.stories.d.ts.map +1 -0
- package/dist/atoms/Banner/index.d.ts +3 -0
- package/dist/atoms/Banner/index.d.ts.map +1 -0
- package/dist/atoms/StatusPill/StatusPill.d.ts +47 -0
- package/dist/atoms/StatusPill/StatusPill.d.ts.map +1 -0
- package/dist/atoms/StatusPill/index.d.ts +3 -0
- package/dist/atoms/StatusPill/index.d.ts.map +1 -0
- package/dist/atoms/Toast/Toast.d.ts +49 -0
- package/dist/atoms/Toast/Toast.d.ts.map +1 -0
- package/dist/atoms/Toast/Toast.stories.d.ts +10 -0
- package/dist/atoms/Toast/Toast.stories.d.ts.map +1 -0
- package/dist/atoms/Toast/index.d.ts +3 -0
- package/dist/atoms/Toast/index.d.ts.map +1 -0
- package/dist/atoms/index.d.ts +4 -0
- package/dist/atoms/index.d.ts.map +1 -1
- package/dist/index.d.ts +15 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1974 -411
- package/dist/molecules/ConfirmDialog/ConfirmDialog.d.ts +43 -0
- package/dist/molecules/ConfirmDialog/ConfirmDialog.d.ts.map +1 -0
- package/dist/molecules/ConfirmDialog/ConfirmDialog.stories.d.ts +9 -0
- package/dist/molecules/ConfirmDialog/ConfirmDialog.stories.d.ts.map +1 -0
- package/dist/molecules/ConfirmDialog/index.d.ts +3 -0
- package/dist/molecules/ConfirmDialog/index.d.ts.map +1 -0
- package/dist/molecules/Modal/Modal.d.ts +39 -0
- package/dist/molecules/Modal/Modal.d.ts.map +1 -0
- package/dist/molecules/Modal/Modal.stories.d.ts +11 -0
- package/dist/molecules/Modal/Modal.stories.d.ts.map +1 -0
- package/dist/molecules/Modal/index.d.ts +3 -0
- package/dist/molecules/Modal/index.d.ts.map +1 -0
- package/dist/molecules/PromptDialog/PromptDialog.d.ts +46 -0
- package/dist/molecules/PromptDialog/PromptDialog.d.ts.map +1 -0
- package/dist/molecules/PromptDialog/PromptDialog.stories.d.ts +10 -0
- package/dist/molecules/PromptDialog/PromptDialog.stories.d.ts.map +1 -0
- package/dist/molecules/PromptDialog/index.d.ts +3 -0
- package/dist/molecules/PromptDialog/index.d.ts.map +1 -0
- package/dist/molecules/index.d.ts +3 -0
- package/dist/molecules/index.d.ts.map +1 -1
- package/dist/organisms/ToastProvider/ToastProvider.d.ts +53 -0
- package/dist/organisms/ToastProvider/ToastProvider.d.ts.map +1 -0
- package/dist/organisms/ToastProvider/index.d.ts +4 -0
- package/dist/organisms/ToastProvider/index.d.ts.map +1 -0
- package/dist/organisms/ToastProvider/useToast.d.ts +28 -0
- package/dist/organisms/ToastProvider/useToast.d.ts.map +1 -0
- package/dist/organisms/index.d.ts +1 -0
- package/dist/organisms/index.d.ts.map +1 -1
- package/dist/primitives/Dialog/Dialog.d.ts +63 -0
- package/dist/primitives/Dialog/Dialog.d.ts.map +1 -0
- package/dist/primitives/Dialog/Dialog.stories.d.ts +9 -0
- package/dist/primitives/Dialog/Dialog.stories.d.ts.map +1 -0
- package/dist/primitives/Dialog/index.d.ts +3 -0
- package/dist/primitives/Dialog/index.d.ts.map +1 -0
- package/dist/primitives/index.d.ts +1 -0
- package/dist/primitives/index.d.ts.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +17 -2
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './Alert.css';
|
|
3
|
+
export type AlertVariant = 'success' | 'warning' | 'danger' | 'info';
|
|
4
|
+
export type AlertSize = 'sm' | 'md';
|
|
5
|
+
export interface AlertProps {
|
|
6
|
+
/** Status variant — routes through the sacred semantic palette (BRAND_ARCH § 5). */
|
|
7
|
+
variant: AlertVariant;
|
|
8
|
+
/** Optional title — bolded, sits above message. */
|
|
9
|
+
title?: string;
|
|
10
|
+
/** Body message. */
|
|
11
|
+
message: string | React.ReactNode;
|
|
12
|
+
/** Whether the × dismiss button renders. Default false. */
|
|
13
|
+
dismissible?: boolean;
|
|
14
|
+
/** Called when × clicked (only if dismissible). */
|
|
15
|
+
onDismiss?: () => void;
|
|
16
|
+
/** Override the default variant icon. Pass `null` to render no icon. */
|
|
17
|
+
icon?: React.ReactNode | null;
|
|
18
|
+
/**
|
|
19
|
+
* Size:
|
|
20
|
+
* - `md` (default) — primary inline alert.
|
|
21
|
+
* - `sm` — compact, for form-field error context.
|
|
22
|
+
*/
|
|
23
|
+
size?: AlertSize;
|
|
24
|
+
className?: string;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Alert — DSGN-3.6.5 (atom)
|
|
28
|
+
*
|
|
29
|
+
* Inline status surface. Use for form-field error/help text, content-block
|
|
30
|
+
* status notes, contextual info inside a card or panel. For page-level
|
|
31
|
+
* status, use Banner. For transient feedback, use Toast.
|
|
32
|
+
*
|
|
33
|
+
* A11y:
|
|
34
|
+
* - success / warning / info → `role="status"` + `aria-live="polite"`
|
|
35
|
+
* - danger only → `role="alert"` + `aria-live="assertive"`
|
|
36
|
+
*/
|
|
37
|
+
export declare const Alert: React.FC<AlertProps>;
|
|
38
|
+
export default Alert;
|
|
39
|
+
//# sourceMappingURL=Alert.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/atoms/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AACrE,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpC,MAAM,WAAW,UAAU;IACzB,oFAAoF;IACpF,OAAO,EAAE,YAAY,CAAC;IACtB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,2DAA2D;IAC3D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,wEAAwE;IACxE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;IAC9B;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgBD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA+CtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { Alert } from './Alert';
|
|
3
|
+
declare const meta: Meta<typeof Alert>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Alert>;
|
|
6
|
+
export declare const Success: Story;
|
|
7
|
+
export declare const Warning: Story;
|
|
8
|
+
export declare const Danger: Story;
|
|
9
|
+
export declare const Info: Story;
|
|
10
|
+
export declare const Small: Story;
|
|
11
|
+
export declare const Dismissible: Story;
|
|
12
|
+
//# sourceMappingURL=Alert.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Alert.stories.d.ts","sourceRoot":"","sources":["../../../src/atoms/Alert/Alert.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CAc5B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AACF,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AACF,eAAO,MAAM,MAAM,EAAE,KAEpB,CAAC;AACF,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAC;AACF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AACF,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atoms/Alert/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AACpF,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './Banner.css';
|
|
3
|
+
export type BannerVariant = 'success' | 'warning' | 'danger' | 'info';
|
|
4
|
+
export type BannerPosition = 'inline' | 'sticky-top';
|
|
5
|
+
export interface BannerAction {
|
|
6
|
+
label: string;
|
|
7
|
+
onClick: () => void;
|
|
8
|
+
}
|
|
9
|
+
export interface BannerProps {
|
|
10
|
+
/** Status variant — routes through the sacred semantic palette (BRAND_ARCH § 5). */
|
|
11
|
+
variant: BannerVariant;
|
|
12
|
+
/** Optional title — bolded, sits above message. */
|
|
13
|
+
title?: string;
|
|
14
|
+
/** Body message. */
|
|
15
|
+
message: string | React.ReactNode;
|
|
16
|
+
/** Whether the × dismiss button renders. Default false (Banner is persistent). */
|
|
17
|
+
dismissible?: boolean;
|
|
18
|
+
/** Called when × clicked (only if dismissible). */
|
|
19
|
+
onDismiss?: () => void;
|
|
20
|
+
/** Optional action button (e.g. "Retry", "Learn more"). */
|
|
21
|
+
action?: BannerAction;
|
|
22
|
+
/** Override the default variant icon. Pass `null` to render no icon. */
|
|
23
|
+
icon?: React.ReactNode | null;
|
|
24
|
+
/**
|
|
25
|
+
* Layout position:
|
|
26
|
+
* - `inline` — flows naturally in document (default).
|
|
27
|
+
* - `sticky-top` — `position: sticky; top: 0;` for page-level system messages.
|
|
28
|
+
*
|
|
29
|
+
* Layer ordering for `sticky-top`: Modal (1000) > Toast (1100) > Banner-sticky
|
|
30
|
+
* (200) > page content. Modal + Toast always overlay Banner.
|
|
31
|
+
*/
|
|
32
|
+
position?: BannerPosition;
|
|
33
|
+
className?: string;
|
|
34
|
+
}
|
|
35
|
+
/**
|
|
36
|
+
* Banner — DSGN-3.6.5 (atom)
|
|
37
|
+
*
|
|
38
|
+
* Persistent page-level status surface. Use for outages, deprecation notices,
|
|
39
|
+
* maintenance windows, feature announcements. For transient feedback (save
|
|
40
|
+
* success), use Toast (DSGN-3.6.4). For inline form-field errors, use Alert.
|
|
41
|
+
*
|
|
42
|
+
* A11y:
|
|
43
|
+
* - default / success / warning / info → `role="region"` + `aria-label`
|
|
44
|
+
* - danger only → `role="alert"`
|
|
45
|
+
*/
|
|
46
|
+
export declare const Banner: React.FC<BannerProps>;
|
|
47
|
+
export default Banner;
|
|
48
|
+
//# sourceMappingURL=Banner.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/atoms/Banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AACtE,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,YAAY,CAAC;AAErD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,WAAW;IAC1B,oFAAoF;IACpF,OAAO,EAAE,aAAa,CAAC;IACvB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oBAAoB;IACpB,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,kFAAkF;IAClF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,2DAA2D;IAC3D,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,wEAAwE;IACxE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;IAC9B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgBD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAuDxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
import { Banner } from './Banner';
|
|
3
|
+
declare const meta: Meta<typeof Banner>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof Banner>;
|
|
6
|
+
export declare const Success: Story;
|
|
7
|
+
export declare const Warning: Story;
|
|
8
|
+
export declare const Danger: Story;
|
|
9
|
+
export declare const Info: Story;
|
|
10
|
+
export declare const StickyTop: Story;
|
|
11
|
+
//# sourceMappingURL=Banner.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Banner.stories.d.ts","sourceRoot":"","sources":["../../../src/atoms/Banner/Banner.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAa7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAErC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAQpB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAKlB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAsBvB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atoms/Banner/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EACN,KAAK,WAAW,EAChB,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,YAAY,GAClB,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './StatusPill.css';
|
|
3
|
+
export type StatusPillState = 'healthy' | 'warn' | 'down' | 'info';
|
|
4
|
+
export interface StatusPillProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
5
|
+
/**
|
|
6
|
+
* Semantic state. Determines which token family the pill consumes:
|
|
7
|
+
* - `healthy` → `--p58-success` (green; theme-dispatched under AXE)
|
|
8
|
+
* - `warn` → `--p58-warning` (amber)
|
|
9
|
+
* - `down` → `--p58-danger` (red)
|
|
10
|
+
* - `info` → `--p58-info` (blue)
|
|
11
|
+
*
|
|
12
|
+
* Theme accents (`--p58-teal-*` / `--p58-axe-accent-*`) are NOT options here —
|
|
13
|
+
* accent is reserved for theme-specific moments (AXE Score hero, BRAND eyebrow,
|
|
14
|
+
* winning-arm-score), not for status state. Per
|
|
15
|
+
* `BRAND_ARCHITECTURE.md § 5 "Semantic colors are sacred"`.
|
|
16
|
+
*/
|
|
17
|
+
state: StatusPillState;
|
|
18
|
+
/**
|
|
19
|
+
* Optional leading dot glyph (filled circle in `currentColor`).
|
|
20
|
+
* Defaults to `true` — set `false` to render a label-only pill.
|
|
21
|
+
*/
|
|
22
|
+
withDot?: boolean;
|
|
23
|
+
children: React.ReactNode;
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* StatusPill Atom
|
|
27
|
+
*
|
|
28
|
+
* Renders a semantic state pill (healthy / warn / down / info) consuming the
|
|
29
|
+
* canonical `--p58-{success|warning|danger|info}` tokens by construction.
|
|
30
|
+
* Authors cannot misroute the colors — the token consumption is built into the
|
|
31
|
+
* CSS class, not exposed as a prop.
|
|
32
|
+
*
|
|
33
|
+
* Genesis: DSGN-2.1.3 Tsvika ZT 2026-06-07 — an earlier AXE Report dashboard
|
|
34
|
+
* draft consumed `--p58-axe-accent` for the "healthy" pill, conflating semantic
|
|
35
|
+
* state with theme-specific moment. The fix established the 5-layer enforcement
|
|
36
|
+
* defense; this primitive is Layer 2.
|
|
37
|
+
*
|
|
38
|
+
* Usage:
|
|
39
|
+
* ```tsx
|
|
40
|
+
* <StatusPill state="healthy">healthy</StatusPill>
|
|
41
|
+
* <StatusPill state="warn">regressed</StatusPill>
|
|
42
|
+
* <StatusPill state="down">failing</StatusPill>
|
|
43
|
+
* ```
|
|
44
|
+
*/
|
|
45
|
+
export declare const StatusPill: React.FC<StatusPillProps>;
|
|
46
|
+
export default StatusPill;
|
|
47
|
+
//# sourceMappingURL=StatusPill.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StatusPill.d.ts","sourceRoot":"","sources":["../../../src/atoms/StatusPill/StatusPill.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,kBAAkB,CAAC;AAE1B,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;AAEnE,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC5E;;;;;;;;;;;OAWG;IACH,KAAK,EAAE,eAAe,CAAC;IACvB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAkBhD,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atoms/StatusPill/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './Toast.css';
|
|
3
|
+
export type ToastVariant = 'default' | 'success' | 'warning' | 'danger' | 'info';
|
|
4
|
+
export interface ToastAction {
|
|
5
|
+
label: string;
|
|
6
|
+
onClick: () => void;
|
|
7
|
+
}
|
|
8
|
+
export interface ToastProps {
|
|
9
|
+
/** Unique id (used by ToastProvider for queue tracking). */
|
|
10
|
+
id: string;
|
|
11
|
+
/** The message body. */
|
|
12
|
+
message: string | React.ReactNode;
|
|
13
|
+
/** Status variant routes the left-edge stripe through the sacred palette (per BRAND_ARCH § 5). */
|
|
14
|
+
variant?: ToastVariant;
|
|
15
|
+
/**
|
|
16
|
+
* Auto-dismiss after this many ms. `-1` means persistent until user dismisses.
|
|
17
|
+
* Pause-on-hover clears the timer; mouseleave restarts.
|
|
18
|
+
* Default: 5000.
|
|
19
|
+
*/
|
|
20
|
+
duration?: number;
|
|
21
|
+
/** Optional action button (dismisses parent toast after onClick). */
|
|
22
|
+
action?: ToastAction;
|
|
23
|
+
/** Fires when the toast should dismiss (timeout, ×-click, or action-click). */
|
|
24
|
+
onDismiss: (id: string) => void;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Toast — atomic leaf (DSGN-3.6.4)
|
|
28
|
+
*
|
|
29
|
+
* Single toast rendering. Owned by ToastProvider (organism) which manages the
|
|
30
|
+
* queue + portal mount + position-stack. Consumers do NOT instantiate Toast
|
|
31
|
+
* directly — they call `useToast()` and the Provider renders the leaf.
|
|
32
|
+
*
|
|
33
|
+
* A11y:
|
|
34
|
+
* - role="status" for default/success/warning/info → aria-live="polite"
|
|
35
|
+
* - role="alert" for danger only → aria-live="assertive"
|
|
36
|
+
*
|
|
37
|
+
* Token consumption (per DSGN-3.6.1 D1 Toast row):
|
|
38
|
+
* surface → --p58-surface-2
|
|
39
|
+
* border → --p58-border (baseline) — overridden left-rail per variant
|
|
40
|
+
* left-stripe → --p58-{success|warning|danger|info} (sacred § 5)
|
|
41
|
+
* default variant → --p58-border-strong (neutral)
|
|
42
|
+
* text → --p58-fg-1 + --p58-fg-2
|
|
43
|
+
* dismiss × → --p58-fg-3 (resting) / --p58-fg-1 (hover)
|
|
44
|
+
*
|
|
45
|
+
* Pause-on-hover: clearTimeout on enter, schedule fresh timeout on leave.
|
|
46
|
+
*/
|
|
47
|
+
export declare const Toast: React.FC<ToastProps>;
|
|
48
|
+
export default Toast;
|
|
49
|
+
//# sourceMappingURL=Toast.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/atoms/Toast/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AAEjF,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,UAAU;IACzB,4DAA4D;IAC5D,EAAE,EAAE,MAAM,CAAC;IACX,wBAAwB;IACxB,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,kGAAkG;IAClG,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,+EAA+E;IAC/E,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAyEtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react';
|
|
2
|
+
declare const meta: Meta;
|
|
3
|
+
export default meta;
|
|
4
|
+
type Story = StoryObj;
|
|
5
|
+
export declare const TopRight: Story;
|
|
6
|
+
export declare const TopLeft: Story;
|
|
7
|
+
export declare const BottomRight: Story;
|
|
8
|
+
export declare const BottomLeft: Story;
|
|
9
|
+
export declare const MaxVisibleOne: Story;
|
|
10
|
+
//# sourceMappingURL=Toast.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Toast.stories.d.ts","sourceRoot":"","sources":["../../../src/atoms/Toast/Toast.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,QAAA,MAAM,IAAI,EAAE,IAcX,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AA6BtB,eAAO,MAAM,QAAQ,EAAE,KAAkC,CAAC;AAC1D,eAAO,MAAM,OAAO,EAAE,KAAsD,CAAC;AAC7E,eAAO,MAAM,WAAW,EAAE,KAA0D,CAAC;AACrF,eAAO,MAAM,UAAU,EAAE,KAAyD,CAAC;AACnF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atoms/Toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,EACL,KAAK,UAAU,EACf,KAAK,YAAY,EACjB,KAAK,WAAW,GACjB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC"}
|
package/dist/atoms/index.d.ts
CHANGED
|
@@ -4,6 +4,9 @@
|
|
|
4
4
|
* Basic building blocks of the design system.
|
|
5
5
|
*/
|
|
6
6
|
export * from './Button';
|
|
7
|
+
export * from './Toast';
|
|
8
|
+
export * from './Banner';
|
|
9
|
+
export * from './Alert';
|
|
7
10
|
export * from './Input';
|
|
8
11
|
export * from './Badge';
|
|
9
12
|
export * from './Icon';
|
|
@@ -12,4 +15,5 @@ export * from './Label';
|
|
|
12
15
|
export * from './Container';
|
|
13
16
|
export * from './List';
|
|
14
17
|
export * from './ListItem';
|
|
18
|
+
export * from './StatusPill';
|
|
15
19
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/atoms/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/atoms/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,UAAU,CAAC;AAGzB,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -28,15 +28,22 @@ export * from './atoms/Label';
|
|
|
28
28
|
export * from './atoms/Container';
|
|
29
29
|
export * from './atoms/List';
|
|
30
30
|
export * from './atoms/ListItem';
|
|
31
|
+
export * from './atoms/Toast';
|
|
32
|
+
export * from './atoms/Banner';
|
|
33
|
+
export * from './atoms/Alert';
|
|
31
34
|
export * from './molecules/SearchInput';
|
|
32
35
|
export * from './molecules/TagBadge';
|
|
33
36
|
export * from './molecules/InfoCard';
|
|
34
37
|
export * from './molecules/CategoryHeader';
|
|
35
38
|
export * from './molecules/FileItem';
|
|
39
|
+
export * from './molecules/Modal';
|
|
40
|
+
export * from './molecules/ConfirmDialog';
|
|
41
|
+
export * from './molecules/PromptDialog';
|
|
36
42
|
export * from './organisms/SearchSection';
|
|
37
43
|
export * from './organisms/TagFilterList';
|
|
38
44
|
export * from './organisms/CategoryGroup';
|
|
39
45
|
export * from './organisms/ArtifactList';
|
|
46
|
+
export * from './organisms/ToastProvider';
|
|
40
47
|
export * from './primitives';
|
|
41
48
|
export type { ButtonProps, } from './atoms/Button';
|
|
42
49
|
export type { InputProps, } from './atoms/Input';
|
|
@@ -56,5 +63,13 @@ export type { SearchSectionProps, } from './organisms/SearchSection';
|
|
|
56
63
|
export type { TagFilterListProps, } from './organisms/TagFilterList';
|
|
57
64
|
export type { CategoryGroupProps, } from './organisms/CategoryGroup';
|
|
58
65
|
export type { ArtifactListProps, } from './organisms/ArtifactList';
|
|
66
|
+
export type { DialogProps, } from './primitives/Dialog';
|
|
67
|
+
export type { ModalProps, ModalSize, } from './molecules/Modal';
|
|
68
|
+
export type { ConfirmDialogProps, ConfirmDialogVariant, } from './molecules/ConfirmDialog';
|
|
69
|
+
export type { PromptDialogProps, PromptDialogInputType, } from './molecules/PromptDialog';
|
|
70
|
+
export type { ToastProps, ToastVariant, ToastAction, } from './atoms/Toast';
|
|
71
|
+
export type { ToastProviderProps, ToastPosition, ToastInit, ToastApi, } from './organisms/ToastProvider';
|
|
72
|
+
export type { BannerProps, BannerVariant, BannerPosition, BannerAction, } from './atoms/Banner';
|
|
73
|
+
export type { AlertProps, AlertVariant, AlertSize, } from './atoms/Alert';
|
|
59
74
|
export type { Artifact, } from './types';
|
|
60
75
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAGH,OAAO,cAAc,CAAC;AAGtB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAGH,OAAO,cAAc,CAAC;AAGtB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AAEjC,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAG9B,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,sBAAsB,CAAC;AAErC,cAAc,mBAAmB,CAAC;AAClC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AAGzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AAEzC,cAAc,2BAA2B,CAAC;AAG1C,cAAc,cAAc,CAAC;AAG7B,YAAY,EACV,WAAW,GACZ,MAAM,gBAAgB,CAAC;AAExB,YAAY,EACV,UAAU,GACX,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,UAAU,GACX,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,SAAS,GACV,MAAM,cAAc,CAAC;AAEtB,YAAY,EACV,kBAAkB,GACnB,MAAM,uBAAuB,CAAC;AAE/B,YAAY,EACV,UAAU,GACX,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,cAAc,GACf,MAAM,mBAAmB,CAAC;AAE3B,YAAY,EACV,SAAS,GACV,MAAM,cAAc,CAAC;AAEtB,YAAY,EACV,aAAa,GACd,MAAM,kBAAkB,CAAC;AAE1B,YAAY,EACV,gBAAgB,GACjB,MAAM,yBAAyB,CAAC;AAEjC,YAAY,EACV,aAAa,GACd,MAAM,sBAAsB,CAAC;AAE9B,YAAY,EACV,aAAa,GACd,MAAM,sBAAsB,CAAC;AAE9B,YAAY,EACV,mBAAmB,GACpB,MAAM,4BAA4B,CAAC;AAEpC,YAAY,EACV,aAAa,GACd,MAAM,sBAAsB,CAAC;AAE9B,YAAY,EACV,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,YAAY,EACV,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,YAAY,EACV,kBAAkB,GACnB,MAAM,2BAA2B,CAAC;AAEnC,YAAY,EACV,iBAAiB,GAClB,MAAM,0BAA0B,CAAC;AAIlC,YAAY,EACV,WAAW,GACZ,MAAM,qBAAqB,CAAC;AAE7B,YAAY,EACV,UAAU,EACV,SAAS,GACV,MAAM,mBAAmB,CAAC;AAE3B,YAAY,EACV,kBAAkB,EAClB,oBAAoB,GACrB,MAAM,2BAA2B,CAAC;AAEnC,YAAY,EACV,iBAAiB,EACjB,qBAAqB,GACtB,MAAM,0BAA0B,CAAC;AAElC,YAAY,EACV,UAAU,EACV,YAAY,EACZ,WAAW,GACZ,MAAM,eAAe,CAAC;AAEvB,YAAY,EACV,kBAAkB,EAClB,aAAa,EACb,SAAS,EACT,QAAQ,GACT,MAAM,2BAA2B,CAAC;AAEnC,YAAY,EACV,WAAW,EACX,aAAa,EACb,cAAc,EACd,YAAY,GACb,MAAM,gBAAgB,CAAC;AAExB,YAAY,EACV,UAAU,EACV,YAAY,EACZ,SAAS,GACV,MAAM,eAAe,CAAC;AAGvB,YAAY,EACV,QAAQ,GACT,MAAM,SAAS,CAAC"}
|