@kismet-ux/constellation 1.1.0 → 1.3.0

package/dist/ui/Chip/chip.css

@@ -1,3 +1,4 @@
+@charset "UTF-8";
 /**
  * Size config. `icon-size` scales SVGs rendered as direct children to match
  * the chip's visual weight. `padding-with-icon` trims horizontal padding
@@ -22,6 +23,43 @@
 .chip-module_chip--wrap__YvZ3D {
   white-space: normal;
 }
+.chip-module_chip--mono__SMCPR {
+  font-family: var(--font-mono), monospace;
+  font-variant-numeric: tabular-nums;
+}
+.chip-module_chip--uppercase__bLI8t {
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+.chip-module_chip--rounded__epRJb {
+  border-radius: var(--radius-xs);
+}
+.chip-module_chip--dashed__trSp1 {
+  border-style: dashed;
+}
+.chip-module_chip--2xs__GJtZF {
+  font-size: 0.56rem;
+  padding: 0 0.25rem;
+}
+.chip-module_chip--2xs__GJtZF > svg {
+  height: 0.6rem;
+  width: 0.6rem;
+}
+.chip-module_chip--2xs__GJtZF:has(> svg) {
+  padding: 0 0.2rem;
+}
+.chip-module_chip--xs__Smd5u {
+  font-size: 0.66rem;
+  padding: 0.1rem 0.4rem;
+}
+.chip-module_chip--xs__Smd5u > svg {
+  height: 0.7rem;
+  width: 0.7rem;
+}
+.chip-module_chip--xs__Smd5u:has(> svg) {
+  padding: 0.1rem 0.32rem;
+}
 .chip-module_chip--sm___bJkU {
   font-size: 0.72rem;
   padding: 0.15rem 0.5rem;
@@ -44,12 +82,14 @@
 .chip-module_chip--md__N7LAU:has(> svg) {
   padding: 0.25rem 0.55rem;
 }
-.chip-module_chip__u4PJ9.chip-module_chip--inherit__HjU_P {
-  border-color: currentColor;
-  color: currentColor;
-}
-.chip-module_chip__u4PJ9.chip-module_chip--inherit__HjU_P:hover {
-  background-color: var(--themed-hover, var(--action-hover));
+.chip-module_chip__u4PJ9 {
+  /**
+   * Each theme resolves four roles. Every one is written as
+   * `var(--chip-color, <token>)`, so setting a single `--chip-color` on the
+   * element overrides the whole set — that is the escape hatch for a colour
+   * the theme scale does not have (a diet marker, a category hue), without
+   * needing a bespoke component.
+   */
 }
 .chip-module_chip__u4PJ9.chip-module_chip--primary__kBS6M {
   --themed-main: var(--primary-main);
@@ -62,12 +102,10 @@
   --themed-focus-visible: var(--primary-focus-visible);
   --themed-outlined-border: var(--primary-outlined-border);
   --themed-selected: var(--primary-selected);
-  background-color: color-mix(in srgb, var(--primary-hover) 20%, transparent);
-  border-color: var(--primary-outlined-border);
-  color: var(--primary-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--primary__kBS6M:hover {
-  background-color: color-mix(in srgb, var(--primary-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--primary-outlined-border));
+  --chip-fill: var(--chip-color, var(--primary-main));
+  --chip-wash: var(--chip-color, var(--primary-hover));
+  --chip-on-fill: var(--primary-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--secondary__eyfdz {
   --themed-main: var(--secondary-main);
@@ -80,12 +118,10 @@
   --themed-focus-visible: var(--secondary-focus-visible);
   --themed-outlined-border: var(--secondary-outlined-border);
   --themed-selected: var(--secondary-selected);
-  background-color: color-mix(in srgb, var(--secondary-hover) 20%, transparent);
-  border-color: var(--secondary-outlined-border);
-  color: var(--secondary-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--secondary__eyfdz:hover {
-  background-color: color-mix(in srgb, var(--secondary-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--secondary-outlined-border));
+  --chip-fill: var(--chip-color, var(--secondary-main));
+  --chip-wash: var(--chip-color, var(--secondary-hover));
+  --chip-on-fill: var(--secondary-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--destructive__80JrW {
   --themed-main: var(--destructive-main);
@@ -98,12 +134,10 @@
   --themed-focus-visible: var(--destructive-focus-visible);
   --themed-outlined-border: var(--destructive-outlined-border);
   --themed-selected: var(--destructive-selected);
-  background-color: color-mix(in srgb, var(--destructive-hover) 20%, transparent);
-  border-color: var(--destructive-outlined-border);
-  color: var(--destructive-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--destructive__80JrW:hover {
-  background-color: color-mix(in srgb, var(--destructive-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--destructive-outlined-border));
+  --chip-fill: var(--chip-color, var(--destructive-main));
+  --chip-wash: var(--chip-color, var(--destructive-hover));
+  --chip-on-fill: var(--destructive-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--warning__3oxvl {
   --themed-main: var(--warning-main);
@@ -116,12 +150,10 @@
   --themed-focus-visible: var(--warning-focus-visible);
   --themed-outlined-border: var(--warning-outlined-border);
   --themed-selected: var(--warning-selected);
-  background-color: color-mix(in srgb, var(--warning-hover) 20%, transparent);
-  border-color: var(--warning-outlined-border);
-  color: var(--warning-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--warning__3oxvl:hover {
-  background-color: color-mix(in srgb, var(--warning-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--warning-outlined-border));
+  --chip-fill: var(--chip-color, var(--warning-main));
+  --chip-wash: var(--chip-color, var(--warning-hover));
+  --chip-on-fill: var(--warning-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--success__VF1tZ {
   --themed-main: var(--success-main);
@@ -134,12 +166,10 @@
   --themed-focus-visible: var(--success-focus-visible);
   --themed-outlined-border: var(--success-outlined-border);
   --themed-selected: var(--success-selected);
-  background-color: color-mix(in srgb, var(--success-hover) 20%, transparent);
-  border-color: var(--success-outlined-border);
-  color: var(--success-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--success__VF1tZ:hover {
-  background-color: color-mix(in srgb, var(--success-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--success-outlined-border));
+  --chip-fill: var(--chip-color, var(--success-main));
+  --chip-wash: var(--chip-color, var(--success-hover));
+  --chip-on-fill: var(--success-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--info__Jgnsc {
   --themed-main: var(--info-main);
@@ -152,12 +182,10 @@
   --themed-focus-visible: var(--info-focus-visible);
   --themed-outlined-border: var(--info-outlined-border);
   --themed-selected: var(--info-selected);
-  background-color: color-mix(in srgb, var(--info-hover) 20%, transparent);
-  border-color: var(--info-outlined-border);
-  color: var(--info-outlined-border);
-}
-.chip-module_chip__u4PJ9.chip-module_chip--info__Jgnsc:hover {
-  background-color: color-mix(in srgb, var(--info-hover) 40%, transparent);
+  --chip-ink: var(--chip-color, var(--info-outlined-border));
+  --chip-fill: var(--chip-color, var(--info-main));
+  --chip-wash: var(--chip-color, var(--info-hover));
+  --chip-on-fill: var(--info-contrast);
 }
 .chip-module_chip__u4PJ9.chip-module_chip--slate__vmQ7R {
   --themed-main: var(--slate-main);
@@ -170,10 +198,32 @@
   --themed-focus-visible: var(--slate-focus-visible);
   --themed-outlined-border: var(--slate-outlined-border);
   --themed-selected: var(--slate-selected);
-  background-color: color-mix(in srgb, var(--slate-hover) 20%, transparent);
-  border-color: var(--slate-outlined-border);
-  color: var(--slate-outlined-border);
+  --chip-ink: var(--chip-color, var(--slate-outlined-border));
+  --chip-fill: var(--chip-color, var(--slate-main));
+  --chip-wash: var(--chip-color, var(--slate-hover));
+  --chip-on-fill: var(--slate-contrast);
 }
-.chip-module_chip__u4PJ9.chip-module_chip--slate__vmQ7R:hover {
-  background-color: color-mix(in srgb, var(--slate-hover) 40%, transparent);
+.chip-module_chip__u4PJ9.chip-module_chip--inherit__HjU_P {
+  --chip-ink: var(--chip-color, currentColor);
+  --chip-fill: var(--chip-color, currentColor);
+  --chip-wash: var(--chip-color, var(--themed-hover, var(--action-hover)));
+  --chip-on-fill: var(--themed-contrast, var(--background-default));
+}
+.chip-module_chip--soft__zYBtU {
+  background-color: color-mix(in srgb, var(--chip-wash) 20%, transparent);
+  border-color: var(--chip-ink);
+  color: var(--chip-ink);
+}
+.chip-module_chip--soft__zYBtU:hover {
+  background-color: color-mix(in srgb, var(--chip-wash) 40%, transparent);
+}
+.chip-module_chip--outline__TO-HF {
+  background-color: transparent;
+  border-color: color-mix(in srgb, var(--chip-ink) 55%, transparent);
+  color: var(--chip-ink);
+}
+.chip-module_chip--solid__F89cD {
+  background-color: var(--chip-fill);
+  border-color: var(--chip-fill);
+  color: var(--chip-on-fill);
 }

package/dist/ui/Chip/chip.d.ts

@@ -2,7 +2,21 @@ import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 import { chipVariants } from './chip-variants';
 export interface ChipProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {
+    /**
+     * Any colour outside the theme scale — a category hue, a dietary marker.
+     * Overrides the whole set of colour roles the theme would otherwise supply,
+     * so one value is enough for every `variant`.
+     */
+    color?: string;
 }
+/**
+ * A small status marker.
+ *
+ * `variant` chooses how much weight it carries: `soft` (a tinted fill, the
+ * default) reads as ambient, `outline` recedes further, and `solid` is a claim.
+ * `dashed` marks the value as provisional — a guess rather than a reading —
+ * which is a distinction worth drawing without spending a second colour on it.
+ */
 declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLSpanElement>>;
 export { Chip };
 //# sourceMappingURL=chip.d.ts.map

package/dist/ui/Chip/chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,YAAY,CAAC,OAAO,YAAY,CAAC;CAAG;AAErF,QAAA,MAAM,IAAI,mFAaT,CAAC;AAGF,OAAO,EAAE,IAAI,EAAE,CAAC"}
+{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../src/ui/Chip/chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,YAAY,CAAC,OAAO,YAAY,CAAC;IAChF;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;GAOG;AACH,QAAA,MAAM,IAAI,mFAkCT,CAAC;AAGF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/ui/Chip/chip.js

@@ -4,8 +4,16 @@ import * as React from 'react';
 import { withAriaHiddenChildren } from '../../internal/with-aria-hidden-children.js';
 import { chipVariants } from './chip-variants.js';
 
-const Chip = React.forwardRef(({ className, size, theme, wrap, children, ...props }, ref) => {
-    return (jsx("span", { "data-slot": 'chip', ref: ref, className: cn(chipVariants({ size, theme, wrap }), className), ...props, children: withAriaHiddenChildren(children) }));
+/**
+ * A small status marker.
+ *
+ * `variant` chooses how much weight it carries: `soft` (a tinted fill, the
+ * default) reads as ambient, `outline` recedes further, and `solid` is a claim.
+ * `dashed` marks the value as provisional — a guess rather than a reading —
+ * which is a distinction worth drawing without spending a second colour on it.
+ */
+const Chip = React.forwardRef(({ className, size, theme, variant, shape, dashed, mono, uppercase, wrap, color, style, children, ...props }, ref) => {
+    return (jsx("span", { "data-slot": 'chip', ref: ref, className: cn(chipVariants({ size, theme, variant, shape, dashed, mono, uppercase, wrap }), className), style: color ? { ...style, '--chip-color': color } : style, ...props, children: withAriaHiddenChildren(children) }));
 });
 Chip.displayName = 'Chip';
 

package/dist/ui/Chip/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sources":["../../../src/ui/Chip/chip.tsx"],"sourcesContent":["import { type VariantProps } from 'class-variance-authority';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport { withAriaHiddenChildren } from '../../internal/with-aria-hidden-children';\nimport { chipVariants } from './chip-variants';\n\nexport interface ChipProps\n  extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {}\n\nconst Chip = React.forwardRef<HTMLSpanElement, ChipProps>(\n  ({ className, size, theme, wrap, children, ...props }, ref) => {\n    return (\n      <span\n        data-slot={'chip'}\n        ref={ref}\n        className={cn(chipVariants({ size, theme, wrap }), className)}\n        {...props}\n      >\n        {withAriaHiddenChildren(children)}\n      </span>\n    );\n  },\n);\nChip.displayName = 'Chip';\n\nexport { Chip };\n"],"names":["_jsx"],"mappings":";;;;;;AASA,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAC3B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC5D,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAA,WAAA,EACa,MAAM,EACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,EAAA,GACzD,KAAK,EAAA,QAAA,EAER,sBAAsB,CAAC,QAAQ,CAAC,EAAA,CAC5B;AAEX,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM;;"}
+{"version":3,"file":"chip.js","sources":["../../../src/ui/Chip/chip.tsx"],"sourcesContent":["import { type VariantProps } from 'class-variance-authority';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport { withAriaHiddenChildren } from '../../internal/with-aria-hidden-children';\nimport { chipVariants } from './chip-variants';\n\nexport interface ChipProps\n  extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof chipVariants> {\n  /**\n   * Any colour outside the theme scale — a category hue, a dietary marker.\n   * Overrides the whole set of colour roles the theme would otherwise supply,\n   * so one value is enough for every `variant`.\n   */\n  color?: string;\n}\n\n/**\n * A small status marker.\n *\n * `variant` chooses how much weight it carries: `soft` (a tinted fill, the\n * default) reads as ambient, `outline` recedes further, and `solid` is a claim.\n * `dashed` marks the value as provisional — a guess rather than a reading —\n * which is a distinction worth drawing without spending a second colour on it.\n */\nconst Chip = React.forwardRef<HTMLSpanElement, ChipProps>(\n  (\n    {\n      className,\n      size,\n      theme,\n      variant,\n      shape,\n      dashed,\n      mono,\n      uppercase,\n      wrap,\n      color,\n      style,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <span\n        data-slot={'chip'}\n        ref={ref}\n        className={cn(\n          chipVariants({ size, theme, variant, shape, dashed, mono, uppercase, wrap }),\n          className,\n        )}\n        style={color ? ({ ...style, '--chip-color': color } as React.CSSProperties) : style}\n        {...props}\n      >\n        {withAriaHiddenChildren(children)}\n      </span>\n    );\n  },\n);\nChip.displayName = 'Chip';\n\nexport { Chip };\n"],"names":["_jsx"],"mappings":";;;;;;AAgBA;;;;;;;AAOG;AACH,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAC3B,CACE,EACE,SAAS,EACT,IAAI,EACJ,KAAK,EACL,OAAO,EACP,KAAK,EACL,MAAM,EACN,IAAI,EACJ,SAAS,EACT,IAAI,EACJ,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAA,WAAA,EACa,MAAM,EACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAC5E,SAAS,CACV,EACD,KAAK,EAAE,KAAK,GAAI,EAAE,GAAG,KAAK,EAAE,cAAc,EAAE,KAAK,EAA0B,GAAG,KAAK,EAAA,GAC/E,KAAK,EAAA,QAAA,EAER,sBAAsB,CAAC,QAAQ,CAAC,EAAA,CAC5B;AAEX,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM;;"}

package/dist/ui/Chip/chip.module.scss.js

@@ -1,6 +1,6 @@
 import './chip.css';
 
-var s = {"chip":"chip-module_chip__u4PJ9","chip--wrap":"chip-module_chip--wrap__YvZ3D","chip--sm":"chip-module_chip--sm___bJkU","chip--md":"chip-module_chip--md__N7LAU","chip--inherit":"chip-module_chip--inherit__HjU_P","chip--primary":"chip-module_chip--primary__kBS6M","chip--secondary":"chip-module_chip--secondary__eyfdz","chip--destructive":"chip-module_chip--destructive__80JrW","chip--warning":"chip-module_chip--warning__3oxvl","chip--success":"chip-module_chip--success__VF1tZ","chip--info":"chip-module_chip--info__Jgnsc","chip--slate":"chip-module_chip--slate__vmQ7R"};
+var s = {"chip":"chip-module_chip__u4PJ9","chip--wrap":"chip-module_chip--wrap__YvZ3D","chip--mono":"chip-module_chip--mono__SMCPR","chip--uppercase":"chip-module_chip--uppercase__bLI8t","chip--rounded":"chip-module_chip--rounded__epRJb","chip--dashed":"chip-module_chip--dashed__trSp1","chip--2xs":"chip-module_chip--2xs__GJtZF","chip--xs":"chip-module_chip--xs__Smd5u","chip--sm":"chip-module_chip--sm___bJkU","chip--md":"chip-module_chip--md__N7LAU","chip--primary":"chip-module_chip--primary__kBS6M","chip--secondary":"chip-module_chip--secondary__eyfdz","chip--destructive":"chip-module_chip--destructive__80JrW","chip--warning":"chip-module_chip--warning__3oxvl","chip--success":"chip-module_chip--success__VF1tZ","chip--info":"chip-module_chip--info__Jgnsc","chip--slate":"chip-module_chip--slate__vmQ7R","chip--inherit":"chip-module_chip--inherit__HjU_P","chip--soft":"chip-module_chip--soft__zYBtU","chip--outline":"chip-module_chip--outline__TO-HF","chip--solid":"chip-module_chip--solid__F89cD"};
 
 export { s as default };
 //# sourceMappingURL=chip.module.scss.js.map

package/dist/ui/StatusDot/index.d.ts

@@ -0,0 +1,3 @@
+export * from './status-dot';
+export * from './status-dot-variants';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/StatusDot/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/StatusDot/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC"}

package/dist/ui/StatusDot/status-dot-variants.d.ts

@@ -0,0 +1,7 @@
+export declare const statusDotVariants: (props?: ({
+    theme?: "inherit" | "primary" | "secondary" | "destructive" | "warning" | "success" | "info" | "slate" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    glow?: boolean | null | undefined;
+    pulse?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+//# sourceMappingURL=status-dot-variants.d.ts.map

package/dist/ui/StatusDot/status-dot-variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot-variants.d.ts","sourceRoot":"","sources":["../../../src/ui/StatusDot/status-dot-variants.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB;;;;;8EAqB5B,CAAC"}

package/dist/ui/StatusDot/status-dot-variants.js

@@ -0,0 +1,28 @@
+import { cva } from 'class-variance-authority';
+import s from './status-dot.module.scss.js';
+
+const statusDotVariants = cva(s['status-dot'], {
+    variants: {
+        theme: {
+            primary: s['status-dot--primary'],
+            secondary: s['status-dot--secondary'],
+            destructive: s['status-dot--destructive'],
+            warning: s['status-dot--warning'],
+            success: s['status-dot--success'],
+            info: s['status-dot--info'],
+            slate: s['status-dot--slate'],
+            inherit: s['status-dot--inherit'],
+        },
+        size: {
+            sm: s['status-dot--sm'],
+            md: s['status-dot--md'],
+            lg: s['status-dot--lg'],
+        },
+        glow: { true: s['status-dot--glow'] },
+        pulse: { true: s['status-dot--pulse'] },
+    },
+    defaultVariants: { theme: 'slate', size: 'md', glow: false, pulse: false },
+});
+
+export { statusDotVariants };
+//# sourceMappingURL=status-dot-variants.js.map

package/dist/ui/StatusDot/status-dot-variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot-variants.js","sources":["../../../src/ui/StatusDot/status-dot-variants.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport s from './status-dot.module.scss';\n\nexport const statusDotVariants = cva(s['status-dot'], {\n  variants: {\n    theme: {\n      primary: s['status-dot--primary'],\n      secondary: s['status-dot--secondary'],\n      destructive: s['status-dot--destructive'],\n      warning: s['status-dot--warning'],\n      success: s['status-dot--success'],\n      info: s['status-dot--info'],\n      slate: s['status-dot--slate'],\n      inherit: s['status-dot--inherit'],\n    },\n    size: {\n      sm: s['status-dot--sm'],\n      md: s['status-dot--md'],\n      lg: s['status-dot--lg'],\n    },\n    glow: { true: s['status-dot--glow'] },\n    pulse: { true: s['status-dot--pulse'] },\n  },\n  defaultVariants: { theme: 'slate', size: 'md', glow: false, pulse: false },\n});\n"],"names":[],"mappings":";;;AAGO,MAAM,iBAAiB,GAAG,GAAG,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE;AACpD,IAAA,QAAQ,EAAE;AACR,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AACjC,YAAA,SAAS,EAAE,CAAC,CAAC,uBAAuB,CAAC;AACrC,YAAA,WAAW,EAAE,CAAC,CAAC,yBAAyB,CAAC;AACzC,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AACjC,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AACjC,YAAA,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC;AAC3B,YAAA,KAAK,EAAE,CAAC,CAAC,mBAAmB,CAAC;AAC7B,YAAA,OAAO,EAAE,CAAC,CAAC,qBAAqB,CAAC;AAClC,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC;AACvB,YAAA,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC;AACvB,YAAA,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC;AACxB,SAAA;QACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,kBAAkB,CAAC,EAAE;QACrC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC,mBAAmB,CAAC,EAAE;AACxC,KAAA;AACD,IAAA,eAAe,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE;AAC3E,CAAA;;"}

package/dist/ui/StatusDot/status-dot.css

@@ -0,0 +1,61 @@
+.status-dot-module_status-dot__MoSd6 {
+  background-color: var(--dot-color);
+  border-radius: 50%;
+  display: inline-block;
+  flex-shrink: 0;
+  height: var(--dot-size);
+  width: var(--dot-size);
+}
+.status-dot-module_status-dot--primary__DoTcY {
+  --dot-color: var(--primary-main);
+}
+.status-dot-module_status-dot--secondary__pnRMx {
+  --dot-color: var(--secondary-main);
+}
+.status-dot-module_status-dot--destructive__z-jPU {
+  --dot-color: var(--destructive-main);
+}
+.status-dot-module_status-dot--warning__ZFtBS {
+  --dot-color: var(--warning-main);
+}
+.status-dot-module_status-dot--success__cYB5i {
+  --dot-color: var(--success-main);
+}
+.status-dot-module_status-dot--info__sAXNn {
+  --dot-color: var(--info-main);
+}
+.status-dot-module_status-dot--slate__bapda {
+  --dot-color: var(--slate-main);
+}
+.status-dot-module_status-dot--inherit__6o2O9 {
+  --dot-color: currentColor;
+}
+.status-dot-module_status-dot--sm__lPs5V {
+  --dot-size: 5px;
+}
+.status-dot-module_status-dot--md__CELtX {
+  --dot-size: 6px;
+}
+.status-dot-module_status-dot--lg__7M2z0 {
+  --dot-size: 9px;
+}
+.status-dot-module_status-dot--glow__Tbf-5 {
+  box-shadow: 0 0 8px var(--dot-color);
+}
+.status-dot-module_status-dot--pulse__Vw5aP {
+  animation: status-dot-module_status-dot-pulse__zH12Y 1.5s ease-in-out infinite;
+}
+
+@keyframes status-dot-module_status-dot-pulse__zH12Y {
+  0%, 100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.35;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  .status-dot-module_status-dot--pulse__Vw5aP {
+    animation: none;
+  }
+}

package/dist/ui/StatusDot/status-dot.d.ts

@@ -0,0 +1,23 @@
+import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import { statusDotVariants } from './status-dot-variants';
+export interface StatusDotProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>, VariantProps<typeof statusDotVariants> {
+    /** A colour outside the theme scale. */
+    color?: string;
+    /** Accessible name. Omit only when adjacent text already says the state. */
+    label?: string;
+}
+/**
+ * The dot that says what state a connection or process is in.
+ *
+ * Deliberately not a `Chip`: a chip is a bordered object that holds a word,
+ * where this is a single mark that usually sits *beside* one. Pairing it with
+ * text is the caller's job, which keeps the wording — and its translation —
+ * out of here.
+ *
+ * `glow` is for the state worth catching in peripheral vision (a save landing);
+ * `pulse` for one that is still in flight.
+ */
+declare const StatusDot: React.ForwardRefExoticComponent<StatusDotProps & React.RefAttributes<HTMLSpanElement>>;
+export { StatusDot };
+//# sourceMappingURL=status-dot.d.ts.map

package/dist/ui/StatusDot/status-dot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot.d.ts","sourceRoot":"","sources":["../../../src/ui/StatusDot/status-dot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE1D,MAAM,WAAW,cACf,SACE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,OAAO,CAAC,EACpD,YAAY,CAAC,OAAO,iBAAiB,CAAC;IACxC,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;GAUG;AACH,QAAA,MAAM,SAAS,wFAed,CAAC;AAGF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/ui/StatusDot/status-dot.js

@@ -0,0 +1,23 @@
+import { jsx } from 'react/jsx-runtime';
+import cn from 'clsx';
+import * as React from 'react';
+import { statusDotVariants } from './status-dot-variants.js';
+
+/**
+ * The dot that says what state a connection or process is in.
+ *
+ * Deliberately not a `Chip`: a chip is a bordered object that holds a word,
+ * where this is a single mark that usually sits *beside* one. Pairing it with
+ * text is the caller's job, which keeps the wording — and its translation —
+ * out of here.
+ *
+ * `glow` is for the state worth catching in peripheral vision (a save landing);
+ * `pulse` for one that is still in flight.
+ */
+const StatusDot = React.forwardRef(({ className, theme, size, glow, pulse, color, label, style, ...props }, ref) => {
+    return (jsx("span", { "data-slot": 'status-dot', ref: ref, role: label ? 'img' : undefined, "aria-label": label, "aria-hidden": label ? undefined : true, className: cn(statusDotVariants({ theme, size, glow, pulse }), className), style: color ? { ...style, '--dot-color': color } : style, ...props }));
+});
+StatusDot.displayName = 'StatusDot';
+
+export { StatusDot };
+//# sourceMappingURL=status-dot.js.map

package/dist/ui/StatusDot/status-dot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot.js","sources":["../../../src/ui/StatusDot/status-dot.tsx"],"sourcesContent":["import { type VariantProps } from 'class-variance-authority';\nimport cn from 'clsx';\nimport * as React from 'react';\nimport { statusDotVariants } from './status-dot-variants';\n\nexport interface StatusDotProps\n  extends\n    Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>,\n    VariantProps<typeof statusDotVariants> {\n  /** A colour outside the theme scale. */\n  color?: string;\n  /** Accessible name. Omit only when adjacent text already says the state. */\n  label?: string;\n}\n\n/**\n * The dot that says what state a connection or process is in.\n *\n * Deliberately not a `Chip`: a chip is a bordered object that holds a word,\n * where this is a single mark that usually sits *beside* one. Pairing it with\n * text is the caller's job, which keeps the wording — and its translation —\n * out of here.\n *\n * `glow` is for the state worth catching in peripheral vision (a save landing);\n * `pulse` for one that is still in flight.\n */\nconst StatusDot = React.forwardRef<HTMLSpanElement, StatusDotProps>(\n  ({ className, theme, size, glow, pulse, color, label, style, ...props }, ref) => {\n    return (\n      <span\n        data-slot={'status-dot'}\n        ref={ref}\n        role={label ? 'img' : undefined}\n        aria-label={label}\n        aria-hidden={label ? undefined : true}\n        className={cn(statusDotVariants({ theme, size, glow, pulse }), className)}\n        style={color ? ({ ...style, '--dot-color': color } as React.CSSProperties) : style}\n        {...props}\n      />\n    );\n  },\n);\nStatusDot.displayName = 'StatusDot';\n\nexport { StatusDot };\n"],"names":["_jsx"],"mappings":";;;;;AAeA;;;;;;;;;;AAUG;AACH,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAChC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;AAC9E,IAAA,QACEA,GAAA,CAAA,MAAA,EAAA,EAAA,WAAA,EACa,YAAY,EACvB,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,KAAK,GAAG,KAAK,GAAG,SAAS,gBACnB,KAAK,EAAA,aAAA,EACJ,KAAK,GAAG,SAAS,GAAG,IAAI,EACrC,SAAS,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,SAAS,CAAC,EACzE,KAAK,EAAE,KAAK,GAAI,EAAE,GAAG,KAAK,EAAE,aAAa,EAAE,KAAK,EAA0B,GAAG,KAAK,EAAA,GAC9E,KAAK,EAAA,CACT;AAEN,CAAC;AAEH,SAAS,CAAC,WAAW,GAAG,WAAW;;"}

package/dist/ui/StatusDot/status-dot.module.scss.js

@@ -0,0 +1,6 @@
+import './status-dot.css';
+
+var s = {"status-dot":"status-dot-module_status-dot__MoSd6","status-dot--primary":"status-dot-module_status-dot--primary__DoTcY","status-dot--secondary":"status-dot-module_status-dot--secondary__pnRMx","status-dot--destructive":"status-dot-module_status-dot--destructive__z-jPU","status-dot--warning":"status-dot-module_status-dot--warning__ZFtBS","status-dot--success":"status-dot-module_status-dot--success__cYB5i","status-dot--info":"status-dot-module_status-dot--info__sAXNn","status-dot--slate":"status-dot-module_status-dot--slate__bapda","status-dot--inherit":"status-dot-module_status-dot--inherit__6o2O9","status-dot--sm":"status-dot-module_status-dot--sm__lPs5V","status-dot--md":"status-dot-module_status-dot--md__CELtX","status-dot--lg":"status-dot-module_status-dot--lg__7M2z0","status-dot--glow":"status-dot-module_status-dot--glow__Tbf-5","status-dot--pulse":"status-dot-module_status-dot--pulse__Vw5aP"};
+
+export { s as default };
+//# sourceMappingURL=status-dot.module.scss.js.map

package/dist/ui/StatusDot/status-dot.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/ui/index.d.ts

@@ -12,6 +12,7 @@ export * from './Pagination';
 export * from './ProgressBar';
 export * from './Separator';
 export * from './StatCard';
+export * from './StatusDot';
 export * from './StepProgress';
 export * from './Switch';
 export * from './Table';

package/dist/ui/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC"}

package/dist/ui.d.ts

@@ -1,5 +1,5 @@
-export { a as Alert, b as AlertBanner, c as AlertBannerProps, d as AlertDescription, f as AlertProps, g as AlertProvider, i as AlertTitle, j as Avatar, k as AvatarFallback, l as AvatarFallbackProps, m as AvatarImage, n as AvatarImageProps, o as AvatarProps, C as Chip, p as ChipProps, q as CodeBlock, r as CodeBlockProps, D as DevIndicator, s as DevIndicatorProps, t as Dialog, u as DialogClose, v as DialogCloseProps, w as DialogContent, x as DialogContentProps, y as DialogDescription, z as DialogFooter, B as DialogHeader, E as DialogOverlay, F as DialogPortal, G as DialogProps, H as DialogTitle, I as DialogTrigger, J as DialogTriggerProps, K as EmptyState, L as EmptyStateProps, M as Icon, N as IconProps, O as List, P as ListItem, Q as ListItemProps, R as ListProps, T as Pagination, V as ProgressBar, W as ProgressBarProps, Y as Separator, Z as SeparatorProps, a0 as StatCard, a1 as StatCardDirection, a2 as StatCardProps, a3 as StatCardSize, a4 as StatCardTheme, a5 as StatCardVariant, a6 as Step, a7 as StepProgress, a8 as StepProgressProps, a9 as Switch, aa as SwitchProps, ab as Table, ac as TableActionCell, ad as TableActionCellProps, ae as TableActionItem, af as TableBody, ag as TableBodyProps, ah as TableCard, ai as TableCell, aj as TableFooter, ak as TableHead, al as TableHeader, am as TableRow, an as TableSortableHeader, ao as TableSortableHeaderProps, ap as TableToolbar, aq as TableToolbarProps, ar as Toggle, as as ToggleGroup, at as ToggleGroupProps, au as ToggleProps, av as TrendDirection, aw as persistAlert } from './index-BeCWb0Ix.js';
-export { B as Button, a as ButtonProps, T as Tooltip, b as TooltipContent, c as TooltipContentProps, d as TooltipProps, e as TooltipProvider, f as TooltipTrigger, g as TooltipTriggerProps } from './tooltip-zOT3UHCF.js';
+export { a as Alert, b as AlertBanner, c as AlertBannerProps, d as AlertDescription, f as AlertProps, g as AlertProvider, i as AlertTitle, j as Avatar, k as AvatarFallback, l as AvatarFallbackProps, m as AvatarImage, n as AvatarImageProps, o as AvatarProps, C as Chip, p as ChipProps, q as CodeBlock, r as CodeBlockProps, D as DevIndicator, s as DevIndicatorProps, t as Dialog, u as DialogClose, v as DialogCloseProps, w as DialogContent, x as DialogContentProps, y as DialogDescription, z as DialogFooter, B as DialogHeader, E as DialogOverlay, F as DialogPortal, G as DialogProps, H as DialogTitle, I as DialogTrigger, J as DialogTriggerProps, K as EmptyState, L as EmptyStateProps, M as Icon, N as IconProps, O as List, P as ListItem, Q as ListItemProps, R as ListProps, T as Pagination, V as ProgressBar, W as ProgressBarProps, Y as Separator, Z as SeparatorProps, a0 as StatCard, a1 as StatCardDirection, a2 as StatCardProps, a3 as StatCardSize, a4 as StatCardTheme, a5 as StatCardVariant, a6 as StatusDot, a7 as StatusDotProps, a8 as Step, a9 as StepProgress, aa as StepProgressProps, ab as Switch, ac as SwitchProps, ad as Table, ae as TableActionCell, af as TableActionCellProps, ag as TableActionItem, ah as TableBody, ai as TableBodyProps, aj as TableCard, ak as TableCell, al as TableFooter, am as TableHead, an as TableHeader, ao as TableRow, ap as TableSortableHeader, aq as TableSortableHeaderProps, ar as TableToolbar, as as TableToolbarProps, at as Toggle, au as ToggleGroup, av as ToggleGroupProps, aw as ToggleProps, ax as TrendDirection, ay as persistAlert, az as statusDotVariants } from './index-DCtv8Gm1.js';
+export { B as Button, a as ButtonProps, T as Tooltip, b as TooltipContent, c as TooltipContentProps, d as TooltipProps, e as TooltipProvider, f as TooltipTrigger, g as TooltipTriggerProps } from './tooltip-C25-bG7o.js';
 import 'class-variance-authority';
 import 'react';
 import 'class-variance-authority/types';

package/dist/ui.js

@@ -14,6 +14,8 @@ export { Pagination } from './ui/Pagination/pagination.js';
 export { ProgressBar } from './ui/ProgressBar/progress-bar.js';
 export { Separator } from './ui/Separator/separator.js';
 export { StatCard } from './ui/StatCard/stat-card.js';
+export { StatusDot } from './ui/StatusDot/status-dot.js';
+export { statusDotVariants } from './ui/StatusDot/status-dot-variants.js';
 export { StepProgress } from './ui/StepProgress/step-progress.js';
 export { Switch } from './ui/Switch/switch.js';
 export { Table, TableBody, TableCard, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableSortableHeader } from './ui/Table/table.js';

package/dist/ui.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ui.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kismet-ux/constellation",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -86,6 +86,10 @@
       "import": "./dist/index.css",
       "default": "./dist/index.css"
     },
+    "./styles/tokens": {
+      "import": "./dist/tokens.css",
+      "default": "./dist/tokens.css"
+    },
     "./styles/mixins": {
       "import": "./src/styles/mixins.scss",
       "default": "./src/styles/mixins.scss"