@galaxy-io/dls 1.4.10 → 1.4.12

package/dist/inputs/TextAreaInput.js

@@ -10,12 +10,14 @@ 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";
@@ -146,6 +148,13 @@ var TEXTAREA_SIZE_TO_SHIMMER_HEIGHT_MAP = {
 	["MEDIUM"]: 14,
 	["LARGE"]: 16
 };
+/**
+* A multi-line text field. Not resizable by the user — size it with `lines`,
+* `height`, or `fillHeight`.
+*
+* 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) => {
 	const [state, setState] = useState(DEFAULT_STATE);
 	const handleFocus = (e) => {

package/dist/inputs/TextInput.d.ts

@@ -1,4 +1,11 @@
 import { type InputProps } from "./Input";
-type TextInputProps = Omit<InputProps<string>, "type" | "parse">;
+/** Every `InputProps` field except `type` and `parse`, which are fixed to text. */
+export type TextInputProps = Omit<InputProps<string>, "type" | "parse">;
+/**
+ * A single-line text field. The default input.
+ *
+ * `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.
+ */
 declare const TextInput: import("react").ForwardRefExoticComponent<TextInputProps & import("react").RefAttributes<HTMLInputElement>>;
 export default TextInput;

package/dist/inputs/TextInput.js

@@ -3,6 +3,12 @@ import { forwardRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/inputs/TextInput.tsx
 var DEFAULT_STATE = { error: "" };
+/**
+* A single-line text field. The default input.
+*
+* `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) => {
 	const [state, setState] = useState(DEFAULT_STATE);
 	const handleFocus = () => {

package/dist/inputs/ToggleInput.d.ts

@@ -1,11 +1,22 @@
 export interface ToggleInputProps {
+    /** Label rendered above the switch, like the other inputs. */
     label?: string;
+    /** Adds an info icon beside the label with this content on hover. */
     labelTooltip?: string | React.ReactNode;
+    /** Controlled state. The switch holds none of its own. */
     value: boolean;
     onChange: (value: boolean) => void;
     isDisabled?: boolean;
+    /** A number is px. Ignored when `fillWidth` is set. */
     width?: number | string;
+    /** Stretch to the parent's width, pushing the switch to the right edge. */
     fillWidth?: boolean;
 }
+/**
+ * An on/off switch. Fully controlled — you own `value`.
+ *
+ * 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;
 export default ToggleInput;

package/dist/inputs/ToggleInput.js

@@ -44,6 +44,12 @@ var HiddenInput = /*#__PURE__*/ styled("input")({
 	class: "h1smouvb",
 	propsAsIs: false
 });
+/**
+* An on/off switch. Fully controlled — you own `value`.
+*
+* 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 }) => {
 	const handleClick = useCallback(() => {
 		if (!isDisabled) onChange(!value);

package/dist/lists/BulletedList.d.ts

@@ -1,11 +1,15 @@
+/** Item text size — maps onto the matching `TextSize` step. */
 export declare enum BulletedListSize {
     SMALL = "SMALL",
     MEDIUM = "MEDIUM",
     LARGE = "LARGE"
 }
 export interface BulletedListProps {
+    /** One string per bullet. Plain text only — no nesting, no rich content. */
     items: string[];
+    /** @default BulletedListSize.MEDIUM */
     size?: BulletedListSize;
 }
+/** An unordered list of plain strings, each rendered through `Text`. */
 declare const BulletedList: ({ items, size }: BulletedListProps) => import("react").JSX.Element;
 export default BulletedList;

package/dist/lists/BulletedList.js

@@ -20,6 +20,7 @@ var StyledBulletedListItem = /*#__PURE__*/ styled("li")({
 	class: "s13x8jj4",
 	propsAsIs: false
 });
