@starci/grammar 0.12.14 → 0.14.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/LICENSE +21 -21
- package/README.md +34 -31
- package/dist/.build-stamp.json +4 -4
- package/dist/common/components-forms.css +28 -44
- package/dist/common/components-list-panel.css +8 -0
- package/dist/common/components-navigation.css +163 -6
- package/dist/common/components-overlays.css +41 -2
- package/dist/common/conformance.d.ts +3 -8
- package/dist/common/conformance.d.ts.map +1 -1
- package/dist/common/conformance.js +4 -9
- package/dist/common/conformance.js.map +1 -1
- package/dist/common/registry.d.ts +24 -21
- package/dist/common/registry.d.ts.map +1 -1
- package/dist/common/registry.js +4 -4
- package/dist/common/registry.js.map +1 -1
- package/dist/common/renderers-forms.d.ts +11 -11
- package/dist/common/renderers-navigation.d.ts +5 -5
- package/dist/common/renderers-navigation.d.ts.map +1 -1
- package/dist/common/renderers-navigation.js +1 -1
- package/dist/common/renderers-navigation.js.map +1 -1
- package/dist/common/renderers-overlays.d.ts +2 -2
- package/dist/common/renderers-overlays.d.ts.map +1 -1
- package/dist/common/renderers-overlays.js.map +1 -1
- package/dist/common/renderers.d.ts +4 -1
- package/dist/common/renderers.d.ts.map +1 -1
- package/dist/common/renderers.js +3 -0
- package/dist/common/renderers.js.map +1 -1
- package/dist/common/{rule-catalog.generated.d.ts → rule-catalog.d.ts} +1 -1
- package/dist/common/rule-catalog.d.ts.map +1 -0
- package/dist/common/{rule-catalog.generated.js → rule-catalog.js} +2 -4
- package/dist/common/rule-catalog.js.map +1 -0
- package/dist/common/styles.css +236 -48
- package/dist/core/branch/ComboBox/index.d.ts +5 -5
- package/dist/core/branch/ComboBox/index.d.ts.map +1 -1
- package/dist/core/branch/ComboBox/index.js +9 -2
- package/dist/core/branch/ComboBox/index.js.map +1 -1
- package/dist/core/branch/DataTable/index.d.ts +20 -3
- package/dist/core/branch/DataTable/index.d.ts.map +1 -1
- package/dist/core/branch/DataTable/index.js +45 -8
- package/dist/core/branch/DataTable/index.js.map +1 -1
- package/dist/core/branch/FlowGraph/index.d.ts +26 -7
- package/dist/core/branch/FlowGraph/index.d.ts.map +1 -1
- package/dist/core/branch/FlowGraph/index.js +132 -30
- package/dist/core/branch/FlowGraph/index.js.map +1 -1
- package/dist/core/branch/FlowGraph/layout.d.ts +34 -1
- package/dist/core/branch/FlowGraph/layout.d.ts.map +1 -1
- package/dist/core/branch/FlowGraph/layout.js +82 -0
- package/dist/core/branch/FlowGraph/layout.js.map +1 -1
- package/dist/core/branch/FlowGraph/types.d.ts +13 -1
- package/dist/core/branch/FlowGraph/types.d.ts.map +1 -1
- package/dist/core/branch/ListBox/index.d.ts +4 -2
- package/dist/core/branch/ListBox/index.d.ts.map +1 -1
- package/dist/core/branch/ListBox/index.js +2 -2
- package/dist/core/branch/ListBox/index.js.map +1 -1
- package/dist/core/branch/MarkdownArticle/index.d.ts +7 -1
- package/dist/core/branch/MarkdownArticle/index.d.ts.map +1 -1
- package/dist/core/branch/MarkdownArticle/index.js +5 -2
- package/dist/core/branch/MarkdownArticle/index.js.map +1 -1
- package/dist/core/branch/Select/index.d.ts +6 -8
- package/dist/core/branch/Select/index.d.ts.map +1 -1
- package/dist/core/branch/Select/index.js +9 -5
- package/dist/core/branch/Select/index.js.map +1 -1
- package/dist/core/branch/SurfaceCard/index.d.ts +9 -0
- package/dist/core/branch/SurfaceCard/index.d.ts.map +1 -1
- package/dist/core/branch/SurfaceCard/index.js +3 -2
- package/dist/core/branch/SurfaceCard/index.js.map +1 -1
- package/dist/core/branch/Tabs/index.d.ts.map +1 -1
- package/dist/core/branch/Tabs/index.js +17 -0
- package/dist/core/branch/Tabs/index.js.map +1 -1
- package/dist/core/branch/Tooltip/index.d.ts +9 -1
- package/dist/core/branch/Tooltip/index.d.ts.map +1 -1
- package/dist/core/branch/Tooltip/index.js +2 -2
- package/dist/core/branch/Tooltip/index.js.map +1 -1
- package/dist/core/buttonIntent.d.ts.map +1 -1
- package/dist/core/buttonIntent.js +1 -2
- package/dist/core/buttonIntent.js.map +1 -1
- package/dist/core/collectionItem.d.ts +3 -3
- package/dist/core/collectionItem.d.ts.map +1 -1
- package/dist/core/collectionItem.js +1 -2
- package/dist/core/collectionItem.js.map +1 -1
- package/dist/core/composite/Alert/index.d.ts +5 -0
- package/dist/core/composite/Alert/index.d.ts.map +1 -1
- package/dist/core/composite/Alert/index.js +7 -2
- package/dist/core/composite/Alert/index.js.map +1 -1
- package/dist/core/composite/CheckboxGroup/index.d.ts +6 -5
- package/dist/core/composite/CheckboxGroup/index.d.ts.map +1 -1
- package/dist/core/composite/CheckboxGroup/index.js +10 -3
- package/dist/core/composite/CheckboxGroup/index.js.map +1 -1
- package/dist/core/composite/DescriptionList/index.d.ts +3 -2
- package/dist/core/composite/DescriptionList/index.d.ts.map +1 -1
- package/dist/core/composite/DescriptionList/index.js +5 -4
- package/dist/core/composite/DescriptionList/index.js.map +1 -1
- package/dist/core/composite/RadioGroup/index.d.ts +5 -3
- package/dist/core/composite/RadioGroup/index.d.ts.map +1 -1
- package/dist/core/composite/RadioGroup/index.js +9 -2
- package/dist/core/composite/RadioGroup/index.js.map +1 -1
- package/dist/core/composite/SegmentedControl/index.d.ts +6 -6
- package/dist/core/composite/SegmentedControl/index.d.ts.map +1 -1
- package/dist/core/composite/SegmentedControl/index.js +9 -5
- package/dist/core/composite/SegmentedControl/index.js.map +1 -1
- package/dist/core/composite/TagGroup/index.d.ts +27 -4
- package/dist/core/composite/TagGroup/index.d.ts.map +1 -1
- package/dist/core/composite/TagGroup/index.js +132 -2
- package/dist/core/composite/TagGroup/index.js.map +1 -1
- package/dist/core/composite/Timeline/index.d.ts +5 -0
- package/dist/core/composite/Timeline/index.d.ts.map +1 -1
- package/dist/core/composite/Timeline/index.js +1 -1
- package/dist/core/composite/Timeline/index.js.map +1 -1
- package/dist/core/composition/Sidebar/index.d.ts +4 -0
- package/dist/core/composition/Sidebar/index.d.ts.map +1 -1
- package/dist/core/composition/Sidebar/index.js +4 -2
- package/dist/core/composition/Sidebar/index.js.map +1 -1
- package/dist/core/dna.d.ts +1 -1
- package/dist/core/dna.js +1 -1
- package/dist/core/dna.js.map +1 -1
- package/dist/core/index.d.ts +1 -1
- package/dist/core/index.d.ts.map +1 -1
- package/dist/core/primitive/Avatar/index.d.ts +1 -1
- package/dist/core/primitive/Badge/index.d.ts +8 -5
- package/dist/core/primitive/Badge/index.d.ts.map +1 -1
- package/dist/core/primitive/Badge/index.js +14 -5
- package/dist/core/primitive/Badge/index.js.map +1 -1
- package/dist/core/primitive/Button/index.d.ts +10 -2
- package/dist/core/primitive/Button/index.d.ts.map +1 -1
- package/dist/core/primitive/Button/index.js +15 -4
- package/dist/core/primitive/Button/index.js.map +1 -1
- package/dist/core/primitive/Checkbox/index.d.ts +5 -3
- package/dist/core/primitive/Checkbox/index.d.ts.map +1 -1
- package/dist/core/primitive/Checkbox/index.js +9 -2
- package/dist/core/primitive/Checkbox/index.js.map +1 -1
- package/dist/core/primitive/Code/index.d.ts +10 -0
- package/dist/core/primitive/Code/index.d.ts.map +1 -0
- package/dist/core/primitive/Code/index.js +5 -0
- package/dist/core/primitive/Code/index.js.map +1 -0
- package/dist/core/primitive/Field/index.d.ts +12 -25
- package/dist/core/primitive/Field/index.d.ts.map +1 -1
- package/dist/core/primitive/Field/index.js +13 -14
- package/dist/core/primitive/Field/index.js.map +1 -1
- package/dist/core/primitive/GrammarRoot/index.d.ts +8 -1
- package/dist/core/primitive/GrammarRoot/index.d.ts.map +1 -1
- package/dist/core/primitive/GrammarRoot/index.js +5 -1
- package/dist/core/primitive/GrammarRoot/index.js.map +1 -1
- package/dist/core/primitive/Icon/index.d.ts.map +1 -1
- package/dist/core/primitive/Icon/index.js +3 -2
- package/dist/core/primitive/Icon/index.js.map +1 -1
- package/dist/core/primitive/Input/index.d.ts +9 -4
- package/dist/core/primitive/Input/index.d.ts.map +1 -1
- package/dist/core/primitive/Input/index.js +13 -8
- package/dist/core/primitive/Input/index.js.map +1 -1
- package/dist/core/primitive/Meter/index.d.ts +4 -1
- package/dist/core/primitive/Meter/index.d.ts.map +1 -1
- package/dist/core/primitive/Meter/index.js +3 -3
- package/dist/core/primitive/Meter/index.js.map +1 -1
- package/dist/core/primitive/NumberField/index.d.ts +6 -5
- package/dist/core/primitive/NumberField/index.d.ts.map +1 -1
- package/dist/core/primitive/NumberField/index.js +10 -3
- package/dist/core/primitive/NumberField/index.js.map +1 -1
- package/dist/core/primitive/PinnedActionBar/index.d.ts +25 -6
- package/dist/core/primitive/PinnedActionBar/index.d.ts.map +1 -1
- package/dist/core/primitive/PinnedActionBar/index.js +9 -4
- package/dist/core/primitive/PinnedActionBar/index.js.map +1 -1
- package/dist/core/primitive/SearchField/index.d.ts +6 -5
- package/dist/core/primitive/SearchField/index.d.ts.map +1 -1
- package/dist/core/primitive/SearchField/index.js +10 -3
- package/dist/core/primitive/SearchField/index.js.map +1 -1
- package/dist/core/primitive/SectionHeader/index.d.ts +3 -3
- package/dist/core/primitive/SectionHeader/index.js +2 -2
- package/dist/core/primitive/SectionHeader/index.js.map +1 -1
- package/dist/core/primitive/Skeleton/index.d.ts +11 -0
- package/dist/core/primitive/Skeleton/index.d.ts.map +1 -1
- package/dist/core/primitive/Skeleton/index.js +12 -1
- package/dist/core/primitive/Skeleton/index.js.map +1 -1
- package/dist/core/primitive/StatusDot/index.d.ts +61 -0
- package/dist/core/primitive/StatusDot/index.d.ts.map +1 -0
- package/dist/core/primitive/StatusDot/index.js +55 -0
- package/dist/core/primitive/StatusDot/index.js.map +1 -0
- package/dist/core/primitive/Switch/index.d.ts +4 -3
- package/dist/core/primitive/Switch/index.d.ts.map +1 -1
- package/dist/core/primitive/Switch/index.js +5 -2
- package/dist/core/primitive/Switch/index.js.map +1 -1
- package/dist/core/primitive/Terminal/index.d.ts +20 -0
- package/dist/core/primitive/Terminal/index.d.ts.map +1 -0
- package/dist/core/primitive/Terminal/index.js +29 -0
- package/dist/core/primitive/Terminal/index.js.map +1 -0
- package/dist/core/primitive/Text/index.d.ts +5 -1
- package/dist/core/primitive/Text/index.d.ts.map +1 -1
- package/dist/core/primitive/Text/index.js +12 -7
- package/dist/core/primitive/Text/index.js.map +1 -1
- package/dist/core/primitive/TextAction/index.d.ts.map +1 -1
- package/dist/core/primitive/TextAction/index.js +9 -4
- package/dist/core/primitive/TextAction/index.js.map +1 -1
- package/dist/core/primitive/Textarea/index.d.ts +8 -4
- package/dist/core/primitive/Textarea/index.d.ts.map +1 -1
- package/dist/core/primitive/Textarea/index.js +9 -5
- package/dist/core/primitive/Textarea/index.js.map +1 -1
- package/dist/core/styles.css +18 -6
- package/dist/offset-pop/components-forms.css +0 -17
- package/dist/offset-pop/components-navigation.css +30 -4
- package/dist/offset-pop/components-overlays.css +5 -0
- package/dist/offset-pop/index.d.ts +1 -1
- package/dist/offset-pop/index.d.ts.map +1 -1
- package/dist/offset-pop/styles.css +44 -0
- package/package.json +7 -12
- package/dist/common/rule-catalog.generated.d.ts.map +0 -1
- package/dist/common/rule-catalog.generated.js.map +0 -1
- package/dist/heritage/dna.d.ts +0 -63
- package/dist/heritage/dna.d.ts.map +0 -1
- package/dist/heritage/dna.js +0 -37
- package/dist/heritage/dna.js.map +0 -1
- package/dist/heritage/index.d.ts +0 -27
- package/dist/heritage/index.d.ts.map +0 -1
- package/dist/heritage/index.js +0 -46
- package/dist/heritage/index.js.map +0 -1
- package/dist/heritage/styles.css +0 -187
|
@@ -22,9 +22,9 @@ const wholeNumber = (value, fallback) => (Number.isFinite(value) ? Math.round(va
|
|
|
22
22
|
* `data-grammar-meter-segments` and each segment its state on `data-grammar-meter-segment`.
|
|
23
23
|
*/
|
|
24
24
|
const renderMeterRoot = (domProps) => _jsx("div", { ...domProps, role: "meter" });
|
|
25
|
-
export const Meter = ({ label, value, minValue = 0, maxValue = 100, valueLabel, tone = "neutral", isLabelHidden = false, segments, isSkeleton = false, }) => {
|
|
25
|
+
export const Meter = ({ label, value, minValue = 0, maxValue = 100, valueLabel, tone = "neutral", isLabelHidden = false, segments, isSkeleton = false, size = "md", }) => {
|
|
26
26
|
if (isSkeleton) {
|
|
27
|
-
return (_jsxs("div", { "data-tier": "atom", "data-component": "Meter", "data-loading": "true", "data-grammar-skeleton": "true", "data-grammar-tone": "neutral", "data-contract": "A11Y-3 STATE-8", "aria-busy": "true", className: "starci-core-meter starci-core-meter-skeleton", children: [_jsx("span", { className: "starci-core-meter-header", children: _jsx("span", { className: isLabelHidden ? "starci-core-meter-label starci-core-form-label--screen-reader" : "starci-core-meter-label", children: label }) }), _jsx("span", { "aria-hidden": "true", "data-slot": "meter-track", className: "starci-core-meter-skeleton-bar", children: _jsx(Skeleton, { shape: "rect" }) })] }));
|
|
27
|
+
return (_jsxs("div", { "data-tier": "atom", "data-component": "Meter", "data-loading": "true", "data-size": size, "data-grammar-skeleton": "true", "data-grammar-tone": "neutral", "data-contract": "A11Y-3 STATE-8", "aria-busy": "true", className: "starci-core-meter starci-core-meter-skeleton", children: [_jsx("span", { className: "starci-core-meter-header", children: _jsx("span", { className: isLabelHidden ? "starci-core-meter-label starci-core-form-label--screen-reader" : "starci-core-meter-label", children: label }) }), _jsx("span", { "aria-hidden": "true", "data-slot": "meter-track", className: "starci-core-meter-skeleton-bar", children: _jsx(Skeleton, { shape: "rect" }) })] }));
|
|
28
28
|
}
|
|
29
29
|
const status = vendorStatusFor(tone);
|
|
30
30
|
const count = segments === undefined ? undefined : clampSegments(segments);
|
|
@@ -32,6 +32,6 @@ export const Meter = ({ label, value, minValue = 0, maxValue = 100, valueLabel,
|
|
|
32
32
|
const max = count === undefined ? maxValue : Math.max(min + 1, wholeNumber(maxValue, 100));
|
|
33
33
|
const reading = count === undefined ? value : Math.min(max, Math.max(min, wholeNumber(value, min)));
|
|
34
34
|
const filled = count === undefined ? 0 : Math.round(((reading - min) / (max - min)) * count);
|
|
35
|
-
return (_jsxs(HeroMeter, { "data-tier": "atom", "data-component": "Meter", "data-grammar-tone": tone, "data-contract": "A11Y-3 ACCENT-4", value: reading, minValue: min, maxValue: max, ...(count === undefined ? {} : { "data-grammar-meter-segments": count }), ...(valueLabel === undefined ? {} : { valueLabel }), ...(isLabelHidden ? { "aria-label": label } : {}), color: status === "default" ? "accent" : status, size:
|
|
35
|
+
return (_jsxs(HeroMeter, { "data-tier": "atom", "data-component": "Meter", "data-grammar-tone": tone, "data-size": size, "data-contract": "A11Y-3 ACCENT-4", value: reading, minValue: min, maxValue: max, ...(count === undefined ? {} : { "data-grammar-meter-segments": count }), ...(valueLabel === undefined ? {} : { valueLabel }), ...(isLabelHidden ? { "aria-label": label } : {}), color: status === "default" ? "accent" : status, size: size, className: "starci-core-meter", render: renderMeterRoot, children: [isLabelHidden ? null : (_jsxs("span", { className: "starci-core-meter-header", children: [_jsx(HeroLabel, { className: "starci-core-meter-label", children: label }), _jsx(HeroMeter.Output, { className: "starci-core-meter-output" })] })), count === undefined ? (_jsx(HeroMeter.Track, { className: "starci-core-meter-track", children: _jsx(HeroMeter.Fill, { className: "starci-core-meter-fill", "data-contract": "MOTION-2" }) })) : (_jsx(HeroMeter.Track, { className: "starci-core-meter-track starci-core-meter-segments", children: Array.from({ length: count }, (_, index) => (_jsx("span", { "aria-hidden": "true", className: "starci-core-meter-segment", "data-grammar-meter-segment": index < filled ? "filled" : "empty" }, index))) }))] }));
|
|
36
36
|
};
|
|
37
37
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Meter/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,KAAK,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AAGtE,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Meter/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -15,14 +15,15 @@ export type NumberFieldProps = FieldControlProps & {
|
|
|
15
15
|
/** Defaults to `secondary` inside a Grammar surface and `primary` outside (ANATOMY-2 case-1). */
|
|
16
16
|
readonly variant?: "primary" | "secondary";
|
|
17
17
|
/**
|
|
18
|
-
* Initial unresolved content (knowledge STATE-8)
|
|
19
|
-
*
|
|
18
|
+
* Initial unresolved content (knowledge STATE-8), with skeleton parity: the ready anatomy at the same props (label,
|
|
19
|
+
* description, control box, options) inside an inert, `aria-busy` scope, its control box painted as a Skeleton and its
|
|
20
|
+
* value or mark not drawn, so the loading field keeps the ready box. Nothing is invalid or pending while it loads.
|
|
20
21
|
*/
|
|
21
22
|
readonly isSkeleton?: boolean;
|
|
22
23
|
};
|
|
23
24
|
/**
|
|
24
|
-
*
|
|
25
|
-
*
|
|
25
|
+
* Skeleton parity (knowledge STATE-8): `isSkeleton` renders the ready anatomy at the same props inside
|
|
26
|
+
* `FieldSkeletonScope` (inert, `aria-busy`, control box painted as a Skeleton), so the loading field keeps the ready box.
|
|
26
27
|
*/
|
|
27
|
-
export declare const NumberField: ({
|
|
28
|
+
export declare const NumberField: ({ isSkeleton, ...props }: NumberFieldProps) => import("react").JSX.Element;
|
|
28
29
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/NumberField/index.tsx"],"names":[],"mappings":"AAIA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/NumberField/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAQH,KAAK,iBAAiB,EACzB,MAAM,mBAAmB,CAAA;AAE1B,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,GAAG;IAC/C,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;IACtB,uEAAuE;IACvE,QAAQ,CAAC,aAAa,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAA;IACjD,mFAAmF;IACnF,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,CAAA;IAC/B,iGAAiG;IACjG,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAChC,CAAA;AAQD;;;GAGG;AACH,eAAO,MAAM,WAAW,GAAI,0BAAkC,gBAAgB,gCAEvC,CAAA"}
|
|
@@ -2,18 +2,25 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useFieldVariant } from "../../surfaceContext.js";
|
|
4
4
|
import { NumberField as HeroNumberField } from "@heroui/react";
|
|
5
|
-
import { FieldDescription, FieldErrorText, FieldLabel,
|
|
5
|
+
import { FieldDescription, FieldErrorText, FieldLabel, FieldSkeletonScope, loadingFieldProps, fieldVariantAttributes, vendorFieldProps, } from "../Field/index.js";
|
|
6
6
|
/*
|
|
7
7
|
* Consumer hook: `starci-core-number-field` names this control's root for a consumer or family
|
|
8
8
|
* stylesheet. No shipped sheet paints it: the root is drawn as a whole by `.starci-core-field`, so
|
|
9
9
|
* a rule on the hook adds to the shared anatomy and never has to replace it.
|
|
10
10
|
*/
|
|
11
|
+
/**
|
|
12
|
+
* Skeleton parity (knowledge STATE-8): `isSkeleton` renders the ready anatomy at the same props inside
|
|
13
|
+
* `FieldSkeletonScope` (inert, `aria-busy`, control box painted as a Skeleton), so the loading field keeps the ready box.
|
|
14
|
+
*/
|
|
15
|
+
export const NumberField = ({ isSkeleton = false, ...props }) => isSkeleton
|
|
16
|
+
? _jsx(FieldSkeletonScope, { component: "NumberField", children: _jsx(NumberFieldControl, { ...loadingFieldProps(props) }) })
|
|
17
|
+
: _jsx(NumberFieldControl, { ...props });
|
|
11
18
|
/**
|
|
12
19
|
* A number with stepping. The vendor owns `role="spinbutton"`-equivalent semantics on the input,
|
|
13
20
|
* locale parsing, arrow-key and wheel stepping, clamping to min/max and the localized stepper names.
|
|
14
21
|
*/
|
|
15
|
-
|
|
22
|
+
const NumberFieldControl = ({ id, placeholder, value, defaultValue, onValueChange, minValue, maxValue, step, formatOptions, hideSteppers = false, variant: requestedVariant, ...field }) => {
|
|
16
23
|
const variant = useFieldVariant(requestedVariant);
|
|
17
|
-
return
|
|
24
|
+
return (_jsxs(HeroNumberField, { "data-tier": "atom", "data-component": "NumberField", "data-contract": "A11Y-1 FEEDBACK-1 STATE-1", className: "starci-core-field starci-core-number-field", fullWidth: true, variant: variant, ...fieldVariantAttributes(variant), ...vendorFieldProps(field), isReadOnly: field.isReadOnly === true, ...(value === undefined ? defaultValue === undefined ? {} : { defaultValue } : { value }), ...(onValueChange === undefined ? {} : { onChange: onValueChange }), ...(minValue === undefined ? {} : { minValue }), ...(maxValue === undefined ? {} : { maxValue }), ...(step === undefined ? {} : { step }), ...(formatOptions === undefined ? {} : { formatOptions }), children: [_jsx(FieldLabel, { isHidden: field.isLabelHidden, isRequired: field.isRequired, children: field.label }), _jsxs(HeroNumberField.Group, { className: "starci-core-number-field-group", "data-grammar-field-control": "true", children: [hideSteppers ? null : _jsx(HeroNumberField.DecrementButton, { className: "starci-core-number-field-step" }), _jsx(HeroNumberField.Input, { ...(id === undefined ? {} : { id }), ...(placeholder === undefined ? {} : { placeholder }), className: "starci-core-number-field-input" }), hideSteppers ? null : _jsx(HeroNumberField.IncrementButton, { className: "starci-core-number-field-step" })] }), _jsx(FieldDescription, { children: field.description }), _jsx(FieldErrorText, { children: field.errorMessage })] }));
|
|
18
25
|
};
|
|
19
26
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/NumberField/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,eAAe,CAAA;AAC9D,OAAO,EACH,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/NumberField/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,20 +1,39 @@
|
|
|
1
1
|
import type { ReactNode } from "react";
|
|
2
2
|
/** `narrow` shows the bar below 48rem only (the page header carries the command at wider widths); `always` at every width. */
|
|
3
3
|
export type PinnedActionBarVisibility = "narrow" | "always";
|
|
4
|
-
|
|
5
|
-
/** The one page command: a single `Button` (normally `variant="primary"`, `width="fill"`). */
|
|
6
|
-
readonly children: ReactNode;
|
|
4
|
+
type PinnedActionBarBase = {
|
|
7
5
|
/** Accessible name of the bar (`role="group"`), e.g. the command's purpose. */
|
|
8
6
|
readonly label: string;
|
|
9
7
|
/** Default `narrow`. */
|
|
10
8
|
readonly visibility?: PinnedActionBarVisibility;
|
|
11
9
|
};
|
|
10
|
+
/** The one page command: a single `Button` (normally `variant="primary"`, `width="fill"`). */
|
|
11
|
+
type SingleCommandBar = PinnedActionBarBase & {
|
|
12
|
+
readonly children: ReactNode;
|
|
13
|
+
readonly summary?: never;
|
|
14
|
+
readonly dismiss?: never;
|
|
15
|
+
readonly commit?: never;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* A summary with up to two actions. `summary` is text or a node (a selection count, a total, unsaved changes);
|
|
19
|
+
* `dismiss` is the secondary action (a `Button` with `intent="dismiss"`) and `commit` the primary one
|
|
20
|
+
* (a `Button` with `intent="commit"`). The dismiss action sits before the commit action.
|
|
21
|
+
*/
|
|
22
|
+
type SummaryBar = PinnedActionBarBase & {
|
|
23
|
+
readonly children?: never;
|
|
24
|
+
readonly summary: ReactNode;
|
|
25
|
+
readonly dismiss?: ReactNode;
|
|
26
|
+
readonly commit?: ReactNode;
|
|
27
|
+
};
|
|
28
|
+
export type PinnedActionBarProps = SingleCommandBar | SummaryBar;
|
|
12
29
|
/**
|
|
13
30
|
* The page's primary command pinned to the bottom edge on a narrow screen, in thumb reach (UX-9 case-1):
|
|
14
31
|
* sticky at the bottom of its scroll container, on `--surface` behind a 1px `--separator` top hairline
|
|
15
32
|
* (BOUNDARY-1), inset 0.75rem above and 1rem at the sides and below - plus the device's bottom safe-area
|
|
16
|
-
* inset. It holds one Button
|
|
17
|
-
* `visibility="always"`, so the same
|
|
33
|
+
* inset. It holds one Button, or a summary beside up to two Buttons (dismiss, then commit); it is not
|
|
34
|
+
* navigation (that is `BottomNav`). Hidden at 48rem and wider unless `visibility="always"`, so the same
|
|
35
|
+
* command is shown once per viewport (LAYOUT-4 case-2).
|
|
18
36
|
*/
|
|
19
|
-
export declare const PinnedActionBar: (
|
|
37
|
+
export declare const PinnedActionBar: (props: PinnedActionBarProps) => import("react").JSX.Element;
|
|
38
|
+
export {};
|
|
20
39
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/PinnedActionBar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,8HAA8H;AAC9H,MAAM,MAAM,yBAAyB,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAE3D,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/PinnedActionBar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,8HAA8H;AAC9H,MAAM,MAAM,yBAAyB,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAE3D,KAAK,mBAAmB,GAAG;IACvB,+EAA+E;IAC/E,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,wBAAwB;IACxB,QAAQ,CAAC,UAAU,CAAC,EAAE,yBAAyB,CAAA;CAClD,CAAA;AAED,8FAA8F;AAC9F,KAAK,gBAAgB,GAAG,mBAAmB,GAAG;IAC1C,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAA;IACxB,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAA;IACxB,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAA;CAC1B,CAAA;AAED;;;;GAIG;AACH,KAAK,UAAU,GAAG,mBAAmB,GAAG;IACpC,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAA;IACzB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAA;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,CAAA;CAC9B,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,gBAAgB,GAAG,UAAU,CAAA;AAEhE;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO,oBAAoB,gCA0B1D,CAAA"}
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
/**
|
|
3
3
|
* The page's primary command pinned to the bottom edge on a narrow screen, in thumb reach (UX-9 case-1):
|
|
4
4
|
* sticky at the bottom of its scroll container, on `--surface` behind a 1px `--separator` top hairline
|
|
5
5
|
* (BOUNDARY-1), inset 0.75rem above and 1rem at the sides and below - plus the device's bottom safe-area
|
|
6
|
-
* inset. It holds one Button
|
|
7
|
-
* `visibility="always"`, so the same
|
|
6
|
+
* inset. It holds one Button, or a summary beside up to two Buttons (dismiss, then commit); it is not
|
|
7
|
+
* navigation (that is `BottomNav`). Hidden at 48rem and wider unless `visibility="always"`, so the same
|
|
8
|
+
* command is shown once per viewport (LAYOUT-4 case-2).
|
|
8
9
|
*/
|
|
9
|
-
export const PinnedActionBar = (
|
|
10
|
+
export const PinnedActionBar = (props) => {
|
|
11
|
+
const { label, visibility = "narrow" } = props;
|
|
12
|
+
const hasSummary = props.summary !== undefined;
|
|
13
|
+
return (_jsx("div", { "aria-label": label, className: "starci-core-pinned-action-bar", "data-component": "PinnedActionBar", "data-grammar-bottom-chrome": "true", "data-contract": "BOUNDARY-1", "data-grammar-pinned-visibility": visibility, "data-grammar-pinned-layout": hasSummary ? "summary" : "command", "data-tier": "atom", role: "group", children: hasSummary ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "starci-core-pinned-action-bar-summary", "data-grammar-pinned-summary": "true", children: props.summary }), _jsxs("div", { className: "starci-core-pinned-action-bar-actions", "data-grammar-pinned-actions": "true", children: [props.dismiss, props.commit] })] })) : props.children }));
|
|
14
|
+
};
|
|
10
15
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/PinnedActionBar/index.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/PinnedActionBar/index.tsx"],"names":[],"mappings":";AAkCA;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC3D,MAAM,EAAE,KAAK,EAAE,UAAU,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC9C,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,KAAK,SAAS,CAAA;IAC9C,OAAO,CACH,4BACgB,KAAK,EACjB,SAAS,EAAC,+BAA+B,oBAC1B,iBAAiB,gCACL,MAAM,mBACnB,YAAY,oCACM,UAAU,gCACd,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,eACpD,MAAM,EAChB,IAAI,EAAC,OAAO,YAEX,UAAU,CAAC,CAAC,CAAC,CACV,8BACI,cAAK,SAAS,EAAC,uCAAuC,iCAA6B,MAAM,YAAE,KAAK,CAAC,OAAO,GAAO,EAC/G,eAAK,SAAS,EAAC,uCAAuC,iCAA6B,MAAM,aACpF,KAAK,CAAC,OAAO,EACb,KAAK,CAAC,MAAM,IACX,IACP,CACN,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,GAChB,CACT,CAAA;AACL,CAAC,CAAA"}
|
|
@@ -19,8 +19,9 @@ export type SearchFieldProps = FieldControlProps & {
|
|
|
19
19
|
/** `control` aligns the search box with every other control in the navbar. */
|
|
20
20
|
readonly size?: "md" | "control";
|
|
21
21
|
/**
|
|
22
|
-
* Initial unresolved content (knowledge STATE-8)
|
|
23
|
-
*
|
|
22
|
+
* Initial unresolved content (knowledge STATE-8), with skeleton parity: the ready anatomy at the same props (label,
|
|
23
|
+
* description, control box, options) inside an inert, `aria-busy` scope, its control box painted as a Skeleton and its
|
|
24
|
+
* value or mark not drawn, so the loading field keeps the ready box. Nothing is invalid or pending while it loads.
|
|
24
25
|
*/
|
|
25
26
|
readonly isSkeleton?: boolean;
|
|
26
27
|
/** Focus left the input. */
|
|
@@ -31,8 +32,8 @@ export type SearchFieldProps = FieldControlProps & {
|
|
|
31
32
|
readonly autoFocus?: boolean;
|
|
32
33
|
};
|
|
33
34
|
/**
|
|
34
|
-
*
|
|
35
|
-
*
|
|
35
|
+
* Skeleton parity (knowledge STATE-8): `isSkeleton` renders the ready anatomy at the same props inside
|
|
36
|
+
* `FieldSkeletonScope` (inert, `aria-busy`, control box painted as a Skeleton), so the loading field keeps the ready box.
|
|
36
37
|
*/
|
|
37
|
-
export declare const SearchField: ({
|
|
38
|
+
export declare const SearchField: ({ isSkeleton, ...props }: SearchFieldProps) => import("react").JSX.Element;
|
|
38
39
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/SearchField/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/SearchField/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAQH,KAAK,iBAAiB,EACzB,MAAM,mBAAmB,CAAA;AAE1B,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,GAAG;IAC/C,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,0BAA0B;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC3C,oDAAoD;IACpD,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,2EAA2E;IAC3E,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,kFAAkF;IAClF,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,iGAAiG;IACjG,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IAC1C,8EAA8E;IAC9E,QAAQ,CAAC,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAA;IAChC;;;;OAIG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,4BAA4B;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;IACpE,wCAAwC;IACxC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;CAC/B,CAAA;AAQD;;;GAGG;AACH,eAAO,MAAM,WAAW,GAAI,0BAAkC,gBAAgB,gCAEvC,CAAA"}
|
|
@@ -2,18 +2,25 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useFieldVariant } from "../../surfaceContext.js";
|
|
4
4
|
import { SearchField as HeroSearchField, Spinner as HeroSpinner } from "@heroui/react";
|
|
5
|
-
import { FieldDescription, FieldErrorText, FieldLabel,
|
|
5
|
+
import { FieldDescription, FieldErrorText, FieldLabel, FieldSkeletonScope, loadingFieldProps, fieldVariantAttributes, vendorFieldProps, } from "../Field/index.js";
|
|
6
6
|
/*
|
|
7
7
|
* Consumer hook: `starci-core-search-field` names this control's root for a consumer or family
|
|
8
8
|
* stylesheet. No shipped sheet paints it: the root is drawn as a whole by `.starci-core-field`, so
|
|
9
9
|
* a rule on the hook adds to the shared anatomy and never has to replace it.
|
|
10
10
|
*/
|
|
11
|
+
/**
|
|
12
|
+
* Skeleton parity (knowledge STATE-8): `isSkeleton` renders the ready anatomy at the same props inside
|
|
13
|
+
* `FieldSkeletonScope` (inert, `aria-busy`, control box painted as a Skeleton), so the loading field keeps the ready box.
|
|
14
|
+
*/
|
|
15
|
+
export const SearchField = ({ isSkeleton = false, ...props }) => isSkeleton
|
|
16
|
+
? _jsx(FieldSkeletonScope, { component: "SearchField", children: _jsx(SearchFieldControl, { ...loadingFieldProps(props) }) })
|
|
17
|
+
: _jsx(SearchFieldControl, { ...props });
|
|
11
18
|
/**
|
|
12
19
|
* A text field whose job is a query: `type="search"`, a clear button, Escape to clear, Enter to
|
|
13
20
|
* submit - all the vendor's. The leading glyph is decoration; the label is the name.
|
|
14
21
|
*/
|
|
15
|
-
|
|
22
|
+
const SearchFieldControl = ({ id, placeholder, value, defaultValue, onValueChange, onSubmit, onClear, isPending = false, clearLabel, variant: requestedVariant, size = "md", onBlur, onPaste, autoFocus = false, ...field }) => {
|
|
16
23
|
const variant = useFieldVariant(requestedVariant);
|
|
17
|
-
return
|
|
24
|
+
return (_jsxs(HeroSearchField, { "data-tier": "atom", "data-component": "SearchField", "data-contract": "A11Y-1 FEEDBACK-1 STATE-1", className: "starci-core-field starci-core-search-field", fullWidth: true, variant: variant, ...fieldVariantAttributes(variant), ...vendorFieldProps({ ...field, isPending }), isReadOnly: field.isReadOnly === true, ...(value === undefined ? defaultValue === undefined ? {} : { defaultValue } : { value }), ...(onValueChange === undefined ? {} : { onChange: onValueChange }), ...(onSubmit === undefined ? {} : { onSubmit }), ...(onClear === undefined ? {} : { onClear }), children: [_jsx(FieldLabel, { isHidden: field.isLabelHidden, isRequired: field.isRequired, children: field.label }), _jsxs(HeroSearchField.Group, { className: "starci-core-search-field-group", "data-grammar-field-control": "true", "data-grammar-control-size": size === "control" ? "control" : undefined, children: [_jsx(HeroSearchField.SearchIcon, { "aria-hidden": "true" }), _jsx(HeroSearchField.Input, { ...(id === undefined ? {} : { id }), ...(placeholder === undefined ? {} : { placeholder }), className: "starci-core-search-field-input", ...(autoFocus ? { autoFocus: true } : {}), ...(onBlur === undefined ? {} : { onBlur: () => onBlur() }), ...(onPaste === undefined ? {} : { onPaste }), ...(isPending ? { "aria-busy": true } : {}) }), isPending ? _jsx(HeroSpinner, { size: "sm", color: "current", "aria-hidden": "true", className: "starci-core-field-spinner" }) : null, _jsx(HeroSearchField.ClearButton, { className: "starci-core-search-field-clear", ...(clearLabel === undefined ? {} : { "aria-label": clearLabel }) })] }), _jsx(FieldDescription, { children: field.description }), _jsx(FieldErrorText, { children: field.errorMessage })] }));
|
|
18
25
|
};
|
|
19
26
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/SearchField/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EAAE,WAAW,IAAI,eAAe,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;AAEtF,OAAO,EACH,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/SearchField/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -21,9 +21,9 @@ export type SectionHeaderProps = {
|
|
|
21
21
|
/** Closed semantic anatomy; ContextIntro requires eyebrow, title and description. */
|
|
22
22
|
readonly composition?: "section-header" | "context-intro";
|
|
23
23
|
/**
|
|
24
|
-
* Draw the header as inert geometry while its content is unresolved (knowledge STATE-8): `title`
|
|
25
|
-
*
|
|
26
|
-
*
|
|
24
|
+
* Draw the header as inert geometry while its content is unresolved (knowledge STATE-8). Skeleton parity: `title` (with
|
|
25
|
+
* `count`), `description`, `meta` and `action` keep their slots and are laid out unseen as measured placeholders under a
|
|
26
|
+
* shimmer, so the loading header has the ready header's box; an empty title takes a default bar. `eyebrow` stays real.
|
|
27
27
|
* The skeleton parts are `aria-hidden` (the heading is hidden with its line, so no empty heading is announced); the root is `aria-busy`.
|
|
28
28
|
*/
|
|
29
29
|
readonly isSkeleton?: boolean;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "@heroui/react";
|
|
3
3
|
import { createElement } from "react";
|
|
4
|
-
import {
|
|
4
|
+
import { SkeletonPlaceholder } from "../Skeleton/index.js";
|
|
5
5
|
/**
|
|
6
6
|
* Reusable title-copy-action hierarchy shared by StarCi product sections.
|
|
7
7
|
*
|
|
@@ -9,5 +9,5 @@ import { Skeleton } from "../Skeleton/index.js";
|
|
|
9
9
|
* banner landmark, and the banner belongs to the application bar (TopBar / NavigationFeatureNav /
|
|
10
10
|
* WorkspaceShell header). A section heading group must not add a second one.
|
|
11
11
|
*/
|
|
12
|
-
export const SectionHeader = ({ title, description, eyebrow, action, count, meta, level = 2, className, id, composition = "section-header", isSkeleton = false, }) => isSkeleton ? (_jsxs("div", { className: cn("starci-core-section-header", className), "data-component": "SectionHeader", "data-tier": "atom", "data-contract": "GAP-5 STATE-8", "data-grammar-section-header": "true", "data-grammar-composition": composition, "data-grammar-skeleton": "true", "data-loading": "true", "aria-busy": "true", children: [_jsxs("div", { className: "starci-core-section-header-copy", "data-contract": "GAP-2", children: [eyebrow === undefined ? null : _jsx("div", { className: "starci-core-section-eyebrow", children: eyebrow }), createElement(`h${level}`, { className: "starci-core-section-title
|
|
12
|
+
export const SectionHeader = ({ title, description, eyebrow, action, count, meta, level = 2, className, id, composition = "section-header", isSkeleton = false, }) => isSkeleton ? (_jsxs("div", { className: cn("starci-core-section-header", className), "data-component": "SectionHeader", "data-tier": "atom", "data-contract": "GAP-5 STATE-8", "data-grammar-section-header": "true", "data-grammar-composition": composition, "data-grammar-skeleton": "true", "data-loading": "true", "aria-busy": "true", children: [_jsxs("div", { className: "starci-core-section-header-copy", "data-contract": "GAP-2", children: [eyebrow === undefined ? null : _jsx("div", { className: "starci-core-section-eyebrow", children: eyebrow }), createElement(`h${level}`, { className: "starci-core-section-title", id, "aria-hidden": "true", "data-contract": "MARGIN-0 FLOW-3" }, _jsxs(SkeletonPlaceholder, { children: [title, count === undefined ? null : _jsx("span", { className: "starci-core-section-count", children: ` (${count})` })] }, "title")), description === undefined ? null : _jsx("div", { "aria-hidden": "true", className: "starci-core-section-description", children: _jsx(SkeletonPlaceholder, { children: description }) })] }), meta === undefined ? null : _jsx("div", { "aria-hidden": "true", className: "starci-core-section-meta", children: _jsx(SkeletonPlaceholder, { children: meta }) }), action === undefined ? null : _jsx("div", { "aria-hidden": "true", className: "starci-core-section-action", children: _jsx(SkeletonPlaceholder, { shape: "block", children: action }) })] })) : (_jsxs("div", { className: cn("starci-core-section-header", className), "data-component": "SectionHeader", "data-tier": "atom", "data-contract": "GAP-5", "data-grammar-section-header": "true", "data-grammar-composition": composition, children: [_jsxs("div", { className: "starci-core-section-header-copy", "data-contract": "GAP-2", children: [eyebrow === undefined ? null : _jsx("div", { className: "starci-core-section-eyebrow", children: eyebrow }), createElement(`h${level}`, { className: "starci-core-section-title", id, "data-contract": "MARGIN-0 FLOW-3" }, title, count === undefined ? null : (_jsx("span", { className: "starci-core-section-count", "data-grammar-section-count": count, "data-contract": "TONE-2", children: ` (${count})` }, "count"))), description === undefined ? null : _jsx("div", { className: "starci-core-section-description", children: description })] }), meta === undefined ? null : _jsx("div", { className: "starci-core-section-meta", "data-contract": "FONT-1 TONE-2", children: meta }), action === undefined ? null : _jsx("div", { className: "starci-core-section-action", children: action })] }));
|
|
13
13
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/SectionHeader/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAClC,OAAO,EAAE,aAAa,EAAkB,MAAM,OAAO,CAAA;AACrD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/SectionHeader/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
1
2
|
export type SkeletonShape = "text" | "rect" | "circle";
|
|
2
3
|
export type SkeletonRatio = "square" | "landscape" | "wide";
|
|
3
4
|
export type SkeletonSize = "sm" | "md" | "lg";
|
|
@@ -18,4 +19,14 @@ export type SkeletonProps = {
|
|
|
18
19
|
* `.starci-core-skeleton` in `src/common/components-overlays.css`.
|
|
19
20
|
*/
|
|
20
21
|
export declare const Skeleton: ({ shape, lines, ratio, size }: SkeletonProps) => import("react").JSX.Element;
|
|
22
|
+
/**
|
|
23
|
+
* Internal - skeleton parity for a slot whose ready content is known while it loads (a title, an action, a leading mark).
|
|
24
|
+
* The content is laid out exactly as the ready slot lays it out, unseen and inert, and the shimmer paints over its box,
|
|
25
|
+
* so the loading slot has the ready slot's size by construction. `text` is a run of copy (one line box per line),
|
|
26
|
+
* `block` a control or mark, `circle` a round mark, `region` a block-level body (a code block). Empty text takes a default bar width.
|
|
27
|
+
*/
|
|
28
|
+
export declare const SkeletonPlaceholder: ({ children, shape }: {
|
|
29
|
+
readonly children?: ReactNode;
|
|
30
|
+
readonly shape?: "text" | "block" | "circle" | "region";
|
|
31
|
+
}) => import("react").JSX.Element;
|
|
21
32
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Skeleton/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Skeleton/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAA;AACtD,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,WAAW,GAAG,MAAM,CAAA;AAC3D,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAE7C,MAAM,MAAM,aAAa,GAAG;IACxB,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAA;IAC9B,kGAAkG;IAClG,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,uEAAuE;IACvE,QAAQ,CAAC,KAAK,CAAC,EAAE,aAAa,CAAA;IAC9B,gDAAgD;IAChD,QAAQ,CAAC,IAAI,CAAC,EAAE,YAAY,CAAA;CAC/B,CAAA;AAID;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,GAAI,+BAAiE,aAAa,gCAsCtG,CAAA;AAID;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,GAAI,qBAA8B;IAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAA;CAAE,gCAO3J,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { Skeleton as HeroSkeleton } from "@heroui/react";
|
|
2
|
+
import { Skeleton as HeroSkeleton, skeletonVariants } from "@heroui/react";
|
|
3
3
|
const clampLines = (lines) => Math.min(12, Math.max(1, Math.floor(Number.isFinite(lines) ? lines : 1)));
|
|
4
4
|
/**
|
|
5
5
|
* ATOM - `Skeleton`: inert geometry for initial unresolved content.
|
|
@@ -15,4 +15,15 @@ export const Skeleton = ({ shape = "text", lines = 1, ratio = "landscape", size
|
|
|
15
15
|
}
|
|
16
16
|
return (_jsx(HeroSkeleton, { animationType: "shimmer", "data-tier": "atom", "data-component": "Skeleton", "data-shape": shape, ...(shape === "rect" ? { "data-ratio": ratio } : { "data-size": size }), "aria-hidden": "true", "data-contract": "STATE-2 MOTION-2", className: shape === "circle" ? "starci-core-skeleton rounded-full" : "starci-core-skeleton" }));
|
|
17
17
|
};
|
|
18
|
+
const PLACEHOLDER_CLASS_NAME = skeletonVariants({ animationType: "shimmer" }).base({ className: "starci-core-skeleton-placeholder" });
|
|
19
|
+
/**
|
|
20
|
+
* Internal - skeleton parity for a slot whose ready content is known while it loads (a title, an action, a leading mark).
|
|
21
|
+
* The content is laid out exactly as the ready slot lays it out, unseen and inert, and the shimmer paints over its box,
|
|
22
|
+
* so the loading slot has the ready slot's size by construction. `text` is a run of copy (one line box per line),
|
|
23
|
+
* `block` a control or mark, `circle` a round mark, `region` a block-level body (a code block). Empty text takes a default bar width.
|
|
24
|
+
*/
|
|
25
|
+
export const SkeletonPlaceholder = ({ children, shape = "text" }) => {
|
|
26
|
+
const Element = shape === "region" ? "div" : "span";
|
|
27
|
+
return (_jsx(Element, { "aria-hidden": "true", inert: true, className: PLACEHOLDER_CLASS_NAME, "data-shape": shape, "data-contract": "STATE-2 MOTION-2", children: children }));
|
|
28
|
+
};
|
|
18
29
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Skeleton/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Skeleton/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAiB1E,MAAM,UAAU,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;AAE/G;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,WAAW,EAAE,IAAI,GAAG,IAAI,EAAiB,EAAE,EAAE;IACvG,IAAI,KAAK,KAAK,MAAM,EAAE,CAAC;QACnB,MAAM,KAAK,GAAG,UAAU,CAAC,KAAK,CAAC,CAAA;QAC/B,OAAO,CACH,4BACc,MAAM,oBACD,UAAU,gBACd,MAAM,gBACL,KAAK,iBACL,MAAM,mBACJ,SAAS,EACvB,SAAS,EAAC,4BAA4B,YAErC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACzC,KAAC,YAAY,IAET,aAAa,EAAC,SAAS,EACvB,SAAS,EAAC,sBAAsB,mBAClB,UAAU,gCACI,KAAK,KAAK,KAAK,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,IAJzE,KAAK,CAKZ,CACL,CAAC,GACC,CACV,CAAA;IACL,CAAC;IAED,OAAO,CACH,KAAC,YAAY,IACT,aAAa,EAAC,SAAS,eACb,MAAM,oBACD,UAAU,gBACb,KAAK,KACb,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,iBAC5D,MAAM,mBACJ,kBAAkB,EAChC,SAAS,EAAE,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,mCAAmC,CAAC,CAAC,CAAC,sBAAsB,GAC9F,CACL,CAAA;AACL,CAAC,CAAA;AAED,MAAM,sBAAsB,GAAG,gBAAgB,CAAC,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,kCAAkC,EAAE,CAAC,CAAA;AAErI;;;;;GAKG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,GAAG,MAAM,EAA8F,EAAE,EAAE;IAC5J,MAAM,OAAO,GAAG,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAA;IACnD,OAAO,CACH,KAAC,OAAO,mBAAa,MAAM,EAAC,KAAK,QAAC,SAAS,EAAE,sBAAsB,gBAAc,KAAK,mBAAgB,kBAAkB,YACnH,QAAQ,GACH,CACb,CAAA;AACL,CAAC,CAAA"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
export type StatusDotTone = "neutral" | "accent" | "success" | "warning" | "danger";
|
|
3
|
+
/** The same three sizes as HeroUI Chip; the text variant takes the Chip's padding, height and type scale. */
|
|
4
|
+
export type StatusDotSize = "sm" | "md" | "lg";
|
|
5
|
+
type StatusDotBase = {
|
|
6
|
+
readonly tone?: StatusDotTone;
|
|
7
|
+
readonly size?: StatusDotSize;
|
|
8
|
+
/**
|
|
9
|
+
* Initial unresolved status (knowledge STATE-8). Skeleton parity: the same anatomy at the same size, painted as one
|
|
10
|
+
* Skeleton block, its dot and label kept as an unseen measured placeholder; `aria-hidden`, no Tooltip, nothing announced.
|
|
11
|
+
*/
|
|
12
|
+
readonly isSkeleton?: boolean;
|
|
13
|
+
};
|
|
14
|
+
/** With text: dot + text + light tinted background, shaped exactly like a HeroUI soft Chip of the same size. */
|
|
15
|
+
type StatusDotWithText = StatusDotBase & {
|
|
16
|
+
readonly children: ReactNode;
|
|
17
|
+
/** Optional: the visible text already names the status. */
|
|
18
|
+
readonly "aria-label"?: string;
|
|
19
|
+
readonly echo?: never;
|
|
20
|
+
};
|
|
21
|
+
/** Dot only: static, or `echo` (a ring that expands and fades in the tone's light stop). Both need an accessible name. */
|
|
22
|
+
type StatusDotOnly = StatusDotBase & {
|
|
23
|
+
readonly children?: undefined;
|
|
24
|
+
/** Required without children: the status in words, also shown in a Tooltip on hover and focus. */
|
|
25
|
+
readonly "aria-label": string;
|
|
26
|
+
readonly echo?: boolean;
|
|
27
|
+
};
|
|
28
|
+
export type StatusDotProps = StatusDotWithText | StatusDotOnly;
|
|
29
|
+
/** The label's first letter is always uppercase: a text node is capitalised here, any other node by `::first-letter`. */
|
|
30
|
+
export declare const capitaliseFirst: (children: ReactNode) => ReactNode;
|
|
31
|
+
/** The one dot: size from the shared `--starci-core-status-dot-size` token, colour from the tone. */
|
|
32
|
+
export declare const StatusDotMark: ({ tone, echo }: {
|
|
33
|
+
readonly tone: StatusDotTone;
|
|
34
|
+
readonly echo?: boolean;
|
|
35
|
+
}) => import("react").JSX.Element;
|
|
36
|
+
/**
|
|
37
|
+
* The text anatomy, shared by `StatusDot` and `Badge isDot`: a soft HeroUI `Chip`, the dot, then the label.
|
|
38
|
+
* `component` and `extra` let Badge keep its own `data-component` and attributes on the same anatomy.
|
|
39
|
+
*/
|
|
40
|
+
export declare const StatusDotChip: ({ tone, size, children, component, extra, isSkeleton, ...aria }: {
|
|
41
|
+
readonly tone: StatusDotTone;
|
|
42
|
+
readonly size: StatusDotSize;
|
|
43
|
+
readonly children: ReactNode;
|
|
44
|
+
readonly component?: string;
|
|
45
|
+
readonly extra?: Readonly<Record<string, string | undefined>>;
|
|
46
|
+
readonly isSkeleton?: boolean;
|
|
47
|
+
readonly "aria-label"?: string;
|
|
48
|
+
}) => import("react").JSX.Element;
|
|
49
|
+
/**
|
|
50
|
+
* ATOM - `StatusDot`: a status as a coloured dot, in three variants that share one dot-size token and one tone set.
|
|
51
|
+
*
|
|
52
|
+
* - With `children`: dot + text on a soft tint, rendered through HeroUI's own `Chip` (`variant="soft"`, the same
|
|
53
|
+
* `size`), so padding and height are the Chip's by construction. The dot-to-text gap is gap-1 (0.25rem).
|
|
54
|
+
* - `echo`: the dot alone with a ring that expands and fades in the tone's light stop; off under reduced motion.
|
|
55
|
+
* - Default without text: the dot alone, no background, no echo.
|
|
56
|
+
*
|
|
57
|
+
* Both dot-only variants require `aria-label` and show it in a Tooltip on hover and focus.
|
|
58
|
+
*/
|
|
59
|
+
export declare const StatusDot: (props: StatusDotProps) => import("react").JSX.Element;
|
|
60
|
+
export {};
|
|
61
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/StatusDot/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;AACnF,6GAA6G;AAC7G,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAE9C,KAAK,aAAa,GAAG;IACjB,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,CAAA;IAC7B,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,CAAA;IAC7B;;;OAGG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAChC,CAAA;AAED,gHAAgH;AAChH,KAAK,iBAAiB,GAAG,aAAa,GAAG;IACrC,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,2DAA2D;IAC3D,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,CAAA;CACxB,CAAA;AAED,0HAA0H;AAC1H,KAAK,aAAa,GAAG,aAAa,GAAG;IACjC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;IAC7B,kGAAkG;IAClG,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,cAAc,GAAG,iBAAiB,GAAG,aAAa,CAAA;AAY9D,yHAAyH;AACzH,eAAO,MAAM,eAAe,GAAI,UAAU,SAAS,KAAG,SAGrD,CAAA;AAED,qGAAqG;AACrG,eAAO,MAAM,aAAa,GAAI,gBAAwB;IAAE,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;IAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,OAAO,CAAA;CAAE,gCAQ9G,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa,GAAI,iEAAuF;IACjH,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAA;IAC5B,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAA;IAC5B,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,KAAK,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC,CAAA;IAC7D,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;CACjC,gCAiBA,CAAA;AAiCD;;;;;;;;;GASG;AACH,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,gCAqB9C,CAAA"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Chip, Tooltip as HeroTooltip, skeletonVariants } from "@heroui/react";
|
|
4
|
+
import { useOverlayContainer } from "../../overlayScope.js";
|
|
5
|
+
import { tooltipContentClassName } from "../../branch/Tooltip/classNames.js";
|
|
6
|
+
const SKELETON_CLASS_NAME = skeletonVariants({ animationType: "shimmer" }).base();
|
|
7
|
+
const CHIP_COLORS = {
|
|
8
|
+
neutral: "default",
|
|
9
|
+
accent: "accent",
|
|
10
|
+
success: "success",
|
|
11
|
+
warning: "warning",
|
|
12
|
+
danger: "danger",
|
|
13
|
+
};
|
|
14
|
+
/** The label's first letter is always uppercase: a text node is capitalised here, any other node by `::first-letter`. */
|
|
15
|
+
export const capitaliseFirst = (children) => {
|
|
16
|
+
if (typeof children !== "string" || children.length === 0)
|
|
17
|
+
return children;
|
|
18
|
+
return children.charAt(0).toLocaleUpperCase() + children.slice(1);
|
|
19
|
+
};
|
|
20
|
+
/** The one dot: size from the shared `--starci-core-status-dot-size` token, colour from the tone. */
|
|
21
|
+
export const StatusDotMark = ({ tone, echo = false }) => (_jsx("span", { "aria-hidden": "true", className: "starci-core-status-dot-mark", "data-slot": "status-dot-mark", "data-tone": tone, "data-echo": echo ? "true" : "false" }));
|
|
22
|
+
/**
|
|
23
|
+
* The text anatomy, shared by `StatusDot` and `Badge isDot`: a soft HeroUI `Chip`, the dot, then the label.
|
|
24
|
+
* `component` and `extra` let Badge keep its own `data-component` and attributes on the same anatomy.
|
|
25
|
+
*/
|
|
26
|
+
export const StatusDotChip = ({ tone, size, children, component = "StatusDot", extra, isSkeleton = false, ...aria }) => (_jsxs(Chip, { "data-tier": "atom", "data-component": component, "data-variant": "text", "data-tone": tone, "data-size": size, ...extra, color: CHIP_COLORS[tone], variant: "soft", size: size, className: isSkeleton ? `starci-core-status-dot starci-core-status-dot-chip ${SKELETON_CLASS_NAME}` : "starci-core-status-dot starci-core-status-dot-chip", ...(isSkeleton ? { "data-loading": "true", "aria-hidden": true } : aria), children: [_jsx(StatusDotMark, { tone: tone }), _jsx("span", { className: "starci-core-status-dot-label", children: capitaliseFirst(children) })] }));
|
|
27
|
+
const DotOnly = ({ tone, size, echo, label }) => {
|
|
28
|
+
const { anchor, container } = useOverlayContainer("Tooltip");
|
|
29
|
+
return (_jsxs(HeroTooltip, { delay: 0, children: [_jsx(HeroTooltip.Trigger, { role: "img", "aria-label": label, className: "starci-core-status-dot", "data-tier": "atom", "data-component": "StatusDot", "data-variant": echo ? "echo" : "static", "data-tone": tone, "data-size": size, children: _jsx(StatusDotMark, { tone: tone, echo: echo }) }), anchor, container === null ? null : (_jsx(HeroTooltip.Content, { UNSTABLE_portalContainer: container, placement: "top", className: tooltipContentClassName, "data-grammar-tooltip-content": "true", children: label }))] }));
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* ATOM - `StatusDot`: a status as a coloured dot, in three variants that share one dot-size token and one tone set.
|
|
33
|
+
*
|
|
34
|
+
* - With `children`: dot + text on a soft tint, rendered through HeroUI's own `Chip` (`variant="soft"`, the same
|
|
35
|
+
* `size`), so padding and height are the Chip's by construction. The dot-to-text gap is gap-1 (0.25rem).
|
|
36
|
+
* - `echo`: the dot alone with a ring that expands and fades in the tone's light stop; off under reduced motion.
|
|
37
|
+
* - Default without text: the dot alone, no background, no echo.
|
|
38
|
+
*
|
|
39
|
+
* Both dot-only variants require `aria-label` and show it in a Tooltip on hover and focus.
|
|
40
|
+
*/
|
|
41
|
+
export const StatusDot = (props) => {
|
|
42
|
+
const tone = props.tone ?? "neutral";
|
|
43
|
+
const size = props.size ?? "md";
|
|
44
|
+
if (props.isSkeleton === true) {
|
|
45
|
+
if (props.children === undefined) {
|
|
46
|
+
return (_jsx("span", { "aria-hidden": "true", className: `starci-core-status-dot ${SKELETON_CLASS_NAME}`, "data-tier": "atom", "data-component": "StatusDot", "data-variant": "static", "data-tone": tone, "data-size": size, "data-loading": "true", children: _jsx(StatusDotMark, { tone: tone }) }));
|
|
47
|
+
}
|
|
48
|
+
return _jsx(StatusDotChip, { tone: tone, size: size, isSkeleton: true, children: props.children });
|
|
49
|
+
}
|
|
50
|
+
if (props.children === undefined) {
|
|
51
|
+
return _jsx(DotOnly, { tone: tone, size: size, echo: props.echo === true, label: props["aria-label"] ?? "Status" });
|
|
52
|
+
}
|
|
53
|
+
return (_jsx(StatusDotChip, { tone: tone, size: size, ...(props["aria-label"] === undefined ? {} : { "aria-label": props["aria-label"] }), children: props.children }));
|
|
54
|
+
};
|
|
55
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/StatusDot/index.tsx"],"names":[],"mappings":"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"}
|