@starci/grammar 0.5.1 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.build-stamp.json +4 -4
- package/dist/common/components-navigation.css +111 -0
- package/dist/common/components-overlays.css +57 -34
- package/dist/common/registry.d.ts +11 -8
- package/dist/common/registry.d.ts.map +1 -1
- package/dist/common/registry.js +2 -2
- package/dist/common/registry.js.map +1 -1
- package/dist/common/renderers-navigation.d.ts +4 -4
- package/dist/common/renderers-navigation.d.ts.map +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 -2
- package/dist/common/renderers.d.ts.map +1 -1
- package/dist/common/renderers.js +1 -0
- package/dist/common/renderers.js.map +1 -1
- package/dist/common/styles.css +224 -6
- package/dist/core/CircleFill.d.ts +15 -0
- package/dist/core/CircleFill.d.ts.map +1 -0
- package/dist/core/CircleFill.js +11 -0
- package/dist/core/CircleFill.js.map +1 -0
- package/dist/core/LeadingNumber.d.ts.map +1 -1
- package/dist/core/LeadingNumber.js +1 -1
- package/dist/core/LeadingNumber.js.map +1 -1
- package/dist/core/OtpInput.d.ts.map +1 -1
- package/dist/core/OtpInput.js +2 -2
- package/dist/core/OtpInput.js.map +1 -1
- package/dist/core/StateMark.d.ts.map +1 -1
- package/dist/core/StateMark.js +1 -1
- package/dist/core/StateMark.js.map +1 -1
- package/dist/core/branch/MarkdownArticle/index.d.ts.map +1 -1
- package/dist/core/branch/MarkdownArticle/index.js +3 -3
- package/dist/core/branch/MarkdownArticle/index.js.map +1 -1
- package/dist/core/branch/Rail/index.d.ts.map +1 -1
- package/dist/core/branch/Rail/index.js +2 -0
- package/dist/core/branch/Rail/index.js.map +1 -1
- package/dist/core/branch/Subnav/index.d.ts.map +1 -1
- package/dist/core/branch/Subnav/index.js +1 -1
- package/dist/core/branch/Subnav/index.js.map +1 -1
- package/dist/core/branch/SurfaceAccordionCard/index.d.ts.map +1 -1
- package/dist/core/branch/SurfaceAccordionCard/index.js +1 -1
- package/dist/core/branch/SurfaceAccordionCard/index.js.map +1 -1
- package/dist/core/branch/SurfaceCard/classNames.d.ts +8 -0
- package/dist/core/branch/SurfaceCard/classNames.d.ts.map +1 -1
- package/dist/core/branch/SurfaceCard/classNames.js +4 -0
- package/dist/core/branch/SurfaceCard/classNames.js.map +1 -1
- package/dist/core/branch/SurfaceCard/index.d.ts +25 -2
- package/dist/core/branch/SurfaceCard/index.d.ts.map +1 -1
- package/dist/core/branch/SurfaceCard/index.js +18 -7
- package/dist/core/branch/SurfaceCard/index.js.map +1 -1
- package/dist/core/branch/SurfaceListCard/index.d.ts.map +1 -1
- package/dist/core/branch/SurfaceListCard/index.js +1 -1
- package/dist/core/branch/SurfaceListCard/index.js.map +1 -1
- package/dist/core/branch/Tabs/index.js +2 -2
- package/dist/core/branch/Tabs/index.js.map +1 -1
- package/dist/core/branch/Tooltip/index.d.ts.map +1 -1
- package/dist/core/branch/Tooltip/index.js +1 -1
- package/dist/core/branch/Tooltip/index.js.map +1 -1
- package/dist/core/composite/Alert/index.d.ts +8 -0
- package/dist/core/composite/Alert/index.d.ts.map +1 -1
- package/dist/core/composite/Alert/index.js +25 -1
- package/dist/core/composite/Alert/index.js.map +1 -1
- package/dist/core/composite/DescriptionList/index.d.ts +29 -4
- package/dist/core/composite/DescriptionList/index.d.ts.map +1 -1
- package/dist/core/composite/DescriptionList/index.js +10 -1
- package/dist/core/composite/DescriptionList/index.js.map +1 -1
- package/dist/core/composite/HorizontalScrollRegion/index.d.ts.map +1 -1
- package/dist/core/composite/HorizontalScrollRegion/index.js +1 -1
- package/dist/core/composite/HorizontalScrollRegion/index.js.map +1 -1
- package/dist/core/composite/StaticStateRow/index.d.ts.map +1 -1
- package/dist/core/composite/StaticStateRow/index.js +1 -1
- package/dist/core/composite/StaticStateRow/index.js.map +1 -1
- package/dist/core/composite/TagGroup/index.d.ts +11 -0
- package/dist/core/composite/TagGroup/index.d.ts.map +1 -1
- package/dist/core/composite/TagGroup/index.js +1 -1
- package/dist/core/composite/TagGroup/index.js.map +1 -1
- package/dist/core/composite/VerticalScrollRegion/index.js +2 -2
- package/dist/core/composite/VerticalScrollRegion/index.js.map +1 -1
- package/dist/core/composition/ChatWorkspace/index.d.ts.map +1 -1
- package/dist/core/composition/ChatWorkspace/index.js +1 -1
- package/dist/core/composition/ChatWorkspace/index.js.map +1 -1
- package/dist/core/composition/NavigationFeatureNav/index.d.ts.map +1 -1
- package/dist/core/composition/NavigationFeatureNav/index.js +1 -1
- package/dist/core/composition/NavigationFeatureNav/index.js.map +1 -1
- package/dist/core/composition/PrimaryRailLayout/index.js +1 -1
- package/dist/core/composition/PrimaryRailLayout/index.js.map +1 -1
- package/dist/core/composition/WorkspaceShell/index.js +1 -1
- package/dist/core/composition/WorkspaceShell/index.js.map +1 -1
- package/dist/core/index.d.ts +11 -8
- package/dist/core/index.d.ts.map +1 -1
- package/dist/core/primitive/Badge/index.d.ts +8 -2
- package/dist/core/primitive/Badge/index.d.ts.map +1 -1
- package/dist/core/primitive/Badge/index.js +5 -3
- package/dist/core/primitive/Badge/index.js.map +1 -1
- package/dist/core/primitive/Button/index.d.ts +6 -1
- package/dist/core/primitive/Button/index.d.ts.map +1 -1
- package/dist/core/primitive/Button/index.js +2 -0
- package/dist/core/primitive/Button/index.js.map +1 -1
- package/dist/core/primitive/Divider/index.d.ts +21 -3
- package/dist/core/primitive/Divider/index.d.ts.map +1 -1
- package/dist/core/primitive/Divider/index.js +14 -2
- package/dist/core/primitive/Divider/index.js.map +1 -1
- package/dist/core/primitive/GrammarRoot/index.d.ts.map +1 -1
- package/dist/core/primitive/GrammarRoot/index.js +1 -1
- package/dist/core/primitive/GrammarRoot/index.js.map +1 -1
- package/dist/core/primitive/IconButton/index.d.ts +8 -1
- package/dist/core/primitive/IconButton/index.d.ts.map +1 -1
- package/dist/core/primitive/IconButton/index.js +1 -1
- package/dist/core/primitive/IconButton/index.js.map +1 -1
- package/dist/core/primitive/Image/assetSlot.d.ts +19 -0
- package/dist/core/primitive/Image/assetSlot.d.ts.map +1 -0
- package/dist/core/primitive/Image/assetSlot.js +7 -0
- package/dist/core/primitive/Image/assetSlot.js.map +1 -0
- package/dist/core/primitive/Image/index.d.ts +4 -2
- package/dist/core/primitive/Image/index.d.ts.map +1 -1
- package/dist/core/primitive/Image/index.js +3 -2
- package/dist/core/primitive/Image/index.js.map +1 -1
- package/dist/core/primitive/IncludedMark/index.d.ts.map +1 -1
- package/dist/core/primitive/IncludedMark/index.js +1 -1
- package/dist/core/primitive/IncludedMark/index.js.map +1 -1
- package/dist/core/primitive/Label/index.d.ts +2 -0
- package/dist/core/primitive/Label/index.d.ts.map +1 -1
- package/dist/core/primitive/Label/index.js +2 -0
- package/dist/core/primitive/Label/index.js.map +1 -1
- package/dist/core/primitive/MediaFrame/index.d.ts +3 -2
- package/dist/core/primitive/MediaFrame/index.d.ts.map +1 -1
- package/dist/core/primitive/MediaFrame/index.js +2 -1
- package/dist/core/primitive/MediaFrame/index.js.map +1 -1
- package/dist/core/primitive/Meter/index.d.ts +15 -1
- package/dist/core/primitive/Meter/index.d.ts.map +1 -1
- package/dist/core/primitive/Meter/index.js +16 -3
- package/dist/core/primitive/Meter/index.js.map +1 -1
- package/dist/core/primitive/PageContainer/index.d.ts.map +1 -1
- package/dist/core/primitive/PageContainer/index.js +1 -1
- package/dist/core/primitive/PageContainer/index.js.map +1 -1
- package/dist/core/primitive/PinnedActionBar/index.d.ts +20 -0
- package/dist/core/primitive/PinnedActionBar/index.d.ts.map +1 -0
- package/dist/core/primitive/PinnedActionBar/index.js +10 -0
- package/dist/core/primitive/PinnedActionBar/index.js.map +1 -0
- package/dist/core/primitive/RankArtwork/index.d.ts.map +1 -1
- package/dist/core/primitive/RankArtwork/index.js +1 -1
- package/dist/core/primitive/RankArtwork/index.js.map +1 -1
- package/dist/core/primitive/SectionHeader/index.d.ts +11 -1
- package/dist/core/primitive/SectionHeader/index.d.ts.map +1 -1
- package/dist/core/primitive/SectionHeader/index.js +1 -1
- package/dist/core/primitive/SectionHeader/index.js.map +1 -1
- package/dist/core/primitive/SurfaceCopyGroup/index.d.ts.map +1 -1
- package/dist/core/primitive/SurfaceCopyGroup/index.js +1 -1
- package/dist/core/primitive/SurfaceCopyGroup/index.js.map +1 -1
- package/dist/heritage/styles.css +7 -0
- package/dist/offset-pop/components-navigation.css +10 -0
- package/dist/offset-pop/components-overlays.css +21 -1
- package/dist/offset-pop/styles.css +26 -0
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Image/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Image/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAEnE,OAAO,EAAuB,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAEzE,YAAY,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAA;AAC/E,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;AAE3D,MAAM,MAAM,UAAU,GAAG,cAAc,GAAG;IACtC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;IACpB,4DAA4D;IAC5D,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;IACpB,0FAA0F;IAC1F,QAAQ,CAAC,MAAM,CAAC,EAAE,WAAW,CAAA;IAC7B,QAAQ,CAAC,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAClC,2DAA2D;IAC3D,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;IAC7B,0EAA0E;IAC1E,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACnC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAA;IAC5D,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,KAAK,GAAI,wHAcnB,UAAU,gCAoDZ,CAAA"}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { useEffect, useRef, useState } from "react";
|
|
4
4
|
import { navigationClassName } from "../../navigationClassNames.js";
|
|
5
|
+
import { assetSlotAttributes } from "./assetSlot.js";
|
|
5
6
|
/**
|
|
6
7
|
* A reserved-ratio image with loading, loaded and error states.
|
|
7
8
|
*
|
|
@@ -9,7 +10,7 @@ import { navigationClassName } from "../../navigationClassNames.js";
|
|
|
9
10
|
* `MediaFrame` frames approved art with a caption; `Image` is the element inside or outside it.
|
|
10
11
|
* Contract: box MEDIA-2 MEDIA-5 (reserved ratio, load states), img MEDIA-4 MOTION-2, fallback MEDIA-4 MEDIA-5.
|
|
11
12
|
*/
|
|
12
|
-
export const Image = ({ src, alt, aspect = "auto", fit = "cover", fallback, loading = "lazy", srcSet, sizes, width, height, onLoadStateChange, className, }) => {
|
|
13
|
+
export const Image = ({ src, alt, aspect = "auto", fit = "cover", fallback, loading = "lazy", srcSet, sizes, width, height, onLoadStateChange, className, ...assetSlot }) => {
|
|
13
14
|
const [state, setState] = useState("loading");
|
|
14
15
|
const imageRef = useRef(null);
|
|
15
16
|
const report = (next) => {
|
|
@@ -24,6 +25,6 @@ export const Image = ({ src, alt, aspect = "auto", fit = "cover", fallback, load
|
|
|
24
25
|
report("loaded");
|
|
25
26
|
}, [src]);
|
|
26
27
|
const showFallback = state === "error" && fallback !== undefined;
|
|
27
|
-
return (_jsx("span", { className: navigationClassName("starci-core-image", className), "data-component": "Image", "data-contract": "MEDIA-2 MEDIA-5", "data-tier": "atom", "data-grammar-image-aspect": aspect, "data-grammar-image-fit": fit, "data-grammar-image-state": state, children: showFallback ? (_jsx("span", { className: "starci-core-image-fallback", "data-contract": "MEDIA-4 MEDIA-5", "data-grammar-image-fallback": "true", ...(alt === "" ? { "aria-hidden": true } : { role: "img", "aria-label": alt }), children: fallback })) : (_jsx("img", { ref: imageRef, alt: alt, className: "starci-core-image-element", "data-contract": "MEDIA-4 MOTION-2", decoding: "async", loading: loading, src: src, ...(srcSet === undefined ? {} : { srcSet }), ...(sizes === undefined ? {} : { sizes }), ...(width === undefined ? {} : { width }), ...(height === undefined ? {} : { height }), onError: () => report("error"), onLoad: () => report("loaded") })) }));
|
|
28
|
+
return (_jsx("span", { className: navigationClassName("starci-core-image", className), "data-component": "Image", "data-contract": "MEDIA-2 MEDIA-5", "data-tier": "atom", "data-grammar-image-aspect": aspect, "data-grammar-image-fit": fit, "data-grammar-image-state": state, ...assetSlotAttributes(assetSlot), children: showFallback ? (_jsx("span", { className: "starci-core-image-fallback", "data-contract": "MEDIA-4 MEDIA-5", "data-grammar-image-fallback": "true", ...(alt === "" ? { "aria-hidden": true } : { role: "img", "aria-label": alt }), children: fallback })) : (_jsx("img", { ref: imageRef, alt: alt, className: "starci-core-image-element", "data-contract": "MEDIA-4 MOTION-2", decoding: "async", loading: loading, src: src, ...(srcSet === undefined ? {} : { srcSet }), ...(sizes === undefined ? {} : { sizes }), ...(width === undefined ? {} : { width }), ...(height === undefined ? {} : { height }), onError: () => report("error"), onLoad: () => report("loaded") })) }));
|
|
28
29
|
};
|
|
29
30
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Image/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Image/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAuB,MAAM,gBAAgB,CAAA;AA0BzE;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAClB,GAAG,EACH,GAAG,EACH,MAAM,GAAG,MAAM,EACf,GAAG,GAAG,OAAO,EACb,QAAQ,EACR,OAAO,GAAG,MAAM,EAChB,MAAM,EACN,KAAK,EACL,KAAK,EACL,MAAM,EACN,iBAAiB,EACjB,SAAS,EACT,GAAG,SAAS,EACH,EAAE,EAAE;IACb,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAiB,SAAS,CAAC,CAAA;IAC7D,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAC/C,MAAM,MAAM,GAAG,CAAC,IAAoB,EAAE,EAAE;QACpC,QAAQ,CAAC,IAAI,CAAC,CAAA;QACd,iBAAiB,EAAE,CAAC,IAAI,CAAC,CAAA;IAC7B,CAAC,CAAA;IACD,SAAS,CAAC,GAAG,EAAE;QACX,QAAQ,CAAC,SAAS,CAAC,CAAA;QACnB,8DAA8D;QAC9D,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAA;QAC9B,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,GAAG,CAAC;YAAE,MAAM,CAAC,QAAQ,CAAC,CAAA;IACpF,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAA;IAET,MAAM,YAAY,GAAG,KAAK,KAAK,OAAO,IAAI,QAAQ,KAAK,SAAS,CAAA;IAChE,OAAO,CACH,eACI,SAAS,EAAE,mBAAmB,CAAC,mBAAmB,EAAE,SAAS,CAAC,oBAC/C,OAAO,mBACR,iBAAiB,eACrB,MAAM,+BACW,MAAM,4BACT,GAAG,8BACD,KAAK,KAC3B,mBAAmB,CAAC,SAAS,CAAC,YAEjC,YAAY,CAAC,CAAC,CAAC,CACZ,eACI,SAAS,EAAC,4BAA4B,mBACxB,iBAAiB,iCACH,MAAM,KAC9B,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC,YACjF,QAAQ,GAAQ,CACrB,CAAC,CAAC,CAAC,CACA,cACI,GAAG,EAAE,QAAQ,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,2BAA2B,mBACvB,kBAAkB,EAChC,QAAQ,EAAC,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,KACJ,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,KACxC,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,KACtC,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,KACtC,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAC5C,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,EAC9B,MAAM,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,GAChC,CACL,GACE,CACV,CAAA;AACL,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/IncludedMark/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAGrD,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAChF,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,YAAY,GAAI,gCAAgC,iBAAiB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/IncludedMark/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAGrD,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAChF,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,YAAY,GAAI,gCAAgC,iBAAiB,gCAiB7E,CAAA"}
|
|
@@ -5,5 +5,5 @@ import { cn } from "@heroui/react";
|
|
|
5
5
|
* foreground. It deliberately does not reuse affirmative/completion state (TRUTH-1), and it is named
|
|
6
6
|
* only when given a label, silent otherwise (ICON-6).
|
|
7
7
|
*/
|
|
8
|
-
export const IncludedMark = ({ className, label, ...props }) => (_jsxs("svg", { ...props, "aria-hidden": label === undefined ? "true" : undefined, "aria-label": label, className: cn("starci-core-included-mark", className), "data-contract": "ICON-6 TRUTH-1", "data-grammar-included-mark": "true", focusable: "false", role: label === undefined ? undefined : "img", viewBox: "0 0 20 20", children: [_jsx("circle", { cx: "10", cy: "10", fill: "none", r: "8", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "m6.5 10.25 2.2 2.2 4.8-5", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.75" })] }));
|
|
8
|
+
export const IncludedMark = ({ className, label, ...props }) => (_jsxs("svg", { ...props, "aria-hidden": label === undefined ? "true" : undefined, "aria-label": label, className: cn("starci-core-included-mark", className), "data-contract": "ICON-6 TRUTH-1", "data-grammar-included-mark": "true", "data-component": "IncludedMark", "data-tier": "atom", focusable: "false", role: label === undefined ? undefined : "img", viewBox: "0 0 20 20", children: [_jsx("circle", { cx: "10", cy: "10", fill: "none", r: "8", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "m6.5 10.25 2.2 2.2 4.8-5", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.75" })] }));
|
|
9
9
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/IncludedMark/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAMlC;;;;GAIG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAqB,EAAE,EAAE,CAAC,CAC/E,kBACQ,KAAK,iBACI,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,gBACzC,KAAK,EACjB,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE,SAAS,CAAC,mBACvC,gBAAgB,gCACH,MAAM,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/IncludedMark/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAMlC;;;;GAIG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAqB,EAAE,EAAE,CAAC,CAC/E,kBACQ,KAAK,iBACI,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,gBACzC,KAAK,EACjB,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE,SAAS,CAAC,mBACvC,gBAAgB,gCACH,MAAM,oBAClB,cAAc,eACnB,MAAM,EAChB,SAAS,EAAC,OAAO,EACjB,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,EAC7C,OAAO,EAAC,WAAW,aAEnB,iBAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAC,CAAC,EAAC,GAAG,EAAC,MAAM,EAAC,cAAc,EAAC,WAAW,EAAC,KAAK,GAAG,EACpF,eAAM,CAAC,EAAC,0BAA0B,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAC,MAAM,GAAG,IACrI,CACT,CAAA"}
|
|
@@ -19,6 +19,8 @@ export declare const Label: ({ id, children, depth, as }: LabelProps) => import(
|
|
|
19
19
|
readonly id: string | undefined;
|
|
20
20
|
readonly className: string;
|
|
21
21
|
readonly "data-grammar-label": "true";
|
|
22
|
+
readonly "data-component": "Label";
|
|
23
|
+
readonly "data-tier": "atom";
|
|
22
24
|
readonly "data-grammar-label-depth": "top" | "nested";
|
|
23
25
|
readonly "data-contract": "FONT-1 MARGIN-0" | "FONT-2 MARGIN-0";
|
|
24
26
|
}, HTMLElement>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Label/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;AAEnD,0CAA0C;AAC1C,eAAO,MAAM,6BAA6B,EAAE,mBAAuB,CAAA;AAGnE,MAAM,MAAM,UAAU,GAAG;IACrB,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACjC,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1D,CAAA;AAED,qFAAqF;AACrF,eAAO,MAAM,KAAK,GAAI,6BAA8C,UAAU
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Label/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;AAEnD,0CAA0C;AAC1C,eAAO,MAAM,6BAA6B,EAAE,mBAAuB,CAAA;AAGnE,MAAM,MAAM,UAAU,GAAG;IACrB,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IACjC,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1D,CAAA;AAED,qFAAqF;AACrF,eAAO,MAAM,KAAK,GAAI,6BAA8C,UAAU;;;;;;;;eAY7E,CAAA"}
|
|
@@ -8,6 +8,8 @@ export const Label = ({ id, children, depth = "top", as = "span" }) => {
|
|
|
8
8
|
id,
|
|
9
9
|
className: getLabelClassName(),
|
|
10
10
|
"data-grammar-label": "true",
|
|
11
|
+
"data-component": "Label",
|
|
12
|
+
"data-tier": "atom",
|
|
11
13
|
"data-grammar-label-depth": depth,
|
|
12
14
|
"data-contract": getLabelContract(depth),
|
|
13
15
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Label/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAkB,MAAM,OAAO,CAAA;AASrD,0CAA0C;AAC1C,MAAM,CAAC,MAAM,6BAA6B,GAAwB,CAAC,CAAA;AACnE,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAUrE,qFAAqF;AACrF,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,GAAG,KAAK,EAAE,EAAE,GAAG,MAAM,EAAc,EAAE,EAAE;IAC9E,MAAM,MAAM,GAAG;QACX,EAAE;QACF,SAAS,EAAE,iBAAiB,EAAE;QAC9B,oBAAoB,EAAE,MAAM;QAC5B,0BAA0B,EAAE,KAAK;QACjC,eAAe,EAAE,gBAAgB,CAAC,KAAK,CAAC;KAClC,CAAA;IAEV,OAAO,aAAa,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAA;AAC9C,CAAC,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/Label/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAkB,MAAM,OAAO,CAAA;AASrD,0CAA0C;AAC1C,MAAM,CAAC,MAAM,6BAA6B,GAAwB,CAAC,CAAA;AACnE,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAUrE,qFAAqF;AACrF,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,GAAG,KAAK,EAAE,EAAE,GAAG,MAAM,EAAc,EAAE,EAAE;IAC9E,MAAM,MAAM,GAAG;QACX,EAAE;QACF,SAAS,EAAE,iBAAiB,EAAE;QAC9B,oBAAoB,EAAE,MAAM;QAC5B,gBAAgB,EAAE,OAAO;QACzB,WAAW,EAAE,MAAM;QACnB,0BAA0B,EAAE,KAAK;QACjC,eAAe,EAAE,gBAAgB,CAAC,KAAK,CAAC;KAClC,CAAA;IAEV,OAAO,aAAa,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAA;AAC9C,CAAC,CAAA"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ReactNode } from "react";
|
|
2
|
-
|
|
2
|
+
import { type AssetSlotProps } from "../Image/assetSlot.js";
|
|
3
|
+
export type MediaFrameProps = AssetSlotProps & {
|
|
3
4
|
readonly children: ReactNode;
|
|
4
5
|
readonly caption?: ReactNode;
|
|
5
6
|
readonly aspect?: "landscape" | "portrait" | "square" | "auto";
|
|
@@ -11,5 +12,5 @@ export type MediaFrameProps = {
|
|
|
11
12
|
* Product-family frame for an approved illustration, photograph or generated bitmap.
|
|
12
13
|
* Asset purpose and generation authority stay with the consuming product workflow.
|
|
13
14
|
*/
|
|
14
|
-
export declare const MediaFrame: ({ children, caption, aspect, fit, treatment, className, }: MediaFrameProps) => import("react").JSX.Element;
|
|
15
|
+
export declare const MediaFrame: ({ children, caption, aspect, fit, treatment, className, ...assetSlot }: MediaFrameProps) => import("react").JSX.Element;
|
|
15
16
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/MediaFrame/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/MediaFrame/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAuB,KAAK,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAEhF,MAAM,MAAM,eAAe,GAAG,cAAc,GAAG;IAC3C,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;IAC9D,QAAQ,CAAC,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAClC,QAAQ,CAAC,SAAS,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAA;IACvC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,UAAU,GAAI,wEAQxB,eAAe,gCAkBjB,CAAA"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "@heroui/react";
|
|
3
|
+
import { assetSlotAttributes } from "../Image/assetSlot.js";
|
|
3
4
|
/**
|
|
4
5
|
* Product-family frame for an approved illustration, photograph or generated bitmap.
|
|
5
6
|
* Asset purpose and generation authority stay with the consuming product workflow.
|
|
6
7
|
*/
|
|
7
|
-
export const MediaFrame = ({ children, caption, aspect = "landscape", fit = "cover", treatment = "framed", className, }) => (_jsxs("figure", { className: cn("starci-core-media-frame", className), "data-contract": "GAP-2 MARGIN-0", "data-grammar-media-aspect": aspect, "data-grammar-media-fit": fit, "data-grammar-media-treatment": treatment, children: [_jsx("div", { className: "starci-core-media-viewport", "data-contract": treatment === "plain" ? "OVERFLOW-2 SURFACE-1" : "OVERFLOW-2 BOUNDARY-5 SURFACE-3", "data-grammar-media": "true", children: children }), caption === undefined ? null : _jsx("figcaption", { className: "starci-core-media-caption", "data-contract": "FLOW-3", children: caption })] }));
|
|
8
|
+
export const MediaFrame = ({ children, caption, aspect = "landscape", fit = "cover", treatment = "framed", className, ...assetSlot }) => (_jsxs("figure", { className: cn("starci-core-media-frame", className), "data-component": "MediaFrame", "data-tier": "atom", ...assetSlotAttributes(assetSlot), "data-contract": "GAP-2 MARGIN-0", "data-grammar-media-aspect": aspect, "data-grammar-media-fit": fit, "data-grammar-media-treatment": treatment, children: [_jsx("div", { className: "starci-core-media-viewport", "data-contract": treatment === "plain" ? "OVERFLOW-2 SURFACE-1" : "OVERFLOW-2 BOUNDARY-5 SURFACE-3", "data-grammar-media": "true", children: children }), caption === undefined ? null : _jsx("figcaption", { className: "starci-core-media-caption", "data-contract": "FLOW-3", children: caption })] }));
|
|
8
9
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/MediaFrame/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/MediaFrame/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAElC,OAAO,EAAE,mBAAmB,EAAuB,MAAM,uBAAuB,CAAA;AAWhF;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACvB,QAAQ,EACR,OAAO,EACP,MAAM,GAAG,WAAW,EACpB,GAAG,GAAG,OAAO,EACb,SAAS,GAAG,QAAQ,EACpB,SAAS,EACT,GAAG,SAAS,EACE,EAAE,EAAE,CAAC,CACnB,kBACI,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,oBACpC,YAAY,eACjB,MAAM,KACZ,mBAAmB,CAAC,SAAS,CAAC,mBACpB,gBAAgB,+BACH,MAAM,4BACT,GAAG,kCACG,SAAS,aAEvC,cACI,SAAS,EAAC,4BAA4B,mBACvB,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,iCAAiC,wBAC9E,MAAM,YAC3B,QAAQ,GAAO,EAChB,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,qBAAY,SAAS,EAAC,2BAA2B,mBAAe,QAAQ,YAAE,OAAO,GAAc,IAC1H,CACZ,CAAA"}
|
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import type { PresentationState } from "../../../common/state.js";
|
|
2
|
+
/**
|
|
3
|
+
* How many equal parts a segmented meter draws: a discrete count such as "2 of 3 capabilities".
|
|
4
|
+
* A closed range, 2..12 - one part is a plain meter and more than twelve stops reading as a count.
|
|
5
|
+
*/
|
|
6
|
+
export type MeterSegments = 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
2
7
|
export type MeterProps = {
|
|
3
8
|
/** What the gauge measures. Visible by default and wired as the meter's accessible name. */
|
|
4
9
|
readonly label: string;
|
|
@@ -11,6 +16,15 @@ export type MeterProps = {
|
|
|
11
16
|
readonly tone?: PresentationState;
|
|
12
17
|
/** Hide the drawn label and reading but keep the accessible name. */
|
|
13
18
|
readonly isLabelHidden?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Draw the track as this many equal, separately rounded segments instead of one continuous fill.
|
|
21
|
+
* The track spans the full width of its container, like a Progress track, at HeroUI's h-1
|
|
22
|
+
* (0.25rem, 4px; the plain meter is h-2); segments sit 0.25rem apart. The reading becomes a whole count: `value`, `minValue` and `maxValue` are rounded
|
|
23
|
+
* to integers and the value clamped into range, and `round((value - min) / (max - min) * segments)`
|
|
24
|
+
* segments fill. The segments are presentational (`aria-hidden`): the one `role="meter"` keeps the
|
|
25
|
+
* accessible name and `aria-value*`. Out-of-range counts from untyped callers clamp to 2..12.
|
|
26
|
+
*/
|
|
27
|
+
readonly segments?: MeterSegments;
|
|
14
28
|
};
|
|
15
|
-
export declare const Meter: ({ label, value, minValue, maxValue, valueLabel, tone, isLabelHidden, }: MeterProps) => import("react").JSX.Element;
|
|
29
|
+
export declare const Meter: ({ label, value, minValue, maxValue, valueLabel, tone, isLabelHidden, segments, }: MeterProps) => import("react").JSX.Element;
|
|
16
30
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Meter/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAGjE,MAAM,MAAM,UAAU,GAAG;IACrB,4FAA4F;IAC5F,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,qFAAqF;IACrF,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,0FAA0F;IAC1F,QAAQ,CAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACjC,qEAAqE;IACrE,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/Meter/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAGjE;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAA;AAExE,MAAM,MAAM,UAAU,GAAG;IACrB,4FAA4F;IAC5F,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,qFAAqF;IACrF,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,0FAA0F;IAC1F,QAAQ,CAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACjC,qEAAqE;IACrE,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAA;IAChC;;;;;;;OAOG;IACH,QAAQ,CAAC,QAAQ,CAAC,EAAE,aAAa,CAAA;CACpC,CAAA;AA0BD,eAAO,MAAM,KAAK,GAAI,kFASnB,UAAU,gCAgDZ,CAAA"}
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Label as HeroLabel, Meter as HeroMeter } from "@heroui/react";
|
|
3
3
|
import { vendorStatusFor } from "../../overlayScope.js";
|
|
4
|
+
const MIN_SEGMENTS = 2;
|
|
5
|
+
const MAX_SEGMENTS = 12;
|
|
6
|
+
/** A whole segment count in 2..12, whatever an untyped caller passed. */
|
|
7
|
+
const clampSegments = (segments) => Math.min(MAX_SEGMENTS, Math.max(MIN_SEGMENTS, Math.round(Number.isFinite(segments) ? segments : MIN_SEGMENTS)));
|
|
8
|
+
/** A segmented meter reads whole counts; a non-finite bound falls back to the plain default. */
|
|
9
|
+
const wholeNumber = (value, fallback) => (Number.isFinite(value) ? Math.round(value) : fallback);
|
|
4
10
|
/**
|
|
5
11
|
* ATOM - `Meter`: a static reading inside a known range (`role="meter"`).
|
|
6
12
|
*
|
|
@@ -10,11 +16,18 @@ import { vendorStatusFor } from "../../overlayScope.js";
|
|
|
10
16
|
* and Gecko map it to a level indicator / progress bar natively).
|
|
11
17
|
*
|
|
12
18
|
* Unlike `Progress`, a meter is not work moving toward completion. Tone is a PresentationState and is
|
|
13
|
-
* echoed on `data-grammar-tone` for family treatments.
|
|
19
|
+
* echoed on `data-grammar-tone` for family treatments. `segments` draws a discrete count (3 of 3,
|
|
20
|
+
* 2 of 3) as equal segments on the same track; the root echoes the count on
|
|
21
|
+
* `data-grammar-meter-segments` and each segment its state on `data-grammar-meter-segment`.
|
|
14
22
|
*/
|
|
15
23
|
const renderMeterRoot = (domProps) => _jsx("div", { ...domProps, role: "meter" });
|
|
16
|
-
export const Meter = ({ label, value, minValue = 0, maxValue = 100, valueLabel, tone = "neutral", isLabelHidden = false, }) => {
|
|
24
|
+
export const Meter = ({ label, value, minValue = 0, maxValue = 100, valueLabel, tone = "neutral", isLabelHidden = false, segments, }) => {
|
|
17
25
|
const status = vendorStatusFor(tone);
|
|
18
|
-
|
|
26
|
+
const count = segments === undefined ? undefined : clampSegments(segments);
|
|
27
|
+
const min = count === undefined ? minValue : wholeNumber(minValue, 0);
|
|
28
|
+
const max = count === undefined ? maxValue : Math.max(min + 1, wholeNumber(maxValue, 100));
|
|
29
|
+
const reading = count === undefined ? value : Math.min(max, Math.max(min, wholeNumber(value, min)));
|
|
30
|
+
const filled = count === undefined ? 0 : Math.round(((reading - min) / (max - min)) * count);
|
|
31
|
+
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: "md", 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))) }))] }));
|
|
19
32
|
};
|
|
20
33
|
//# 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;
|
|
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;AA+BvD,MAAM,YAAY,GAAG,CAAC,CAAA;AACtB,MAAM,YAAY,GAAG,EAAE,CAAA;AAEvB,yEAAyE;AACzE,MAAM,aAAa,GAAG,CAAC,QAAgB,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAA;AAE3J,gGAAgG;AAChG,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,QAAgB,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAA;AAEhH;;;;;;;;;;;;GAYG;AACH,MAAM,eAAe,GAAG,CAAC,QAAsC,EAAE,EAAE,CAAC,iBAAS,QAAQ,EAAE,IAAI,EAAC,OAAO,GAAG,CAAA;AAEtG,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAClB,KAAK,EACL,KAAK,EACL,QAAQ,GAAG,CAAC,EACZ,QAAQ,GAAG,GAAG,EACd,UAAU,EACV,IAAI,GAAG,SAAS,EAChB,aAAa,GAAG,KAAK,EACrB,QAAQ,GACC,EAAE,EAAE;IACb,MAAM,MAAM,GAAG,eAAe,CAAC,IAAI,CAAC,CAAA;IACpC,MAAM,KAAK,GAAG,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;IAC1E,MAAM,GAAG,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAA;IACrE,MAAM,GAAG,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,EAAE,WAAW,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAA;IAC1F,MAAM,OAAO,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,WAAW,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,CAAA;IACnG,MAAM,MAAM,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,CAAA;IAC5F,OAAO,CACH,MAAC,SAAS,iBACI,MAAM,oBACD,OAAO,uBACH,IAAI,mBACT,iBAAiB,EAC/B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,GAAG,EACb,QAAQ,EAAE,GAAG,KACT,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,6BAA6B,EAAE,KAAK,EAAE,CAAC,KACrE,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC,KAChD,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAClD,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,EAC/C,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,mBAAmB,EAC7B,MAAM,EAAE,eAAe,aAEtB,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACpB,gBAAM,SAAS,EAAC,0BAA0B,aACtC,KAAC,SAAS,IAAC,SAAS,EAAC,yBAAyB,YAAE,KAAK,GAAa,EAClE,KAAC,SAAS,CAAC,MAAM,IAAC,SAAS,EAAC,0BAA0B,GAAG,IACtD,CACV,EACA,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,CACnB,KAAC,SAAS,CAAC,KAAK,IAAC,SAAS,EAAC,yBAAyB,YAChD,KAAC,SAAS,CAAC,IAAI,IAAC,SAAS,EAAC,wBAAwB,mBAAe,UAAU,GAAG,GAChE,CACrB,CAAC,CAAC,CAAC,CACA,KAAC,SAAS,CAAC,KAAK,IAAC,SAAS,EAAC,oDAAoD,YAC1E,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACzC,8BAEgB,MAAM,EAClB,SAAS,EAAC,2BAA2B,gCACT,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,IAH1D,KAAK,CAIZ,CACL,CAAC,GACY,CACrB,IACO,CACf,CAAA;AACL,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/PageContainer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAC/D,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;IACjD,uFAAuF;IACvF,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC,EAAE,MAAM,CAAA;CACtC,CAAA;AAED,6EAA6E;AAC7E,eAAO,MAAM,aAAa,GAAI,kCAA8C,kBAAkB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/PageContainer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAC/D,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAA;IACjD,uFAAuF;IACvF,QAAQ,CAAC,CAAC,eAAe,CAAC,CAAC,EAAE,MAAM,CAAA;CACtC,CAAA;AAED,6EAA6E;AAC7E,eAAO,MAAM,aAAa,GAAI,kCAA8C,kBAAkB,gCAY7F,CAAA"}
|
|
@@ -3,6 +3,6 @@ import { cn } from "@heroui/react";
|
|
|
3
3
|
/** Centred responsive page inset using the packaged StarCi measure scale. */
|
|
4
4
|
export const PageContainer = ({ className, measure = "product", ...props }) => {
|
|
5
5
|
const { "data-contract": composedContract, ...rest } = props;
|
|
6
|
-
return (_jsx("div", { ...rest, className: cn("starci-core-page-container", className), "data-contract": ["MARGIN-AUTO", "MEASURE-1", composedContract].filter(Boolean).join(" "), "data-grammar-page-measure": measure }));
|
|
6
|
+
return (_jsx("div", { ...rest, className: cn("starci-core-page-container", className), "data-contract": ["MARGIN-AUTO", "MEASURE-1", composedContract].filter(Boolean).join(" "), "data-grammar-page-measure": measure, "data-component": "PageContainer", "data-tier": "atom" }));
|
|
7
7
|
};
|
|
8
8
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/PageContainer/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AASlC,6EAA6E;AAC7E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,KAAK,EAAsB,EAAE,EAAE;IAC9F,MAAM,EAAE,eAAe,EAAE,gBAAgB,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAA;IAC5D,OAAO,CACH,iBACQ,IAAI,EACR,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,SAAS,CAAC,mBACvC,CAAC,aAAa,EAAE,WAAW,EAAE,gBAAgB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,+BAC5D,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/PageContainer/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AASlC,6EAA6E;AAC7E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,KAAK,EAAsB,EAAE,EAAE;IAC9F,MAAM,EAAE,eAAe,EAAE,gBAAgB,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAA;IAC5D,OAAO,CACH,iBACQ,IAAI,EACR,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,SAAS,CAAC,mBACvC,CAAC,aAAa,EAAE,WAAW,EAAE,gBAAgB,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,+BAC5D,OAAO,oBACnB,eAAe,eACpB,MAAM,GAClB,CACL,CAAA;AACL,CAAC,CAAA"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
/** `narrow` shows the bar below 48rem only (the page header carries the command at wider widths); `always` at every width. */
|
|
3
|
+
export type PinnedActionBarVisibility = "narrow" | "always";
|
|
4
|
+
export type PinnedActionBarProps = {
|
|
5
|
+
/** The one page command: a single `Button` (normally `variant="primary"`, `width="fill"`). */
|
|
6
|
+
readonly children: ReactNode;
|
|
7
|
+
/** Accessible name of the bar (`role="group"`), e.g. the command's purpose. */
|
|
8
|
+
readonly label: string;
|
|
9
|
+
/** Default `narrow`. */
|
|
10
|
+
readonly visibility?: PinnedActionBarVisibility;
|
|
11
|
+
};
|
|
12
|
+
/**
|
|
13
|
+
* The page's primary command pinned to the bottom edge on a narrow screen, in thumb reach (UX-9 case-1):
|
|
14
|
+
* sticky at the bottom of its scroll container, on `--surface` behind a 1px `--separator` top hairline
|
|
15
|
+
* (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; it is not navigation (that is `BottomNav`). Hidden at 48rem and wider unless
|
|
17
|
+
* `visibility="always"`, so the same command is shown once per viewport (LAYOUT-4 case-2).
|
|
18
|
+
*/
|
|
19
|
+
export declare const PinnedActionBar: ({ children, label, visibility }: PinnedActionBarProps) => import("react").JSX.Element;
|
|
20
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +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,MAAM,MAAM,oBAAoB,GAAG;IAC/B,8FAA8F;IAC9F,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,+EAA+E;IAC/E,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,wBAAwB;IACxB,QAAQ,CAAC,UAAU,CAAC,EAAE,yBAAyB,CAAA;CAClD,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,GAAI,iCAA4C,oBAAoB,gCAY/F,CAAA"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
* The page's primary command pinned to the bottom edge on a narrow screen, in thumb reach (UX-9 case-1):
|
|
4
|
+
* sticky at the bottom of its scroll container, on `--surface` behind a 1px `--separator` top hairline
|
|
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; it is not navigation (that is `BottomNav`). Hidden at 48rem and wider unless
|
|
7
|
+
* `visibility="always"`, so the same command is shown once per viewport (LAYOUT-4 case-2).
|
|
8
|
+
*/
|
|
9
|
+
export const PinnedActionBar = ({ children, label, visibility = "narrow" }) => (_jsx("div", { "aria-label": label, className: "starci-core-pinned-action-bar", "data-component": "PinnedActionBar", "data-contract": "BOUNDARY-1", "data-grammar-pinned-visibility": visibility, "data-tier": "atom", role: "group", children: children }));
|
|
10
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/PinnedActionBar/index.tsx"],"names":[],"mappings":";AAcA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,GAAG,QAAQ,EAAwB,EAAE,EAAE,CAAC,CACjG,4BACgB,KAAK,EACjB,SAAS,EAAC,+BAA+B,oBAC1B,iBAAiB,mBAClB,YAAY,oCACM,UAAU,eAChC,MAAM,EAChB,IAAI,EAAC,OAAO,YAEX,QAAQ,GACP,CACT,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/RankArtwork/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAa,MAAM,OAAO,CAAA;AAGhE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAA;AAElE,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC/E,QAAQ,CAAC,IAAI,EAAE,eAAe,CAAA;IAC9B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AA0CD;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,sCAAsC,gBAAgB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/RankArtwork/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAa,MAAM,OAAO,CAAA;AAGhE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAA;AAElE,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,GAAG;IAC/E,QAAQ,CAAC,IAAI,EAAE,eAAe,CAAA;IAC9B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AA0CD;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,sCAAsC,gBAAgB,gCAkBjF,CAAA"}
|
|
@@ -11,5 +11,5 @@ const artworkByKind = {
|
|
|
11
11
|
* the ranking meaning; the Grammar owns the official Fluent Emoji Flat art. Named only when given a
|
|
12
12
|
* label, silent otherwise (ICON-6).
|
|
13
13
|
*/
|
|
14
|
-
export const RankArtwork = ({ className, kind, label, ...props }) => (_jsx("svg", { ...props, "aria-hidden": label === undefined ? "true" : undefined, "aria-label": label, className: cn("starci-core-rank-artwork", className), "data-contract": "ICON-6", "data-grammar-rank-artwork": kind, fill: "none", focusable: "false", role: label === undefined ? undefined : "img", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", children: artworkByKind[kind] }));
|
|
14
|
+
export const RankArtwork = ({ className, kind, label, ...props }) => (_jsx("svg", { ...props, "aria-hidden": label === undefined ? "true" : undefined, "aria-label": label, className: cn("starci-core-rank-artwork", className), "data-contract": "ICON-6", "data-grammar-rank-artwork": kind, "data-component": "RankArtwork", "data-tier": "atom", fill: "none", focusable: "false", role: label === undefined ? undefined : "img", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", children: artworkByKind[kind] }));
|
|
15
15
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/RankArtwork/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AASlC,MAAM,aAAa,GAAuC;IACtD,KAAK,EAAE,CACH,8BACI,eAAM,CAAC,EAAC,8MAA8M,EAAC,IAAI,EAAC,SAAS,GAAG,EACxO,eAAM,CAAC,EAAC,kNAAkN,EAAC,IAAI,EAAC,SAAS,GAAG,EAC5O,eAAM,CAAC,EAAC,iNAAiN,EAAC,IAAI,EAAC,SAAS,GAAG,EAC3O,eAAM,CAAC,EAAC,yNAAyN,EAAC,IAAI,EAAC,SAAS,GAAG,EACnP,eAAM,CAAC,EAAC,+kBAA+kB,EAAC,IAAI,EAAC,SAAS,GAAG,IAC1mB,CACN;IACD,MAAM,EAAE,CACJ,8BACI,eAAM,CAAC,EAAC,sNAAsN,EAAC,IAAI,EAAC,SAAS,GAAG,EAChP,eAAM,CAAC,EAAC,kNAAkN,EAAC,IAAI,EAAC,SAAS,GAAG,EAC5O,eAAM,CAAC,EAAC,8MAA8M,EAAC,IAAI,EAAC,SAAS,GAAG,EACxO,eAAM,CAAC,EAAC,opBAAopB,EAAC,IAAI,EAAC,SAAS,GAAG,EAC9qB,eAAM,CAAC,EAAC,qoBAAqoB,EAAC,IAAI,EAAC,SAAS,GAAG,IAChqB,CACN;IACD,KAAK,EAAE,CACH,8BACI,eAAM,CAAC,EAAC,oOAAoO,EAAC,IAAI,EAAC,SAAS,GAAG,EAC9P,eAAM,CAAC,EAAC,0OAA0O,EAAC,IAAI,EAAC,SAAS,GAAG,EACpQ,eAAM,CAAC,EAAC,qLAAqL,EAAC,IAAI,EAAC,SAAS,GAAG,EAC/M,eAAM,CAAC,EAAC,+kBAA+kB,EAAC,IAAI,EAAC,SAAS,GAAG,EACzmB,eAAM,CAAC,EAAC,0rBAA0rB,EAAC,IAAI,EAAC,SAAS,GAAG,IACrtB,CACN;IACD,GAAG,EAAE,CACD,8BACI,eAAM,CAAC,EAAC,6kBAA6kB,EAAC,IAAI,EAAC,SAAS,GAAG,EACvmB,eAAM,CAAC,EAAC,4kBAA4kB,EAAC,IAAI,EAAC,SAAS,GAAG,EACtmB,eAAM,CAAC,EAAC,qJAAqJ,EAAC,IAAI,EAAC,SAAS,GAAG,EAC/K,eAAM,CAAC,EAAC,oMAAoM,EAAC,IAAI,EAAC,SAAS,GAAG,EAC9N,eAAM,CAAC,EAAC,qOAAqO,EAAC,IAAI,EAAC,SAAS,GAAG,EAC/P,eAAM,CAAC,EAAC,wMAAwM,EAAC,IAAI,EAAC,SAAS,GAAG,IACnO,CACN;CACJ,CAAA;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CACnF,iBACQ,KAAK,iBACI,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,gBACzC,KAAK,EACjB,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,mBACtC,QAAQ,+BACK,IAAI,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/RankArtwork/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AASlC,MAAM,aAAa,GAAuC;IACtD,KAAK,EAAE,CACH,8BACI,eAAM,CAAC,EAAC,8MAA8M,EAAC,IAAI,EAAC,SAAS,GAAG,EACxO,eAAM,CAAC,EAAC,kNAAkN,EAAC,IAAI,EAAC,SAAS,GAAG,EAC5O,eAAM,CAAC,EAAC,iNAAiN,EAAC,IAAI,EAAC,SAAS,GAAG,EAC3O,eAAM,CAAC,EAAC,yNAAyN,EAAC,IAAI,EAAC,SAAS,GAAG,EACnP,eAAM,CAAC,EAAC,+kBAA+kB,EAAC,IAAI,EAAC,SAAS,GAAG,IAC1mB,CACN;IACD,MAAM,EAAE,CACJ,8BACI,eAAM,CAAC,EAAC,sNAAsN,EAAC,IAAI,EAAC,SAAS,GAAG,EAChP,eAAM,CAAC,EAAC,kNAAkN,EAAC,IAAI,EAAC,SAAS,GAAG,EAC5O,eAAM,CAAC,EAAC,8MAA8M,EAAC,IAAI,EAAC,SAAS,GAAG,EACxO,eAAM,CAAC,EAAC,opBAAopB,EAAC,IAAI,EAAC,SAAS,GAAG,EAC9qB,eAAM,CAAC,EAAC,qoBAAqoB,EAAC,IAAI,EAAC,SAAS,GAAG,IAChqB,CACN;IACD,KAAK,EAAE,CACH,8BACI,eAAM,CAAC,EAAC,oOAAoO,EAAC,IAAI,EAAC,SAAS,GAAG,EAC9P,eAAM,CAAC,EAAC,0OAA0O,EAAC,IAAI,EAAC,SAAS,GAAG,EACpQ,eAAM,CAAC,EAAC,qLAAqL,EAAC,IAAI,EAAC,SAAS,GAAG,EAC/M,eAAM,CAAC,EAAC,+kBAA+kB,EAAC,IAAI,EAAC,SAAS,GAAG,EACzmB,eAAM,CAAC,EAAC,0rBAA0rB,EAAC,IAAI,EAAC,SAAS,GAAG,IACrtB,CACN;IACD,GAAG,EAAE,CACD,8BACI,eAAM,CAAC,EAAC,6kBAA6kB,EAAC,IAAI,EAAC,SAAS,GAAG,EACvmB,eAAM,CAAC,EAAC,4kBAA4kB,EAAC,IAAI,EAAC,SAAS,GAAG,EACtmB,eAAM,CAAC,EAAC,qJAAqJ,EAAC,IAAI,EAAC,SAAS,GAAG,EAC/K,eAAM,CAAC,EAAC,oMAAoM,EAAC,IAAI,EAAC,SAAS,GAAG,EAC9N,eAAM,CAAC,EAAC,qOAAqO,EAAC,IAAI,EAAC,SAAS,GAAG,EAC/P,eAAM,CAAC,EAAC,wMAAwM,EAAC,IAAI,EAAC,SAAS,GAAG,IACnO,CACN;CACJ,CAAA;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CACnF,iBACQ,KAAK,iBACI,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,gBACzC,KAAK,EACjB,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,mBACtC,QAAQ,+BACK,IAAI,oBAChB,aAAa,eAClB,MAAM,EAChB,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,OAAO,EACjB,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,EAC7C,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,YAEjC,aAAa,CAAC,IAAI,CAAC,GAClB,CACT,CAAA"}
|
|
@@ -4,6 +4,16 @@ export type SectionHeaderProps = {
|
|
|
4
4
|
readonly description?: ReactNode;
|
|
5
5
|
readonly eyebrow?: ReactNode;
|
|
6
6
|
readonly action?: ReactNode;
|
|
7
|
+
/**
|
|
8
|
+
* How many items the section holds, drawn after the title as a muted "(n)" in the title's own line
|
|
9
|
+
* (e.g. "Installations (2)"). It is part of the heading's accessible name.
|
|
10
|
+
*/
|
|
11
|
+
readonly count?: number;
|
|
12
|
+
/**
|
|
13
|
+
* Trailing meta of the section - where and when its facts come from (a source time, "Inventoried at
|
|
14
|
+
* 10:00"). FONT-1 muted, at the end of the header row, before any `action`.
|
|
15
|
+
*/
|
|
16
|
+
readonly meta?: ReactNode;
|
|
7
17
|
/** Outline rank of the title. Default `2`; pick the rank that follows the heading above it. */
|
|
8
18
|
readonly level?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
9
19
|
readonly className?: string;
|
|
@@ -18,5 +28,5 @@ export type SectionHeaderProps = {
|
|
|
18
28
|
* banner landmark, and the banner belongs to the application bar (TopBar / NavigationFeatureNav /
|
|
19
29
|
* WorkspaceShell header). A section heading group must not add a second one.
|
|
20
30
|
*/
|
|
21
|
-
export declare const SectionHeader: ({ title, description, eyebrow, action, level, className, id, composition, }: SectionHeaderProps) => import("react").JSX.Element;
|
|
31
|
+
export declare const SectionHeader: ({ title, description, eyebrow, action, count, meta, level, className, id, composition, }: SectionHeaderProps) => import("react").JSX.Element;
|
|
22
32
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/SectionHeader/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,kBAAkB,GAAG;IAC7B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAA;IACzB,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAA;IAChC,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,CAAA;IAC3B,+FAA+F;IAC/F,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACtC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,qFAAqF;IACrF,QAAQ,CAAC,WAAW,CAAC,EAAE,gBAAgB,GAAG,eAAe,CAAA;CAC5D,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,GAAI,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/SectionHeader/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,kBAAkB,GAAG;IAC7B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAA;IACzB,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAA;IAChC,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,CAAA;IAC3B;;;OAGG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,CAAA;IACzB,+FAA+F;IAC/F,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACtC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,qFAAqF;IACrF,QAAQ,CAAC,WAAW,CAAC,EAAE,gBAAgB,GAAG,eAAe,CAAA;CAC5D,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,GAAI,0FAW3B,kBAAkB,gCA0BpB,CAAA"}
|
|
@@ -8,5 +8,5 @@ import { createElement } from "react";
|
|
|
8
8
|
* banner landmark, and the banner belongs to the application bar (TopBar / NavigationFeatureNav /
|
|
9
9
|
* WorkspaceShell header). A section heading group must not add a second one.
|
|
10
10
|
*/
|
|
11
|
-
export const SectionHeader = ({ title, description, eyebrow, action, level = 2, className, id, composition = "section-header", }) => (_jsxs("div", { className: cn("starci-core-section-header", className), "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), description === undefined ? null : _jsx("div", { className: "starci-core-section-description", children: description })] }), action === undefined ? null : _jsx("div", { className: "starci-core-section-action", children: action })] }));
|
|
11
|
+
export const SectionHeader = ({ title, description, eyebrow, action, count, meta, level = 2, className, id, composition = "section-header", }) => (_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 })] }));
|
|
12
12
|
//# 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;
|
|
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;AAyBrD;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC1B,KAAK,EACL,WAAW,EACX,OAAO,EACP,MAAM,EACN,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,CAAC,EACT,SAAS,EACT,EAAE,EACF,WAAW,GAAG,gBAAgB,GACb,EAAE,EAAE,CAAC,CACtB,eACI,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,SAAS,CAAC,oBACvC,eAAe,eACpB,MAAM,mBACF,OAAO,iCACO,MAAM,8BACR,WAAW,aAErC,eAAK,SAAS,EAAC,iCAAiC,mBAAe,OAAO,aACjE,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,6BAA6B,YAAE,OAAO,GAAO,EAC3F,aAAa,CACV,IAAI,KAAK,EAAE,EACX,EAAE,SAAS,EAAE,2BAA2B,EAAE,EAAE,EAAE,eAAe,EAAE,iBAAiB,EAAE,EAClF,KAAK,EACL,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACzB,eAAkB,SAAS,EAAC,2BAA2B,gCAA6B,KAAK,mBAAgB,QAAQ,YAC5G,KAAK,KAAK,GAAG,IADR,OAAO,CAEV,CACV,CACJ,EACA,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,iCAAiC,YAAE,WAAW,GAAO,IACtG,EACL,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,0BAA0B,mBAAe,eAAe,YAAE,IAAI,GAAO,EAChH,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAK,SAAS,EAAC,4BAA4B,YAAE,MAAM,GAAO,IACvF,CACT,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/SurfaceCopyGroup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,qBAAqB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAClE,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;CAC/C,CAAA;AAED,+EAA+E;AAC/E,eAAO,MAAM,gBAAgB,GAAI,kCAA8C,qBAAqB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/primitive/SurfaceCopyGroup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAErD,MAAM,MAAM,qBAAqB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAClE,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;CAC/C,CAAA;AAED,+EAA+E;AAC/E,eAAO,MAAM,gBAAgB,GAAI,kCAA8C,qBAAqB,gCASnG,CAAA"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from "@heroui/react";
|
|
3
3
|
/** Groups one title with its explanation before a separate action boundary. */
|
|
4
|
-
export const SurfaceCopyGroup = ({ className, density = "compact", ...props }) => (_jsx("div", { ...props, className: cn("starci-core-surface-copy-group", className), "data-contract": density === "comfortable" ? "GAP-3" : "GAP-2", "data-grammar-copy-density": density }));
|
|
4
|
+
export const SurfaceCopyGroup = ({ className, density = "compact", ...props }) => (_jsx("div", { ...props, className: cn("starci-core-surface-copy-group", className), "data-contract": density === "comfortable" ? "GAP-3" : "GAP-2", "data-grammar-copy-density": density, "data-component": "SurfaceCopyGroup", "data-tier": "atom" }));
|
|
5
5
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/SurfaceCopyGroup/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAOlC,+EAA+E;AAC/E,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,KAAK,EAAyB,EAAE,EAAE,CAAC,CACrG,iBACQ,KAAK,EACT,SAAS,EAAE,EAAE,CAAC,gCAAgC,EAAE,SAAS,CAAC,mBAC3C,OAAO,KAAK,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,+BACjC,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/primitive/SurfaceCopyGroup/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAOlC,+EAA+E;AAC/E,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,KAAK,EAAyB,EAAE,EAAE,CAAC,CACrG,iBACQ,KAAK,EACT,SAAS,EAAE,EAAE,CAAC,gCAAgC,EAAE,SAAS,CAAC,mBAC3C,OAAO,KAAK,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,+BACjC,OAAO,oBACnB,kBAAkB,eACvB,MAAM,GAClB,CACL,CAAA"}
|
package/dist/heritage/styles.css
CHANGED
|
@@ -88,6 +88,13 @@
|
|
|
88
88
|
box-shadow: none;
|
|
89
89
|
}
|
|
90
90
|
|
|
91
|
+
/* The ink band (SurfaceCard treatment="ink", 0.6.0) keeps its ink ground over the family's paper surface. */
|
|
92
|
+
.grammar-common-root[data-grammar-family="heritage"] [data-grammar-surface-card][data-slot="card"] [data-grammar-frame="bounded"][data-slot="card-content"][data-grammar-surface-treatment="ink"] {
|
|
93
|
+
border-color: var(--grammar-ink-band);
|
|
94
|
+
background: var(--grammar-ink-band);
|
|
95
|
+
color: var(--grammar-ink-band-foreground);
|
|
96
|
+
}
|
|
97
|
+
|
|
91
98
|
.grammar-common-root[data-grammar-family="heritage"] [data-grammar-surface-label] {
|
|
92
99
|
color: var(--heritage-green-900);
|
|
93
100
|
font-family: var(--heritage-display);
|
|
@@ -220,6 +220,16 @@
|
|
|
220
220
|
border-block-start: var(--offset-pop-outline-width) solid var(--offset-pop-ink);
|
|
221
221
|
}
|
|
222
222
|
|
|
223
|
+
/*
|
|
224
|
+
* A stat strip divides its cells on the inline axis, in the same ink line. Common draws that edge only at
|
|
225
|
+
* 48rem and wider (its border style); the family re-inks its width and colour, so no width query is added.
|
|
226
|
+
*/
|
|
227
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="DescriptionList"][data-grammar-description-layout="stat-strip"][data-grammar-description-divided="true"] [data-grammar-description-pair] + [data-grammar-description-pair] {
|
|
228
|
+
border-block-start: 0;
|
|
229
|
+
border-inline-start-width: var(--offset-pop-outline-width);
|
|
230
|
+
border-inline-start-color: var(--offset-pop-ink);
|
|
231
|
+
}
|
|
232
|
+
|
|
223
233
|
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="DescriptionList"] dt {
|
|
224
234
|
color: var(--foreground);
|
|
225
235
|
font-weight: 800;
|
|
@@ -98,7 +98,9 @@
|
|
|
98
98
|
background: var(--accent);
|
|
99
99
|
}
|
|
100
100
|
|
|
101
|
-
|
|
101
|
+
/* A negative Alert's action is Common's danger Button (HeroUI's danger Alert carries a danger "Retry"). */
|
|
102
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-grammar-overlay-action="confirm"][data-grammar-tone="negative"] > [data-component="Button"],
|
|
103
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="Alert"][data-grammar-tone="negative"] [data-grammar-alert-actions] > [data-component="Button"] {
|
|
102
104
|
color: var(--danger-foreground);
|
|
103
105
|
background: var(--danger);
|
|
104
106
|
}
|
|
@@ -217,6 +219,24 @@
|
|
|
217
219
|
background: var(--accent);
|
|
218
220
|
}
|
|
219
221
|
|
|
222
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="Meter"][data-grammar-meter-segments] [data-slot="meter-track"] {
|
|
223
|
+
border: 0;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
/* The segmented track is Common's 0.25rem line: too thin for the ink outline, so the empty
|
|
227
|
+
segments take the ink at 18% (the ProgressCircle track's mix) instead. */
|
|
228
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="Meter"] [data-grammar-meter-segment] {
|
|
229
|
+
background: color-mix(in srgb, var(--offset-pop-ink) 18%, transparent);
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="Meter"] [data-grammar-meter-segment="filled"] {
|
|
233
|
+
background: var(--offset-pop-tone-color);
|
|
234
|
+
}
|
|
235
|
+
|
|
236
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="Meter"][data-grammar-tone="neutral"] [data-grammar-meter-segment="filled"] {
|
|
237
|
+
background: var(--accent);
|
|
238
|
+
}
|
|
239
|
+
|
|
220
240
|
.grammar-common-root[data-grammar-family="offset-pop"] [data-component="Meter"] [data-slot="label"] {
|
|
221
241
|
color: var(--foreground);
|
|
222
242
|
font-weight: 800;
|
|
@@ -214,6 +214,32 @@
|
|
|
214
214
|
background: var(--surface-secondary);
|
|
215
215
|
}
|
|
216
216
|
|
|
217
|
+
/*
|
|
218
|
+
* The ink band (SurfaceCard treatment="ink", 0.6.0) is painted on the family ink with the canvas on
|
|
219
|
+
* it - the pink stays the decision accent (ACCENT-1). The ink flips to cream in the dark theme, so the
|
|
220
|
+
* band's quiet inks are mixes of the canvas into the ink (both directions stay AA: muted 72% is
|
|
221
|
+
* about 8:1), not the lightness lift Common uses for a dark accent.
|
|
222
|
+
*/
|
|
223
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-grammar-surface-card][data-slot="card"] [data-grammar-frame="bounded"][data-slot="card-content"][data-grammar-surface-treatment="ink"] {
|
|
224
|
+
--grammar-ink-band: var(--offset-pop-ink);
|
|
225
|
+
--grammar-ink-band-foreground: var(--offset-pop-canvas);
|
|
226
|
+
--grammar-ink-band-muted: color-mix(in oklab, var(--offset-pop-canvas) 72%, var(--offset-pop-ink));
|
|
227
|
+
--grammar-ink-band-separator: color-mix(in oklab, var(--offset-pop-canvas) 18%, var(--offset-pop-ink));
|
|
228
|
+
--grammar-ink-band-plate: color-mix(in oklab, var(--offset-pop-canvas) 10%, var(--offset-pop-ink));
|
|
229
|
+
--grammar-ink-band-orbit: color-mix(in oklab, var(--offset-pop-canvas) 20%, var(--offset-pop-ink));
|
|
230
|
+
--success-soft-foreground: color-mix(in oklab, var(--offset-pop-mint) 45%, var(--offset-pop-canvas));
|
|
231
|
+
--warning-soft-foreground: color-mix(in oklab, var(--offset-pop-yellow) 45%, var(--offset-pop-canvas));
|
|
232
|
+
--danger-soft-foreground: color-mix(in oklab, var(--offset-pop-critical) 45%, var(--offset-pop-canvas));
|
|
233
|
+
border-color: var(--offset-pop-ink);
|
|
234
|
+
color: var(--grammar-ink-band-foreground);
|
|
235
|
+
background: var(--grammar-ink-band);
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
/* On the ink band the eyebrow is the band's muted ink, not the text-safe pink (which is tuned for the canvas). */
|
|
239
|
+
.grammar-common-root[data-grammar-family="offset-pop"] [data-grammar-surface-treatment="ink"] [data-grammar-section-header] .starci-core-section-eyebrow {
|
|
240
|
+
color: var(--grammar-ink-band-muted);
|
|
241
|
+
}
|
|
242
|
+
|
|
217
243
|
.grammar-common-root[data-grammar-family="offset-pop"] [data-grammar-surface-label] {
|
|
218
244
|
color: var(--foreground);
|
|
219
245
|
font-weight: 800;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@starci/grammar",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"description": "Reusable StarCi React components, compositions, and packaged visual DNA.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"starci",
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
"scripts": {
|
|
61
61
|
"build": "node scripts/clean.mjs && tsc -p tsconfig.build.json && node scripts/copy-css.mjs && node scripts/build-stamp.mjs",
|
|
62
62
|
"typecheck": "tsc -p tsconfig.build.json --noEmit && tsc -p tsconfig.stories.json",
|
|
63
|
-
"test": "npm run build && node --test src/common/index.test.mjs src/core/index.test.mjs src/offset-pop/index.test.mjs src/package-boundary.test.mjs && vitest run --config vitest.config.ts src/shipped-geometry.spec.ts src/core/shipped-claims.spec.tsx src/common/conformance.spec.ts src/common/styles.spec.ts src/core/family.spec.tsx src/core/styles.spec.ts src/core/surface-card-family.spec.tsx src/core/scrollable-surfaces.spec.tsx src/core/primitive/Badge/index.spec.tsx src/core/primitive/Button/index.spec.tsx src/core/primitive/Divider/index.spec.tsx src/core/primitive/Heading/index.spec.tsx src/core/primitive/Icon/index.spec.tsx src/core/primitive/IconButton/index.spec.tsx src/core/primitive/IconTile/index.spec.tsx src/core/primitive/Input/index.spec.tsx src/core/primitive/PressableField/index.spec.tsx src/core/primitive/Progress/index.spec.tsx src/core/primitive/Text/index.spec.tsx src/core/primitive/TextAction/index.spec.tsx src/core/primitive/Label/index.spec.tsx src/core/primitive/RankArtwork/index.spec.tsx src/core/composite/EmptyNotice/index.spec.tsx src/core/branch/Tabs/index.spec.tsx src/core/branch/Subnav/index.spec.tsx src/core/branch/Subnav/styles.spec.ts src/core/branch/Tooltip/index.spec.tsx src/core/composition/NavigationFeatureNav/index.spec.tsx src/core/composition/NavigationFeatureNav/styles.spec.ts src/core/composition/Sidebar/index.spec.tsx src/core/composition/Sidebar/styles.spec.ts src/core/composition/collapse.spec.tsx src/core/composition/WorkspaceShell/index.spec.tsx src/core/composition/ChatWorkspace/index.spec.tsx src/heritage/index.spec.tsx src/heritage/styles.spec.ts src/offset-pop/index.spec.tsx src/offset-pop/render.spec.tsx src/offset-pop/styles.spec.ts src/offset-pop/family.spec.tsx src/offset-pop/shipped-claims.spec.tsx src/offset-pop/surface-card-family.spec.tsx src/offset-pop/scrollable-surfaces.spec.tsx src/offset-pop/conformance.spec.ts src/core/branch/Accordion/index.spec.tsx src/core/branch/AlertDialog/index.spec.tsx src/core/branch/Calendar/index.spec.tsx src/core/branch/ComboBox/index.spec.tsx src/core/branch/DataTable/index.spec.tsx src/core/branch/DatePicker/index.spec.tsx src/core/branch/DateRangePicker/index.spec.tsx src/core/branch/Dialog/index.spec.tsx src/core/branch/Disclosure/index.spec.tsx src/core/branch/Drawer/index.spec.tsx src/core/branch/DropdownMenu/index.spec.tsx src/core/branch/ListBox/index.spec.tsx src/core/branch/Popover/index.spec.tsx src/core/branch/Select/index.spec.tsx src/core/branch/Toast/index.spec.tsx src/core/composite/Alert/index.spec.tsx src/core/composite/AvatarGroup/index.spec.tsx src/core/composite/Breadcrumbs/index.spec.tsx src/core/composite/ButtonGroup/index.spec.tsx src/core/composite/CheckboxGroup/index.spec.tsx src/core/composite/DescriptionList/index.spec.tsx src/core/composite/Fieldset/index.spec.tsx src/core/composite/Form/index.spec.tsx src/core/composite/Pagination/index.spec.tsx src/core/composite/RadioGroup/index.spec.tsx src/core/composite/SegmentedControl/index.spec.tsx src/core/composite/Stepper/index.spec.tsx src/core/composite/TagGroup/index.spec.tsx src/core/composite/Timeline/index.spec.tsx src/core/composition/BottomNav/index.spec.tsx src/core/composition/Footer/index.spec.tsx src/core/composition/TopBar/index.spec.tsx src/core/primitive/Avatar/index.spec.tsx src/core/primitive/Checkbox/index.spec.tsx src/core/primitive/CloseButton/index.spec.tsx src/core/primitive/DateField/index.spec.tsx src/core/primitive/Field/index.spec.tsx src/core/primitive/FileDropzone/index.spec.tsx src/core/primitive/Image/index.spec.tsx src/core/primitive/Kbd/index.spec.tsx src/core/primitive/Link/index.spec.tsx src/core/primitive/Meter/index.spec.tsx src/core/primitive/NumberField/index.spec.tsx src/core/primitive/ProgressCircle/index.spec.tsx src/core/primitive/Rating/index.spec.tsx src/core/primitive/SearchField/index.spec.tsx src/core/primitive/Skeleton/index.spec.tsx src/core/primitive/Slider/index.spec.tsx src/core/primitive/Spinner/index.spec.tsx src/core/primitive/Switch/index.spec.tsx src/core/primitive/Textarea/index.spec.tsx src/core/primitive/TimeField/index.spec.tsx src/offset-pop/components-forms.spec.ts src/offset-pop/components-navigation.spec.ts src/offset-pop/components-overlays.spec.ts src/core/branch/SurfaceCard/index.spec.tsx src/core/branch/SurfaceListCard/index.spec.tsx src/core/branch/SurfaceAccordionCard/index.spec.tsx src/core/branch/Rail/index.spec.tsx src/core/branch/MarkdownArticle/index.spec.tsx src/core/composite/VerticalScrollRegion/index.spec.tsx src/core/primitive/SectionHeader/index.spec.tsx src/core/OtpInput.spec.tsx src/stories/catalog.spec.ts",
|
|
63
|
+
"test": "npm run build && node --test src/common/index.test.mjs src/core/index.test.mjs src/offset-pop/index.test.mjs src/package-boundary.test.mjs && vitest run --config vitest.config.ts src/shipped-geometry.spec.ts src/core/shipped-claims.spec.tsx src/common/conformance.spec.ts src/common/styles.spec.ts src/core/family.spec.tsx src/core/styles.spec.ts src/core/surface-card-family.spec.tsx src/core/scrollable-surfaces.spec.tsx src/core/primitive/Badge/index.spec.tsx src/core/primitive/Button/index.spec.tsx src/core/primitive/Divider/index.spec.tsx src/core/primitive/Heading/index.spec.tsx src/core/primitive/Icon/index.spec.tsx src/core/primitive/IconButton/index.spec.tsx src/core/primitive/IconTile/index.spec.tsx src/core/primitive/Input/index.spec.tsx src/core/primitive/PressableField/index.spec.tsx src/core/primitive/Progress/index.spec.tsx src/core/primitive/Text/index.spec.tsx src/core/primitive/TextAction/index.spec.tsx src/core/primitive/Label/index.spec.tsx src/core/primitive/RankArtwork/index.spec.tsx src/core/composite/EmptyNotice/index.spec.tsx src/core/branch/Tabs/index.spec.tsx src/core/branch/Subnav/index.spec.tsx src/core/branch/Subnav/styles.spec.ts src/core/branch/Tooltip/index.spec.tsx src/core/composition/NavigationFeatureNav/index.spec.tsx src/core/composition/NavigationFeatureNav/styles.spec.ts src/core/composition/Sidebar/index.spec.tsx src/core/composition/Sidebar/styles.spec.ts src/core/composition/collapse.spec.tsx src/core/composition/WorkspaceShell/index.spec.tsx src/core/composition/ChatWorkspace/index.spec.tsx src/heritage/index.spec.tsx src/heritage/styles.spec.ts src/offset-pop/index.spec.tsx src/offset-pop/render.spec.tsx src/offset-pop/styles.spec.ts src/offset-pop/family.spec.tsx src/offset-pop/shipped-claims.spec.tsx src/offset-pop/surface-card-family.spec.tsx src/offset-pop/scrollable-surfaces.spec.tsx src/offset-pop/conformance.spec.ts src/core/branch/Accordion/index.spec.tsx src/core/branch/AlertDialog/index.spec.tsx src/core/branch/Calendar/index.spec.tsx src/core/branch/ComboBox/index.spec.tsx src/core/branch/DataTable/index.spec.tsx src/core/branch/DatePicker/index.spec.tsx src/core/branch/DateRangePicker/index.spec.tsx src/core/branch/Dialog/index.spec.tsx src/core/branch/Disclosure/index.spec.tsx src/core/branch/Drawer/index.spec.tsx src/core/branch/DropdownMenu/index.spec.tsx src/core/branch/ListBox/index.spec.tsx src/core/branch/Popover/index.spec.tsx src/core/branch/Select/index.spec.tsx src/core/branch/Toast/index.spec.tsx src/core/composite/Alert/index.spec.tsx src/core/composite/AvatarGroup/index.spec.tsx src/core/composite/Breadcrumbs/index.spec.tsx src/core/composite/ButtonGroup/index.spec.tsx src/core/composite/CheckboxGroup/index.spec.tsx src/core/composite/DescriptionList/index.spec.tsx src/core/composite/Fieldset/index.spec.tsx src/core/composite/Form/index.spec.tsx src/core/composite/Pagination/index.spec.tsx src/core/composite/RadioGroup/index.spec.tsx src/core/composite/SegmentedControl/index.spec.tsx src/core/composite/Stepper/index.spec.tsx src/core/composite/TagGroup/index.spec.tsx src/core/composite/Timeline/index.spec.tsx src/core/composition/BottomNav/index.spec.tsx src/core/composition/Footer/index.spec.tsx src/core/composition/TopBar/index.spec.tsx src/core/primitive/Avatar/index.spec.tsx src/core/primitive/Checkbox/index.spec.tsx src/core/primitive/CloseButton/index.spec.tsx src/core/primitive/DateField/index.spec.tsx src/core/primitive/Field/index.spec.tsx src/core/primitive/FileDropzone/index.spec.tsx src/core/primitive/Image/index.spec.tsx src/core/primitive/Kbd/index.spec.tsx src/core/primitive/Link/index.spec.tsx src/core/primitive/Meter/index.spec.tsx src/core/primitive/NumberField/index.spec.tsx src/core/primitive/ProgressCircle/index.spec.tsx src/core/primitive/Rating/index.spec.tsx src/core/primitive/SearchField/index.spec.tsx src/core/primitive/Skeleton/index.spec.tsx src/core/primitive/Slider/index.spec.tsx src/core/primitive/Spinner/index.spec.tsx src/core/primitive/Switch/index.spec.tsx src/core/primitive/Textarea/index.spec.tsx src/core/primitive/TimeField/index.spec.tsx src/offset-pop/components-forms.spec.ts src/offset-pop/components-navigation.spec.ts src/offset-pop/components-overlays.spec.ts src/core/branch/SurfaceCard/index.spec.tsx src/core/branch/SurfaceListCard/index.spec.tsx src/core/branch/SurfaceAccordionCard/index.spec.tsx src/core/branch/Rail/index.spec.tsx src/core/branch/MarkdownArticle/index.spec.tsx src/core/composite/VerticalScrollRegion/index.spec.tsx src/core/primitive/SectionHeader/index.spec.tsx src/core/primitive/PinnedActionBar/index.spec.tsx src/core/branch/SurfaceCard/ink.spec.ts src/core/data-component.spec.tsx src/core/OtpInput.spec.tsx src/stories/catalog.spec.ts",
|
|
64
64
|
"test:a11y": "vitest run --config vitest.a11y.config.ts",
|
|
65
65
|
"pack:check": "npm run build && node --test src/package-boundary.test.mjs",
|
|
66
66
|
"prepack": "npm run typecheck && npm test",
|