@luscii-healthtech/web-ui 59.1.0 → 60.0.0

package/dist/esm/components/Radio/LabeledRadio.js

@@ -8,19 +8,25 @@ import { HelperAndErrorText } from '../forms/shared/HelperAndErrorText.js';
 import { LabelText } from '../forms/shared/LabelText.js';
 import { StyledRadio } from './StyledRadio.js';
 
+const RADIO_COLUMN_CLASS_NAME = "ui:w-4";
+const RADIO_COLUMN_GAP = "m";
 const LabeledRadio = React__default.forwardRef((props, ref) => {
   const { children, label, helperText, errorText, className, inputClassName } = props, attributes = __rest(props, ["children", "label", "helperText", "errorText", "className", "inputClassName"]);
   const { id, disabled } = attributes;
   const semanticId = React__default.useId();
-  return jsxs(Stack, { as: "label", axis: "x", _gap: "m", htmlFor: id, className: classNames("ui:radio-form-field-label", className), children: [jsxs("div", { className: "ui:relative ui:flex ui:flex-row ui:items-center ui:self-start", children: [jsx(Text, { "aria-hidden": true, className: "ui:w-4 ui:opacity-0", children: "CENTER" }), jsx("div", { className: "ui:absolute", children: jsx(StyledRadio, Object.assign({ "aria-describedby": semanticId }, attributes, { ref, className: inputClassName })) })] }), jsxs("div", { children: [jsx(RadioLabel, { label, disabled, children }), jsx(HelperAndErrorText, { helperText, errorText, describingId: semanticId })] })] });
+  return (
+    // Always rendered, so toggling `children` doesn't remount the radio (and lose its focus or state).
+    // Without children it has no effect on the layout.
+    jsxs("div", { className: children ? "ui:flex ui:flex-col ui:items-start ui:gap-f_s" : "ui:contents", children: [jsxs(Stack, { as: "label", axis: "x", _gap: RADIO_COLUMN_GAP, htmlFor: id, className: classNames("ui:radio-form-field-label", className), children: [jsxs("div", { className: "ui:relative ui:flex ui:flex-row ui:items-center ui:self-start", children: [jsx(Text, { "aria-hidden": true, className: classNames(RADIO_COLUMN_CLASS_NAME, "ui:opacity-0"), children: "CENTER" }), jsx("div", { className: "ui:absolute", children: jsx(StyledRadio, Object.assign({ "aria-describedby": semanticId }, attributes, { ref, className: inputClassName })) })] }), jsxs("div", { children: [jsx(RadioLabel, { label, disabled }), jsx(HelperAndErrorText, { helperText, errorText, describingId: semanticId })] })] }), children ? jsxs(Stack, { axis: "x", _gap: RADIO_COLUMN_GAP, className: "ui:self-stretch", children: [jsx("div", { className: classNames(RADIO_COLUMN_CLASS_NAME, "ui:shrink-0") }), jsx("div", { className: "ui:min-w-0 ui:flex-1", children })] }) : null] })
+  );
 });
 function RadioLabel(props) {
-  const { children, label, disabled } = props;
-  if (!label && !children) {
+  const { label, disabled } = props;
+  if (!label) {
     return null;
   }
-  if (children) {
-    return children;
+  if (typeof label !== "string" && typeof label !== "number") {
+    return label;
   }
   return jsx(LabelText, { color: disabled ? "slate-500" : void 0, children: label });
 }

package/dist/esm/components/Radio/LabeledRadio.js.map

@@ -1 +1 @@
-{"version":3,"file":"LabeledRadio.js","sources":["../../../../../../src/components/Radio/LabeledRadio.tsx"],"sourcesContent":[null],"names":["React","_jsxs","_jsx"],"mappings":";;;;;;;;;;AA2EO,MAAM,YAAA,GAAeA,cAAA,CAAM,UAAA,CAChC,CAAC,OAAO,GAAA,KAAO;AACb,EAAA,MAAM,EACJ,QAAA,EACA,KAAA,EACA,YACA,SAAA,EACA,SAAA,EACA,gBAAc,GAEZ,KAAA,EADC,oBACD,KAAA,EARE,CAAA,UAAA,EAAA,OAAA,EAAA,cAAA,WAAA,EAAA,WAAA,EAAA,gBAAA,CAQL,CAAA;AACD,EAAA,MAAM,EAAE,EAAA,EAAI,QAAA,EAAQ,GAAK,UAAA;AACzB,EAAA,MAAM,UAAA,GAAaA,eAAM,KAAA;AAEzB,EAAA,OACEC,KAAC,KAAA,EAAK,EACJ,IAAG,OAAA,EACH,IAAA,EAAK,KACL,IAAA,EAAK,GAAA,EACL,SAAS,EAAA,EACT,SAAA,EAAW,WAAW,2BAAA,EAA6B,SAAS,GAAC,QAAA,EAAA,CAE7DA,cAAK,SAAA,EAAU,+DAAA,EAA+D,UAAA,CAE5EC,GAAA,CAAC,6BAAiB,SAAA,EAAU,qBAAA,EAAqB,UAAA,QAAA,EAAA,GAIjDA,GAAA,UAAK,SAAA,EAAU,aAAA,EAAa,UAC1BA,GAAA,CAAC,WAAA,sCACmB,UAAA,IACd,UAAA,EAAU,EACd,KACA,SAAA,EAAW,cAAA,MACX,CACE,CAAA,EAAA,CAAA,EAGRD,IAAA,CAAA,OAAA,EAAA,QAAA,EAAA,CACEC,GAAA,CAAC,UAAA,EAAU,EAAC,KAAA,EAAc,QAAA,EAAkB,UACjC,CAAA,EAEXA,IAAC,kBAAA,EAAkB,EACjB,YACA,SAAA,EACA,YAAA,EAAc,YAAU,CACxB,GAAA,CACE,GAAA,CAAA;AAGZ,CAAC;AASH,SAAS,WAAW,KAAA,EAAsB;AACxC,EAAA,MAAM,EAAE,QAAA,EAAU,KAAA,EAAO,QAAA,EAAQ,GAAK,KAAA;AAEtC,EAAA,IAAI,CAAC,KAAA,IAAS,CAAC,QAAA,EAAU;AACvB,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,OAAO,QAAA;AAAA,EACT;AAEA,EAAA,OACEA,GAAA,CAAC,aAAU,KAAA,EAAO,WAAW,WAAA,GAAc,MAAA,YAAY,KAAA,EAAK,CAAA;AAEhE;;"}
+{"version":3,"file":"LabeledRadio.js","sources":["../../../../../../src/components/Radio/LabeledRadio.tsx"],"sourcesContent":[null],"names":["React","_jsxs","_jsx"],"mappings":";;;;;;;;;;AAkEA,MAAM,uBAAA,GAA0B,QAAA;AAChC,MAAM,gBAAA,GAAmB,GAAA;AAsBlB,MAAM,YAAA,GAAeA,cAAA,CAAM,UAAA,CAChC,CAAC,OAAO,GAAA,KAAO;AACb,EAAA,MAAM,EACJ,QAAA,EACA,KAAA,EACA,YACA,SAAA,EACA,SAAA,EACA,gBAAc,GAEZ,KAAA,EADC,oBACD,KAAA,EARE,CAAA,UAAA,EAAA,OAAA,EAAA,cAAA,WAAA,EAAA,WAAA,EAAA,gBAAA,CAQL,CAAA;AACD,EAAA,MAAM,EAAE,EAAA,EAAI,QAAA,EAAQ,GAAK,UAAA;AACzB,EAAA,MAAM,UAAA,GAAaA,eAAM,KAAA;AAEzB,EAAA;AAAA;AAAA;AAAA,IAGEC,IAAA,CAAA,KAAA,EAAA,EACE,SAAA,EACE,QAAA,GACI,+CAAA,GACA,aAAA,EAAa,QAAA,EAAA,CAGnBA,IAAA,CAAC,KAAA,EAAK,EACJ,IAAG,OAAA,EACH,IAAA,EAAK,GAAA,EACL,IAAA,EAAM,gBAAA,EACN,OAAA,EAAS,EAAA,EACT,SAAA,EAAW,WAAW,2BAAA,EAA6B,SAAS,CAAA,EAAC,QAAA,EAAA,CAE7DA,IAAA,CAAA,KAAA,EAAA,EAAK,WAAU,+DAAA,EAA+D,QAAA,EAAA,CAE5EC,GAAA,CAAC,IAAA,EAAI,EAAA,aAAA,EAAA,IAAA,EAEH,SAAA,EAAW,UAAA,CAAW,uBAAA,EAAyB,cAAc,CAAA,yBAK/DA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAA,EAAU,aAAA,EAAa,QAAA,EAC1BA,GAAA,CAAC,WAAA,EAAW,OAAA,MAAA,CAAA,EAAA,kBAAA,EACQ,UAAA,EAAU,EACxB,UAAA,EAAU,EACd,GAAA,EACA,WAAW,cAAA,EAAc,CAAA,CAAA,EACzB,CACE,CAAA,EAAA,CAAA,EAGRD,IAAA,CAAA,KAAA,EAAA,EAAA,QAAA,EAAA,CACEC,GAAA,CAAC,UAAA,EAAU,EAAC,KAAA,EAAc,QAAA,EAAkB,CAAA,EAC5CA,GAAA,CAAC,kBAAA,EAAkB,EACjB,UAAA,EACA,WACA,YAAA,EAAc,UAAA,GACd,CAAA,EAAA,CACE,CAAA,EAAA,CAAA,EAGP,QAAA,GACCD,IAAA,CAAC,KAAA,EAAK,EAAC,IAAA,EAAK,GAAA,EAAI,IAAA,EAAM,kBAAkB,SAAA,EAAU,iBAAA,EAAiB,QAAA,EAAA,CAEjEC,GAAA,UACE,SAAA,EAAW,WAAW,uBAAA,EAAyB,aAAa,CAAA,EAAC,CAAA,EAE/DA,GAAA,CAAA,KAAA,EAAA,EAAK,WAAU,sBAAA,YAAgC,CAAO,CAAA,EAAA,CAAA,GAEtD,IAAI,GAAA;AAAA;AAGd,CAAC;AAQH,SAAS,WAAW,KAAA,EAAsB;AACxC,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAQ,GAAK,KAAA;AAE5B,EAAA,IAAI,CAAC,KAAA,EAAO;AACV,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,IAAI,OAAO,KAAA,KAAU,QAAA,IAAY,OAAO,UAAU,QAAA,EAAU;AAC1D,IAAA,OAAO,KAAA;AAAA,EACT;AAEA,EAAA,OACEA,GAAA,CAAC,aAAU,KAAA,EAAO,WAAW,WAAA,GAAc,MAAA,YAAY,KAAA,EAAK,CAAA;AAEhE;;"}

package/dist/esm/components/RangeTriggerIcon/RangeTriggerIcon.js

@@ -0,0 +1,45 @@
+import { __rest } from '../../vendor/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+const RANGE_COLORS = {
+  "alerts-high-salmon": "var(--ui-color-icon-alerts-high-salmon)",
+  "alerts-high-crimson": "var(--ui-color-icon-alerts-high-crimson)",
+  "alerts-high-red": "var(--ui-color-icon-alerts-high-red)",
+  "alerts-medium-sun": "var(--ui-color-icon-alerts-medium-sun)",
+  "alerts-medium-oak": "var(--ui-color-icon-alerts-medium-oak)",
+  "alerts-medium-amber": "var(--ui-color-icon-alerts-medium-amber)",
+  "alerts-low-mint": "var(--ui-color-icon-alerts-low-mint)",
+  "alerts-low-leaf": "var(--ui-color-icon-alerts-low-leaf)",
+  "alerts-low-green": "var(--ui-color-icon-alerts-low-green)",
+  "alerts-neutral-fog": "var(--ui-color-icon-alerts-neutral-fog)",
+  "alerts-neutral-neutral": "var(--ui-color-icon-alerts-neutral-neutral)",
+  "alerts-neutral-graphite": "var(--ui-color-icon-alerts-neutral-graphite)"
+};
+const DEFAULT_COLOR = "var(--ui-color-icon-brand-primary-default)";
+const TRACK_COLOR = "var(--ui-color-icon-neutral-secondary-disabled)";
+const DISABLED_COLOR = "var(--ui-color-icon-neutral-primary-default)";
+const TRACK_PATH = "M3 9H37A3 3 0 0 1 37 15H3A3 3 0 0 1 3 9Z";
+const RANGE_PATHS = {
+  // Square on the left, rounded on the right where it meets the track's end.
+  upper: "M20 9H37A3 3 0 0 1 37 15H20Z",
+  // Rounded on the left where it meets the track's end, square on the right.
+  lower: "M20 9H3A3 3 0 0 0 3 15H20Z",
+  // From 30% to 70% of the track, square on both ends.
+  middle: "M12 9H28V15H12Z",
+  // The whole track, when neither bound restricts the range.
+  full: TRACK_PATH
+};
+const RangeTriggerIcon = (_a) => {
+  var { shape, color, disabled = false } = _a, svgProps = __rest(_a, ["shape", "color", "disabled"]);
+  let rangeColor = DEFAULT_COLOR;
+  if (disabled) {
+    rangeColor = DISABLED_COLOR;
+  } else if (color) {
+    rangeColor = RANGE_COLORS[color];
+  }
+  const hasAccessibleName = Boolean(svgProps["aria-label"] || svgProps["aria-labelledby"]);
+  return jsxs("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 40, height: 24, viewBox: "0 0 40 24", fill: "none" }, svgProps, { role: hasAccessibleName ? "img" : void 0, "aria-hidden": hasAccessibleName ? void 0 : true, children: [jsx("path", { d: TRACK_PATH, fill: TRACK_COLOR }), shape === "exact" ? jsx("circle", { cx: 20, cy: 12, r: 4, fill: rangeColor }) : jsx("path", { d: RANGE_PATHS[shape], fill: rangeColor })] }));
+};
+
+export { RangeTriggerIcon };
+//# sourceMappingURL=RangeTriggerIcon.js.map

package/dist/esm/components/RangeTriggerIcon/RangeTriggerIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RangeTriggerIcon.js","sources":["../../../../../../src/components/RangeTriggerIcon/RangeTriggerIcon.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":";;;AAqCA,MAAM,YAAA,GAAsD;AAAA,EAC1D,oBAAA,EAAsB,yCAAA;AAAA,EACtB,qBAAA,EAAuB,0CAAA;AAAA,EACvB,iBAAA,EAAmB,sCAAA;AAAA,EACnB,mBAAA,EAAqB,wCAAA;AAAA,EACrB,mBAAA,EAAqB,wCAAA;AAAA,EACrB,qBAAA,EAAuB,0CAAA;AAAA,EACvB,iBAAA,EAAmB,sCAAA;AAAA,EACnB,iBAAA,EAAmB,sCAAA;AAAA,EACnB,kBAAA,EAAoB,uCAAA;AAAA,EACpB,oBAAA,EAAsB,yCAAA;AAAA,EACtB,wBAAA,EAA0B,6CAAA;AAAA,EAC1B,yBAAA,EAA2B;;AAI7B,MAAM,aAAA,GAAgB,4CAAA;AAItB,MAAM,WAAA,GAAc,iDAAA;AAEpB,MAAM,cAAA,GAAiB,8CAAA;AAEvB,MAAM,UAAA,GAAa,0CAAA;AAEnB,MAAM,WAAA,GAAuE;AAAA;AAAA,EAE3E,KAAA,EAAO,8BAAA;AAAA;AAAA,EAEP,KAAA,EAAO,4BAAA;AAAA;AAAA,EAEP,MAAA,EAAQ,iBAAA;AAAA;AAAA,EAER,IAAA,EAAM;;AAoCD,MAAM,gBAAA,GAA8C,CAAC,EAAA,KAKvD;AALuD,EAAA,IAAA,EAC1D,KAAA,EACA,KAAA,EACA,QAAA,GAAW,OAAK,GAAA,EAAA,EACb,QAAA,GAAQ,MAAA,CAAA,EAAA,EAJ+C,CAAA,OAAA,EAAA,OAAA,EAAA,UAAA,CAK3D,CAAA;AACC,EAAA,IAAI,UAAA,GAAa,aAAA;AACjB,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,UAAA,GAAa,cAAA;AAAA,EACf,WAAW,KAAA,EAAO;AAChB,IAAA,UAAA,GAAa,aAAa,KAAK,CAAA;AAAA,EACjC;AACA,EAAA,MAAM,oBAAoB,OAAA,CACxB,QAAA,CAAS,YAAY,CAAA,IAAK,QAAA,CAAS,iBAAiB,CAAC,CAAA;AAGvD,EAAA,OACEA,IAAA,wBACE,KAAA,EAAM,4BAAA,EACN,KAAA,EAAO,EAAA,EACP,MAAA,EAAQ,EAAA,EACR,OAAA,EAAQ,aACR,IAAA,EAAK,MAAA,EAAM,EACP,QAAA,EAAQ,EACZ,IAAA,EAAM,iBAAA,GAAoB,KAAA,GAAQ,MAAA,EAAS,aAAA,EAC9B,iBAAA,GAAoB,MAAA,GAAY,IAAA,EAAI,QAAA,EAAA,CAEjDC,GAAA,CAAA,QAAA,EAAM,CAAA,EAAG,UAAA,EAAY,IAAA,EAAM,WAAA,EAAW,CAAA,EACrC,KAAA,KAAU,OAAA,GACTA,GAAA,aAAQ,EAAA,EAAI,EAAA,EAAI,EAAA,EAAI,EAAA,EAAI,GAAG,CAAA,EAAG,IAAA,EAAM,UAAA,MAEpCA,GAAA,CAAA,MAAA,EAAA,EAAM,GAAG,WAAA,CAAY,KAAK,CAAA,EAAG,IAAA,EAAM,UAAA,EAAU,CAC9C,CAAA,EAAA,CAAA,CAAA;AAGP;;"}

package/dist/esm/index.js

@@ -290,6 +290,7 @@ export { HoverIndicatorControl } from './components/HoverIndicatorControl/HoverI
 export { ActionController } from './components/ActionController/ActionController.js';
 export { Collapse } from './components/Collapse/Collapse.js';
 export { RangeCoverage } from './components/RangeCoverage/RangeCoverage.js';
+export { RangeTriggerIcon } from './components/RangeTriggerIcon/RangeTriggerIcon.js';
 export { Skeleton } from './components/Skeleton/Skeleton.js';
 export { DetailsDisclosure } from './components/DetailsDisclosure/DetailsDisclosure.js';
 export { ModalDialog } from './components/ModalDialog/ModalDialog.js';

package/dist/esm/index.js.map

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

package/dist/index.development.js

@@ -2286,19 +2286,25 @@ const StyledRadio = React__namespace.default.forwardRef((props, ref) => {
   return jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("input", Object.assign({ type: "radio" }, attributes, { className: classNames__default.default("ui:appearance-none ui:w-4 ui:h-4 ui:rounded-full ui:border ui:border-slate-300 ui:bg-white", "ui:checked:grid ui:checked:place-content-center ui:checked:before:scale-[1] ui:checked:bg-primary ui:checked:border-primary", "ui:transition-colors ui:duration-100 ui:ease-in-out", "ui:before:content-[' '] ui:before:w-1.5 ui:before:h-1.5 ui:before:bg-white ui:before:rounded ui:before:scale-[0]", "ui:before:transition-transform ui:before:duration-200 ui:before:ease-[cubic-bezier(.47,.34,.52,1.39)]", className), ref })) });
 });
 
