@stridge/kit 0.1.0-alpha.0

package/dist/shared/ui/Select/Select.d.ts

@@ -0,0 +1,243 @@
+import { SelectVariant } from "./Select.context.js";
+import { ComponentProps, ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { Select } from "@base-ui/react/select";
+
+//#region src/shared/ui/Select/Select.d.ts
+/**
+ * Root of the select compound. Wraps Base UI's `Select.Root` and provides the shared
+ * {@link SelectContext} so child parts (`Select.Trigger`, `Select.Content`, `Select.Item`) can
+ * read the active `variant` without prop-drilling.
+ *
+ * @template Value The type of each selectable option value.
+ * @template Multiple Whether multi-select is enabled. Defaults to `false`.
+ */
+declare function Select$1<Value, Multiple extends boolean | undefined = false>({
+  variant,
+  ...props
+}: Select$1.Props<Value, Multiple>): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Groups a set of `Select.Item` and `Select.Label` elements for accessibility and layout.
+ * Wraps Base UI's `Select.Group`.
+ */
+declare function SelectGroup(props: Select$1.GroupProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Displays the currently selected value inside `Select.Trigger`. When `placeholder` is provided
+ * and no value is selected, renders the placeholder text instead. Wraps Base UI's `Select.Value`.
+ */
+declare function SelectValue({
+  placeholder,
+  className,
+  style,
+  ...props
+}: Select$1.ValueProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Button that opens the select dropdown. Reads `variant` from {@link SelectContext} to apply
+ * `outline` or `tile` chrome. Wraps Base UI's `Select.Trigger`.
+ */
+declare function SelectTrigger({
+  children,
+  className,
+  style,
+  ...props
+}: Select$1.TriggerProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Static, non-interactive trigger surface — same chrome as `Select.Trigger`
+ * but without dropdown behaviour. Useful when a row should look like a
+ * Select but the host has no change handler wired (read-only display).
+ *
+ * Pass `variant` directly; this part isn't a child of `<Select>`, so it
+ * can't read context.
+ */
+declare function SelectStaticTrigger({
+  variant,
+  children,
+  className,
+  style,
+  ...props
+}: Select$1.StaticTriggerProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Portals its children outside the current DOM subtree. Wraps Base UI's `Select.Portal`.
+ * Automatically composed by {@link Select.Content} — mount separately only for custom layering.
+ */
+declare function SelectPortal(props: Select$1.PortalProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Positions the select popup relative to its trigger. Wraps Base UI's `Select.Positioner`.
+ * Automatically composed by {@link Select.Content}.
+ */
+declare function SelectPositioner(props: Select$1.PositionerProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Dropdown popup containing the list of items. Composes {@link Select.Portal}, `KitPortalScope`,
+ * and {@link Select.Positioner} with a {@link ScrollArea} viewport so callers only need this part.
+ *
+ * Defaults: `position="popper"`, `side="bottom"`, `align="center"`, `sideOffset=4`,
+ * `scrollArrows=true`.
+ */
+declare function SelectContent({
+  position,
+  side,
+  align,
+  sideOffset,
+  scrollArrows,
+  className,
+  style,
+  children,
+  ...props
+}: Select$1.PopupProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Accessible label for a `Select.Group`. Wraps Base UI's `Select.GroupLabel` and is automatically
+ * associated with its sibling group.
+ */
+declare function SelectLabel({
+  className,
+  style,
+  ...props
+}: Select$1.LabelProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Selectable option inside `Select.Content`. Reads `variant` from {@link SelectContext} to apply
+ * `outline` or `tile` item chrome. Wraps Base UI's `Select.Item`.
+ */
+declare function SelectItem({
+  children,
+  className,
+  style,
+  ...props
+}: Select$1.ItemProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Non-interactive sibling of {@link SelectItem} for catalog rows that should
+ * stay visible but unselectable. Rendered as a plain `<div>` outside Base UI's
+ * composite list — arrow keys / typeahead / click skip it entirely — but
+ * `role="option"` + `aria-disabled="true"` keep the listbox a11y intact for
+ * screen readers. Visual treatment matches the regular item (same chrome,
+ * dimmed). Use this from compound widgets when the underlying item is in the
+ * catalog but the merchant hasn't enabled it for this flow.
+ */
+declare function SelectDisabledItem({
+  children,
+  className,
+  style,
+  ...props
+}: Select$1.DisabledItemProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Visual divider between groups or items inside `Select.Content`. Wraps Base UI's
+ * `Select.Separator`.
+ */
+declare function SelectSeparator({
+  className,
+  style,
+  ...props
+}: Select$1.SeparatorProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Scroll-up affordance that appears at the top of `Select.Content` when the popup overflows.
+ * Wraps Base UI's `Select.ScrollUpArrow`. Rendered automatically by {@link Select.Content} when
+ * `scrollArrows` is `true`.
+ */
+declare function SelectScrollUpButton({
+  className,
+  style,
+  ...props
+}: Select$1.ScrollUpButtonProps): _$react_jsx_runtime0.JSX.Element;
+/**
+ * Scroll-down affordance that appears at the bottom of `Select.Content` when the popup overflows.
+ * Wraps Base UI's `Select.ScrollDownArrow`. Rendered automatically by {@link Select.Content} when
+ * `scrollArrows` is `true`.
+ */
+declare function SelectScrollDownButton({
+  className,
+  style,
+  ...props
+}: Select$1.ScrollDownButtonProps): _$react_jsx_runtime0.JSX.Element;
+declare namespace Select$1 {
+  /**
+   * Visual style applied to the trigger and dropdown.
+   *
+   * - `outline` (default): bordered input surface, fixed 36px height.
+   * - `tile`: selectable-tile surface + card border + tile radius. Full
+   *   width by default; sized for asset-row contexts (~44px tall).
+   */
+  type Variant = SelectVariant;
+  type Props<Value, Multiple extends boolean | undefined = false> = Select.Root.Props<Value, Multiple> & {
+    /**
+     * Visual style applied to the trigger and dropdown. Propagated to child parts via
+     * {@link SelectContext}.
+     *
+     * @default "outline"
+     */
+    variant?: Variant;
+  };
+  type GroupProps = Select.Group.Props;
+  type ItemTextProps = Select.ItemText.Props;
+  type ItemIndicatorProps = Select.ItemIndicator.Props;
+  type PortalProps = Select.Portal.Props;
+  type PositionerProps = Select.Positioner.Props;
+  type TriggerProps = Select.Trigger.Props;
+  type ItemProps = Select.Item.Props;
+  type LabelProps = Select.GroupLabel.Props;
+  type SeparatorProps = Select.Separator.Props;
+  type ScrollUpButtonProps = Select.ScrollUpArrow.Props;
+  type ScrollDownButtonProps = Select.ScrollDownArrow.Props;
+  type StaticTriggerProps = Omit<ComponentProps<"div">, "children"> & {
+    variant?: Variant;
+    children?: ReactNode;
+  };
+  type DisabledItemProps = Omit<ComponentProps<"div">, "children" | "role" | "aria-disabled" | "aria-selected"> & {
+    children?: ReactNode;
+  };
+  type PopupProps = Select.Popup.Props & {
+    /**
+     * Side of the trigger the popup appears on.
+     *
+     * @default "bottom"
+     */
+    side?: Select.Positioner.Props["side"];
+    /**
+     * Alignment of the popup along the cross axis.
+     *
+     * @default "center"
+     */
+    align?: Select.Positioner.Props["align"];
+    /**
+     * Gap in pixels between the popup and the trigger element.
+     *
+     * @default 4
+     */
+    sideOffset?: Select.Positioner.Props["sideOffset"];
+    /**
+     * Positioning strategy for the popup.
+     *
+     * - `"popper"` (default): positions relative to the trigger using floating-UI rules.
+     * - `"item-aligned"`: aligns the selected item with the trigger (`alignItemWithTrigger`).
+     *
+     * @default "popper"
+     */
+    position?: "popper" | "item-aligned";
+    /**
+     * Whether to render the up/down scroll-arrow buttons that appear
+     * when the popup overflows. Defaults to `true`. Set to `false` to
+     * rely on native scrollbar / wheel / keyboard scrolling instead.
+     */
+    scrollArrows?: boolean;
+  };
+  type ValueProps = Select.Value.Props & {
+    /**
+     * Text displayed when no value is selected. When provided, `Select.Value` switches to a
+     * render-prop form that shows the placeholder only when the selection is empty.
+     */
+    placeholder?: string;
+  };
+  const Group: typeof SelectGroup;
+  const Value: typeof SelectValue;
+  const Trigger: typeof SelectTrigger;
+  const StaticTrigger: typeof SelectStaticTrigger;
+  const Portal: typeof SelectPortal;
+  const Positioner: typeof SelectPositioner;
+  const Content: typeof SelectContent;
+  const Label: typeof SelectLabel;
+  const Item: typeof SelectItem;
+  const DisabledItem: typeof SelectDisabledItem;
+  const Separator: typeof SelectSeparator;
+  const ScrollUpButton: typeof SelectScrollUpButton;
+  const ScrollDownButton: typeof SelectScrollDownButton;
+}
+//#endregion
+export { Select$1 as Select };

package/dist/shared/ui/Select/Select.js

@@ -0,0 +1 @@
+"use client";import{KitPortalScope as e}from"../../../scope/KitPortalScope.js";import"../../../scope/index.js";import{ChevronDownIcon as t}from"../../icons/ChevronDownIcon.js";import{ChevronUpIcon as n}from"../../icons/ChevronUpIcon.js";import"../../../icons/index.js";import{joinClassNames as r}from"../../utils/joinClassNames.js";import{mergeClassName as i}from"../../utils/mergeClassName.js";import{mergeStyle as a}from"../../utils/mergeStyle.js";import{ScrollArea as o}from"../ScrollArea/ScrollArea.js";import"../ScrollArea/index.js";import{DEFAULT_SELECT_CONTEXT as s,SelectContext as c,useSelectContext as l}from"./Select.context.js";import{SELECT_SLOTS as u}from"./Select.slots.js";import{styles as d}from"./Select.styles.js";import{jsx as f,jsxs as p}from"react/jsx-runtime";import*as m from"@stylexjs/stylex";import{Select as h}from"@base-ui/react/select";function g({variant:e=s.variant,...t}){return f(c.Provider,{value:{variant:e},children:f(h.Root,{"data-stridge-slot":u.root,...t})})}function _(e){return f(h.Group,{"data-stridge-slot":u.group,...e})}function v({placeholder:e,className:t,style:n,...r}){let o=m.props(d.value),s=m.props(d.value,d.placeholder);return e?f(h.Value,{render:(c,{value:l})=>(Array.isArray(l)?l.length>0:l!=null)?f(h.Value,{"data-stridge-slot":u.value,...r,className:i(o.className,t),style:a(o.style,n)}):f(`span`,{"data-stridge-slot":u.value,...s,children:e}),...r}):f(h.Value,{"data-stridge-slot":u.value,...r,className:i(o.className,t),style:a(o.style,n)})}function y({children:e,className:n,style:r,...o}){let{variant:s}=l(),c=m.props(d.triggerBase,s===`tile`?d.triggerTile:d.triggerOutline),g=m.props(d.triggerContent),_=m.props(d.iconBase,s===`tile`?d.iconTile:d.iconOutline);return p(h.Trigger,{"data-stridge-slot":u.trigger,...o,className:i(c.className,n),style:a(c.style,r),children:[f(`span`,{...g,children:e}),f(h.Icon,{children:f(t,{"data-stridge-slot":u.icon,..._})})]})}function b({variant:e=s.variant,children:n,className:i,style:a,...o}){let c=m.props(d.triggerBase,e===`tile`?d.triggerTile:d.triggerOutline,d.triggerStatic),l=m.props(d.triggerContent),h=m.props(d.iconBase,e===`tile`?d.iconTile:d.iconOutline);return p(`div`,{"data-stridge-slot":u.staticTrigger,...o,className:r(c.className,i),style:{...c.style,...a},children:[f(`span`,{...l,children:n}),f(t,{"data-stridge-slot":u.icon,"aria-hidden":!0,...h})]})}function x(e){return f(h.Portal,{"data-stridge-slot":u.portal,...e})}function S(e){return f(h.Positioner,{"data-stridge-slot":u.positioner,...e,...m.props(d.positioner)})}function C({position:t=`popper`,side:n=`bottom`,align:s=`center`,sideOffset:c=4,scrollArrows:g=!0,className:_,style:v,children:y,...b}){let{variant:C}=l(),w=m.props(d.popupBase,C===`tile`?d.popupTile:d.popupOutline),T=m.props(d.popupScrollArea),E=m.props(d.popupViewport);return f(x,{children:f(e,{children:p(S,{align:s,alignItemWithTrigger:t===`item-aligned`,side:n,sideOffset:c,children:[g?f(O,{}):null,f(h.Popup,{"data-stridge-slot":u.content,...b,render:e=>{let{children:t,className:n,style:i,...a}=e;return p(o,{className:T.className,style:T.style,children:[f(o.Viewport,{...a,className:r(E.className,n),style:{...E.style,...i},children:t}),f(o.Scrollbar,{orientation:`vertical`,children:f(o.Thumb,{})})]})},className:i(w.className,_),style:a(w.style,v),children:y}),g?f(k,{}):null]})})})}function w({className:e,style:t,...n}){let r=m.props(d.label);return f(h.GroupLabel,{"data-stridge-slot":u.label,...n,className:i(r.className,e),style:a(r.style,t)})}function T({children:e,className:t,style:n,...r}){let{variant:o}=l(),s=m.props(d.itemBase,o===`tile`?d.itemTile:d.itemOutline),c=m.props(d.itemText);return f(h.Item,{"data-stridge-slot":u.item,...r,className:i(s.className,t),style:a(s.style,n),children:f(h.ItemText,{...c,children:e})})}function E({children:e,className:t,style:n,...i}){let{variant:a}=l(),o=m.props(d.itemBase,a===`tile`?d.itemTile:d.itemOutline,d.itemDisabled),s=m.props(d.itemText);return f(`div`,{role:`option`,"aria-disabled":`true`,"aria-selected":`false`,tabIndex:-1,"data-stridge-slot":u.item,"data-disabled":``,...i,className:r(o.className,t),style:{...o.style,...n},children:f(`span`,{...s,children:e})})}function D({className:e,style:t,...n}){let r=m.props(d.separator);return f(h.Separator,{"data-stridge-slot":u.separator,...n,className:i(r.className,e),style:a(r.style,t)})}function O({className:e,style:t,...r}){let o=m.props(d.scrollButton,d.scrollUpButton),s=m.props(d.scrollIcon);return f(h.ScrollUpArrow,{"data-stridge-slot":u.scrollUpButton,...r,className:i(o.className,e),style:a(o.style,t),children:f(n,{...s})})}function k({className:e,style:n,...r}){let o=m.props(d.scrollButton,d.scrollDownButton),s=m.props(d.scrollIcon);return f(h.ScrollDownArrow,{"data-stridge-slot":u.scrollDownButton,...r,className:i(o.className,e),style:a(o.style,n),children:f(t,{...s})})}(function(e){e.Group=_,e.Value=v,e.Trigger=y,e.StaticTrigger=b,e.Portal=x,e.Positioner=S,e.Content=C,e.Label=w,e.Item=T,e.DisabledItem=E,e.Separator=D,e.ScrollUpButton=O,e.ScrollDownButton=k})(g||={});export{g as Select};

package/dist/shared/ui/Select/Select.slots.d.ts

@@ -0,0 +1,20 @@
+//#region src/shared/ui/Select/Select.slots.d.ts
+declare const SELECT_SLOTS: {
+  readonly root: "select";
+  readonly group: "select-group";
+  readonly value: "select-value";
+  readonly trigger: "select-trigger";
+  readonly staticTrigger: "select-static-trigger";
+  readonly icon: "select-icon";
+  readonly portal: "select-portal";
+  readonly positioner: "select-positioner";
+  readonly content: "select-content";
+  readonly label: "select-label";
+  readonly item: "select-item";
+  readonly separator: "select-separator";
+  readonly scrollUpButton: "select-scroll-up-button";
+  readonly scrollDownButton: "select-scroll-down-button";
+};
+type SelectSlot = (typeof SELECT_SLOTS)[keyof typeof SELECT_SLOTS];
+//#endregion
+export { SELECT_SLOTS, SelectSlot };

package/dist/shared/ui/Select/Select.slots.js

@@ -0,0 +1 @@
+const e={root:`select`,group:`select-group`,value:`select-value`,trigger:`select-trigger`,staticTrigger:`select-static-trigger`,icon:`select-icon`,portal:`select-portal`,positioner:`select-positioner`,content:`select-content`,label:`select-label`,item:`select-item`,separator:`select-separator`,scrollUpButton:`select-scroll-up-button`,scrollDownButton:`select-scroll-down-button`};export{e as SELECT_SLOTS};

package/dist/shared/ui/Select/Select.styles.js

@@ -0,0 +1 @@
+const e={triggerBase:{"Select__styles.triggerBase":`Select__styles.triggerBase`,"display-k1xSpc":`x3nfvp2`,"alignItems-kGNEyG":`x6s0dn4`,"gap-kOIVth":`x1a6yh9e`,"fontFamily-kMv6JI":`xlaww2m`,"fontSize-kGuDYH":`x14qa7mu`,"lineHeight-kLWn49":`x14vj8e1`,"whiteSpace-khDVqt":`xuxw1ft`,"userSelect-kfSwDN":`x87ps6o`,"cursor-kkrTdU":`xt0e3qv`,"outline-kI3sdo":`x1a2a7pz`,"textAlign-k9WMMc":`x1yc453h`,"transitionProperty-k1ekBW":`xk3iem4`,"transitionDuration-kIyJzY":`xx6bhzk`,"transitionTimingFunction-kAMwcw":`x9lcvmn`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:24`},triggerStatic:{"Select__styles.triggerStatic":`Select__styles.triggerStatic`,"cursor-kkrTdU":`xt0e3qv`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:40`},triggerContent:{"Select__styles.triggerContent":`Select__styles.triggerContent`,"display-k1xSpc":`x78zum5`,"alignItems-kGNEyG":`x6s0dn4`,"gap-kOIVth":`x1a6yh9e`,"flex-kUk6DE":`x98rzlu`,"minWidth-k7Eaqz":`xeuugli`,"textAlign-k9WMMc":`x1yc453h`,"overflow-kVQacm":`xb3r6kr`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:43`},triggerOutline:{"Select__styles.triggerOutline":`Select__styles.triggerOutline`,"width-kzqmXN":`xeq5yr9`,"height-kZKoxP":`xc9qbxq`,"paddingInlineStart-kZCmMZ":`x1qntkwk`,"paddingInlineEnd-kwRFfy":`xzfcf9p`,"borderWidth-kMzoRj":`xmkeg23`,"borderStyle-ksu8eU":`x1y0btm7`,"borderColor-kVAM5u":`x12c9lpl`,"borderRadius-kaIpWk":`x12ur2as`,"backgroundColor-kWkggS":`x1ofs3es x1i3dt4k`,"color-kMwMTN":`xzn0pkc`,"boxShadow-kGVxlE":`xzh026d`,"transitionProperty-k1ekBW":`x11vqxbs`,"transitionDuration-kIyJzY":`xx6bhzk`,"transitionTimingFunction-kAMwcw":`x9lcvmn`,":focus-visible_borderColor-kOJeXU":`x1mt3fz5`,":focus-visible_boxShadow-kEtg5x":`x159teg`,"[data-disabled]_pointerEvents-k7dGCq":`x7gqb9v`,"[data-disabled]_opacity-kncrQb":`x1szrgyu`,"[aria-invalid=true]_borderColor-kmuzpH":`x1e0f7l1`,"[aria-invalid=true]:focus-visible_borderColor-kAVsxs":`xu6psuv`,"[aria-invalid=true]:focus-visible_boxShadow-kfN9lc":`xsklecs`,"[aria-invalid=true][data-popup-open]_borderColor-krGkLy":`x13rkwjk`,"[aria-invalid=true][data-popup-open]_boxShadow-kt7deA":`xyy5omr`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:52`},triggerTile:{"Select__styles.triggerTile":`Select__styles.triggerTile`,"width-kzqmXN":`xh8yej3`,"paddingTop-kLKAdn":`xzi3mdb`,"paddingBottom-kGO01o":`xxbrewl`,"paddingInline-kg3NbH":`xqin4a2`,"borderWidth-kMzoRj":`xmkeg23`,"borderStyle-ksu8eU":`x1y0btm7`,"borderColor-kVAM5u":`x1bue7yx`,"borderRadius-kaIpWk":`xi9trdq`,"backgroundColor-kWkggS":`xsdq91f xjl87wc`,"color-kMwMTN":`xzn0pkc`,"cursor-kkrTdU":`x1ypdohk`,"transitionProperty-k1ekBW":`x11vqxbs`,"transitionDuration-kIyJzY":`xx6bhzk`,"transitionTimingFunction-kAMwcw":`x9lcvmn`,":focus-visible_borderColor-kOJeXU":`x1mt3fz5`,":focus-visible_boxShadow-kEtg5x":`x159teg`,"[data-disabled]_pointerEvents-k7dGCq":`x7gqb9v`,"[aria-invalid=true]_borderColor-kmuzpH":`x1e0f7l1`,"[aria-invalid=true]:focus-visible_borderColor-kAVsxs":`xu6psuv`,"[aria-invalid=true]:focus-visible_boxShadow-kfN9lc":`xsklecs`,"[aria-invalid=true][data-popup-open]_borderColor-krGkLy":`x13rkwjk`,"[aria-invalid=true][data-popup-open]_boxShadow-kt7deA":`xyy5omr`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:90`},value:{"Select__styles.value":`Select__styles.value`,"display-k1xSpc":`x78zum5`,"alignItems-kGNEyG":`x6s0dn4`,"minWidth-k7Eaqz":`xeuugli`,"gap-kOIVth":`x1a6yh9e`,"overflow-kVQacm":`xb3r6kr`,"textOverflow-kg5iWk":`xlyipyv`,"whiteSpace-khDVqt":`xuxw1ft`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:127`},placeholder:{"Select__styles.placeholder":`Select__styles.placeholder`,"color-kMwMTN":`xi96bwj`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:136`},iconBase:{"Select__styles.iconBase":`Select__styles.iconBase`,"display-k1xSpc":`x1lliihq`,"flexShrink-kmuXW":`x2lah0s`,"transitionProperty-k1ekBW":`x11xpdln`,"transitionDuration-kIyJzY":`x13dflua`,"transitionTimingFunction-kAMwcw":`x9lcvmn`,"[data-popup-open] &_transform-k5abDR":`x1c3rhtc`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:139`},iconOutline:{"Select__styles.iconOutline":`Select__styles.iconOutline`,"width-kzqmXN":`x1kky2od`,"height-kZKoxP":`xlup9mm`,"color-kMwMTN":`xi96bwj`,"opacity-kSiTet":`xbyyjgo`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:149`},iconTile:{"Select__styles.iconTile":`Select__styles.iconTile`,"width-kzqmXN":`xsmyaan`,"height-kZKoxP":`x1kpxq89`,"color-kMwMTN":`xdksllq`,"strokeWidth-kfJifR":`xhr4kjn`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:155`},positioner:{"Select__styles.positioner":`Select__styles.positioner`,"zIndex-kY2c9j":`x1x47hvv`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:161`},popupBase:{"Select__styles.popupBase":`Select__styles.popupBase`,"position-kVAEAm":`x1n2onr6`,"minWidth-k7Eaqz":`x80t9vs`,"maxHeight-kskxy":`x1ko6lg0`,"overflowX-kXHlph":`x6ikm8r`,"overflowY-kORKVm":`x1odjw0f`,"padding-kmVPX3":`x1ljrego`,"borderWidth-kMzoRj":`xmkeg23`,"borderStyle-ksu8eU":`x1y0btm7`,"boxShadow-kGVxlE":`x1lo0mqj`,"transformOrigin-k3nNDw":`xctpfpq`,"outline-kI3sdo":`x1a2a7pz`,"[data-open]_animationName-k6MjMx":`x1v7ye95`,"[data-open]_animationDuration-kQT8Nr":`x6qscqp`,"[data-open]_animationTimingFunction-kGrMy9":`xec0cv`,"[data-open]_@media (prefers-reduced-motion: reduce)_animationName-kkMe6y":`x1fxewv3`,"[data-open]_@media (prefers-reduced-motion: reduce)_animationDuration-kUsvFl":`xslpr3k`,"[data-closed]_animationName-khiDtg":`x130u89k`,"[data-closed]_animationDuration-kfqKPr":`x1ej03p1`,"[data-closed]_animationTimingFunction-kBIjI2":`x1gv3vh9`,"[data-closed]_@media (prefers-reduced-motion: reduce)_animationName-kng8EN":`x1cha3i4`,"[data-closed]_@media (prefers-reduced-motion: reduce)_animationDuration-kX5ucw":`xgx5xwo`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:164`},popupScrollArea:{"Select__styles.popupScrollArea":`Select__styles.popupScrollArea`,"width-kzqmXN":`xezivpi`,"height-kZKoxP":`xt7dq6l`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:195`},popupViewport:{"Select__styles.popupViewport":`Select__styles.popupViewport`,"width-kzqmXN":`xh8yej3`,"maxWidth-ks0D6T":`x193iq5w`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:199`},popupOutline:{"Select__styles.popupOutline":`Select__styles.popupOutline`,"borderColor-kVAM5u":`x12c9lpl`,"borderRadius-kaIpWk":`x12ur2as`,"backgroundColor-kWkggS":`x1gdua1s`,"color-kMwMTN":`xqk8w4k`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:203`},popupTile:{"Select__styles.popupTile":`Select__styles.popupTile`,"borderColor-kVAM5u":`x1bue7yx`,"borderRadius-kaIpWk":`xi9trdq`,"backgroundColor-kWkggS":`x1gdua1s`,"color-kMwMTN":`xqk8w4k`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:209`},itemBase:{"Select__styles.itemBase":`Select__styles.itemBase`,"position-kVAEAm":`x1n2onr6`,"display-k1xSpc":`x78zum5`,"alignItems-kGNEyG":`x6s0dn4`,"width-kzqmXN":`xh8yej3`,"gap-kOIVth":`x1a6yh9e`,"paddingInlineStart-kZCmMZ":`xpsy26f`,"paddingInlineEnd-kwRFfy":`xy51phz`,"fontFamily-kMv6JI":`xlaww2m`,"fontSize-kGuDYH":`x14qa7mu`,"lineHeight-kLWn49":`x14vj8e1`,"cursor-kkrTdU":`xt0e3qv`,"userSelect-kfSwDN":`x87ps6o`,"outline-kI3sdo":`x1a2a7pz`,"color-kMwMTN":`xqk8w4k`,"textAlign-k9WMMc":`x1yc453h`,"[data-disabled]_pointerEvents-k7dGCq":`x7gqb9v`,"[data-disabled]_opacity-kncrQb":`x1szrgyu`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:215`},itemOutline:{"Select__styles.itemOutline":`Select__styles.itemOutline`,"minHeight-kAzted":`x21xpn4`,"paddingTop-kLKAdn":`xq38ur3`,"paddingBottom-kGO01o":`x1hli9g4`,"borderRadius-kaIpWk":`x143j3yi`,":focus_backgroundColor-kL3a3j":`x12wwdwo`,":focus_color-kabz5l":`x1gfp9c8`,"[data-highlighted]_backgroundColor-kRQljQ":`xr6bgp2`,"[data-highlighted]_color-kEenPV":`x163giyb`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:236`},itemTile:{"Select__styles.itemTile":`Select__styles.itemTile`,"minHeight-kAzted":`x1ba4aug`,"paddingTop-kLKAdn":`x1y1aw1k`,"paddingBottom-kGO01o":`xwib8y2`,"borderRadius-kaIpWk":`x1s7mj9v`,":focus_backgroundColor-kL3a3j":`x91zbg9`,":focus_color-kabz5l":`x1gfp9c8`,"[data-highlighted]_backgroundColor-kRQljQ":`xevhoj0`,"[data-highlighted]_color-kEenPV":`x163giyb`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:250`},itemDisabled:{"Select__styles.itemDisabled":`Select__styles.itemDisabled`,"cursor-kkrTdU":`x1h6gzvc`,"opacity-kSiTet":`xyd83as`,"color-kMwMTN":`xi96bwj`,"backgroundColor-kWkggS":`xjbqb8w`,":hover_backgroundColor-kGzVvX":`x1n5bzlp`,":hover_color-kDPRdz":`xib2ewr`,":focus_backgroundColor-kL3a3j":`xyc4ar7`,":focus_color-kabz5l":`x1thzfav`,":focus-visible_backgroundColor-kJX3Yn":`x14rb9jf`,":focus-visible_color-kTyn8Z":`xk1skjw`,":active_backgroundColor-kSReZ0":`xyftt0y`,":active_color-kc7ZrP":`x1u0pxdh`,"[data-disabled]_pointerEvents-k7dGCq":`x1sw4l06`,"[data-disabled]_opacity-kncrQb":`x11xjgb3`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:277`},itemText:{"Select__styles.itemText":`Select__styles.itemText`,"display-k1xSpc":`x78zum5`,"alignItems-kGNEyG":`x6s0dn4`,"gap-kOIVth":`x1a6yh9e`,"minWidth-k7Eaqz":`xeuugli`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:303`},label:{"Select__styles.label":`Select__styles.label`,"paddingTop-kLKAdn":`xq38ur3`,"paddingBottom-kGO01o":`x1hli9g4`,"paddingInline-kg3NbH":`xxztuhb`,"color-kMwMTN":`xi96bwj`,"fontFamily-kMv6JI":`xlaww2m`,"fontSize-kGuDYH":`x1oae1zf`,"lineHeight-kLWn49":`x14vj8e1`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:309`},separator:{"Select__styles.separator":`Select__styles.separator`,"height-kZKoxP":`xjm9jq1`,"marginTop-keoZOQ":`x1p5pg8g`,"marginBottom-k1K539":`x1782xsq`,"marginInline-kUOVxO":`x1mqxmvn`,"backgroundColor-kWkggS":`x136i1dt`,"pointerEvents-kfzvcC":`x47corl`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:318`},scrollButton:{"Select__styles.scrollButton":`Select__styles.scrollButton`,"position-kVAEAm":`x1n2onr6`,"zIndex-kY2c9j":`xfa8aoj`,"display-k1xSpc":`x78zum5`,"alignItems-kGNEyG":`x6s0dn4`,"justifyContent-kjj79g":`xl56j7k`,"width-kzqmXN":`xh8yej3`,"height-kZKoxP":`xxk0z11`,"minHeight-kAzted":`xjwf9q1`,"borderWidth-kMzoRj":`xmkeg23`,"borderStyle-ksu8eU":`x1y0btm7`,"borderColor-kVAM5u":`x12c9lpl`,"backgroundColor-kWkggS":`x1gdua1s`,"color-kMwMTN":`xqk8w4k`,"textAlign-k9WMMc":`x2b8uid`,"cursor-kkrTdU":`xt0e3qv`,"::before_position-kEoFBp":`x1hmns74`,"::before_insetInlineStart-kSJ0CW":`x1682cnc`,"::before_width-kOlAkY":`x1rmj1tg`,"::before_height-kgzTxl":`xszcg87`,"::before_content-kgeoSG":`x10tli2e`,"::before_pointerEvents-km8f2m":`xkk1bqk`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:326`},scrollUpButton:{"Select__styles.scrollUpButton":`Select__styles.scrollUpButton`,"borderBottomWidth-kt9PQ7":`x1qhh985`,"borderStartStartRadius-krdFHd":`x1d6sz28`,"borderStartEndRadius-kfmiAY":`x1982ebo`,"[data-direction=up]::before_top-kmeIDP":`x1yuh1d4`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:351`},scrollDownButton:{"Select__styles.scrollDownButton":`Select__styles.scrollDownButton`,"bottom-krVfgx":`x1ey2m1c`,"borderTopWidth-kEafiO":`x972fbf`,"borderEndStartRadius-kVL7Gh":`x1n8kxja`,"borderEndEndRadius-kT0f0o":`x8xpvqr`,"[data-direction=down]::before_bottom-kr3AeW":`xzs8kq4`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:359`},scrollIcon:{"Select__styles.scrollIcon":`Select__styles.scrollIcon`,"display-k1xSpc":`x1lliihq`,"width-kzqmXN":`x1kky2od`,"height-kZKoxP":`xlup9mm`,$$css:`@stridge/kit:src/shared/ui/Select/Select.styles.ts:368`}};export{e as styles};

package/dist/shared/ui/Select/index.d.ts

@@ -0,0 +1,3 @@
+import { SelectVariant } from "./Select.context.js";
+import { Select } from "./Select.js";
+import { SELECT_SLOTS, SelectSlot } from "./Select.slots.js";

package/dist/shared/ui/Select/index.js

@@ -0,0 +1 @@
+import"./Select.slots.js";import"./Select.js";

package/dist/shared/ui/SelectableTile/SelectableTile.d.ts

@@ -0,0 +1,83 @@
+import { CSSProperties, HTMLAttributes, MouseEventHandler, ReactNode, Ref } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/shared/ui/SelectableTile/SelectableTile.d.ts
+type SelectableTileShape = "card" | "pill";
+/**
+ * Selectable surface. Use `shape="card"` for full-width rows, `shape="pill"`
+ * for equal-width chips.
+ *
+ * The interactive form renders Base UI's `Toggle` — a button that carries
+ * `aria-pressed` semantics and integrates with `<SelectableTileGroup>`'s
+ * roving-tabindex / arrow-key navigation. Pass a `value` to participate in
+ * a group's shared selection state; the parent group derives `pressed` from
+ * its `value` array (single-select with `multiple={false}`, multi-select
+ * otherwise). Outside a group, drive the visual state via `selected` and
+ * the click via `onClick`.
+ *
+ * The inert form (no `onClick`) renders a `<div role="option">` with
+ * `aria-selected` so showcase / static surfaces (asset-list previews,
+ * fixture-only flows) still convey selection without the button affordance.
+ */
+declare function SelectableTile({
+  selected,
+  shape,
+  interactive: interactiveProp,
+  disabled,
+  onClick,
+  value,
+  className,
+  style,
+  children,
+  ...props
+}: SelectableTile.Props): _$react_jsx_runtime0.JSX.Element;
+declare namespace SelectableTile {
+  /**
+   * Common attributes accepted by both the interactive (`button`) and inert (`div`) forms.
+   * Typed against `HTMLElement` so the prop bag stays valid for either branch.
+   *
+   * `role` is omitted because the inert form pins `role="option"` to keep `aria-selected`
+   * valid; the interactive form uses Base UI's `Toggle` semantics. If a different role is
+   * needed in a future caller, expose a dedicated escape hatch rather than reopening this.
+   */
+  type CommonAttributes = Omit<HTMLAttributes<HTMLElement>, "role" | "onClick" | "value" | "defaultValue">;
+  export type Props = CommonAttributes & {
+    /**
+     * Active state. Drives `aria-pressed` (interactive) / `aria-selected` (inert)
+     * and the kit's selected styling. Inside a `<SelectableTileGroup>`, the group's
+     * `value` array overrides this prop.
+     */
+    selected?: boolean;
+    /**
+     * Surface shape. Defaults to `"card"`.
+     */
+    shape?: SelectableTileShape;
+    /**
+     * Force interactive vs inert rendering. Defaults to `typeof onClick === "function" || typeof value === "string"`.
+     */
+    interactive?: boolean;
+    /**
+     * Disables the underlying button when interactive; renders `aria-disabled` when inert.
+     */
+    disabled?: boolean;
+    /**
+     * Click handler.
+     */
+    onClick?: MouseEventHandler<HTMLElement>;
+    /**
+     * Identifier used when the tile is part of a `<SelectableTileGroup>`.
+     * Lets the parent group track which tile(s) are pressed.
+     */
+    value?: string;
+    /**
+     * Ref to the rendered element (button or div, depending on `interactive`).
+     */
+    ref?: Ref<HTMLElement>;
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+  };
+  export {};
+}
+//#endregion
+export { SelectableTile, SelectableTileShape };

package/dist/shared/ui/SelectableTile/SelectableTile.js

@@ -0,0 +1 @@
+"use client";import{joinClassNames as e}from"../../utils/joinClassNames.js";import{SELECTABLE_TILE_SLOTS as t}from"./SelectableTile.slots.js";import{shapeStyles as n,styles as r}from"./SelectableTile.styles.js";import{jsx as i}from"react/jsx-runtime";import*as a from"@stylexjs/stylex";import{Toggle as o}from"@base-ui/react/toggle";function s({selected:s=!1,shape:c=`card`,interactive:l,disabled:u=!1,onClick:d,value:f,className:p,style:m,children:h,...g}){let _=l??(typeof d==`function`||typeof f==`string`),v=a.props(r.base,n[c],_?r.interactive:r.inert,s&&r.selected,u&&r.disabled),y={"data-stridge-slot":t.root,"data-shape":c,"data-selected":s||void 0,"data-interactive":_||void 0,className:e(v.className,p),style:{...v.style,...m}};return _?i(o,{...g,...y,value:f,pressed:s,disabled:u,onClick:d,children:h}):i(`div`,{role:`option`,tabIndex:-1,"aria-selected":s,"aria-disabled":u||void 0,...y,...g,children:h})}export{s as SelectableTile};

package/dist/shared/ui/SelectableTile/SelectableTile.slots.d.ts

@@ -0,0 +1,7 @@
+//#region src/shared/ui/SelectableTile/SelectableTile.slots.d.ts
+declare const SELECTABLE_TILE_SLOTS: {
+  readonly root: "selectable-tile";
+};
+type SelectableTileSlot = (typeof SELECTABLE_TILE_SLOTS)[keyof typeof SELECTABLE_TILE_SLOTS];
+//#endregion
+export { SELECTABLE_TILE_SLOTS, SelectableTileSlot };

package/dist/shared/ui/SelectableTile/SelectableTile.slots.js

@@ -0,0 +1 @@
+const e={root:`selectable-tile`};export{e as SELECTABLE_TILE_SLOTS};

package/dist/shared/ui/SelectableTile/SelectableTile.styles.js

@@ -0,0 +1 @@
+const e={base:{"SelectableTile__styles.base":`SelectableTile__styles.base`,"position-kVAEAm":`x1n2onr6`,"display-k1xSpc":`x78zum5`,"alignItems-kGNEyG":`x6s0dn4`,"margin-kogj98":`x1ghz6dp`,"outline-kI3sdo":`x1a2a7pz`,"backgroundColor-kWkggS":`xsdq91f`,"borderWidth-kMzoRj":`xmkeg23`,"borderStyle-ksu8eU":`x1y0btm7`,"borderColor-kVAM5u":`xa3awxp`,"color-kMwMTN":`x1kqivnd`,"textAlign-k9WMMc":`x1yc453h`,"textDecoration-kybGjl":`x1hl2dhg`,"fontFamily-kMv6JI":`xlaww2m`,"appearance-kysU6D":`xjyslct`,"transitionProperty-k1ekBW":`xju6q8h`,"transitionDuration-kIyJzY":`x1vhb3u9`,"transitionTimingFunction-kAMwcw":`x1xv5090`,":focus-visible_borderColor-kOJeXU":`x1muc15j`,":focus-visible_boxShadow-kEtg5x":`x1s9xil4`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:4`},interactive:{"SelectableTile__styles.interactive":`SelectableTile__styles.interactive`,"cursor-kkrTdU":`x1ypdohk`,"backgroundColor-kWkggS":`xsdq91f x1k72nz7 x18xkpei`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:27`},inert:{"SelectableTile__styles.inert":`SelectableTile__styles.inert`,"cursor-kkrTdU":`xt0e3qv`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:42`},selected:{"SelectableTile__styles.selected":`SelectableTile__styles.selected`,"backgroundColor-kWkggS":`x1b6mqgj`,"borderColor-kVAM5u":`x10ssn8f`,"boxShadow-kGVxlE":`x1r82gqv`,"color-kMwMTN":`x1823it2`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:45`},highlighted:{"SelectableTile__styles.highlighted":`SelectableTile__styles.highlighted`,"borderColor-kVAM5u":`x10ssn8f`,"boxShadow-kGVxlE":`xprdceg`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:58`},disabled:{"SelectableTile__styles.disabled":`SelectableTile__styles.disabled`,"opacity-kSiTet":`xbyyjgo`,"pointerEvents-kfzvcC":`x47corl`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:62`}},t={card:{"SelectableTile__shapeStyles.card":`SelectableTile__shapeStyles.card`,"flexDirection-kXwgrk":`x1q0g3np`,"width-kzqmXN":`xh8yej3`,"borderRadius-kaIpWk":`xi9trdq`,"paddingBlock-k8WAf4":`xxlmvz2`,"paddingInline-kg3NbH":`x1hr3lfm`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:68`},pill:{"SelectableTile__shapeStyles.pill":`SelectableTile__shapeStyles.pill`,"flexGrow-kzQI83":`x1iyjqo2`,"flexShrink-kmuXW":`xs83m0k`,"flexBasis-kCS8Yb":`x1r8uery`,"flexDirection-kXwgrk":`x1q0g3np`,"justifyContent-kjj79g":`xl56j7k`,"borderRadius-kaIpWk":`x1g6ocf5`,"paddingBlock-k8WAf4":`x1b9wmvo`,"paddingInline-kg3NbH":`xaope02`,$$css:`@stridge/kit:src/shared/ui/SelectableTile/SelectableTile.styles.ts:75`}};export{t as shapeStyles,e as styles};

package/dist/shared/ui/SelectableTile/SelectableTileGroup.d.ts

@@ -0,0 +1,82 @@
+import { CSSProperties, ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/shared/ui/SelectableTile/SelectableTileGroup.d.ts
+interface SelectableTileGroupProps {
+  /**
+   * Value(s) of the currently pressed tile(s). Pass a single-element
+   * array for single-select pickers (asset picker, percent presets);
+   * pass `undefined` (or `[]`) for nav-style lists where the rows
+   * dispatch transitions on click and don't track a pressed state.
+   */
+  value?: readonly string[];
+  /**
+   * Fired when the pressed state of the group changes. Receives the
+   * full pressed array. For single-select callers, read `next[0]`.
+   */
+  onValueChange?: (next: string[]) => void;
+  /**
+   * `false` (default) — at most one tile pressed at a time. `true` —
+   * any number can be pressed simultaneously.
+   */
+  multiple?: boolean;
+  /**
+   * Arrow-key navigation orientation. Defaults to `"vertical"` so
+   * Up / Down walk the rows (the kit's full-width card stack).
+   */
+  orientation?: "vertical" | "horizontal";
+  /**
+   * Whether arrow-key navigation wraps from last → first / first →
+   * last. Defaults to `true`.
+   */
+  loopFocus?: boolean;
+  /**
+   * Disables every tile in the group.
+   */
+  disabled?: boolean;
+  /**
+   * Optional accessible label, applied to the underlying group.
+   */
+  "aria-label"?: string;
+  children?: ReactNode;
+  className?: string;
+  style?: CSSProperties;
+  /**
+   * Pass-through DOM attributes (data-*, aria-*).
+   */
+  [key: `data-${string}`]: string | number | boolean | undefined;
+}
+/**
+ * Roving-tabindex container for a stack of `SelectableTile`s. Wraps
+ * Base UI's `ToggleGroup`, which provides arrow-key navigation, focus
+ * looping, and shared pressed-state across the children for free.
+ *
+ * Three usage patterns:
+ *
+ * - **Single-select** (asset picker, percent-preset pills) — pass
+ *   `value={[selectedId]}` + `multiple={false}`. The group tracks which
+ *   tile is pressed and fires `onValueChange` with the new array.
+ * - **Multi-select** — pass `value={selectedIds}` + `multiple={true}`.
+ *   Same shape, group permits multiple presses.
+ * - **Nav-only** (deposit method picker) — omit `value` /
+ *   `onValueChange`. Tiles still get arrow-key navigation; click
+ *   handlers (via `SelectableTile.onClick`) drive the actual behavior.
+ *
+ * Children should be `<SelectableTile>` instances (interactive). Static
+ * (`role="option"`) tiles render unchanged but won't participate in
+ * arrow-key navigation.
+ */
+declare function SelectableTileGroup({
+  value,
+  onValueChange,
+  multiple,
+  orientation,
+  loopFocus,
+  disabled,
+  className,
+  style,
+  children,
+  ...rest
+}: SelectableTileGroupProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SelectableTileGroup, SelectableTileGroupProps };

package/dist/shared/ui/SelectableTile/SelectableTileGroup.js

@@ -0,0 +1 @@
+"use client";import{joinClassNames as e}from"../../utils/joinClassNames.js";import{jsx as t}from"react/jsx-runtime";import{ToggleGroup as n}from"@base-ui/react/toggle-group";function r({value:r,onValueChange:i,multiple:a=!1,orientation:o=`vertical`,loopFocus:s=!0,disabled:c=!1,className:l,style:u,children:d,...f}){let p={className:`SelectableTileGroup__styles.root x1a2a7pz`,"data-style-src":`@stridge/kit:src/shared/ui/SelectableTile/SelectableTileGroup.tsx:7`},m={multiple:a,orientation:o,loopFocus:s,disabled:c,className:e(p.className,l),style:{...p.style,...u},...f};return r!==void 0&&(m.value=r),i&&(m.onValueChange=e=>i(e)),t(n,{...m,children:d})}export{r as SelectableTileGroup};

package/dist/shared/ui/SelectableTile/index.d.ts

@@ -0,0 +1,3 @@
+import { SelectableTile, SelectableTileShape } from "./SelectableTile.js";
+import { SELECTABLE_TILE_SLOTS, SelectableTileSlot } from "./SelectableTile.slots.js";
+import { SelectableTileGroup, SelectableTileGroupProps } from "./SelectableTileGroup.js";

package/dist/shared/ui/SelectableTile/index.js

@@ -0,0 +1 @@
+import"./SelectableTile.slots.js";import"./SelectableTile.js";import"./SelectableTileGroup.js";

package/dist/shared/ui/Skeleton/Skeleton.d.ts

@@ -0,0 +1,41 @@
+import { ComponentProps } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/shared/ui/Skeleton/Skeleton.d.ts
+/**
+ * Loading placeholder. Renders a pill-shaped rect with a shimmer sweep. Set `width` and `height` to mirror the
+ * value being replaced so the layout doesn't reflow when data lands.
+ *
+ * Rendered with `aria-hidden` because skeletons are decorative.
+ *
+ * @example
+ * ```tsx
+ * {value ? <span>{value}</span> : <Skeleton width={120} height={16} />}
+ * ```
+ */
+declare function Skeleton({
+  width,
+  height,
+  radius,
+  className,
+  style,
+  ...props
+}: Skeleton.Props): _$react_jsx_runtime0.JSX.Element;
+declare namespace Skeleton {
+  type Props = Omit<ComponentProps<"span">, "children" | "width" | "height"> & {
+    /**
+     * Slot width — should mirror the value being replaced.
+     */
+    width?: number | string;
+    /**
+     * Slot height — should mirror the value being replaced.
+     */
+    height?: number | string;
+    /**
+     * Pill radius. Defaults to `6px`.
+     */
+    radius?: number | string;
+  };
+}
+//#endregion
+export { Skeleton };

package/dist/shared/ui/Skeleton/Skeleton.js

@@ -0,0 +1 @@
+"use client";import{joinClassNames as e}from"../../utils/joinClassNames.js";import{SKELETON_SLOTS as t}from"./Skeleton.slots.js";import{styles as n}from"./Skeleton.styles.js";import{jsx as r}from"react/jsx-runtime";import*as i from"@stylexjs/stylex";function a({width:a,height:o,radius:s,className:c,style:l,...u}){let d=i.props(n.root),f={width:a,height:o,borderRadius:s??`6px`,...l};return r(`span`,{"aria-hidden":!0,"data-stridge-slot":t.root,...u,className:e(d.className,c),style:{...d.style,...f}})}export{a as Skeleton};

package/dist/shared/ui/Skeleton/Skeleton.slots.d.ts

@@ -0,0 +1,7 @@
+//#region src/shared/ui/Skeleton/Skeleton.slots.d.ts
+declare const SKELETON_SLOTS: {
+  readonly root: "skeleton";
+};
+type SkeletonSlot = (typeof SKELETON_SLOTS)[keyof typeof SKELETON_SLOTS];
+//#endregion
+export { SKELETON_SLOTS, SkeletonSlot };

package/dist/shared/ui/Skeleton/Skeleton.slots.js

@@ -0,0 +1 @@
+const e={root:`skeleton`};export{e as SKELETON_SLOTS};

package/dist/shared/ui/Skeleton/Skeleton.styles.js

@@ -0,0 +1 @@
+const e={root:{"Skeleton__styles.root":`Skeleton__styles.root`,"display-k1xSpc":`x1rg5ohu`,"flexShrink-kmuXW":`x2lah0s`,"backgroundColor-kWkggS":`x3l8li6`,"backgroundImage-kKwaWg":`x1sxldtw`,"backgroundSize-kgSjnq":`xakli9p`,"backgroundRepeat-kz484i":`xiy17q3`,"animationName-kKVMdj":`x1ng0oyw`,"animationDuration-k44tkh":`x1sbju2s`,"animationIterationCount-ko0y90":`xa4qsjk`,"animationTimingFunction-kyAemX":`x1esw782`,$$css:`@stridge/kit:src/shared/ui/Skeleton/Skeleton.styles.ts:12`}};export{e as styles};

package/dist/shared/ui/Skeleton/index.d.ts

@@ -0,0 +1,2 @@
+import { Skeleton } from "./Skeleton.js";
+import { SKELETON_SLOTS, SkeletonSlot } from "./Skeleton.slots.js";

package/dist/shared/ui/Skeleton/index.js

@@ -0,0 +1 @@
+import"./Skeleton.slots.js";import"./Skeleton.js";