@galaxy-io/dls 1.4.15 → 1.5.0

package/dist/inputs/TextAreaInput.d.ts

@@ -1,25 +1,12 @@
-/** Text size and inset density. Row count comes from `lines`, not from this. */
-export declare enum TextAreaSize {
-    SMALL = "SMALL",
-    MEDIUM = "MEDIUM",
-    LARGE = "LARGE"
-}
-/** Background treatment. `TRANSPARENT` is for embedding in an existing surface. */
-export declare enum TextAreaVariant {
-    TRANSPARENT = "TRANSPARENT",
-    BASE = "BASE",
-    PRIMARY = "PRIMARY",
-    SECONDARY = "SECONDARY",
-    TERTIARY = "TERTIARY"
-}
+import { InputSize, InputVariant } from "./Input";
 export interface TextAreaInputProps {
     /** Controlled value. */
     value?: string;
     onChange: (value: string) => void;
-    /** @default TextAreaVariant.PRIMARY */
-    variant?: TextAreaVariant;
-    /** @default TextAreaSize.MEDIUM */
-    size?: TextAreaSize;
+    /** Field surface color. @default InputVariant.PRIMARY */
+    variant?: InputVariant;
+    /** @default InputSize.MEDIUM */
+    size?: InputSize;
     /** Visible rows before scrolling. @default 3 */
     lines?: number;
     placeholder?: string;

package/dist/inputs/TextAreaInput.js

@@ -3,36 +3,24 @@ import { getCssSizeValue } from "../utils/linaria.js";
 import Text, { TextSize, TextVariant } from "../text/Text.js";
 import FlexWrapper, { FlexDirection } from "../containers/FlexWrapper.js";
 import TextShimmer from "../text/TextShimmer.js";
-import { InputLabel } from "./Input.js";
+import { InputLabel, InputSize, InputVariant, getInputBorderColor, getInputFontSize, getInputLineHeight, getInputPadding, getInputPaddingValue, getInputSurfaceColor } from "./Input.js";
 /* empty css                        */
 import { styled } from "@linaria/react";
-import { match } from "ts-pattern";
 import { forwardRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/inputs/TextAreaInput.tsx
-/** Text size and inset density. Row count comes from `lines`, not from this. */
-var TextAreaSize = /* @__PURE__ */ function(TextAreaSize) {
-	TextAreaSize["SMALL"] = "SMALL";
-	TextAreaSize["MEDIUM"] = "MEDIUM";
-	TextAreaSize["LARGE"] = "LARGE";
-	return TextAreaSize;
-}({});
-/** Background treatment. `TRANSPARENT` is for embedding in an existing surface. */
-var TextAreaVariant = /* @__PURE__ */ function(TextAreaVariant) {
-	TextAreaVariant["TRANSPARENT"] = "TRANSPARENT";
-	TextAreaVariant["BASE"] = "BASE";
-	TextAreaVariant["PRIMARY"] = "PRIMARY";
-	TextAreaVariant["SECONDARY"] = "SECONDARY";
-	TextAreaVariant["TERTIARY"] = "TERTIARY";
-	return TextAreaVariant;
-}({});
-var _exp = () => ({ $lines, $size, theme, $height, $noPadding }) => {
-	if ($height) return "auto";
-	const lineHeight = match($size).with("SMALL", () => Number(theme.font.sans.height.body_sm.replace("px", ""))).with("MEDIUM", () => Number(theme.font.sans.height.body_md.replace("px", ""))).with("LARGE", () => Number(theme.font.sans.height.body_lg.replace("px", ""))).exhaustive();
-	if ($noPadding) return `${lineHeight * $lines}px`;
-	const padding = match($size).with("SMALL", () => 12).with("MEDIUM", () => 16).with("LARGE", () => 20).exhaustive();
-	return `${lineHeight * $lines + padding}px`;
-};
+/**
+* Row count drives the height, so the box is measured rather than stepped:
+* `lines` line-boxes plus the inset above and below. Shared by the field and by
+* the loading placeholder that has to match it exactly.
+*/
+function getTextAreaMinHeight(theme, size, lines, height, noPadding) {
+	if (height) return "auto";
+	const lineHeight = Number(getInputLineHeight(theme, size).replace("px", ""));
+	if (noPadding) return `${lineHeight * lines}px`;
+	return `${lineHeight * lines + 2 * getInputPaddingValue(size)}px`;
+}
+var _exp = () => ({ $lines, $size, theme, $height, $noPadding }) => getTextAreaMinHeight(theme, $size, $lines, $height, $noPadding);
 var _exp2 = () => ({ $fillWidth, $width }) => {
 	if ($fillWidth) return "100%";
 	if ($width) return getCssSizeValue($width, "0");
@@ -44,26 +32,19 @@ var _exp3 = () => ({ $height, $fillHeight }) => {
 	return "auto";
 };
 var _exp4 = () => ({ $fillHeight }) => $fillHeight ? "1" : "none";
-var _exp5 = () => ({ theme, $variant }) => match($variant).with("TRANSPARENT", () => "transparent").with("BASE", () => theme.color.background.base).with("PRIMARY", () => theme.color.background.primary).with("SECONDARY", () => theme.color.background.secondary).with("TERTIARY", () => theme.color.background.tertiary).exhaustive();
+var _exp5 = () => ({ theme, $variant }) => getInputSurfaceColor(theme, $variant);
 var _exp6 = () => ({ theme, $variant, $error, $noBorder }) => {
-	if ($noBorder) return "none";
+	if ($noBorder) return "transparent";
 	if ($error) return theme.color.border.error;
-	return match($variant).with("TRANSPARENT", () => theme.color.border.primary).with("BASE", () => theme.color.border.primary).with("PRIMARY", () => theme.color.border.primary).with("SECONDARY", () => theme.color.border.primary).with("TERTIARY", () => theme.color.border.primary).exhaustive();
+	return getInputBorderColor(theme, $variant);
 };
 var _exp7 = () => ({ theme }) => theme.color.text.primary;
-var _exp8 = () => ({ theme, $size }) => {
-	return match($size).with("SMALL", () => theme.font.sans.size.body_sm).with("MEDIUM", () => theme.font.sans.size.body_md).with("LARGE", () => theme.font.sans.size.body_lg).exhaustive();
-};
-var _exp9 = () => ({ theme, $size }) => {
-	return match($size).with("SMALL", () => theme.font.sans.height.body_sm).with("MEDIUM", () => theme.font.sans.height.body_md).with("LARGE", () => theme.font.sans.height.body_lg).exhaustive();
-};
+var _exp8 = () => ({ theme, $size }) => getInputFontSize(theme, $size);
+var _exp9 = () => ({ theme, $size }) => getInputLineHeight(theme, $size);
 var _exp0 = () => ({ theme }) => theme.font.sans.weight.regular;
 var _exp1 = () => ({ theme }) => theme.font.sans.family;
-var _exp10 = () => ({ $size, $noPadding }) => {
-	if ($noPadding) return "0";
-	return match($size).with("SMALL", () => "6px").with("MEDIUM", () => "8px").with("LARGE", () => "10px").exhaustive();
-};
-var _exp11 = () => ({ theme }) => theme.color.border.primary;
+var _exp10 = () => ({ $size, $noPadding }) => $noPadding ? "0" : getInputPadding($size);
+var _exp11 = () => ({ theme, $variant }) => getInputBorderColor(theme, $variant);
 var _exp12 = () => ({ theme }) => theme.color.border.selected;
 var _exp13 = () => ({ theme }) => theme.color.text.disabled;
 var StyledTextArea = withTheme(/*#__PURE__*/ styled("textarea")({
@@ -101,13 +82,7 @@ var TextAreaWrapper = /*#__PURE__*/ styled("div")({
 		"tu0hnok-2": [_exp16()]
 	}
 });
-var _exp17 = () => ({ $lines, $size, theme, $height, $noPadding }) => {
-	if ($height) return "auto";
-	const lineHeight = match($size).with("SMALL", () => Number(theme.font.sans.height.body_sm.replace("px", ""))).with("MEDIUM", () => Number(theme.font.sans.height.body_md.replace("px", ""))).with("LARGE", () => Number(theme.font.sans.height.body_lg.replace("px", ""))).exhaustive();
-	if ($noPadding) return `${lineHeight * $lines}px`;
-	const padding = match($size).with("SMALL", () => 12).with("MEDIUM", () => 16).with("LARGE", () => 20).exhaustive();
-	return `${lineHeight * $lines + padding}px`;
-};
+var _exp17 = () => ({ $lines, $size, theme, $height, $noPadding }) => getTextAreaMinHeight(theme, $size, $lines, $height, $noPadding);
 var _exp18 = () => ({ $fillWidth, $width }) => {
 	if ($fillWidth) return "100%";
 	if ($width) return getCssSizeValue($width, "0");
@@ -119,15 +94,12 @@ var _exp19 = () => ({ $height, $fillHeight }) => {
 	return "auto";
 };
 var _exp20 = () => ({ $fillHeight }) => $fillHeight ? "1" : "none";
-var _exp21 = () => ({ theme, $variant }) => match($variant).with("TRANSPARENT", () => "transparent").with("BASE", () => theme.color.background.base).with("PRIMARY", () => theme.color.background.primary).with("SECONDARY", () => theme.color.background.secondary).with("TERTIARY", () => theme.color.background.tertiary).exhaustive();
+var _exp21 = () => ({ theme, $variant }) => getInputSurfaceColor(theme, $variant);
 var _exp22 = () => ({ theme, $variant, $noBorder }) => {
 	if ($noBorder) return "transparent";
-	return match($variant).with("TRANSPARENT", () => theme.color.border.primary).with("BASE", () => theme.color.border.primary).with("PRIMARY", () => theme.color.border.primary).with("SECONDARY", () => theme.color.border.primary).with("TERTIARY", () => theme.color.border.primary).exhaustive();
-};
-var _exp23 = () => ({ $size, $noPadding }) => {
-	if ($noPadding) return "0";
-	return match($size).with("SMALL", () => "6px").with("MEDIUM", () => "8px").with("LARGE", () => "10px").exhaustive();
+	return getInputBorderColor(theme, $variant);
 };
+var _exp23 = () => ({ $size, $noPadding }) => $noPadding ? "0" : getInputPadding($size);
 var LoadingContainer = withTheme(/*#__PURE__*/ styled("div")({
 	name: "LoadingContainer",
 	class: "l48iv0n",
@@ -144,9 +116,9 @@ var LoadingContainer = withTheme(/*#__PURE__*/ styled("div")({
 }));
 var DEFAULT_STATE = { error: void 0 };
 var TEXTAREA_SIZE_TO_SHIMMER_HEIGHT_MAP = {
-	["SMALL"]: 12,
-	["MEDIUM"]: 14,
-	["LARGE"]: 16
+	[InputSize.SMALL]: 12,
+	[InputSize.MEDIUM]: 14,
+	[InputSize.LARGE]: 16
 };
 /**
 * A multi-line text field. Not resizable by the user — size it with `lines`,
@@ -155,7 +127,7 @@ var TEXTAREA_SIZE_TO_SHIMMER_HEIGHT_MAP = {
 * Note this one takes `required`/`disabled` rather than the `isRequired`/
 * `isDisabled` the other inputs use.
 */
-var TextAreaInput = forwardRef(({ variant = "PRIMARY", size = "MEDIUM", lines = 3, value, min, max, placeholder, label, labelTooltip, error, required, disabled, autoFocus, onChange, onKeyDown, onBlur, onFocus, width, height, fillWidth, fillHeight, noBorder, noPadding, isLoading }, ref) => {
+var TextAreaInput = forwardRef(({ variant = InputVariant.PRIMARY, size = InputSize.MEDIUM, lines = 3, value, min, max, placeholder, label, labelTooltip, error, required, disabled, autoFocus, onChange, onKeyDown, onBlur, onFocus, width, height, fillWidth, fillHeight, noBorder, noPadding, isLoading }, ref) => {
 	const [state, setState] = useState(DEFAULT_STATE);
 	const handleFocus = (e) => {
 		setState({
@@ -244,4 +216,4 @@ var TextAreaInput = forwardRef(({ variant = "PRIMARY", size = "MEDIUM", lines =
 });
 TextAreaInput.displayName = "TextAreaInput";
 //#endregion
-export { TextAreaSize, TextAreaVariant, TextAreaInput as default };
+export { TextAreaInput as default };

package/dist/inputs/TextInput.d.ts

@@ -1,6 +1,10 @@
 import { type InputProps } from "./Input";
-/** Every `InputProps` field except `type` and `parse`, which are fixed to text. */
-export type TextInputProps = Omit<InputProps<string>, "type" | "parse">;
+/**
+ * Every `InputProps` field except `type` and `parse`, which are fixed to text.
+ * `onFocus` is omitted because the field owns focus to clear its length error,
+ * and `step` is numeric-only.
+ */
+export type TextInputProps = Omit<InputProps<string>, "type" | "parse" | "onFocus" | "step">;
 /**
  * A single-line text field. The default input.
  *

package/dist/inputs/TextInput.js

@@ -9,7 +9,7 @@ var DEFAULT_STATE = { error: "" };
 * `min`/`max` bound the *character count*, not a numeric range — the field
 * validates length on blur and shows its own error. A `error` you pass wins.
 */
-var TextInput = forwardRef(({ size, value, min, max, placeholder, label, labelTooltip, leading, trailing, error, isRequired, isDisabled, autoFocus, onChange, onKeyDown, onBlur, fillWidth, width, isMonospace }, ref) => {
+var TextInput = forwardRef(({ variant, size, value, min, max, placeholder, label, labelTooltip, leading, trailing, error, isRequired, isDisabled, autoFocus, onChange, onKeyDown, onBlur, fillWidth, width, isMonospace }, ref) => {
 	const [state, setState] = useState(DEFAULT_STATE);
 	const handleFocus = () => {
 		setState({
@@ -31,6 +31,7 @@ var TextInput = forwardRef(({ size, value, min, max, placeholder, label, labelTo
 	return /* @__PURE__ */ jsx(Input, {
 		parse: String,
 		onChange,
+		variant,
 		size,
 		ref,
 		type: "text",

package/dist/inputs/ToggleInput.d.ts

@@ -1,4 +1,13 @@
+import { InputSize, InputVariant } from "./Input";
 export interface ToggleInputProps {
+    /**
+     * Off-state track color. The on-state track is a state color and stays
+     * `icon.primary`. @default InputVariant.PRIMARY
+     */
+    variant?: InputVariant;
+    /** Track size — a hit target, so it runs 28×16 / 32×18 / 36×20px.
+     * @default InputSize.MEDIUM */
+    size?: InputSize;
     /** Label rendered above the switch, like the other inputs. */
     label?: string;
     /** Adds an info icon beside the label with this content on hover. */
@@ -18,5 +27,5 @@ export interface ToggleInputProps {
  * Use it for settings that apply immediately. For something that only takes
  * effect on submit, a `CheckboxInput` reads more honestly.
  */
-declare const ToggleInput: ({ label, labelTooltip, value, onChange, isDisabled, width, fillWidth, }: ToggleInputProps) => import("react").JSX.Element;
+declare const ToggleInput: ({ variant, size, label, labelTooltip, value, onChange, isDisabled, width, fillWidth, }: ToggleInputProps) => import("react").JSX.Element;
 export default ToggleInput;

package/dist/inputs/ToggleInput.js

@@ -1,11 +1,22 @@
 import { withTheme } from "../theme/GalaxyTheme.js";
 import FlexWrapper, { AlignItems, JustifyContent } from "../containers/FlexWrapper.js";
-import { InputLabel } from "./Input.js";
+import { InputLabel, InputSize, InputVariant, getInputSurfaceColor } from "./Input.js";
 /* empty css                      */
 import { styled } from "@linaria/react";
+import { match } from "ts-pattern";
 import { useCallback } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/inputs/ToggleInput.tsx
+function getToggleTrackWidth(size) {
+	return match(size).returnType().with(InputSize.SMALL, () => 28).with(InputSize.MEDIUM, () => 32).with(InputSize.LARGE, () => 36).exhaustive();
+}
+function getToggleTrackHeight(size) {
+	return match(size).returnType().with(InputSize.SMALL, () => 16).with(InputSize.MEDIUM, () => 18).with(InputSize.LARGE, () => 20).exhaustive();
+}
+/** The thumb fills the track minus its border and inset on each side — 12 / 14 / 16px. */
+function getToggleThumbSize(size) {
+	return getToggleTrackHeight(size) - 4;
+}
 var _exp = () => ({ $isDisabled }) => $isDisabled ? "not-allowed" : "pointer";
 var _exp2 = () => ({ $isDisabled }) => $isDisabled ? .5 : 1;
 var ToggleWrapper = withTheme(/*#__PURE__*/ styled("div")({
@@ -17,26 +28,34 @@ var ToggleWrapper = withTheme(/*#__PURE__*/ styled("div")({
 		"t1t8zlu-1": [_exp2()]
 	}
 }));
-var _exp3 = () => ({ theme, $isChecked }) => $isChecked ? theme.color.icon.primary : theme.color.opacity.bw24Alt;
-var _exp4 = () => ({ theme }) => theme.color.border.primary;
+var _exp3 = () => ({ $size }) => `${getToggleTrackWidth($size)}px`;
+var _exp4 = () => ({ $size }) => `${getToggleTrackHeight($size)}px`;
+var _exp6 = () => ({ theme, $variant, $isChecked }) => $isChecked ? theme.color.icon.primary : getInputSurfaceColor(theme, $variant);
+var _exp8 = () => ({ theme }) => theme.color.border.primary;
 var ToggleTrack = withTheme(/*#__PURE__*/ styled("div")({
 	name: "ToggleTrack",
 	class: "t1br7yd",
 	propsAsIs: false,
 	vars: {
 		"t1br7yd-0": [_exp3()],
-		"t1br7yd-1": [_exp4()]
+		"t1br7yd-1": [_exp4()],
+		"t1br7yd-2": [_exp6()],
+		"t1br7yd-3": [_exp8()]
 	}
 }));
-var _exp5 = () => ({ $isChecked }) => $isChecked ? "calc(100% - 14px - 1.5px)" : "1.5px";
-var _exp6 = () => ({ theme }) => theme.color.background.base;
+var _exp9 = () => ({ $size, $isChecked }) => $isChecked ? `calc(100% - ${getToggleThumbSize($size)}px - 1.5px)` : `1.5px`;
+var _exp1 = () => ({ $size }) => `${getToggleThumbSize($size)}px`;
+var _exp10 = () => ({ theme, $isChecked }) => $isChecked ? theme.color.background.primary : theme.color.background.primaryAlt;
+var _exp11 = () => ({ theme }) => theme.color.border.primary;
 var ToggleThumb = withTheme(/*#__PURE__*/ styled("div")({
 	name: "ToggleThumb",
 	class: "t1xwadc7",
 	propsAsIs: false,
 	vars: {
-		"t1xwadc7-0": [_exp5()],
-		"t1xwadc7-1": [_exp6()]
+		"t1xwadc7-0": [_exp9()],
+		"t1xwadc7-1": [_exp1()],
+		"t1xwadc7-2": [_exp10()],
+		"t1xwadc7-3": [_exp11()]
 	}
 }));
 var HiddenInput = /*#__PURE__*/ styled("input")({
@@ -50,7 +69,7 @@ var HiddenInput = /*#__PURE__*/ styled("input")({
 * Use it for settings that apply immediately. For something that only takes
 * effect on submit, a `CheckboxInput` reads more honestly.
 */
-var ToggleInput = ({ label, labelTooltip, value, onChange, isDisabled = false, width, fillWidth }) => {
+var ToggleInput = ({ variant = InputVariant.PRIMARY, size = InputSize.MEDIUM, label, labelTooltip, value, onChange, isDisabled = false, width, fillWidth }) => {
 	const handleClick = useCallback(() => {
 		if (!isDisabled) onChange(!value);
 	}, [
@@ -86,9 +105,12 @@ var ToggleInput = ({ label, labelTooltip, value, onChange, isDisabled = false, w
 			"aria-disabled": isDisabled,
 			tabIndex: isDisabled ? -1 : 0,
 			children: [/* @__PURE__ */ jsx(ToggleTrack, {
+				$variant: variant,
+				$size: size,
 				$isChecked: value,
 				$isDisabled: isDisabled,
 				children: /* @__PURE__ */ jsx(ToggleThumb, {
+					$size: size,
 					$isChecked: value,
 					$isDisabled: isDisabled
 				})

package/dist/styles.css

@@ -76,9 +76,13 @@
 .c17zkoob{width:var(--c17zkoob-0);height:var(--c17zkoob-0);}
 .gm80o9u{width:var(--gm80o9u-0);height:var(--gm80o9u-0);}.gm80o9u >div{width:100%;height:100%;}.gm80o9u svg{display:block;}.gm80o9u svg>g path{fill:var(--gm80o9u-1);}
 .cythikj{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;cursor:var(--cythikj-0);opacity:var(--cythikj-1);}.cythikj:focus-visible{outline:2px solid var(--cythikj-2);outline-offset:2px;border-radius:4px;}
-.c1f4v2sg{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;width:var(--c1f4v2sg-0);height:var(--c1f4v2sg-0);border-radius:4px;border:0.5px solid var(--c1f4v2sg-1);background-color:var(--c1f4v2sg-2);-webkit-transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;}.c1f4v2sg:hover{border-color:var(--c1f4v2sg-3);}
+.c1f4v2sg{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;width:var(--c1f4v2sg-0);height:var(--c1f4v2sg-0);border-radius:4px;border:0.5px solid var(--c1f4v2sg-1);background-color:var(--c1f4v2sg-2);-webkit-transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;}
+.s1bxp24n{outline:none;height:var(--s1bxp24n-0);width:var(--s1bxp24n-1);background-color:var(--s1bxp24n-2);border:0.5px solid var(--s1bxp24n-3);border-radius:5px;color:var(--s1bxp24n-4);font-size:var(--s1bxp24n-5);line-height:var(--s1bxp24n-6);font-weight:var(--s1bxp24n-7);font-family:var(--s1bxp24n-8);padding:var(--s1bxp24n-9);-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;opacity:var(--s1bxp24n-10);}.s1bxp24n:hover:not(:disabled, :focus){border-color:var(--s1bxp24n-11);}.s1bxp24n:focus{border-color:var(--s1bxp24n-12);}.s1bxp24n:disabled{cursor:not-allowed;}.s1bxp24n::-webkit-input-placeholder{color:var(--s1bxp24n-13);}.s1bxp24n::-moz-placeholder{color:var(--s1bxp24n-13);}.s1bxp24n:-ms-input-placeholder{color:var(--s1bxp24n-13);}.s1bxp24n::placeholder{color:var(--s1bxp24n-13);}
+.ixmrsxd{position:relative;width:var(--ixmrsxd-0);}
+.l8jap54{position:absolute;left:var(--l8jap54-0);top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;pointer-events:none;}
+.t16cwjje{position:absolute;right:var(--t16cwjje-0);top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;cursor:var(--t16cwjje-1);}
 .s1i18c6k{color:var(--s1i18c6k-0);font-size:var(--s1i18c6k-1);font-weight:var(--s1i18c6k-2);line-height:var(--s1i18c6k-3);letter-spacing:var(--s1i18c6k-4);padding-left:var(--s1i18c6k-5);}
-.s161ysn8{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding:var(--s161ysn8-0);height:var(--s161ysn8-1);width:var(--s161ysn8-2);cursor:var(--s161ysn8-3);opacity:var(--s161ysn8-4);background:var(--s161ysn8-5);border:0.5px solid var(--s161ysn8-6);border-radius:5px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s161ysn8:hover{border-color:var(--s161ysn8-7);}
+.s161ysn8{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding:var(--s161ysn8-0);height:var(--s161ysn8-1);width:var(--s161ysn8-2);cursor:var(--s161ysn8-3);opacity:var(--s161ysn8-4);background-color:var(--s161ysn8-5);border:0.5px solid var(--s161ysn8-6);border-radius:5px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s161ysn8:hover{border-color:var(--s161ysn8-7);}
 .c10utehj{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;gap:8px;}
 .sjdhyd9{width:280px;height:200px;border-radius:5px;overflow:hidden;border:0.5px solid rgba(0, 0, 0, 0.1);}.sjdhyd9>div{width:100%!important;height:100%!important;}
 .s1xfz2j{width:280px;height:12px;border-radius:5px;overflow:hidden;border:0.5px solid var(--s1xfz2j-0);position:relative;cursor:pointer;}.s1xfz2j>div{width:100%!important;height:100%!important;}
@@ -86,21 +90,17 @@
 .c1581w8r{cursor:pointer;}
 .c2h225c{width:16px;height:16px;border-radius:3px;background-color:var(--c2h225c-0);border:1px solid rgba(0, 0, 0, 0.15);}
 .cnw6647{width:24px;height:24px;border-radius:3px;border:1px solid var(--cnw6647-0);background-color:var(--cnw6647-1);cursor:pointer;padding:0;}.cnw6647:hover{border-color:#ffffff;}.cnw6647:focus{outline:none;}
-.s1bxp24n{outline:none;height:var(--s1bxp24n-0);width:var(--s1bxp24n-1);background-color:var(--s1bxp24n-2);border:0.5px solid var(--s1bxp24n-3);border-radius:5px;color:var(--s1bxp24n-4);font-size:var(--s1bxp24n-5);line-height:var(--s1bxp24n-6);font-weight:var(--s1bxp24n-7);font-family:var(--s1bxp24n-8);padding:var(--s1bxp24n-9);-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;opacity:var(--s1bxp24n-10);}.s1bxp24n:hover:not(:disabled, :focus){border-color:var(--s1bxp24n-11);}.s1bxp24n:focus{border-color:var(--s1bxp24n-12);}.s1bxp24n:disabled{cursor:not-allowed;}.s1bxp24n::-webkit-input-placeholder{color:var(--s1bxp24n-13);}.s1bxp24n::-moz-placeholder{color:var(--s1bxp24n-13);}.s1bxp24n:-ms-input-placeholder{color:var(--s1bxp24n-13);}.s1bxp24n::placeholder{color:var(--s1bxp24n-13);}
-.ixmrsxd{position:relative;width:var(--ixmrsxd-0);}
-.l8jap54{position:absolute;left:var(--l8jap54-0);top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;pointer-events:none;}
-.t16cwjje{position:absolute;right:var(--t16cwjje-0);top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;cursor:var(--t16cwjje-1);}
-.s1902pw9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding:var(--s1902pw9-0);height:var(--s1902pw9-1);width:var(--s1902pw9-2);cursor:var(--s1902pw9-3);opacity:var(--s1902pw9-4);background:var(--s1902pw9-5);border:0.5px solid var(--s1902pw9-6);border-radius:5px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s1902pw9:hover{border-color:var(--s1902pw9-7);}
+.s1902pw9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding:var(--s1902pw9-0);height:var(--s1902pw9-1);width:var(--s1902pw9-2);cursor:var(--s1902pw9-3);opacity:var(--s1902pw9-4);background-color:var(--s1902pw9-5);border:0.5px solid var(--s1902pw9-6);border-radius:5px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s1902pw9:hover{border-color:var(--s1902pw9-7);}
 .c179xo5d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:12px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
 .d60emtx{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;width:36px;height:36px;border:none;border-radius:4px;cursor:var(--d60emtx-0);opacity:var(--d60emtx-1);background-color:var(--d60emtx-2);border:var(--d60emtx-3);-webkit-transition:all 0.075s ease-in-out;transition:all 0.075s ease-in-out;}.d60emtx:hover:not(:disabled){background-color:var(--d60emtx-4);}.d60emtx:focus{outline:none;}
-.s1ecxi56{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding:var(--s1ecxi56-0);height:var(--s1ecxi56-1);width:var(--s1ecxi56-2);cursor:var(--s1ecxi56-3);opacity:var(--s1ecxi56-4);background:var(--s1ecxi56-5);border:0.5px solid var(--s1ecxi56-6);border-radius:4px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s1ecxi56:hover{border:0.5px solid var(--s1ecxi56-7);}
+.s1ecxi56{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;padding:var(--s1ecxi56-0);height:var(--s1ecxi56-1);width:var(--s1ecxi56-2);cursor:var(--s1ecxi56-3);opacity:var(--s1ecxi56-4);background-color:var(--s1ecxi56-5);border:0.5px solid var(--s1ecxi56-6);border-radius:4px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s1ecxi56:hover{border:0.5px solid var(--s1ecxi56-7);}
 .s14m69un{-webkit-flex:1;-ms-flex:1;flex:1;outline:none;border:none;background:transparent;padding:0;margin:0;height:var(--s14m69un-0);color:var(--s14m69un-1);font-size:var(--s14m69un-2);line-height:var(--s14m69un-3);font-weight:var(--s14m69un-4);font-family:var(--s14m69un-5);}.s14m69un:disabled{cursor:not-allowed;}.s14m69un::-webkit-input-placeholder{color:var(--s14m69un-6);}.s14m69un::-moz-placeholder{color:var(--s14m69un-6);}.s14m69un:-ms-input-placeholder{color:var(--s14m69un-6);}.s14m69un::placeholder{color:var(--s14m69un-6);}
 .sbfl8n6{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:var(--sbfl8n6-0);max-height:300px;width:var(--sbfl8n6-1);}
 .sk260f0{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;overflow-y:auto;min-height:0;width:var(--sk260f0-0);}
 .so10ras{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;width:100%;padding:8px;background:var(--so10ras-0);border:none;border-radius:4px;cursor:pointer;}.so10ras:hover{background-color:var(--so10ras-1);}.so10ras:focus{outline:none;background-color:var(--so10ras-1);}
 .poe2ind{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;width:100%;padding:8px;background:var(--poe2ind-0);border-radius:4px;border:none;cursor:pointer;}.poe2ind:hover{background-color:var(--poe2ind-1);}.poe2ind:focus{outline:none;background-color:var(--poe2ind-1);}
 .o9236d8{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
-.sf4kgcu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;gap:4px;padding:var(--sf4kgcu-0);height:var(--sf4kgcu-1);width:var(--sf4kgcu-2);cursor:var(--sf4kgcu-3);opacity:var(--sf4kgcu-4);background:var(--sf4kgcu-5);border:0.5px solid var(--sf4kgcu-6);border-radius:4px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.sf4kgcu:hover{border:0.5px solid var(--sf4kgcu-7);}
+.sf4kgcu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;gap:4px;padding:var(--sf4kgcu-0);height:var(--sf4kgcu-1);width:var(--sf4kgcu-2);cursor:var(--sf4kgcu-3);opacity:var(--sf4kgcu-4);background-color:var(--sf4kgcu-5);border:0.5px solid var(--sf4kgcu-6);border-radius:4px;-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.sf4kgcu:hover{border:0.5px solid var(--sf4kgcu-7);}
 .s15yoqwu{-webkit-flex:1;-ms-flex:1;flex:1;outline:none;border:none;background:transparent;padding:0;margin:0;height:var(--s15yoqwu-0);color:var(--s15yoqwu-1);font-size:var(--s15yoqwu-2);line-height:var(--s15yoqwu-3);font-weight:var(--s15yoqwu-4);font-family:var(--s15yoqwu-5);}.s15yoqwu:disabled{cursor:not-allowed;}.s15yoqwu::-webkit-input-placeholder{color:var(--s15yoqwu-6);}.s15yoqwu::-moz-placeholder{color:var(--s15yoqwu-6);}.s15yoqwu:-ms-input-placeholder{color:var(--s15yoqwu-6);}.s15yoqwu::placeholder{color:var(--s15yoqwu-6);}
 .m1wojn02{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:var(--m1wojn02-0);max-height:300px;width:var(--m1wojn02-1);}
 .m1ybiav6{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;overflow-y:auto;min-height:0;width:var(--m1ybiav6-0);}
@@ -110,21 +110,21 @@
 .m19ovajc{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:4px;min-height:var(--m19ovajc-0);width:var(--m19ovajc-1);background-color:var(--m19ovajc-2);border:0.5px solid var(--m19ovajc-3);border-radius:4px;padding:var(--m19ovajc-4);-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;cursor:var(--m19ovajc-5);opacity:var(--m19ovajc-6);}.m19ovajc:hover:not([data-disabled="true"]){border-color:var(--m19ovajc-7);}
 .s190irv4{-webkit-flex:1;-ms-flex:1;flex:1;min-width:80px;border:none;outline:none;background:transparent;color:var(--s190irv4-0);font-size:var(--s190irv4-1);line-height:var(--s190irv4-2);font-weight:var(--s190irv4-3);font-family:var(--s190irv4-4);}.s190irv4:disabled{cursor:not-allowed;}.s190irv4::-webkit-input-placeholder{color:var(--s190irv4-5);}.s190irv4::-moz-placeholder{color:var(--s190irv4-5);}.s190irv4:-ms-input-placeholder{color:var(--s190irv4-5);}.s190irv4::placeholder{color:var(--s190irv4-5);}
 .r1pzr59l{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;cursor:var(--r1pzr59l-0);opacity:var(--r1pzr59l-1);}
-.r1mwwvky{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;width:var(--r1mwwvky-0);height:var(--r1mwwvky-0);border-radius:50%;border:0.5px solid var(--r1mwwvky-1);background-color:var(--r1mwwvky-2);-webkit-transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;}.r1mwwvky:hover{border-color:var(--r1mwwvky-3);}
+.r1mwwvky{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;width:var(--r1mwwvky-0);height:var(--r1mwwvky-0);border-radius:50%;border:0.5px solid var(--r1mwwvky-1);background-color:var(--r1mwwvky-2);-webkit-transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out,background-color 0.075s ease-in-out;}
 .r137y8ev{width:var(--r137y8ev-0);height:var(--r137y8ev-0);border-radius:50%;background-color:var(--r137y8ev-1);opacity:var(--r137y8ev-2);-webkit-transform:var(--r137y8ev-3);-moz-transform:var(--r137y8ev-3);-ms-transform:var(--r137y8ev-3);transform:var(--r137y8ev-3);-webkit-transition:opacity 0.075s ease-in-out,-webkit-transform 0.075s ease-in-out;transition:opacity 0.075s ease-in-out,transform 0.075s ease-in-out;}
 .sbeizks{position:relative;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:var(--sbeizks-0);opacity:var(--sbeizks-1);}
-.s42jcip{position:relative;width:100%;height:3px;background:var(--s42jcip-0);border-radius:200px;}
+.s42jcip{position:relative;width:100%;height:var(--s42jcip-0);background-color:var(--s42jcip-1);border-radius:200px;}
 .s1b59sw7{position:absolute;left:0;top:0;height:100%;background:var(--s1b59sw7-0);border-radius:200px;z-index:1;}
-.salrebx{position:absolute;left:var(--salrebx-0);top:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:8px;height:8px;background:var(--salrebx-1);border-radius:50%;cursor:var(--salrebx-2);-webkit-transition:var(--salrebx-3);transition:var(--salrebx-3);z-index:3;pointer-events:var(--salrebx-4);}.salrebx:active{cursor:var(--salrebx-5);-webkit-transform:translate(-50%, -50%) scale(1.1);-moz-transform:translate(-50%, -50%) scale(1.1);-ms-transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(1.1);}.salrebx:hover{-webkit-transform:var(--salrebx-6);-moz-transform:var(--salrebx-6);-ms-transform:var(--salrebx-6);transform:var(--salrebx-6);}
+.salrebx{position:absolute;left:var(--salrebx-0);top:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:var(--salrebx-1);height:var(--salrebx-1);background:var(--salrebx-2);border-radius:50%;cursor:var(--salrebx-3);-webkit-transition:var(--salrebx-4);transition:var(--salrebx-4);z-index:3;pointer-events:var(--salrebx-5);}.salrebx:active{cursor:var(--salrebx-6);-webkit-transform:translate(-50%, -50%) scale(1.1);-moz-transform:translate(-50%, -50%) scale(1.1);-ms-transform:translate(-50%, -50%) scale(1.1);transform:translate(-50%, -50%) scale(1.1);}.salrebx:hover{-webkit-transform:var(--salrebx-7);-moz-transform:var(--salrebx-7);-ms-transform:var(--salrebx-7);transform:var(--salrebx-7);}
 .h1trli0w{position:absolute;opacity:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer;z-index:2;}
-.sx2momv{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--sx2momv-0);border:0.5px solid var(--sx2momv-1);border-radius:5px;padding:var(--sx2momv-2);height:var(--sx2momv-3);}
+.sx2momv{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sx2momv-0);border:0.5px solid var(--sx2momv-1);border-radius:5px;padding:var(--sx2momv-2);height:var(--sx2momv-3);}
 .s1pe4aqp{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px;padding:var(--s1pe4aqp-0);background:var(--s1pe4aqp-1);cursor:pointer;border:0.5px solid var(--s1pe4aqp-2);border-radius:4px;}
 .s1jhbbpd{outline:none;resize:none;min-height:var(--s1jhbbpd-0);width:var(--s1jhbbpd-1);height:var(--s1jhbbpd-2);-webkit-flex:var(--s1jhbbpd-3);-ms-flex:var(--s1jhbbpd-3);flex:var(--s1jhbbpd-3);background-color:var(--s1jhbbpd-4);border:0.5px solid var(--s1jhbbpd-5);border-radius:4px;color:var(--s1jhbbpd-6);font-size:var(--s1jhbbpd-7);line-height:var(--s1jhbbpd-8);font-weight:var(--s1jhbbpd-9);font-family:var(--s1jhbbpd-10);padding:var(--s1jhbbpd-11);-webkit-transition:border-color 0.075s ease-in-out;transition:border-color 0.075s ease-in-out;}.s1jhbbpd:hover:not(:disabled, :focus){border-color:var(--s1jhbbpd-12);}.s1jhbbpd:focus{border-color:var(--s1jhbbpd-13);}.s1jhbbpd:disabled{cursor:not-allowed;opacity:0.6;}.s1jhbbpd::-webkit-input-placeholder{color:var(--s1jhbbpd-14);}.s1jhbbpd::-moz-placeholder{color:var(--s1jhbbpd-14);}.s1jhbbpd:-ms-input-placeholder{color:var(--s1jhbbpd-14);}.s1jhbbpd::placeholder{color:var(--s1jhbbpd-14);}
 .tu0hnok{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:var(--tu0hnok-0);height:var(--tu0hnok-1);}
 .l48iv0n{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:4px;min-height:var(--l48iv0n-0);width:var(--l48iv0n-1);height:var(--l48iv0n-2);-webkit-flex:var(--l48iv0n-3);-ms-flex:var(--l48iv0n-3);flex:var(--l48iv0n-3);background-color:var(--l48iv0n-4);border:0.5px solid var(--l48iv0n-5);border-radius:4px;padding:var(--l48iv0n-6);}
 .t1t8zlu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:var(--t1t8zlu-0);opacity:var(--t1t8zlu-1);}
-.t1br7yd{position:relative;width:32px;height:18px;padding:1.5px;background:var(--t1br7yd-0);border:0.5px solid var(--t1br7yd-1);border-radius:200px;-webkit-transition:background-color 0.075s ease-out;transition:background-color 0.075s ease-out;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
-.t1xwadc7{position:absolute;left:var(--t1xwadc7-0);width:14px;height:14px;background:var(--t1xwadc7-1);border-radius:50%;-webkit-transition:left 0.075s ease-out;transition:left 0.075s ease-out;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1);}
+.t1br7yd{position:relative;width:var(--t1br7yd-0);height:var(--t1br7yd-1);padding:1.5px;background-color:var(--t1br7yd-2);border:0.5px solid var(--t1br7yd-3);border-radius:200px;-webkit-transition:background-color 0.075s ease-out;transition:background-color 0.075s ease-out;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
+.t1xwadc7{position:absolute;left:var(--t1xwadc7-0);width:var(--t1xwadc7-1);height:var(--t1xwadc7-1);background:var(--t1xwadc7-2);border-radius:50%;-webkit-transition:left 0.075s ease-out;transition:left 0.075s ease-out;border:0.5px solid var(--t1xwadc7-3);}
 .h1smouvb{position:absolute;opacity:0;width:0;height:0;margin:0;padding:0;pointer-events:none;}
 .l1o22m4p{height:auto;}
 .s1o45025{margin:0;padding-left:8px;list-style:none;}.s1o45025 li{position:relative;padding-left:16px;margin:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;}.s1o45025 li::before{content:"•";position:absolute;left:0;top:0;color:var(--s1o45025-0);font-weight:var(--s1o45025-1);line-height:inherit;}

package/dist/table/TableSelectCell.js

@@ -1,11 +1,12 @@
 import { TableDensity } from "./types.js";
-import CheckboxInput, { CheckboxInputSize } from "../inputs/CheckboxInput.js";
+import { InputSize } from "../inputs/Input.js";
+import CheckboxInput from "../inputs/CheckboxInput.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/table/TableSelectCell.tsx
 var DENSITY_TO_CHECKBOX_SIZE_MAP = {
-	[TableDensity.SMALL]: CheckboxInputSize.SMALL,
-	[TableDensity.MEDIUM]: CheckboxInputSize.MEDIUM,
-	[TableDensity.LARGE]: CheckboxInputSize.MEDIUM
+	[TableDensity.SMALL]: InputSize.SMALL,
+	[TableDensity.MEDIUM]: InputSize.MEDIUM,
+	[TableDensity.LARGE]: InputSize.LARGE
 };
 /**
 * Checkbox used by both the select-all header cell and each body row.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@galaxy-io/dls",
-  "version": "1.4.15",
+  "version": "1.5.0",
   "description": "Galaxy Design Language System",
   "license": "UNLICENSED",
   "type": "module",