+/** Item text size — maps onto the matching `TextSize` step. */
 var BulletedListSize = /* @__PURE__ */ function(BulletedListSize) {
 	BulletedListSize["SMALL"] = "SMALL";
 	BulletedListSize["MEDIUM"] = "MEDIUM";
@@ -31,6 +32,7 @@ var BULLETED_LIST_SIZE_TO_TEXT_SIZE_MAP = {
 	["MEDIUM"]: TextSize.BODY_MD,
 	["LARGE"]: TextSize.BODY_LG
 };
+/** An unordered list of plain strings, each rendered through `Text`. */
 var BulletedList = ({ items, size = "MEDIUM" }) => {
 	return /* @__PURE__ */ jsx(StyledBulletedList, { children: items.map((item, index) => /* @__PURE__ */ jsx(StyledBulletedListItem, { children: /* @__PURE__ */ jsx(Text, {
 		size: BULLETED_LIST_SIZE_TO_TEXT_SIZE_MAP[size],

package/dist/modal/Modal.d.ts

@@ -1,7 +1,15 @@
 import { type PropsWithChildren } from "react";
 export interface ModalProps {
+    /** Controlled visibility. The modal has no open state of its own. */
     open: boolean;
+    /** Called on Escape and on backdrop click. */
     onClose: () => void;
 }
+/**
+ * A centered dialog over a dimmed backdrop. Fully controlled — you own `open`.
+ *
+ * Stacking and Escape handling come from `OverlayProvider`, so only the topmost
+ * overlay closes on Escape. Wrap your app in that provider.
+ */
 declare const Modal: ({ open, onClose, children }: PropsWithChildren<ModalProps>) => import("react").ReactPortal;
 export default Modal;

package/dist/modal/Modal.js

@@ -28,6 +28,12 @@ var ModalContentWrapper = /*#__PURE__*/ styled("div")({
 	class: "m1jgo9vf",
 	propsAsIs: false
 });
+/**
+* A centered dialog over a dimmed backdrop. Fully controlled — you own `open`.
+*
+* Stacking and Escape handling come from `OverlayProvider`, so only the topmost
+* overlay closes on Escape. Wrap your app in that provider.
+*/
 var Modal = ({ open, onClose, children }) => {
 	const { zIndex, isTopmost } = useOverlay(onClose, open, { layer: OverlayLayer.MODAL });
 	const handleContentClick = useCallback((e) => {

package/dist/overlay/OverlayProvider.d.ts

@@ -1,5 +1,6 @@
 import { type PropsWithChildren } from "react";
 import { OverlayLayer } from "./constants";
+/** One registered overlay in the stack. */
 export interface OverlayEntry {
     id: string;
     onDismiss: () => void;
@@ -7,8 +8,11 @@ export interface OverlayEntry {
     dismissOnOverlayClick: boolean;
     zIndex: number;
 }
+/** Options for `useOverlay`'s third argument. */
 export interface OverlayRegisterOptions {
+    /** Stacking tier. Modals always sit above drawers. @default OverlayLayer.MODAL */
     layer?: OverlayLayer;
+    /** Call `onDismiss` when the shared backdrop is clicked. */
     dismissOnOverlayClick?: boolean;
 }
 export interface OverlayInfo {
@@ -21,6 +25,13 @@ export interface OverlayContextValue {
     overlays: OverlayEntry[];
 }
 export declare const OverlayContext: import("react").Context<OverlayContextValue | null>;
+/**
+ * Coordinates every `Modal` and `Drawer` on the page. Mount it once near the
+ * root, above anything that opens an overlay.
+ *
+ * Renders one shared backdrop for the whole stack and routes Escape to the
+ * topmost overlay only, so nesting a modal over a drawer behaves.
+ */
 export declare const OverlayProvider: ({ children }: PropsWithChildren) => import("react").JSX.Element;
 export default OverlayProvider;
 export { getOverlayZIndex, OVERLAY_LAYER_PRIORITY, OVERLAY_Z_INDEX, OVERLAY_Z_INDEX_BASE, OVERLAY_Z_INDEX_STEP, OverlayLayer, } from "./constants";

package/dist/overlay/OverlayProvider.js

@@ -28,6 +28,13 @@ var SharedOverlay = withTheme(/*#__PURE__*/ styled("div")({
 		"s1hpu3t7-6": [_exp7()]
 	}
 }));
+/**
+* Coordinates every `Modal` and `Drawer` on the page. Mount it once near the
+* root, above anything that opens an overlay.
+*
+* Renders one shared backdrop for the whole stack and routes Escape to the
+* topmost overlay only, so nesting a modal over a drawer behaves.
+*/
 var OverlayProvider = ({ children }) => {
 	const [overlays, setOverlays] = useState([]);
 	const zIndexCounterRef = useRef(0);

package/dist/overlay/constants.d.ts

@@ -1,3 +1,4 @@
+/** Which stacking tier an overlay belongs to. Modals always sit above drawers. */
 export declare enum OverlayLayer {
     DRAWER = "DRAWER",
     MODAL = "MODAL"

package/dist/overlay/constants.js

@@ -1,4 +1,5 @@
 //#region src/overlay/constants.ts
+/** Which stacking tier an overlay belongs to. Modals always sit above drawers. */
 var OverlayLayer = /* @__PURE__ */ function(OverlayLayer) {
 	OverlayLayer["DRAWER"] = "DRAWER";
 	OverlayLayer["MODAL"] = "MODAL";

package/dist/overlay/useOverlay.d.ts

@@ -1,7 +1,18 @@
 import { type OverlayRegisterOptions } from "./OverlayProvider";
 export interface UseOverlayReturn {
+    /** The z-index to render this overlay at. Assigned by its position in the stack. */
     zIndex: number;
+    /** True when nothing is stacked above. Only the topmost overlay should act on Escape. */
     isTopmost: boolean;
 }
+/**
+ * Registers an overlay in the global stack and returns its z-index and whether
+ * it's on top. `Modal` and `Drawer` use it internally — reach for it only when
+ * building your own overlay that must interleave correctly with theirs.
+ *
+ * Registration follows `enabled`, so pass your `open` flag straight through.
+ * Falls back to a computed top-of-stack z-index when there's no
+ * `OverlayProvider`, so it degrades rather than throwing.
+ */
 export declare const useOverlay: (onDismiss: () => void, enabled: boolean, options?: OverlayRegisterOptions) => UseOverlayReturn;
 export default useOverlay;

package/dist/overlay/useOverlay.js

@@ -2,6 +2,15 @@ import { OVERLAY_Z_INDEX_BASE } from "./constants.js";
 import { OverlayContext } from "./OverlayProvider.js";
 import { useContext, useEffect, useId } from "react";
 //#region src/overlay/useOverlay.ts
+/**
+* Registers an overlay in the global stack and returns its z-index and whether
+* it's on top. `Modal` and `Drawer` use it internally — reach for it only when
+* building your own overlay that must interleave correctly with theirs.
+*
+* Registration follows `enabled`, so pass your `open` flag straight through.
+* Falls back to a computed top-of-stack z-index when there's no
+* `OverlayProvider`, so it degrades rather than throwing.
+*/
 var useOverlay = (onDismiss, enabled, options) => {
 	const context = useContext(OverlayContext);
 	const id = useId();

package/dist/resizable/HorizontalResizeHandle.d.ts

@@ -1,10 +1,17 @@
 import type { Icon as PhosphorIcon } from "@phosphor-icons/react";
-interface HorizontalResizeHandleProps {
+export interface HorizontalResizeHandleProps {
+    /** Not implemented — the component ignores it. */
     icon?: PhosphorIcon;
     onMouseDown?: (e: React.MouseEvent<HTMLDivElement>) => void;
     onMouseUp?: (e: React.MouseEvent<HTMLDivElement>) => void;
     onMouseMove?: (e: React.MouseEvent<HTMLDivElement>) => void;
     onMouseEnter?: (e: React.MouseEvent<HTMLDivElement>) => void;
 }
+/**
+ * The grab bar for resizing a pane vertically (it spans horizontally, dragging
+ * up and down). Absolutely positioned — give it a `position: relative` parent.
+ *
+ * Presentation only: wire the handlers to `useResize` to move anything.
+ */
 declare const HorizontalResizeHandle: ({ onMouseDown, onMouseUp, onMouseMove, onMouseEnter, }: HorizontalResizeHandleProps) => import("react").JSX.Element;
 export default HorizontalResizeHandle;

package/dist/resizable/HorizontalResizeHandle.js

@@ -20,6 +20,12 @@ var HorizontalResizeHandleStyled = withTheme(/*#__PURE__*/ styled("div")({
 		"hvnpu6g-4": [_exp5()]
 	}
 }));
+/**
+* The grab bar for resizing a pane vertically (it spans horizontally, dragging
+* up and down). Absolutely positioned — give it a `position: relative` parent.
+*
+* Presentation only: wire the handlers to `useResize` to move anything.
+*/
 var HorizontalResizeHandle = ({ onMouseDown, onMouseUp, onMouseMove, onMouseEnter }) => {
 	return /* @__PURE__ */ jsx(HorizontalResizeHandleStyled, {
 		onMouseDown,

package/dist/resizable/VerticalResizeHandle.d.ts

@@ -1,5 +1,6 @@
 import type { Icon as PhosphorIcon } from "@phosphor-icons/react";
-interface VerticalResizeHandleProps {
+export interface VerticalResizeHandleProps {
+    /** Not implemented — the component ignores it. */
     icon?: PhosphorIcon;
     onMouseDown?: (e: React.MouseEvent<HTMLDivElement>) => void;
     onMouseUp?: (e: React.MouseEvent<HTMLDivElement>) => void;
@@ -7,5 +8,11 @@ interface VerticalResizeHandleProps {
     onMouseEnter?: (e: React.MouseEvent<HTMLDivElement>) => void;
     onMouseLeave?: (e: React.MouseEvent<HTMLDivElement>) => void;
 }
+/**
+ * The grab bar for resizing a pane horizontally (it spans vertically, dragging
+ * left and right). Absolutely positioned — give it a `position: relative` parent.
+ *
+ * Presentation only: wire the handlers to `useResize` to move anything.
+ */
 declare const VerticalResizeHandle: ({ onMouseDown, onMouseUp, onMouseMove, onMouseEnter, onMouseLeave, }: VerticalResizeHandleProps) => import("react").JSX.Element;
 export default VerticalResizeHandle;

package/dist/resizable/VerticalResizeHandle.js

@@ -20,6 +20,12 @@ var VerticalResizeHandleStyled = withTheme(/*#__PURE__*/ styled("div")({
 		"v1ha5e5c-4": [_exp5()]
 	}
 }));
+/**
+* The grab bar for resizing a pane horizontally (it spans vertically, dragging
+* left and right). Absolutely positioned — give it a `position: relative` parent.
+*
+* Presentation only: wire the handlers to `useResize` to move anything.
+*/
 var VerticalResizeHandle = ({ onMouseDown, onMouseUp, onMouseMove, onMouseEnter, onMouseLeave }) => {
 	return /* @__PURE__ */ jsx(VerticalResizeHandleStyled, {
 		onMouseDown,

package/dist/shapes/Circle.d.ts

@@ -1,6 +1,9 @@
-interface CircleProps {
+export interface CircleProps {
+    /** Diameter. A number is px. */
     size: number | string;
+    /** Fill color. @default theme.color.text.tertiary */
     hex?: string;
 }
+/** A filled dot. Used for status indicators and legend swatches. */
 declare const Circle: ({ size, hex }: CircleProps) => import("react").JSX.Element;
 export default Circle;

package/dist/shapes/Circle.js

@@ -15,6 +15,7 @@ var CircleWrapper = withTheme(/*#__PURE__*/ styled("div")({
 		"cmbdg2q-1": [_exp3()]
 	}
 }));
+/** A filled dot. Used for status indicators and legend swatches. */
 var Circle = ({ size, hex }) => {
 	return /* @__PURE__ */ jsx(CircleWrapper, {
 		$size: size,

package/dist/shapes/Square.d.ts

@@ -1,6 +1,9 @@
-interface SquareProps {
+export interface SquareProps {
+    /** Side length. A number is px. */
     size: number | string;
+    /** Fill color. @default theme.color.text.tertiary */
     hex?: string;
 }
+/** A filled square. Used for legend swatches and color chips. */
 declare const Square: ({ size, hex }: SquareProps) => import("react").JSX.Element;
 export default Square;

package/dist/shapes/Square.js

@@ -15,6 +15,7 @@ var SquareWrapper = withTheme(/*#__PURE__*/ styled("div")({
 		"s1ibzzfh-1": [_exp3()]
 	}
 }));
+/** A filled square. Used for legend swatches and color chips. */
 var Square = ({ size, hex }) => {
 	return /* @__PURE__ */ jsx(SquareWrapper, {
 		$size: size,

package/dist/styles.css

@@ -24,16 +24,16 @@
 .c1hcga6s{position:relative;display:var(--c1hcga6s-0);-webkit-flex-direction:var(--c1hcga6s-1);-ms-flex-direction:var(--c1hcga6s-1);flex-direction:var(--c1hcga6s-1);-webkit-align-items:var(--c1hcga6s-2);-webkit-box-align:var(--c1hcga6s-2);-ms-flex-align:var(--c1hcga6s-2);align-items:var(--c1hcga6s-2);-webkit-box-pack:var(--c1hcga6s-3);-ms-flex-pack:var(--c1hcga6s-3);-webkit-justify-content:var(--c1hcga6s-3);justify-content:var(--c1hcga6s-3);width:var(--c1hcga6s-4);min-width:0;height:var(--c1hcga6s-5);min-height:0;}
 .c1fvbgkp{position:relative;width:var(--c1fvbgkp-0);min-width:0;aspect-ratio:var(--c1fvbgkp-1);height:var(--c1fvbgkp-2);-webkit-flex:var(--c1fvbgkp-3);-ms-flex:var(--c1fvbgkp-3);flex:var(--c1fvbgkp-3);min-height:var(--c1fvbgkp-4);}
 .c10uj5yt{display:block;overflow:visible;}
-.cyuty3o[data-active="true"] rect,.cyuty3o[data-active="true"] path,.cyuty3o[data-active="true"] circle{transition-delay:0ms;}
-.c1ob2op2{opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.c1ob2op2[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.c1ob2op2{-webkit-transition:none;transition:none;}}
-.c8c506o{fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.c8c506o[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.c8c506o{-webkit-transition:none;transition:none;}}
-.ceqlpek{stroke:none;pointer-events:none;opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.ceqlpek[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.ceqlpek{-webkit-transition:none;transition:none;}}
-.c1fcbddl{pointer-events:none;opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.c1fcbddl[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.c1fcbddl{-webkit-transition:none;transition:none;}}
-.cpcxr59{opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.cpcxr59[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.cpcxr59{-webkit-transition:none;transition:none;}}
+.cyuty3o{opacity:1;}.cyuty3o[data-state="muted"]{opacity:0.1;}.cyuty3o[data-state="dimmed"]{opacity:0.4;}
+.c1ob2op2{fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;opacity:1;}.c1ob2op2[data-state="muted"]{opacity:0.1;}.c1ob2op2[data-state="dimmed"]{opacity:0.4;}
+.c8c506o{stroke:none;pointer-events:none;opacity:1;}.c8c506o[data-state="muted"]{opacity:0.1;}.c8c506o[data-state="dimmed"]{opacity:0.4;}
+.ceqlpek{pointer-events:none;opacity:1;}.ceqlpek[data-state="muted"]{opacity:0.1;}.ceqlpek[data-state="dimmed"]{opacity:0.4;}
+.c1fcbddl{opacity:1;}.c1fcbddl[data-state="muted"]{opacity:0.1;}.c1fcbddl[data-state="dimmed"]{opacity:0.4;}
+.cpcxr59{fill:transparent;outline:none;}
 .c1wvzvu4{fill:transparent;outline:none;}
-.c17guewt{fill:transparent;outline:none;}
-.cblgiyf{stroke:var(--cblgiyf-0);shape-rendering:crispEdges;}
-.c1lr03cc{stroke:var(--c1lr03cc-0);pointer-events:none;}
+.c17guewt{stroke:var(--c17guewt-0);shape-rendering:crispEdges;}
+.cblgiyf{stroke:var(--cblgiyf-0);pointer-events:none;}
+.c1lr03cc{fill:var(--c1lr03cc-0);pointer-events:none;}
 .cizy1s8{overflow:visible;pointer-events:none;}
 .c1ukq11d{position:absolute;z-index:10;pointer-events:none;left:var(--c1ukq11d-0);top:var(--c1ukq11d-1);min-width:168px;max-width:320px;padding:10px 12px;border:0.5px solid var(--c1ukq11d-2);border-radius:6px;background-color:var(--c1ukq11d-3);opacity:var(--c1ukq11d-4);-webkit-transition:opacity 100ms ease-in-out,left 100ms ease-out,top 100ms ease-out;transition:opacity 100ms ease-in-out,left 100ms ease-out,top 100ms ease-out;}@media (prefers-reduced-motion: reduce){.c1ukq11d{-webkit-transition:none;transition:none;}}
 .cwcko2m{display:-ms-grid;display:grid;-ms-grid-columns:minmax(0, 1fr) auto;grid-template-columns:minmax(0, 1fr) auto;-webkit-column-gap:16px;column-gap:16px;row-gap:6px;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;}
@@ -41,11 +41,11 @@
 .c1iaray{text-align:right;white-space:nowrap;}
 .cz6jod1{position:absolute;left:var(--cz6jod1-0);top:var(--cz6jod1-1);width:var(--cz6jod1-2);height:var(--cz6jod1-2);-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);pointer-events:none;text-align:center;}
 .c1de5mqk{position:absolute;top:38%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);max-width:60%;padding:6px 8px;border:0.5px solid var(--c1de5mqk-0);border-radius:6px;background-color:var(--c1de5mqk-1);pointer-events:none;text-align:center;}
-.cjirv6a{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:var(--cjirv6a-0);-ms-flex-direction:var(--cjirv6a-0);flex-direction:var(--cjirv6a-0);-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:var(--cjirv6a-1);-webkit-box-align:var(--cjirv6a-1);-ms-flex-align:var(--cjirv6a-1);align-items:var(--cjirv6a-1);-webkit-box-pack:var(--cjirv6a-2);-ms-flex-pack:var(--cjirv6a-2);-webkit-justify-content:var(--cjirv6a-2);justify-content:var(--cjirv6a-2);gap:var(--cjirv6a-3);width:var(--cjirv6a-4);min-width:var(--cjirv6a-5);height:var(--cjirv6a-6);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;padding-top:var(--cjirv6a-7);padding-left:var(--cjirv6a-8);}.cjirv6a[data-active="true"] [data-state]{transition-delay:0ms;}
-.c1armna5{position:absolute;visibility:hidden;pointer-events:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:var(--c1armna5-0);-ms-flex-direction:var(--c1armna5-0);flex-direction:var(--c1armna5-0);-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:var(--c1armna5-1);-webkit-box-align:var(--c1armna5-1);-ms-flex-align:var(--c1armna5-1);align-items:var(--c1armna5-1);gap:var(--c1armna5-2);width:-webkit-max-content;width:-moz-max-content;width:max-content;height:-webkit-max-content;height:-moz-max-content;height:max-content;white-space:nowrap;}
-.cgd77rv{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;gap:8px;max-height:208px;overflow-y:auto;}.cgd77rv[data-active="true"] [data-state]{transition-delay:0ms;}
-.cutidpi{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;gap:6px;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:default;border-radius:2px;opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.cutidpi[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.cutidpi{-webkit-transition:none;transition:none;}}.cutidpi:focus-visible{outline:1.5px solid currentColor;outline-offset:2px;}
-.ccpczg{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;gap:6px;opacity:1;-webkit-transition:opacity 100ms ease-in-out 200ms;transition:opacity 100ms ease-in-out 200ms;}.ccpczg[data-state="muted"]{opacity:0.1;}@media (prefers-reduced-motion: reduce){.ccpczg{-webkit-transition:none;transition:none;}}
+.cjirv6a{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:var(--cjirv6a-0);-ms-flex-direction:var(--cjirv6a-0);flex-direction:var(--cjirv6a-0);-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:var(--cjirv6a-1);-webkit-box-align:var(--cjirv6a-1);-ms-flex-align:var(--cjirv6a-1);align-items:var(--cjirv6a-1);-webkit-box-pack:var(--cjirv6a-2);-ms-flex-pack:var(--cjirv6a-2);-webkit-justify-content:var(--cjirv6a-2);justify-content:var(--cjirv6a-2);width:var(--cjirv6a-3);min-width:var(--cjirv6a-4);height:var(--cjirv6a-5);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;padding-top:var(--cjirv6a-6);padding-left:var(--cjirv6a-7);}
+.c1armna5{position:absolute;visibility:hidden;pointer-events:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:var(--c1armna5-0);-ms-flex-direction:var(--c1armna5-0);flex-direction:var(--c1armna5-0);-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:var(--c1armna5-1);-webkit-box-align:var(--c1armna5-1);-ms-flex-align:var(--c1armna5-1);align-items:var(--c1armna5-1);width:-webkit-max-content;width:-moz-max-content;width:max-content;height:-webkit-max-content;height:-moz-max-content;height:max-content;white-space:nowrap;}
+.cgd77rv{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;max-height:208px;overflow-y:auto;}
+.cutidpi{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;gap:6px;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;border:0;padding:var(--cutidpi-0);margin:0;font:inherit;color:inherit;cursor:default;border-radius:2px;opacity:1;}.cutidpi[data-state="muted"]{opacity:0.1;}.cutidpi[data-state="dimmed"]{opacity:0.4;}.cutidpi:focus-visible{outline:1.5px solid currentColor;outline-offset:2px;}
+.ccpczg{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;gap:6px;padding:var(--ccpczg-0);opacity:1;}.ccpczg[data-state="muted"]{opacity:0.1;}.ccpczg[data-state="dimmed"]{opacity:0.4;}
 .cmbdg2q{width:var(--cmbdg2q-0);height:var(--cmbdg2q-0);border-radius:50%;background-color:var(--cmbdg2q-1);}
 .tbnx4ok{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;}
 .tjda4tq{display:inline-block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content;padding:var(--tjda4tq-0);background-color:var(--tjda4tq-1);border:var(--tjda4tq-2);border-radius:5px;}

package/dist/table/InfiniteSpreadsheet.d.ts

@@ -2,5 +2,12 @@ import { type InfiniteSpreadsheetProps } from "./types";
 export { ColumnAlign, ColumnPin, ColumnResizeMode, TableDensity, TableVariant } from "./types";
 export type { ColumnSizingState, EditingCell, InfiniteSpreadsheetProps, Row, SpreadsheetColumnAction, SpreadsheetColumnDef, SpreadsheetHeaderAction, SpreadsheetRowAction, SpreadsheetRowsContext, } from "./types";
 export { CellEnrichmentStatus, SpreadsheetCellType } from "./types";
+/**
+ * An editable grid — cell-level editing, keyboard navigation between cells, and
+ * per-row actions, over the same infinite-scroll machinery as `InfiniteTable`.
+ *
+ * Reach for this when cells are inputs. When the data is read-only, the tables
+ * are lighter.
+ */
 declare function InfiniteSpreadsheet<TData>(props: InfiniteSpreadsheetProps<TData>): import("react").JSX.Element;
 export default InfiniteSpreadsheet;

package/dist/table/InfiniteSpreadsheet.js

@@ -18,6 +18,13 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { PlusIcon } from "@phosphor-icons/react";
 import { useVirtualizer } from "@tanstack/react-virtual";
 //#region src/table/InfiniteSpreadsheet.tsx
+/**
+* An editable grid — cell-level editing, keyboard navigation between cells, and
+* per-row actions, over the same infinite-scroll machinery as `InfiniteTable`.
+*
+* Reach for this when cells are inputs. When the data is read-only, the tables
+* are lighter.
+*/
 function InfiniteSpreadsheet(props) {
 	const { columns, totalRowCount, getRowData, getRowId, height, width, fillWidth, fillHeight, density = TableDensity.MEDIUM, variant = TableVariant.PRIMARY, estimateRowHeight, overscan = 25, hasNextPage, isFetchingNextPage, fetchNextPage, isLoading = false, isError = false, error, loadingRowCount = 5, contentWhenEmpty, contentWhenError, noHeader = false, noLastRowBorder = false, noLastRowPadding = false, enableColumnResizing = true, columnSizing, defaultColumnSizing, onColumnSizingChange, columnResizeMode = ColumnResizeMode.ON_CHANGE, ariaLabel, ariaLabelledBy, onAddColumn, addColumnAriaLabel = "Add column", rowActions, getRowActionsAriaLabel, editingCell: controlledEditingCell, onEditingCellChange, enableRowFocus = true } = props;
 	const scrollContainerRef = useRef(null);

package/dist/table/InfiniteTable.d.ts

@@ -4,6 +4,14 @@ import { type InfiniteTableProps } from "./types";
 export { ColumnAlign, ColumnPin, ColumnResizeMode, TableDensity, TableVariant } from "./types";
 export type { ColumnDef, ColumnSizingState, EstimateColumnWidthOptions, InfiniteTableProps, Row, } from "./types";
 export { estimateColumnWidth } from "./utils";
+/**
+ * A data table with infinite scroll, sorting, row selection, expandable rows and
+ * resizable columns. Define the shape with `ColumnDef[]`; `TData` is inferred
+ * from your row type.
+ *
+ * Renders every loaded row. Past a few thousand rows reach for
+ * `VirtualizedInfiniteTable`, which shares the same column and row API.
+ */
 declare function InfiniteTable<TData>(props: InfiniteTableProps<TData>): React.JSX.Element;
 export default InfiniteTable;
 export type { TanstackTable as Table };

package/dist/table/InfiniteTable.js

@@ -18,6 +18,14 @@ import React, { useCallback, useEffect, useId, useMemo, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { flexRender, getCoreRowModel, getExpandedRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
 //#region src/table/InfiniteTable.tsx
+/**
+* A data table with infinite scroll, sorting, row selection, expandable rows and
+* resizable columns. Define the shape with `ColumnDef[]`; `TData` is inferred
+* from your row type.
+*
+* Renders every loaded row. Past a few thousand rows reach for
+* `VirtualizedInfiniteTable`, which shares the same column and row API.
+*/
 function InfiniteTable(props) {
 	const { columns, data, getRowId, height, width, fillWidth, fillHeight, density = TableDensity.MEDIUM, variant = TableVariant.PRIMARY, hasNextPage, isFetchingNextPage, fetchNextPage, enableRowSelection, enableMultiRowSelection = true, rowSelection, defaultRowSelection, onRowSelectionChange, onSelectedRowsChange, showSelectionColumn = false, selectionColumnPin = ColumnPin.LEFT, enableSelectAll, enableSelectionRange = true, selectAllAriaLabel = "Select all rows", getRowSelectAriaLabel, enableSorting = false, enableMultiSort = false, sorting, onSortingChange, manualSorting = false, isLoading = false, isError = false, error, loadingRowCount = 5, contentWhenEmpty, contentWhenError, noHeader = false, noLastRowBorder = false, noLastRowPadding = false, onRowClick, onRowDoubleClick, onRowActivate, onRowExpand, expandedRowIds, defaultExpandedRowIds, onExpandedChange, getRowCanExpand, enableMultiRowExpansion = true, showExpandColumn = true, expandColumnPin = ColumnPin.LEFT, enableColumnResizing = false, columnSizing, defaultColumnSizing, onColumnSizingChange, columnResizeMode = ColumnResizeMode.ON_CHANGE, ariaLabel, ariaLabelledBy, getRowAriaLabel, enableRowFocus, onTableReady } = props;
 	const instanceId = useId();

package/dist/table/VirtualizedInfiniteTable.d.ts

@@ -8,5 +8,12 @@ export type { ColumnDef, ColumnSizingState, Row, VirtualizedInfiniteTableProps }
  * resolves.
  */
 export type InfiniteTableProps<TData> = VirtualizedInfiniteTableProps<TData>;
+/**
+ * `InfiniteTable` with row virtualization — only the visible window is in the
+ * DOM, so it stays responsive at tens of thousands of rows.
+ *
+ * The trade is a fixed row height and no natural content sizing. Prefer plain
+ * `InfiniteTable` until row count actually becomes the problem.
+ */
 declare function VirtualizedInfiniteTable<TData>(props: VirtualizedInfiniteTableProps<TData>): React.JSX.Element;
 export default VirtualizedInfiniteTable;

package/dist/table/VirtualizedInfiniteTable.js

@@ -42,6 +42,13 @@ function VirtualizedRowInner({ rowData, rowIndex, translateY, rowHeight, density
 	});
 }
 var VirtualizedRow = React.memo(VirtualizedRowInner);
+/**
+* `InfiniteTable` with row virtualization — only the visible window is in the
+* DOM, so it stays responsive at tens of thousands of rows.
+*
+* The trade is a fixed row height and no natural content sizing. Prefer plain
+* `InfiniteTable` until row count actually becomes the problem.
+*/
 function VirtualizedInfiniteTable(props) {
 	const { columns, totalRowCount, getRowData, getRowId, height, width, fillWidth, fillHeight, density = TableDensity.MEDIUM, variant = TableVariant.PRIMARY, estimateRowHeight, overscan = 25, hasNextPage, isFetchingNextPage, fetchNextPage, isLoading = false, isError = false, error, loadingRowCount = 5, contentWhenEmpty, contentWhenError, noHeader = false, noLastRowBorder = false, noLastRowPadding = false, enableColumnResizing = false, columnSizing, defaultColumnSizing, onColumnSizingChange, columnResizeMode = ColumnResizeMode.ON_CHANGE, ariaLabel, ariaLabelledBy, onRowClick } = props;
 	const scrollContainerRef = useRef(null);

package/dist/text/Bold.d.ts

@@ -1,3 +1,7 @@
 import type { PropsWithChildren } from "react";
+/**
+ * Bumps its children to the medium weight. Nest it inside a `Text` to emphasize
+ * part of a string — DLS has only two weights, so this is as bold as type gets.
+ */
 declare const Bold: ({ children }: PropsWithChildren) => import("react").JSX.Element;
 export default Bold;

package/dist/text/Bold.js

@@ -10,6 +10,10 @@ var StyledBoldText = withTheme(/*#__PURE__*/ styled("span")({
 	propsAsIs: false,
 	vars: { "s10i74tu-0": [_exp()] }
 }));
+/**
+* Bumps its children to the medium weight. Nest it inside a `Text` to emphasize
+* part of a string — DLS has only two weights, so this is as bold as type gets.
+*/
 var Bold = ({ children }) => {
 	return /* @__PURE__ */ jsx(StyledBoldText, { children });
 };

package/dist/text/Code.d.ts

@@ -1,3 +1,7 @@
 import type { PropsWithChildren } from "react";
+/**
+ * Inline code — mono family on a tinted, hairline-bordered chip. Nest it inside
+ * a `Text` for identifiers and literals in prose.
+ */
 declare const Code: ({ children }: PropsWithChildren) => import("react").JSX.Element;
 export default Code;

package/dist/text/Code.js

@@ -20,6 +20,10 @@ var StyledCodeText = withTheme(/*#__PURE__*/ styled("span")({
 		"sdpyy92-4": [_exp5()]
 	}
 }));
+/**
+* Inline code — mono family on a tinted, hairline-bordered chip. Nest it inside
+* a `Text` for identifiers and literals in prose.
+*/
 var Code = ({ children }) => {
 	return /* @__PURE__ */ jsx(StyledCodeText, { children });
 };

package/dist/text/EditableText.d.ts

@@ -1,7 +1,16 @@
 import { type TextProps } from "./Text";
-type EditableTextProps = TextProps & {
+export type EditableTextProps = TextProps & {
+    /** Current text. Also the value the field resets to on cancel. */
     label: string;
+    /** Called with the new text when the edit is committed. */
     onSave: (text: string) => void;
 };
+/**
+ * Click-to-edit text. Renders as `Text` until clicked, then swaps to an inline
+ * input. Accepts every `TextProps` styling prop on top of its own.
+ *
+ * Holds the draft internally and only calls `onSave` on commit, so it works as
+ * an uncontrolled field — `label` is the starting value, not a bound one.
+ */
 declare const EditableText: ({ label, onSave, size, variant, weight, align, isMonospace, ...textProps }: EditableTextProps) => import("react").JSX.Element;
 export default EditableText;

package/dist/text/EditableText.js

@@ -50,6 +50,13 @@ var EditableTextText = withTheme(/*#__PURE__*/ styled("span")({
 	propsAsIs: false,
 	vars: { "e1j2x5d3-0": [_exp9()] }
 }));
+/**
+* Click-to-edit text. Renders as `Text` until clicked, then swaps to an inline
+* input. Accepts every `TextProps` styling prop on top of its own.
+*
+* Holds the draft internally and only calls `onSave` on commit, so it works as
+* an uncontrolled field — `label` is the starting value, not a bound one.
+*/
 var EditableText = ({ label, onSave, size = TextSize.BODY_MD, variant = TextVariant.PRIMARY, weight = TextWeight.REGULAR, align = "left", isMonospace = false, ...textProps }) => {
 	const [state, setState] = useState(() => ({
 		localLabel: label,

package/dist/text/Ellipsis.d.ts

@@ -1,10 +1,12 @@
 export interface EllipsisProps {
+    /** Animate the dots. Static when false. */
     isPulse?: boolean;
-    /**
-     * The speed of the pulse animation in seconds.
-     * @default 1.4
-     */
+    /** Duration of one pulse cycle in seconds. @default 1 */
     speed?: number;
 }
+/**
+ * Three dots that pulse in sequence — the "…thinking" affordance. Renders the
+ * literal characters, so it aligns with adjacent text rather than a spinner.
+ */
 declare const Ellipsis: ({ isPulse, speed }: EllipsisProps) => import("react").JSX.Element;
 export default Ellipsis;

package/dist/text/Ellipsis.js

@@ -13,6 +13,10 @@ var StyledEllipsis = /*#__PURE__*/ styled("span")({
 		"szfsuud-1": [_exp2()]
 	}
 });
+/**
+* Three dots that pulse in sequence — the "…thinking" affordance. Renders the
+* literal characters, so it aligns with adjacent text rather than a spinner.
+*/
 var Ellipsis = ({ isPulse = false, speed = 1 }) => {
 	return /* @__PURE__ */ jsxs(StyledEllipsis, {
 		$isPulse: isPulse,