+const RADIO_COLUMN_CLASS_NAME = "ui:w-4";
+const RADIO_COLUMN_GAP = "m";
 const LabeledRadio = React__namespace.default.forwardRef((props, ref) => {
   const { children, label, helperText, errorText, className, inputClassName } = props, attributes = __rest(props, ["children", "label", "helperText", "errorText", "className", "inputClassName"]);
   const { id, disabled } = attributes;
   const semanticId = React__namespace.default.useId();
-  return jsxRuntime.jsxs(Stack, { as: "label", axis: "x", _gap: "m", htmlFor: id, className: classNames__default.default("ui:radio-form-field-label", className), children: [jsxRuntime.jsxs("div", { className: "ui:relative ui:flex ui:flex-row ui:items-center ui:self-start", children: [jsxRuntime.jsx(Text, { "aria-hidden": true, className: "ui:w-4 ui:opacity-0", children: "CENTER" }), jsxRuntime.jsx("div", { className: "ui:absolute", children: jsxRuntime.jsx(StyledRadio, Object.assign({ "aria-describedby": semanticId }, attributes, { ref, className: inputClassName })) })] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(RadioLabel, { label, disabled, children }), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: semanticId })] })] });
+  return (
+    // Always rendered, so toggling `children` doesn't remount the radio (and lose its focus or state).
+    // Without children it has no effect on the layout.
+    jsxRuntime.jsxs("div", { className: children ? "ui:flex ui:flex-col ui:items-start ui:gap-f_s" : "ui:contents", children: [jsxRuntime.jsxs(Stack, { as: "label", axis: "x", _gap: RADIO_COLUMN_GAP, htmlFor: id, className: classNames__default.default("ui:radio-form-field-label", className), children: [jsxRuntime.jsxs("div", { className: "ui:relative ui:flex ui:flex-row ui:items-center ui:self-start", children: [jsxRuntime.jsx(Text, { "aria-hidden": true, className: classNames__default.default(RADIO_COLUMN_CLASS_NAME, "ui:opacity-0"), children: "CENTER" }), jsxRuntime.jsx("div", { className: "ui:absolute", children: jsxRuntime.jsx(StyledRadio, Object.assign({ "aria-describedby": semanticId }, attributes, { ref, className: inputClassName })) })] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(RadioLabel, { label, disabled }), jsxRuntime.jsx(HelperAndErrorText, { helperText, errorText, describingId: semanticId })] })] }), children ? jsxRuntime.jsxs(Stack, { axis: "x", _gap: RADIO_COLUMN_GAP, className: "ui:self-stretch", children: [jsxRuntime.jsx("div", { className: classNames__default.default(RADIO_COLUMN_CLASS_NAME, "ui:shrink-0") }), jsxRuntime.jsx("div", { className: "ui:min-w-0 ui:flex-1", children })] }) : null] })
+  );
 });
 function RadioLabel(props) {
-  const { children, label, disabled } = props;
-  if (!label && !children) {
+  const { label, disabled } = props;
+  if (!label) {
     return null;
   }
-  if (children) {
-    return children;
+  if (typeof label !== "string" && typeof label !== "number") {
+    return label;
   }
   return jsxRuntime.jsx(LabelText, { color: disabled ? "slate-500" : void 0, children: label });
 }
@@ -6937,6 +6943,46 @@ const RangeCoverage = Object.assign(RangeCoverageComponent, {
   useAdaptiveTicks
 });
 
+const RANGE_COLORS = {
+  "alerts-high-salmon": "var(--ui-color-icon-alerts-high-salmon)",
+  "alerts-high-crimson": "var(--ui-color-icon-alerts-high-crimson)",
+  "alerts-high-red": "var(--ui-color-icon-alerts-high-red)",
+  "alerts-medium-sun": "var(--ui-color-icon-alerts-medium-sun)",
+  "alerts-medium-oak": "var(--ui-color-icon-alerts-medium-oak)",
+  "alerts-medium-amber": "var(--ui-color-icon-alerts-medium-amber)",
+  "alerts-low-mint": "var(--ui-color-icon-alerts-low-mint)",
+  "alerts-low-leaf": "var(--ui-color-icon-alerts-low-leaf)",
+  "alerts-low-green": "var(--ui-color-icon-alerts-low-green)",
+  "alerts-neutral-fog": "var(--ui-color-icon-alerts-neutral-fog)",
+  "alerts-neutral-neutral": "var(--ui-color-icon-alerts-neutral-neutral)",
+  "alerts-neutral-graphite": "var(--ui-color-icon-alerts-neutral-graphite)"
+};
+const DEFAULT_COLOR = "var(--ui-color-icon-brand-primary-default)";
+const TRACK_COLOR = "var(--ui-color-icon-neutral-secondary-disabled)";
+const DISABLED_COLOR = "var(--ui-color-icon-neutral-primary-default)";
+const TRACK_PATH = "M3 9H37A3 3 0 0 1 37 15H3A3 3 0 0 1 3 9Z";
+const RANGE_PATHS = {
+  // Square on the left, rounded on the right where it meets the track's end.
+  upper: "M20 9H37A3 3 0 0 1 37 15H20Z",
+  // Rounded on the left where it meets the track's end, square on the right.
+  lower: "M20 9H3A3 3 0 0 0 3 15H20Z",
+  // From 30% to 70% of the track, square on both ends.
+  middle: "M12 9H28V15H12Z",
+  // The whole track, when neither bound restricts the range.
+  full: TRACK_PATH
+};
+const RangeTriggerIcon = (_a) => {
+  var { shape, color, disabled = false } = _a, svgProps = __rest(_a, ["shape", "color", "disabled"]);
+  let rangeColor = DEFAULT_COLOR;
+  if (disabled) {
+    rangeColor = DISABLED_COLOR;
+  } else if (color) {
+    rangeColor = RANGE_COLORS[color];
+  }
+  const hasAccessibleName = Boolean(svgProps["aria-label"] || svgProps["aria-labelledby"]);
+  return jsxRuntime.jsxs("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: 40, height: 24, viewBox: "0 0 40 24", fill: "none" }, svgProps, { role: hasAccessibleName ? "img" : void 0, "aria-hidden": hasAccessibleName ? void 0 : true, children: [jsxRuntime.jsx("path", { d: TRACK_PATH, fill: TRACK_COLOR }), shape === "exact" ? jsxRuntime.jsx("circle", { cx: 20, cy: 12, r: 4, fill: rangeColor }) : jsxRuntime.jsx("path", { d: RANGE_PATHS[shape], fill: rangeColor })] }));
+};
+
 const AsideLayout = (_a) => {
   var { aside, children } = _a, rest = __rest(_a, ["aside", "children"]);
   const containerClasses = classNames__default.default("ui:flex-col ui:md:flex-row");
@@ -7473,6 +7519,7 @@ exports.PrimaryTabBar = PrimaryTabBar;
 exports.PrinterIcon = PrinterIcon;
 exports.QuestionFilledIcon = QuestionFilledIcon;
 exports.RangeCoverage = RangeCoverage;
+exports.RangeTriggerIcon = RangeTriggerIcon;
 exports.RedAlertColoredIcon = RedAlertColoredIcon;
 exports.RedAlertIcon = RedAlertIcon;
 exports.RefreshIcon = RefreshIcon;