@flanksource/clicky-ui 0.3.44 → 0.3.45

package/dist/data/runtime/RuntimeBarIdentity.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarIdentity.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/RuntimeBarIdentity.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAO/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAG/E,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,qBAAqB,CAAC;IAC5B,KAAK,EAAE,qBAAqB,EAAE,CAAC;IAC/B,MAAM,EAAE,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;IAC9C,aAAa,EAAE,SAAS,GAAG,SAAS,CAAC;IACrC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,WAAW,GAAG,OAAO,CAAC;IAC/B,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EACjC,OAAe,EACf,GAAG,KAAK,EACT,EAAE,uBAAuB,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,+BA8CjD"}
+{"version":3,"file":"RuntimeBarIdentity.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/RuntimeBarIdentity.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAO/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAG/E,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,qBAAqB,CAAC;IAC5B,KAAK,EAAE,qBAAqB,EAAE,CAAC;IAC/B,MAAM,EAAE,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;IAC9C,aAAa,EAAE,SAAS,GAAG,SAAS,CAAC;IACrC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EACjC,OAAe,EACf,GAAG,KAAK,EACT,EAAE,uBAAuB,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,+BA2CjD"}

package/dist/data/runtime/RuntimeBarIdentity.js

@@ -23,12 +23,9 @@ function RuntimeBarIdentity({
     "div",
     {
       "data-runtime-bar-section": measure ? void 0 : "identity",
-      className: cn(
-        "flex h-control-h min-w-0 items-stretch",
-        props.variant === "combo" && "gap-1"
-      ),
+      className: "flex h-control-h min-w-0 items-stretch",
       children: [
-        measure ? /* @__PURE__ */ jsx(IdentityMeasure, { variant: props.variant, children: modeCaption }) : /* @__PURE__ */ jsx(
+        measure ? /* @__PURE__ */ jsx(IdentityMeasure, { children: modeCaption }) : /* @__PURE__ */ jsx(
           RuntimeSegment,
           {
             menuLabel: "Runtime mode",
@@ -43,13 +40,12 @@ function RuntimeBarIdentity({
             children: modeCaption
           }
         ),
-        measure ? /* @__PURE__ */ jsx(IdentityMeasure, { variant: props.variant, model: true, children: /* @__PURE__ */ jsx(ModelCaption, { ...props }) }) : /* @__PURE__ */ jsx(RuntimeModelPicker, { ...props })
+        measure ? /* @__PURE__ */ jsx(IdentityMeasure, { model: true, children: /* @__PURE__ */ jsx(ModelCaption, { ...props }) }) : /* @__PURE__ */ jsx(RuntimeModelPicker, { ...props })
       ]
     }
   );
 }
 function IdentityMeasure({
-  variant,
   model = false,
   children
 }) {
@@ -57,9 +53,8 @@ function IdentityMeasure({
     "div",
     {
       className: cn(
-        "flex h-control-h items-center gap-1.5 px-density-2",
-        model && "max-w-56 min-w-0",
-        variant === "combo" ? "rounded-md border border-input" : "border-l border-border first:border-l-0"
+        "flex h-control-h items-center gap-1.5 border-l border-border px-density-2 first:border-l-0",
+        model && "max-w-56 min-w-0"
       ),
       children: /* @__PURE__ */ jsx(RuntimeSegmentCaption, { children })
     }
@@ -139,10 +134,7 @@ function RuntimeModelPicker(props) {
       disabled: props.locked,
       value: props.unavailable ? "" : ((_a = props.selectedModel) == null ? void 0 : _a.id) ?? props.model ?? "",
       options,
-      className: cn(
-        "h-control-h min-w-0 max-w-56 flex-1",
-        props.variant === "combo" ? "rounded-md border border-input bg-background" : "border-l border-border first:border-l-0"
-      ),
+      className: "h-control-h min-w-0 max-w-56 flex-1 border-l border-border first:border-l-0",
       triggerClassName: "h-full rounded-none border-0 px-density-2 focus-visible:ring-inset aria-expanded:bg-muted",
       triggerContent: /* @__PURE__ */ jsx(ModelCaption, { ...props }),
       onNew: (value) => ({ value, label: `Use custom: ${value}` }),

package/dist/data/runtime/RuntimeBarIdentity.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarIdentity.js","sources":["../../../src/data/runtime/RuntimeBarIdentity.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Combobox, type ComboboxOption } from \"../../components/Combobox\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport type { ChatModel } from \"../chat/types\";\nimport { runtimeFamilyBrand } from \"./RuntimeBar.model\";\nimport {\n  RuntimeSegment,\n  RuntimeSegmentCaption,\n  SEGMENT_CAPTION_CLASS,\n} from \"./RuntimeBarSegment\";\nimport { modelGroupsForMode } from \"./RuntimeBar.selection\";\nimport type { SpecRuntimeFamily, SpecRuntimeModeOption } from \"./runtime-mode\";\nimport { UNSPECIFIED_LABEL, unspecifiedHint } from \"./unspecified\";\n\nexport type RuntimeBarIdentityProps = {\n  family: SpecRuntimeFamily;\n  mode: SpecRuntimeModeOption;\n  modes: SpecRuntimeModeOption[];\n  groups: ReturnType<typeof modelGroupsForMode>;\n  selectedModel: ChatModel | undefined;\n  model: string | undefined;\n  unavailable: boolean;\n  inheritedModelLabel: string | undefined;\n  locked: boolean;\n  showModel: boolean;\n  variant: \"segmented\" | \"combo\";\n  onModeChange: (mode: string) => void;\n  onModelSelect: (model: ChatModel) => void;\n  onModelClear: () => void;\n  onCustomModel: (model: string) => void;\n  onFamilySelect: (family: string) => void;\n};\n\nexport function RuntimeBarIdentity({\n  measure = false,\n  ...props\n}: RuntimeBarIdentityProps & { measure?: boolean }) {\n  const modeCaption = (\n    <>\n      {props.mode.icon && (\n        <Icon\n          icon={props.mode.icon}\n          className=\"size-4 shrink-0 text-muted-foreground\"\n        />\n      )}\n      <span className={SEGMENT_CAPTION_CLASS}>{props.mode.label}</span>\n    </>\n  );\n  return (\n    <div\n      data-runtime-bar-section={measure ? undefined : \"identity\"}\n      className={cn(\n        \"flex h-control-h min-w-0 items-stretch\",\n        props.variant === \"combo\" && \"gap-1\",\n      )}\n    >\n      {measure ? (\n        <IdentityMeasure variant={props.variant}>{modeCaption}</IdentityMeasure>\n      ) : (\n        <RuntimeSegment\n          menuLabel=\"Runtime mode\"\n          title={`Runtime mode — ${props.mode.label}`}\n          disabled={props.locked}\n          className=\"shrink-0\"\n          items={props.modes.map((mode) => ({\n            label: mode.label,\n            ...(mode.icon ? { icon: mode.icon } : {}),\n            onSelect: () => props.onModeChange(mode.id),\n          }))}\n        >\n          {modeCaption}\n        </RuntimeSegment>\n      )}\n      {measure ? (\n        <IdentityMeasure variant={props.variant} model>\n          <ModelCaption {...props} />\n        </IdentityMeasure>\n      ) : (\n        <RuntimeModelPicker {...props} />\n      )}\n    </div>\n  );\n}\n\nfunction IdentityMeasure({\n  variant,\n  model = false,\n  children,\n}: {\n  variant: \"segmented\" | \"combo\";\n  model?: boolean;\n  children: ReactNode;\n}) {\n  return (\n    <div\n      className={cn(\n        \"flex h-control-h items-center gap-1.5 px-density-2\",\n        model && \"max-w-56 min-w-0\",\n        variant === \"combo\"\n          ? \"rounded-md border border-input\"\n          : \"border-l border-border first:border-l-0\",\n      )}\n    >\n      <RuntimeSegmentCaption>{children}</RuntimeSegmentCaption>\n    </div>\n  );\n}\n\nfunction ModelCaption(props: RuntimeBarIdentityProps) {\n  const brand = runtimeFamilyBrand(props.family);\n  const label = props.showModel\n    ? props.unavailable\n      ? \"Unavailable selection\"\n      : (props.selectedModel?.label ?? props.model ?? UNSPECIFIED_LABEL)\n    : props.family.label;\n  return (\n    <>\n      {props.showModel && (\n        <span className=\"sr-only\">{props.family.label} </span>\n      )}\n      {brand.icon && (\n        <Icon\n          icon={brand.icon}\n          className={cn(\"size-4 shrink-0\", brand.color)}\n        />\n      )}\n      <span className=\"min-w-0 truncate font-mono text-xs font-semibold text-foreground\">\n        {label}\n      </span>\n    </>\n  );\n}\n\nfunction RuntimeModelPicker(props: RuntimeBarIdentityProps) {\n  const title = props.showModel\n    ? `Model — ${props.unavailable ? \"unavailable selection\" : props.model || \"unspecified\"}`\n    : `Family — ${props.family.label}`;\n  if (!props.showModel)\n    return (\n      <RuntimeSegment\n        menuLabel=\"Family\"\n        title={title}\n        disabled={props.locked}\n        className=\"min-w-0 max-w-56 flex-1\"\n        items={props.groups.map(({ family }) => {\n          const brand = runtimeFamilyBrand(family);\n          return {\n            label: family.label,\n            ...(brand.icon ? { icon: brand.icon } : {}),\n            onSelect: () => props.onFamilySelect(family.id),\n          };\n        })}\n      >\n        <ModelCaption {...props} />\n      </RuntimeSegment>\n    );\n  const options: ComboboxOption[] = [\n    {\n      value: \"\",\n      label: UNSPECIFIED_LABEL,\n      description: unspecifiedHint(props.inheritedModelLabel),\n    },\n    ...props.groups.flatMap(({ family, models }) => {\n      const brand = runtimeFamilyBrand(family);\n      const icon = brand.icon ? (\n        <Icon icon={brand.icon} className={cn(\"size-4\", brand.color)} />\n      ) : undefined;\n      return models.length\n        ? models.map((model) => ({\n            value: model.id,\n            label: model.label.trim() || model.id,\n            group: family.label,\n            icon,\n          }))\n        : [\n            {\n              value: `family:${family.id}`,\n              label: \"Custom model…\",\n              group: family.label,\n              icon,\n            },\n          ];\n    }),\n  ];\n  return (\n    <Combobox\n      searchPlacement=\"menu\"\n      ariaLabel=\"Model\"\n      title={title}\n      disabled={props.locked}\n      value={\n        props.unavailable ? \"\" : (props.selectedModel?.id ?? props.model ?? \"\")\n      }\n      options={options}\n      className={cn(\n        \"h-control-h min-w-0 max-w-56 flex-1\",\n        props.variant === \"combo\"\n          ? \"rounded-md border border-input bg-background\"\n          : \"border-l border-border first:border-l-0\",\n      )}\n      triggerClassName=\"h-full rounded-none border-0 px-density-2 focus-visible:ring-inset aria-expanded:bg-muted\"\n      triggerContent={<ModelCaption {...props} />}\n      onNew={(value) => ({ value, label: `Use custom: ${value}` })}\n      onChange={(value) => {\n        if (!value) return props.onModelClear();\n        const family = props.groups.find(\n          ({ family }) => value === `family:${family.id}`,\n        )?.family;\n        if (family) return props.onFamilySelect(family.id);\n        const model = props.groups\n          .flatMap(({ models }) => models)\n          .find((model) => model.id === value);\n        if (model) props.onModelSelect(model);\n        else props.onCustomModel(value);\n      }}\n    />\n  );\n}\n"],"names":["_a","family","model"],"mappings":"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"}
+{"version":3,"file":"RuntimeBarIdentity.js","sources":["../../../src/data/runtime/RuntimeBarIdentity.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Combobox, type ComboboxOption } from \"../../components/Combobox\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport type { ChatModel } from \"../chat/types\";\nimport { runtimeFamilyBrand } from \"./RuntimeBar.model\";\nimport {\n  RuntimeSegment,\n  RuntimeSegmentCaption,\n  SEGMENT_CAPTION_CLASS,\n} from \"./RuntimeBarSegment\";\nimport { modelGroupsForMode } from \"./RuntimeBar.selection\";\nimport type { SpecRuntimeFamily, SpecRuntimeModeOption } from \"./runtime-mode\";\nimport { UNSPECIFIED_LABEL, unspecifiedHint } from \"./unspecified\";\n\nexport type RuntimeBarIdentityProps = {\n  family: SpecRuntimeFamily;\n  mode: SpecRuntimeModeOption;\n  modes: SpecRuntimeModeOption[];\n  groups: ReturnType<typeof modelGroupsForMode>;\n  selectedModel: ChatModel | undefined;\n  model: string | undefined;\n  unavailable: boolean;\n  inheritedModelLabel: string | undefined;\n  locked: boolean;\n  showModel: boolean;\n  onModeChange: (mode: string) => void;\n  onModelSelect: (model: ChatModel) => void;\n  onModelClear: () => void;\n  onCustomModel: (model: string) => void;\n  onFamilySelect: (family: string) => void;\n};\n\nexport function RuntimeBarIdentity({\n  measure = false,\n  ...props\n}: RuntimeBarIdentityProps & { measure?: boolean }) {\n  const modeCaption = (\n    <>\n      {props.mode.icon && (\n        <Icon\n          icon={props.mode.icon}\n          className=\"size-4 shrink-0 text-muted-foreground\"\n        />\n      )}\n      <span className={SEGMENT_CAPTION_CLASS}>{props.mode.label}</span>\n    </>\n  );\n  return (\n    <div\n      data-runtime-bar-section={measure ? undefined : \"identity\"}\n      className=\"flex h-control-h min-w-0 items-stretch\"\n    >\n      {measure ? (\n        <IdentityMeasure>{modeCaption}</IdentityMeasure>\n      ) : (\n        <RuntimeSegment\n          menuLabel=\"Runtime mode\"\n          title={`Runtime mode — ${props.mode.label}`}\n          disabled={props.locked}\n          className=\"shrink-0\"\n          items={props.modes.map((mode) => ({\n            label: mode.label,\n            ...(mode.icon ? { icon: mode.icon } : {}),\n            onSelect: () => props.onModeChange(mode.id),\n          }))}\n        >\n          {modeCaption}\n        </RuntimeSegment>\n      )}\n      {measure ? (\n        <IdentityMeasure model>\n          <ModelCaption {...props} />\n        </IdentityMeasure>\n      ) : (\n        <RuntimeModelPicker {...props} />\n      )}\n    </div>\n  );\n}\n\nfunction IdentityMeasure({\n  model = false,\n  children,\n}: {\n  model?: boolean;\n  children: ReactNode;\n}) {\n  return (\n    <div\n      className={cn(\n        \"flex h-control-h items-center gap-1.5 border-l border-border px-density-2 first:border-l-0\",\n        model && \"max-w-56 min-w-0\",\n      )}\n    >\n      <RuntimeSegmentCaption>{children}</RuntimeSegmentCaption>\n    </div>\n  );\n}\n\nfunction ModelCaption(props: RuntimeBarIdentityProps) {\n  const brand = runtimeFamilyBrand(props.family);\n  const label = props.showModel\n    ? props.unavailable\n      ? \"Unavailable selection\"\n      : (props.selectedModel?.label ?? props.model ?? UNSPECIFIED_LABEL)\n    : props.family.label;\n  return (\n    <>\n      {props.showModel && (\n        <span className=\"sr-only\">{props.family.label} </span>\n      )}\n      {brand.icon && (\n        <Icon\n          icon={brand.icon}\n          className={cn(\"size-4 shrink-0\", brand.color)}\n        />\n      )}\n      <span className=\"min-w-0 truncate font-mono text-xs font-semibold text-foreground\">\n        {label}\n      </span>\n    </>\n  );\n}\n\nfunction RuntimeModelPicker(props: RuntimeBarIdentityProps) {\n  const title = props.showModel\n    ? `Model — ${props.unavailable ? \"unavailable selection\" : props.model || \"unspecified\"}`\n    : `Family — ${props.family.label}`;\n  if (!props.showModel)\n    return (\n      <RuntimeSegment\n        menuLabel=\"Family\"\n        title={title}\n        disabled={props.locked}\n        className=\"min-w-0 max-w-56 flex-1\"\n        items={props.groups.map(({ family }) => {\n          const brand = runtimeFamilyBrand(family);\n          return {\n            label: family.label,\n            ...(brand.icon ? { icon: brand.icon } : {}),\n            onSelect: () => props.onFamilySelect(family.id),\n          };\n        })}\n      >\n        <ModelCaption {...props} />\n      </RuntimeSegment>\n    );\n  const options: ComboboxOption[] = [\n    {\n      value: \"\",\n      label: UNSPECIFIED_LABEL,\n      description: unspecifiedHint(props.inheritedModelLabel),\n    },\n    ...props.groups.flatMap(({ family, models }) => {\n      const brand = runtimeFamilyBrand(family);\n      const icon = brand.icon ? (\n        <Icon icon={brand.icon} className={cn(\"size-4\", brand.color)} />\n      ) : undefined;\n      return models.length\n        ? models.map((model) => ({\n            value: model.id,\n            label: model.label.trim() || model.id,\n            group: family.label,\n            icon,\n          }))\n        : [\n            {\n              value: `family:${family.id}`,\n              label: \"Custom model…\",\n              group: family.label,\n              icon,\n            },\n          ];\n    }),\n  ];\n  return (\n    <Combobox\n      searchPlacement=\"menu\"\n      ariaLabel=\"Model\"\n      title={title}\n      disabled={props.locked}\n      value={\n        props.unavailable ? \"\" : (props.selectedModel?.id ?? props.model ?? \"\")\n      }\n      options={options}\n      className=\"h-control-h min-w-0 max-w-56 flex-1 border-l border-border first:border-l-0\"\n      triggerClassName=\"h-full rounded-none border-0 px-density-2 focus-visible:ring-inset aria-expanded:bg-muted\"\n      triggerContent={<ModelCaption {...props} />}\n      onNew={(value) => ({ value, label: `Use custom: ${value}` })}\n      onChange={(value) => {\n        if (!value) return props.onModelClear();\n        const family = props.groups.find(\n          ({ family }) => value === `family:${family.id}`,\n        )?.family;\n        if (family) return props.onFamilySelect(family.id);\n        const model = props.groups\n          .flatMap(({ models }) => models)\n          .find((model) => model.id === value);\n        if (model) props.onModelSelect(model);\n        else props.onCustomModel(value);\n      }}\n    />\n  );\n}\n"],"names":["_a","family","model"],"mappings":"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"}

package/dist/data/runtime/RuntimeBarLayout.cjs

@@ -29,11 +29,7 @@ function RuntimeBarLayout({
           {
             role: "group",
             "aria-label": ariaLabel,
-            "data-runtime-bar-variant": identity.variant,
-            className: utils.cn(
-              "inline-flex h-control-h max-w-full items-stretch",
-              identity.variant === "combo" ? "gap-1" : "overflow-hidden rounded-md border border-input bg-background"
-            ),
+            className: "inline-flex h-control-h max-w-full items-stretch overflow-hidden rounded-md border border-input bg-background",
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(RuntimeBarIdentity.RuntimeBarIdentity, { ...identity }),
               /* @__PURE__ */ jsxRuntime.jsx(RuntimeBarActions.RuntimeBarActions, { ...actions, visibleCount })
@@ -49,39 +45,24 @@ function RuntimeBarLayout({
               "div",
               {
                 ref: measurementRef,
-                className: utils.cn(
-                  "pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch",
-                  identity.variant === "combo" && "gap-1"
-                ),
+                className: "pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch",
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx(RuntimeBarIdentity.RuntimeBarIdentity, { ...identity, measure: true }),
                   supplied.map((field) => /* @__PURE__ */ jsxRuntime.jsx(
                     "div",
                     {
-                      className: utils.cn(
-                        "flex h-control-h items-center gap-1.5 px-density-2",
-                        identity.variant === "combo" ? "rounded-md border border-input" : "border-l border-border"
-                      ),
+                      className: "flex h-control-h items-center gap-1.5 border-l border-border px-density-2",
                       children: /* @__PURE__ */ jsxRuntime.jsx(RuntimeBarSegment.RuntimeSegmentCaption, { children: field.caption })
                     },
                     field.id
                   )),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    "div",
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-control-h items-center border-l border-border px-density-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+                    Icon.Icon,
                     {
-                      className: utils.cn(
-                        "flex h-control-h items-center px-density-2",
-                        identity.variant === "combo" ? "rounded-md border border-input" : "border-l border-border"
-                      ),
-                      children: /* @__PURE__ */ jsxRuntime.jsx(
-                        Icon.Icon,
-                        {
-                          icon: UiDotsVertical.UiDotsVertical,
-                          className: "size-4 shrink-0 text-muted-foreground"
-                        }
-                      )
+                      icon: UiDotsVertical.UiDotsVertical,
+                      className: "size-4 shrink-0 text-muted-foreground"
                     }
-                  )
+                  ) })
                 ]
               }
             )

package/dist/data/runtime/RuntimeBarLayout.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarLayout.cjs","sources":["../../../src/data/runtime/RuntimeBarLayout.tsx"],"sourcesContent":["import { UiDotsVertical } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport {\n  RuntimeBarActions,\n  type RuntimeBarActionsProps,\n} from \"./RuntimeBarActions\";\nimport {\n  RuntimeBarIdentity,\n  type RuntimeBarIdentityProps,\n} from \"./RuntimeBarIdentity\";\nimport { RuntimeSegmentCaption } from \"./RuntimeBarSegment\";\nimport { useRuntimeBarOverflow } from \"./use-runtime-bar-overflow\";\n\nexport function RuntimeBarLayout({\n  identity,\n  actions,\n  ariaLabel,\n  className,\n}: {\n  identity: RuntimeBarIdentityProps;\n  actions: RuntimeBarActionsProps;\n  ariaLabel: string;\n  className?: string | undefined;\n}) {\n  const { containerRef, measurementRef, visibleCount } =\n    useRuntimeBarOverflow();\n  const supplied = actions.fields?.filter((field) => field.isSet) ?? [];\n  const hasMenu = Boolean(actions.fields?.length || actions.menu?.length);\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\"relative w-full min-w-0\", className)}\n    >\n      <div\n        role=\"group\"\n        aria-label={ariaLabel}\n        data-runtime-bar-variant={identity.variant}\n        className={cn(\n          \"inline-flex h-control-h max-w-full items-stretch\",\n          identity.variant === \"combo\"\n            ? \"gap-1\"\n            : \"overflow-hidden rounded-md border border-input bg-background\",\n        )}\n      >\n        <RuntimeBarIdentity {...identity} />\n        <RuntimeBarActions {...actions} visibleCount={visibleCount} />\n      </div>\n      {hasMenu && (\n        <div\n          className=\"pointer-events-none absolute inset-0 overflow-hidden\"\n          aria-hidden=\"true\"\n        >\n          <div\n            ref={measurementRef}\n            className={cn(\n              \"pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch\",\n              identity.variant === \"combo\" && \"gap-1\",\n            )}\n          >\n            <RuntimeBarIdentity {...identity} measure />\n            {supplied.map((field) => (\n              <div\n                key={field.id}\n                className={cn(\n                  \"flex h-control-h items-center gap-1.5 px-density-2\",\n                  identity.variant === \"combo\"\n                    ? \"rounded-md border border-input\"\n                    : \"border-l border-border\",\n                )}\n              >\n                <RuntimeSegmentCaption>{field.caption}</RuntimeSegmentCaption>\n              </div>\n            ))}\n            <div\n              className={cn(\n                \"flex h-control-h items-center px-density-2\",\n                identity.variant === \"combo\"\n                  ? \"rounded-md border border-input\"\n                  : \"border-l border-border\",\n              )}\n            >\n              <Icon\n                icon={UiDotsVertical}\n                className=\"size-4 shrink-0 text-muted-foreground\"\n              />\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["useRuntimeBarOverflow","jsxs","cn","jsx","RuntimeBarIdentity","RuntimeBarActions","RuntimeSegmentCaption","Icon","UiDotsVertical"],"mappings":";;;;;;;;;;AAcO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;;AACD,QAAM,EAAE,cAAc,gBAAgB,aAAA,IACpCA,sBAAAA,sBAAA;AACF,QAAM,aAAW,aAAQ,WAAR,mBAAgB,OAAO,CAAC,UAAU,MAAM,WAAU,CAAA;AACnE,QAAM,UAAU,UAAQ,aAAQ,WAAR,mBAAgB,aAAU,aAAQ,SAAR,mBAAc,OAAM;AACtE,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAWC,MAAAA,GAAG,2BAA2B,SAAS;AAAA,MAElD,UAAA;AAAA,QAAAD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY;AAAA,YACZ,4BAA0B,SAAS;AAAA,YACnC,WAAWC,MAAAA;AAAAA,cACT;AAAA,cACA,SAAS,YAAY,UACjB,UACA;AAAA,YAAA;AAAA,YAGN,UAAA;AAAA,cAAAC,2BAAAA,IAACC,mBAAAA,oBAAA,EAAoB,GAAG,UAAU;AAAA,cAClCD,2BAAAA,IAACE,kBAAAA,mBAAA,EAAmB,GAAG,SAAS,aAAA,CAA4B;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAE7D,WACCF,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YAEZ,UAAAF,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAK;AAAA,gBACL,WAAWC,MAAAA;AAAAA,kBACT;AAAA,kBACA,SAAS,YAAY,WAAW;AAAA,gBAAA;AAAA,gBAGlC,UAAA;AAAA,kBAAAC,2BAAAA,IAACC,mBAAAA,oBAAA,EAAoB,GAAG,UAAU,SAAO,KAAA,CAAC;AAAA,kBACzC,SAAS,IAAI,CAAC,UACbD,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBAEC,WAAWD,MAAAA;AAAAA,wBACT;AAAA,wBACA,SAAS,YAAY,UACjB,mCACA;AAAA,sBAAA;AAAA,sBAGN,UAAAC,2BAAAA,IAACG,kBAAAA,uBAAA,EAAuB,UAAA,MAAM,QAAA,CAAQ;AAAA,oBAAA;AAAA,oBARjC,MAAM;AAAA,kBAAA,CAUd;AAAA,kBACDH,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,WAAWD,MAAAA;AAAAA,wBACT;AAAA,wBACA,SAAS,YAAY,UACjB,mCACA;AAAA,sBAAA;AAAA,sBAGN,UAAAC,2BAAAA;AAAAA,wBAACI,KAAAA;AAAAA,wBAAA;AAAA,0BACC,MAAMC,eAAAA;AAAAA,0BACN,WAAU;AAAA,wBAAA;AAAA,sBAAA;AAAA,oBACZ;AAAA,kBAAA;AAAA,gBACF;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;;"}
+{"version":3,"file":"RuntimeBarLayout.cjs","sources":["../../../src/data/runtime/RuntimeBarLayout.tsx"],"sourcesContent":["import { UiDotsVertical } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport {\n  RuntimeBarActions,\n  type RuntimeBarActionsProps,\n} from \"./RuntimeBarActions\";\nimport {\n  RuntimeBarIdentity,\n  type RuntimeBarIdentityProps,\n} from \"./RuntimeBarIdentity\";\nimport { RuntimeSegmentCaption } from \"./RuntimeBarSegment\";\nimport { useRuntimeBarOverflow } from \"./use-runtime-bar-overflow\";\n\nexport function RuntimeBarLayout({\n  identity,\n  actions,\n  ariaLabel,\n  className,\n}: {\n  identity: RuntimeBarIdentityProps;\n  actions: RuntimeBarActionsProps;\n  ariaLabel: string;\n  className?: string | undefined;\n}) {\n  const { containerRef, measurementRef, visibleCount } =\n    useRuntimeBarOverflow();\n  const supplied = actions.fields?.filter((field) => field.isSet) ?? [];\n  const hasMenu = Boolean(actions.fields?.length || actions.menu?.length);\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\"relative w-full min-w-0\", className)}\n    >\n      <div\n        role=\"group\"\n        aria-label={ariaLabel}\n        className=\"inline-flex h-control-h max-w-full items-stretch overflow-hidden rounded-md border border-input bg-background\"\n      >\n        <RuntimeBarIdentity {...identity} />\n        <RuntimeBarActions {...actions} visibleCount={visibleCount} />\n      </div>\n      {hasMenu && (\n        <div\n          className=\"pointer-events-none absolute inset-0 overflow-hidden\"\n          aria-hidden=\"true\"\n        >\n          <div\n            ref={measurementRef}\n            className=\"pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch\"\n          >\n            <RuntimeBarIdentity {...identity} measure />\n            {supplied.map((field) => (\n              <div\n                key={field.id}\n                className=\"flex h-control-h items-center gap-1.5 border-l border-border px-density-2\"\n              >\n                <RuntimeSegmentCaption>{field.caption}</RuntimeSegmentCaption>\n              </div>\n            ))}\n            <div className=\"flex h-control-h items-center border-l border-border px-density-2\">\n              <Icon\n                icon={UiDotsVertical}\n                className=\"size-4 shrink-0 text-muted-foreground\"\n              />\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["useRuntimeBarOverflow","jsxs","cn","jsx","RuntimeBarIdentity","RuntimeBarActions","RuntimeSegmentCaption","Icon","UiDotsVertical"],"mappings":";;;;;;;;;;AAcO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;;AACD,QAAM,EAAE,cAAc,gBAAgB,aAAA,IACpCA,sBAAAA,sBAAA;AACF,QAAM,aAAW,aAAQ,WAAR,mBAAgB,OAAO,CAAC,UAAU,MAAM,WAAU,CAAA;AACnE,QAAM,UAAU,UAAQ,aAAQ,WAAR,mBAAgB,aAAU,aAAQ,SAAR,mBAAc,OAAM;AACtE,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAWC,MAAAA,GAAG,2BAA2B,SAAS;AAAA,MAElD,UAAA;AAAA,QAAAD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY;AAAA,YACZ,WAAU;AAAA,YAEV,UAAA;AAAA,cAAAE,2BAAAA,IAACC,mBAAAA,oBAAA,EAAoB,GAAG,UAAU;AAAA,cAClCD,2BAAAA,IAACE,kBAAAA,mBAAA,EAAmB,GAAG,SAAS,aAAA,CAA4B;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAE7D,WACCF,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YAEZ,UAAAF,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAK;AAAA,gBACL,WAAU;AAAA,gBAEV,UAAA;AAAA,kBAAAE,2BAAAA,IAACC,mBAAAA,oBAAA,EAAoB,GAAG,UAAU,SAAO,KAAA,CAAC;AAAA,kBACzC,SAAS,IAAI,CAAC,UACbD,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBAEC,WAAU;AAAA,sBAEV,UAAAA,2BAAAA,IAACG,kBAAAA,uBAAA,EAAuB,UAAA,MAAM,QAAA,CAAQ;AAAA,oBAAA;AAAA,oBAHjC,MAAM;AAAA,kBAAA,CAKd;AAAA,kBACDH,2BAAAA,IAAC,OAAA,EAAI,WAAU,qEACb,UAAAA,2BAAAA;AAAAA,oBAACI,KAAAA;AAAAA,oBAAA;AAAA,sBACC,MAAMC,eAAAA;AAAAA,sBACN,WAAU;AAAA,oBAAA;AAAA,kBAAA,EACZ,CACF;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;;"}

package/dist/data/runtime/RuntimeBarLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarLayout.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/RuntimeBarLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,sBAAsB,CAAC;AAI9B,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,uBAAuB,CAAC;IAClC,OAAO,EAAE,sBAAsB,CAAC;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,+BAoEA"}
+{"version":3,"file":"RuntimeBarLayout.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/RuntimeBarLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,sBAAsB,CAAC;AAI9B,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,uBAAuB,CAAC;IAClC,OAAO,EAAE,sBAAsB,CAAC;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC,+BA+CA"}

package/dist/data/runtime/RuntimeBarLayout.js

@@ -27,11 +27,7 @@ function RuntimeBarLayout({
           {
             role: "group",
             "aria-label": ariaLabel,
-            "data-runtime-bar-variant": identity.variant,
-            className: cn(
-              "inline-flex h-control-h max-w-full items-stretch",
-              identity.variant === "combo" ? "gap-1" : "overflow-hidden rounded-md border border-input bg-background"
-            ),
+            className: "inline-flex h-control-h max-w-full items-stretch overflow-hidden rounded-md border border-input bg-background",
             children: [
               /* @__PURE__ */ jsx(RuntimeBarIdentity, { ...identity }),
               /* @__PURE__ */ jsx(RuntimeBarActions, { ...actions, visibleCount })
@@ -47,39 +43,24 @@ function RuntimeBarLayout({
               "div",
               {
                 ref: measurementRef,
-                className: cn(
-                  "pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch",
-                  identity.variant === "combo" && "gap-1"
-                ),
+                className: "pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch",
                 children: [
                   /* @__PURE__ */ jsx(RuntimeBarIdentity, { ...identity, measure: true }),
                   supplied.map((field) => /* @__PURE__ */ jsx(
                     "div",
                     {
-                      className: cn(
-                        "flex h-control-h items-center gap-1.5 px-density-2",
-                        identity.variant === "combo" ? "rounded-md border border-input" : "border-l border-border"
-                      ),
+                      className: "flex h-control-h items-center gap-1.5 border-l border-border px-density-2",
                       children: /* @__PURE__ */ jsx(RuntimeSegmentCaption, { children: field.caption })
                     },
                     field.id
                   )),
-                  /* @__PURE__ */ jsx(
-                    "div",
+                  /* @__PURE__ */ jsx("div", { className: "flex h-control-h items-center border-l border-border px-density-2", children: /* @__PURE__ */ jsx(
+                    Icon,
                     {
-                      className: cn(
-                        "flex h-control-h items-center px-density-2",
-                        identity.variant === "combo" ? "rounded-md border border-input" : "border-l border-border"
-                      ),
-                      children: /* @__PURE__ */ jsx(
-                        Icon,
-                        {
-                          icon: UiDotsVertical,
-                          className: "size-4 shrink-0 text-muted-foreground"
-                        }
-                      )
+                      icon: UiDotsVertical,
+                      className: "size-4 shrink-0 text-muted-foreground"
                     }
-                  )
+                  ) })
                 ]
               }
             )

package/dist/data/runtime/RuntimeBarLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarLayout.js","sources":["../../../src/data/runtime/RuntimeBarLayout.tsx"],"sourcesContent":["import { UiDotsVertical } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport {\n  RuntimeBarActions,\n  type RuntimeBarActionsProps,\n} from \"./RuntimeBarActions\";\nimport {\n  RuntimeBarIdentity,\n  type RuntimeBarIdentityProps,\n} from \"./RuntimeBarIdentity\";\nimport { RuntimeSegmentCaption } from \"./RuntimeBarSegment\";\nimport { useRuntimeBarOverflow } from \"./use-runtime-bar-overflow\";\n\nexport function RuntimeBarLayout({\n  identity,\n  actions,\n  ariaLabel,\n  className,\n}: {\n  identity: RuntimeBarIdentityProps;\n  actions: RuntimeBarActionsProps;\n  ariaLabel: string;\n  className?: string | undefined;\n}) {\n  const { containerRef, measurementRef, visibleCount } =\n    useRuntimeBarOverflow();\n  const supplied = actions.fields?.filter((field) => field.isSet) ?? [];\n  const hasMenu = Boolean(actions.fields?.length || actions.menu?.length);\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\"relative w-full min-w-0\", className)}\n    >\n      <div\n        role=\"group\"\n        aria-label={ariaLabel}\n        data-runtime-bar-variant={identity.variant}\n        className={cn(\n          \"inline-flex h-control-h max-w-full items-stretch\",\n          identity.variant === \"combo\"\n            ? \"gap-1\"\n            : \"overflow-hidden rounded-md border border-input bg-background\",\n        )}\n      >\n        <RuntimeBarIdentity {...identity} />\n        <RuntimeBarActions {...actions} visibleCount={visibleCount} />\n      </div>\n      {hasMenu && (\n        <div\n          className=\"pointer-events-none absolute inset-0 overflow-hidden\"\n          aria-hidden=\"true\"\n        >\n          <div\n            ref={measurementRef}\n            className={cn(\n              \"pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch\",\n              identity.variant === \"combo\" && \"gap-1\",\n            )}\n          >\n            <RuntimeBarIdentity {...identity} measure />\n            {supplied.map((field) => (\n              <div\n                key={field.id}\n                className={cn(\n                  \"flex h-control-h items-center gap-1.5 px-density-2\",\n                  identity.variant === \"combo\"\n                    ? \"rounded-md border border-input\"\n                    : \"border-l border-border\",\n                )}\n              >\n                <RuntimeSegmentCaption>{field.caption}</RuntimeSegmentCaption>\n              </div>\n            ))}\n            <div\n              className={cn(\n                \"flex h-control-h items-center px-density-2\",\n                identity.variant === \"combo\"\n                  ? \"rounded-md border border-input\"\n                  : \"border-l border-border\",\n              )}\n            >\n              <Icon\n                icon={UiDotsVertical}\n                className=\"size-4 shrink-0 text-muted-foreground\"\n              />\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAcO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;;AACD,QAAM,EAAE,cAAc,gBAAgB,aAAA,IACpC,sBAAA;AACF,QAAM,aAAW,aAAQ,WAAR,mBAAgB,OAAO,CAAC,UAAU,MAAM,WAAU,CAAA;AACnE,QAAM,UAAU,UAAQ,aAAQ,WAAR,mBAAgB,aAAU,aAAQ,SAAR,mBAAc,OAAM;AACtE,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,GAAG,2BAA2B,SAAS;AAAA,MAElD,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY;AAAA,YACZ,4BAA0B,SAAS;AAAA,YACnC,WAAW;AAAA,cACT;AAAA,cACA,SAAS,YAAY,UACjB,UACA;AAAA,YAAA;AAAA,YAGN,UAAA;AAAA,cAAA,oBAAC,oBAAA,EAAoB,GAAG,UAAU;AAAA,cAClC,oBAAC,mBAAA,EAAmB,GAAG,SAAS,aAAA,CAA4B;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAE7D,WACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YAEZ,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAK;AAAA,gBACL,WAAW;AAAA,kBACT;AAAA,kBACA,SAAS,YAAY,WAAW;AAAA,gBAAA;AAAA,gBAGlC,UAAA;AAAA,kBAAA,oBAAC,oBAAA,EAAoB,GAAG,UAAU,SAAO,KAAA,CAAC;AAAA,kBACzC,SAAS,IAAI,CAAC,UACb;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBAEC,WAAW;AAAA,wBACT;AAAA,wBACA,SAAS,YAAY,UACjB,mCACA;AAAA,sBAAA;AAAA,sBAGN,UAAA,oBAAC,uBAAA,EAAuB,UAAA,MAAM,QAAA,CAAQ;AAAA,oBAAA;AAAA,oBARjC,MAAM;AAAA,kBAAA,CAUd;AAAA,kBACD;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,WAAW;AAAA,wBACT;AAAA,wBACA,SAAS,YAAY,UACjB,mCACA;AAAA,sBAAA;AAAA,sBAGN,UAAA;AAAA,wBAAC;AAAA,wBAAA;AAAA,0BACC,MAAM;AAAA,0BACN,WAAU;AAAA,wBAAA;AAAA,sBAAA;AAAA,oBACZ;AAAA,kBAAA;AAAA,gBACF;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"RuntimeBarLayout.js","sources":["../../../src/data/runtime/RuntimeBarLayout.tsx"],"sourcesContent":["import { UiDotsVertical } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport {\n  RuntimeBarActions,\n  type RuntimeBarActionsProps,\n} from \"./RuntimeBarActions\";\nimport {\n  RuntimeBarIdentity,\n  type RuntimeBarIdentityProps,\n} from \"./RuntimeBarIdentity\";\nimport { RuntimeSegmentCaption } from \"./RuntimeBarSegment\";\nimport { useRuntimeBarOverflow } from \"./use-runtime-bar-overflow\";\n\nexport function RuntimeBarLayout({\n  identity,\n  actions,\n  ariaLabel,\n  className,\n}: {\n  identity: RuntimeBarIdentityProps;\n  actions: RuntimeBarActionsProps;\n  ariaLabel: string;\n  className?: string | undefined;\n}) {\n  const { containerRef, measurementRef, visibleCount } =\n    useRuntimeBarOverflow();\n  const supplied = actions.fields?.filter((field) => field.isSet) ?? [];\n  const hasMenu = Boolean(actions.fields?.length || actions.menu?.length);\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\"relative w-full min-w-0\", className)}\n    >\n      <div\n        role=\"group\"\n        aria-label={ariaLabel}\n        className=\"inline-flex h-control-h max-w-full items-stretch overflow-hidden rounded-md border border-input bg-background\"\n      >\n        <RuntimeBarIdentity {...identity} />\n        <RuntimeBarActions {...actions} visibleCount={visibleCount} />\n      </div>\n      {hasMenu && (\n        <div\n          className=\"pointer-events-none absolute inset-0 overflow-hidden\"\n          aria-hidden=\"true\"\n        >\n          <div\n            ref={measurementRef}\n            className=\"pointer-events-none invisible absolute left-0 top-0 flex w-max items-stretch\"\n          >\n            <RuntimeBarIdentity {...identity} measure />\n            {supplied.map((field) => (\n              <div\n                key={field.id}\n                className=\"flex h-control-h items-center gap-1.5 border-l border-border px-density-2\"\n              >\n                <RuntimeSegmentCaption>{field.caption}</RuntimeSegmentCaption>\n              </div>\n            ))}\n            <div className=\"flex h-control-h items-center border-l border-border px-density-2\">\n              <Icon\n                icon={UiDotsVertical}\n                className=\"size-4 shrink-0 text-muted-foreground\"\n              />\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAcO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;;AACD,QAAM,EAAE,cAAc,gBAAgB,aAAA,IACpC,sBAAA;AACF,QAAM,aAAW,aAAQ,WAAR,mBAAgB,OAAO,CAAC,UAAU,MAAM,WAAU,CAAA;AACnE,QAAM,UAAU,UAAQ,aAAQ,WAAR,mBAAgB,aAAU,aAAQ,SAAR,mBAAc,OAAM;AACtE,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,GAAG,2BAA2B,SAAS;AAAA,MAElD,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY;AAAA,YACZ,WAAU;AAAA,YAEV,UAAA;AAAA,cAAA,oBAAC,oBAAA,EAAoB,GAAG,UAAU;AAAA,cAClC,oBAAC,mBAAA,EAAmB,GAAG,SAAS,aAAA,CAA4B;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAE7D,WACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YAEZ,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAK;AAAA,gBACL,WAAU;AAAA,gBAEV,UAAA;AAAA,kBAAA,oBAAC,oBAAA,EAAoB,GAAG,UAAU,SAAO,KAAA,CAAC;AAAA,kBACzC,SAAS,IAAI,CAAC,UACb;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBAEC,WAAU;AAAA,sBAEV,UAAA,oBAAC,uBAAA,EAAuB,UAAA,MAAM,QAAA,CAAQ;AAAA,oBAAA;AAAA,oBAHjC,MAAM;AAAA,kBAAA,CAKd;AAAA,kBACD,oBAAC,OAAA,EAAI,WAAU,qEACb,UAAA;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,MAAM;AAAA,sBACN,WAAU;AAAA,oBAAA;AAAA,kBAAA,EACZ,CACF;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/data/runtime/RuntimeBarSegment.cjs

@@ -1,11 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const react = require("react");
 const utils = require("../../lib/utils.cjs");
 const DropdownMenu = require("../../overlay/DropdownMenu.cjs");
 const Icon = require("../Icon.cjs");
-const RuntimeBar_context = require("./RuntimeBar.context.cjs");
 const UiCheck = require("../../icons/components/UiCheck.cjs");
 const UiChevronDown = require("../../icons/components/UiChevronDown.cjs");
 const SEGMENT_CAPTION_CLASS = "truncate text-xs font-semibold text-foreground";
@@ -20,7 +18,6 @@ function RuntimeSegment({
   className,
   children
 }) {
-  const variant = react.useContext(RuntimeBar_context.RuntimeBarVariantContext);
   return /* @__PURE__ */ jsxRuntime.jsx(
     DropdownMenu.DropdownMenu,
     {
@@ -30,8 +27,7 @@ function RuntimeSegment({
       ...header ? { header } : {},
       menuClassName: "max-h-[70vh] min-w-56 max-w-80 overflow-y-auto",
       className: utils.cn(
-        "h-control-h min-w-0 [&>span]:min-w-0 [&>span]:w-full",
-        variant === "combo" ? "rounded-md border border-input bg-background" : "border-l border-border first:border-l-0",
+        "h-control-h min-w-0 border-l border-border first:border-l-0 [&>span]:min-w-0 [&>span]:w-full",
         className
       ),
       trigger: /* @__PURE__ */ jsxRuntime.jsx(

package/dist/data/runtime/RuntimeBarSegment.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarSegment.cjs","sources":["../../../src/data/runtime/RuntimeBarSegment.tsx"],"sourcesContent":["import { useContext, type ReactNode } from \"react\";\nimport { UiCheck, UiChevronDown } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  DropdownMenu,\n  type DropdownMenuItem,\n} from \"../../overlay/DropdownMenu\";\nimport { Icon } from \"../Icon\";\nimport { RuntimeBarVariantContext } from \"./RuntimeBar.context\";\n\nexport const SEGMENT_CAPTION_CLASS =\n  \"truncate text-xs font-semibold text-foreground\";\nexport const SEGMENT_KEY_CLASS =\n  \"text-[11px] font-semibold uppercase leading-none tracking-wide text-muted-foreground\";\n\n// One trigger in the segmented runtime bar: a dropdown whose button carries the\n// segment's current value. `min-w-0` on the root lets a segment shrink past its\n// content — without it the flex item's automatic minimum size is its max-content\n// width, so a row of segments overflows a narrow container instead of ellipsing\n// its captions.\nexport function RuntimeSegment({\n  items,\n  menuLabel,\n  title,\n  header,\n  disabled = false,\n  hideChevron = false,\n  className,\n  children,\n}: {\n  items: DropdownMenuItem[];\n  menuLabel: string;\n  title: string;\n  header?: ReactNode;\n  disabled?: boolean;\n  /** Drops the trailing chevron, for a segment whose caption is a bare glyph. */\n  hideChevron?: boolean;\n  className?: string | undefined;\n  children: ReactNode;\n}) {\n  const variant = useContext(RuntimeBarVariantContext);\n  return (\n    <DropdownMenu\n      align=\"left\"\n      menuLabel={menuLabel}\n      items={items}\n      {...(header ? { header } : {})}\n      menuClassName=\"max-h-[70vh] min-w-56 max-w-80 overflow-y-auto\"\n      className={cn(\n        \"h-control-h min-w-0 [&>span]:min-w-0 [&>span]:w-full\",\n        variant === \"combo\"\n          ? \"rounded-md border border-input bg-background\"\n          : \"border-l border-border first:border-l-0\",\n        className,\n      )}\n      trigger={\n        <button\n          type=\"button\"\n          disabled={disabled}\n          title={title}\n          className=\"inline-flex h-full w-full min-w-0 items-center gap-1.5 px-density-2 transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring [[aria-expanded=true]_&]:bg-muted\"\n        >\n          <RuntimeSegmentCaption hideChevron={hideChevron}>\n            {children}\n          </RuntimeSegmentCaption>\n        </button>\n      }\n    />\n  );\n}\n\nexport function RuntimeSegmentCaption({\n  children,\n  hideChevron = false,\n}: {\n  children: ReactNode;\n  hideChevron?: boolean;\n}) {\n  return (\n    <>\n      {children}\n      {!hideChevron && (\n        <Icon\n          icon={UiChevronDown}\n          className=\"size-3 shrink-0 text-muted-foreground/70\"\n        />\n      )}\n    </>\n  );\n}\n\nexport function SegmentItemLabel({\n  text,\n  hint,\n  selected,\n  stacked = false,\n}: {\n  text: string;\n  hint?: string | undefined;\n  selected: boolean;\n  stacked?: boolean | undefined;\n}) {\n  return (\n    <>\n      <span className=\"min-w-0 flex-1\">\n        <span className={cn(\"block truncate\", selected && \"font-semibold\")}>\n          {text}\n        </span>\n        {hint && stacked && (\n          <span className=\"block whitespace-normal text-[11px] leading-4 text-muted-foreground\">\n            {hint}\n          </span>\n        )}\n      </span>\n      {hint && !stacked && (\n        <span className=\"shrink-0 text-[11px] text-muted-foreground\">\n          {hint}\n        </span>\n      )}\n      <Icon\n        icon={UiCheck}\n        className={cn(\n          \"size-3.5 shrink-0 text-primary\",\n          !selected && \"invisible\",\n        )}\n      />\n    </>\n  );\n}\n"],"names":["useContext","RuntimeBarVariantContext","jsx","DropdownMenu","cn","jsxs","Fragment","Icon","UiChevronDown","UiCheck"],"mappings":";;;;;;;;;;AAUO,MAAM,wBACX;AACK,MAAM,oBACX;AAOK,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA;AACF,GAUG;AACD,QAAM,UAAUA,MAAAA,WAAWC,2CAAwB;AACnD,SACEC,2BAAAA;AAAAA,IAACC,aAAAA;AAAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN;AAAA,MACA;AAAA,MACC,GAAI,SAAS,EAAE,OAAA,IAAW,CAAA;AAAA,MAC3B,eAAc;AAAA,MACd,WAAWC,MAAAA;AAAAA,QACT;AAAA,QACA,YAAY,UACR,iDACA;AAAA,QACJ;AAAA,MAAA;AAAA,MAEF,SACEF,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACA,WAAU;AAAA,UAEV,UAAAA,2BAAAA,IAAC,uBAAA,EAAsB,aACpB,SAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAIR;AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA,cAAc;AAChB,GAGG;AACD,SACEG,2BAAAA,KAAAC,qBAAA,EACG,UAAA;AAAA,IAAA;AAAA,IACA,CAAC,eACAJ,2BAAAA;AAAAA,MAACK,KAAAA;AAAAA,MAAA;AAAA,QACC,MAAMC,cAAAA;AAAAA,QACN,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACZ,GAEJ;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACZ,GAKG;AACD,SACEH,2BAAAA,KAAAC,qBAAA,EACE,UAAA;AAAA,IAAAD,2BAAAA,KAAC,QAAA,EAAK,WAAU,kBACd,UAAA;AAAA,MAAAH,2BAAAA,IAAC,UAAK,WAAWE,SAAG,kBAAkB,YAAY,eAAe,GAC9D,UAAA,MACH;AAAA,MACC,QAAQ,WACPF,2BAAAA,IAAC,QAAA,EAAK,WAAU,uEACb,UAAA,KAAA,CACH;AAAA,IAAA,GAEJ;AAAA,IACC,QAAQ,CAAC,0CACP,QAAA,EAAK,WAAU,8CACb,UAAA,MACH;AAAA,IAEFA,2BAAAA;AAAAA,MAACK,KAAAA;AAAAA,MAAA;AAAA,QACC,MAAME,QAAAA;AAAAA,QACN,WAAWL,MAAAA;AAAAA,UACT;AAAA,UACA,CAAC,YAAY;AAAA,QAAA;AAAA,MACf;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;;;;;;"}
+{"version":3,"file":"RuntimeBarSegment.cjs","sources":["../../../src/data/runtime/RuntimeBarSegment.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { UiCheck, UiChevronDown } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  DropdownMenu,\n  type DropdownMenuItem,\n} from \"../../overlay/DropdownMenu\";\nimport { Icon } from \"../Icon\";\n\nexport const SEGMENT_CAPTION_CLASS =\n  \"truncate text-xs font-semibold text-foreground\";\nexport const SEGMENT_KEY_CLASS =\n  \"text-[11px] font-semibold uppercase leading-none tracking-wide text-muted-foreground\";\n\n// One trigger in the segmented runtime bar: a dropdown whose button carries the\n// segment's current value. `min-w-0` on the root lets a segment shrink past its\n// content — without it the flex item's automatic minimum size is its max-content\n// width, so a row of segments overflows a narrow container instead of ellipsing\n// its captions.\nexport function RuntimeSegment({\n  items,\n  menuLabel,\n  title,\n  header,\n  disabled = false,\n  hideChevron = false,\n  className,\n  children,\n}: {\n  items: DropdownMenuItem[];\n  menuLabel: string;\n  title: string;\n  header?: ReactNode;\n  disabled?: boolean;\n  /** Drops the trailing chevron, for a segment whose caption is a bare glyph. */\n  hideChevron?: boolean;\n  className?: string | undefined;\n  children: ReactNode;\n}) {\n  return (\n    <DropdownMenu\n      align=\"left\"\n      menuLabel={menuLabel}\n      items={items}\n      {...(header ? { header } : {})}\n      menuClassName=\"max-h-[70vh] min-w-56 max-w-80 overflow-y-auto\"\n      className={cn(\n        \"h-control-h min-w-0 border-l border-border first:border-l-0 [&>span]:min-w-0 [&>span]:w-full\",\n        className,\n      )}\n      trigger={\n        <button\n          type=\"button\"\n          disabled={disabled}\n          title={title}\n          className=\"inline-flex h-full w-full min-w-0 items-center gap-1.5 px-density-2 transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring [[aria-expanded=true]_&]:bg-muted\"\n        >\n          <RuntimeSegmentCaption hideChevron={hideChevron}>\n            {children}\n          </RuntimeSegmentCaption>\n        </button>\n      }\n    />\n  );\n}\n\nexport function RuntimeSegmentCaption({\n  children,\n  hideChevron = false,\n}: {\n  children: ReactNode;\n  hideChevron?: boolean;\n}) {\n  return (\n    <>\n      {children}\n      {!hideChevron && (\n        <Icon\n          icon={UiChevronDown}\n          className=\"size-3 shrink-0 text-muted-foreground/70\"\n        />\n      )}\n    </>\n  );\n}\n\nexport function SegmentItemLabel({\n  text,\n  hint,\n  selected,\n  stacked = false,\n}: {\n  text: string;\n  hint?: string | undefined;\n  selected: boolean;\n  stacked?: boolean | undefined;\n}) {\n  return (\n    <>\n      <span className=\"min-w-0 flex-1\">\n        <span className={cn(\"block truncate\", selected && \"font-semibold\")}>\n          {text}\n        </span>\n        {hint && stacked && (\n          <span className=\"block whitespace-normal text-[11px] leading-4 text-muted-foreground\">\n            {hint}\n          </span>\n        )}\n      </span>\n      {hint && !stacked && (\n        <span className=\"shrink-0 text-[11px] text-muted-foreground\">\n          {hint}\n        </span>\n      )}\n      <Icon\n        icon={UiCheck}\n        className={cn(\n          \"size-3.5 shrink-0 text-primary\",\n          !selected && \"invisible\",\n        )}\n      />\n    </>\n  );\n}\n"],"names":["jsx","DropdownMenu","cn","jsxs","Fragment","Icon","UiChevronDown","UiCheck"],"mappings":";;;;;;;;AASO,MAAM,wBACX;AACK,MAAM,oBACX;AAOK,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA;AACF,GAUG;AACD,SACEA,2BAAAA;AAAAA,IAACC,aAAAA;AAAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN;AAAA,MACA;AAAA,MACC,GAAI,SAAS,EAAE,OAAA,IAAW,CAAA;AAAA,MAC3B,eAAc;AAAA,MACd,WAAWC,MAAAA;AAAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAEF,SACEF,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACA,WAAU;AAAA,UAEV,UAAAA,2BAAAA,IAAC,uBAAA,EAAsB,aACpB,SAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAIR;AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA,cAAc;AAChB,GAGG;AACD,SACEG,2BAAAA,KAAAC,qBAAA,EACG,UAAA;AAAA,IAAA;AAAA,IACA,CAAC,eACAJ,2BAAAA;AAAAA,MAACK,KAAAA;AAAAA,MAAA;AAAA,QACC,MAAMC,cAAAA;AAAAA,QACN,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACZ,GAEJ;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACZ,GAKG;AACD,SACEH,2BAAAA,KAAAC,qBAAA,EACE,UAAA;AAAA,IAAAD,2BAAAA,KAAC,QAAA,EAAK,WAAU,kBACd,UAAA;AAAA,MAAAH,2BAAAA,IAAC,UAAK,WAAWE,SAAG,kBAAkB,YAAY,eAAe,GAC9D,UAAA,MACH;AAAA,MACC,QAAQ,WACPF,2BAAAA,IAAC,QAAA,EAAK,WAAU,uEACb,UAAA,KAAA,CACH;AAAA,IAAA,GAEJ;AAAA,IACC,QAAQ,CAAC,0CACP,QAAA,EAAK,WAAU,8CACb,UAAA,MACH;AAAA,IAEFA,2BAAAA;AAAAA,MAACK,KAAAA;AAAAA,MAAA;AAAA,QACC,MAAME,QAAAA;AAAAA,QACN,WAAWL,MAAAA;AAAAA,UACT;AAAA,UACA,CAAC,YAAY;AAAA,QAAA;AAAA,MACf;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;;;;;;"}

package/dist/data/runtime/RuntimeBarSegment.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarSegment.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/RuntimeBarSegment.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGnD,OAAO,EAEL,KAAK,gBAAgB,EACtB,MAAM,4BAA4B,CAAC;AAIpC,eAAO,MAAM,qBAAqB,mDACgB,CAAC;AACnD,eAAO,MAAM,iBAAiB,yFAC0D,CAAC;AAOzF,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,KAAK,EACL,MAAM,EACN,QAAgB,EAChB,WAAmB,EACnB,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,QAAQ,EAAE,SAAS,CAAC;CACrB,+BA8BA;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,WAAmB,GACpB,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,+BAYA;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,OAAe,GAChB,EAAE;IACD,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAC/B,+BA2BA"}
+{"version":3,"file":"RuntimeBarSegment.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/RuntimeBarSegment.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAEL,KAAK,gBAAgB,EACtB,MAAM,4BAA4B,CAAC;AAGpC,eAAO,MAAM,qBAAqB,mDACgB,CAAC;AACnD,eAAO,MAAM,iBAAiB,yFAC0D,CAAC;AAOzF,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,SAAS,EACT,KAAK,EACL,MAAM,EACN,QAAgB,EAChB,WAAmB,EACnB,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,QAAQ,EAAE,SAAS,CAAC;CACrB,+BA0BA;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,WAAmB,GACpB,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,+BAYA;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,OAAe,GAChB,EAAE;IACD,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAC/B,+BA2BA"}

package/dist/data/runtime/RuntimeBarSegment.js

@@ -1,9 +1,7 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { useContext } from "react";
 import { cn } from "../../lib/utils.js";
 import { DropdownMenu } from "../../overlay/DropdownMenu.js";
 import { Icon } from "../Icon.js";
-import { RuntimeBarVariantContext } from "./RuntimeBar.context.js";
 import { UiCheck } from "../../icons/components/UiCheck.js";
 import { UiChevronDown } from "../../icons/components/UiChevronDown.js";
 const SEGMENT_CAPTION_CLASS = "truncate text-xs font-semibold text-foreground";
@@ -18,7 +16,6 @@ function RuntimeSegment({
   className,
   children
 }) {
-  const variant = useContext(RuntimeBarVariantContext);
   return /* @__PURE__ */ jsx(
     DropdownMenu,
     {
@@ -28,8 +25,7 @@ function RuntimeSegment({
       ...header ? { header } : {},
       menuClassName: "max-h-[70vh] min-w-56 max-w-80 overflow-y-auto",
       className: cn(
-        "h-control-h min-w-0 [&>span]:min-w-0 [&>span]:w-full",
-        variant === "combo" ? "rounded-md border border-input bg-background" : "border-l border-border first:border-l-0",
+        "h-control-h min-w-0 border-l border-border first:border-l-0 [&>span]:min-w-0 [&>span]:w-full",
         className
       ),
       trigger: /* @__PURE__ */ jsx(

package/dist/data/runtime/RuntimeBarSegment.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuntimeBarSegment.js","sources":["../../../src/data/runtime/RuntimeBarSegment.tsx"],"sourcesContent":["import { useContext, type ReactNode } from \"react\";\nimport { UiCheck, UiChevronDown } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  DropdownMenu,\n  type DropdownMenuItem,\n} from \"../../overlay/DropdownMenu\";\nimport { Icon } from \"../Icon\";\nimport { RuntimeBarVariantContext } from \"./RuntimeBar.context\";\n\nexport const SEGMENT_CAPTION_CLASS =\n  \"truncate text-xs font-semibold text-foreground\";\nexport const SEGMENT_KEY_CLASS =\n  \"text-[11px] font-semibold uppercase leading-none tracking-wide text-muted-foreground\";\n\n// One trigger in the segmented runtime bar: a dropdown whose button carries the\n// segment's current value. `min-w-0` on the root lets a segment shrink past its\n// content — without it the flex item's automatic minimum size is its max-content\n// width, so a row of segments overflows a narrow container instead of ellipsing\n// its captions.\nexport function RuntimeSegment({\n  items,\n  menuLabel,\n  title,\n  header,\n  disabled = false,\n  hideChevron = false,\n  className,\n  children,\n}: {\n  items: DropdownMenuItem[];\n  menuLabel: string;\n  title: string;\n  header?: ReactNode;\n  disabled?: boolean;\n  /** Drops the trailing chevron, for a segment whose caption is a bare glyph. */\n  hideChevron?: boolean;\n  className?: string | undefined;\n  children: ReactNode;\n}) {\n  const variant = useContext(RuntimeBarVariantContext);\n  return (\n    <DropdownMenu\n      align=\"left\"\n      menuLabel={menuLabel}\n      items={items}\n      {...(header ? { header } : {})}\n      menuClassName=\"max-h-[70vh] min-w-56 max-w-80 overflow-y-auto\"\n      className={cn(\n        \"h-control-h min-w-0 [&>span]:min-w-0 [&>span]:w-full\",\n        variant === \"combo\"\n          ? \"rounded-md border border-input bg-background\"\n          : \"border-l border-border first:border-l-0\",\n        className,\n      )}\n      trigger={\n        <button\n          type=\"button\"\n          disabled={disabled}\n          title={title}\n          className=\"inline-flex h-full w-full min-w-0 items-center gap-1.5 px-density-2 transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring [[aria-expanded=true]_&]:bg-muted\"\n        >\n          <RuntimeSegmentCaption hideChevron={hideChevron}>\n            {children}\n          </RuntimeSegmentCaption>\n        </button>\n      }\n    />\n  );\n}\n\nexport function RuntimeSegmentCaption({\n  children,\n  hideChevron = false,\n}: {\n  children: ReactNode;\n  hideChevron?: boolean;\n}) {\n  return (\n    <>\n      {children}\n      {!hideChevron && (\n        <Icon\n          icon={UiChevronDown}\n          className=\"size-3 shrink-0 text-muted-foreground/70\"\n        />\n      )}\n    </>\n  );\n}\n\nexport function SegmentItemLabel({\n  text,\n  hint,\n  selected,\n  stacked = false,\n}: {\n  text: string;\n  hint?: string | undefined;\n  selected: boolean;\n  stacked?: boolean | undefined;\n}) {\n  return (\n    <>\n      <span className=\"min-w-0 flex-1\">\n        <span className={cn(\"block truncate\", selected && \"font-semibold\")}>\n          {text}\n        </span>\n        {hint && stacked && (\n          <span className=\"block whitespace-normal text-[11px] leading-4 text-muted-foreground\">\n            {hint}\n          </span>\n        )}\n      </span>\n      {hint && !stacked && (\n        <span className=\"shrink-0 text-[11px] text-muted-foreground\">\n          {hint}\n        </span>\n      )}\n      <Icon\n        icon={UiCheck}\n        className={cn(\n          \"size-3.5 shrink-0 text-primary\",\n          !selected && \"invisible\",\n        )}\n      />\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAUO,MAAM,wBACX;AACK,MAAM,oBACX;AAOK,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA;AACF,GAUG;AACD,QAAM,UAAU,WAAW,wBAAwB;AACnD,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN;AAAA,MACA;AAAA,MACC,GAAI,SAAS,EAAE,OAAA,IAAW,CAAA;AAAA,MAC3B,eAAc;AAAA,MACd,WAAW;AAAA,QACT;AAAA,QACA,YAAY,UACR,iDACA;AAAA,QACJ;AAAA,MAAA;AAAA,MAEF,SACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACA,WAAU;AAAA,UAEV,UAAA,oBAAC,uBAAA,EAAsB,aACpB,SAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAIR;AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA,cAAc;AAChB,GAGG;AACD,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA;AAAA,IACA,CAAC,eACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACZ,GAEJ;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACZ,GAKG;AACD,SACE,qBAAA,UAAA,EACE,UAAA;AAAA,IAAA,qBAAC,QAAA,EAAK,WAAU,kBACd,UAAA;AAAA,MAAA,oBAAC,UAAK,WAAW,GAAG,kBAAkB,YAAY,eAAe,GAC9D,UAAA,MACH;AAAA,MACC,QAAQ,WACP,oBAAC,QAAA,EAAK,WAAU,uEACb,UAAA,KAAA,CACH;AAAA,IAAA,GAEJ;AAAA,IACC,QAAQ,CAAC,+BACP,QAAA,EAAK,WAAU,8CACb,UAAA,MACH;AAAA,IAEF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AAAA,UACT;AAAA,UACA,CAAC,YAAY;AAAA,QAAA;AAAA,MACf;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}
+{"version":3,"file":"RuntimeBarSegment.js","sources":["../../../src/data/runtime/RuntimeBarSegment.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { UiCheck, UiChevronDown } from \"../../icons\";\nimport { cn } from \"../../lib/utils\";\nimport {\n  DropdownMenu,\n  type DropdownMenuItem,\n} from \"../../overlay/DropdownMenu\";\nimport { Icon } from \"../Icon\";\n\nexport const SEGMENT_CAPTION_CLASS =\n  \"truncate text-xs font-semibold text-foreground\";\nexport const SEGMENT_KEY_CLASS =\n  \"text-[11px] font-semibold uppercase leading-none tracking-wide text-muted-foreground\";\n\n// One trigger in the segmented runtime bar: a dropdown whose button carries the\n// segment's current value. `min-w-0` on the root lets a segment shrink past its\n// content — without it the flex item's automatic minimum size is its max-content\n// width, so a row of segments overflows a narrow container instead of ellipsing\n// its captions.\nexport function RuntimeSegment({\n  items,\n  menuLabel,\n  title,\n  header,\n  disabled = false,\n  hideChevron = false,\n  className,\n  children,\n}: {\n  items: DropdownMenuItem[];\n  menuLabel: string;\n  title: string;\n  header?: ReactNode;\n  disabled?: boolean;\n  /** Drops the trailing chevron, for a segment whose caption is a bare glyph. */\n  hideChevron?: boolean;\n  className?: string | undefined;\n  children: ReactNode;\n}) {\n  return (\n    <DropdownMenu\n      align=\"left\"\n      menuLabel={menuLabel}\n      items={items}\n      {...(header ? { header } : {})}\n      menuClassName=\"max-h-[70vh] min-w-56 max-w-80 overflow-y-auto\"\n      className={cn(\n        \"h-control-h min-w-0 border-l border-border first:border-l-0 [&>span]:min-w-0 [&>span]:w-full\",\n        className,\n      )}\n      trigger={\n        <button\n          type=\"button\"\n          disabled={disabled}\n          title={title}\n          className=\"inline-flex h-full w-full min-w-0 items-center gap-1.5 px-density-2 transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring [[aria-expanded=true]_&]:bg-muted\"\n        >\n          <RuntimeSegmentCaption hideChevron={hideChevron}>\n            {children}\n          </RuntimeSegmentCaption>\n        </button>\n      }\n    />\n  );\n}\n\nexport function RuntimeSegmentCaption({\n  children,\n  hideChevron = false,\n}: {\n  children: ReactNode;\n  hideChevron?: boolean;\n}) {\n  return (\n    <>\n      {children}\n      {!hideChevron && (\n        <Icon\n          icon={UiChevronDown}\n          className=\"size-3 shrink-0 text-muted-foreground/70\"\n        />\n      )}\n    </>\n  );\n}\n\nexport function SegmentItemLabel({\n  text,\n  hint,\n  selected,\n  stacked = false,\n}: {\n  text: string;\n  hint?: string | undefined;\n  selected: boolean;\n  stacked?: boolean | undefined;\n}) {\n  return (\n    <>\n      <span className=\"min-w-0 flex-1\">\n        <span className={cn(\"block truncate\", selected && \"font-semibold\")}>\n          {text}\n        </span>\n        {hint && stacked && (\n          <span className=\"block whitespace-normal text-[11px] leading-4 text-muted-foreground\">\n            {hint}\n          </span>\n        )}\n      </span>\n      {hint && !stacked && (\n        <span className=\"shrink-0 text-[11px] text-muted-foreground\">\n          {hint}\n        </span>\n      )}\n      <Icon\n        icon={UiCheck}\n        className={cn(\n          \"size-3.5 shrink-0 text-primary\",\n          !selected && \"invisible\",\n        )}\n      />\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;;;AASO,MAAM,wBACX;AACK,MAAM,oBACX;AAOK,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA;AACF,GAUG;AACD,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN;AAAA,MACA;AAAA,MACC,GAAI,SAAS,EAAE,OAAA,IAAW,CAAA;AAAA,MAC3B,eAAc;AAAA,MACd,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAEF,SACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACA,WAAU;AAAA,UAEV,UAAA,oBAAC,uBAAA,EAAsB,aACpB,SAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAIR;AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA,cAAc;AAChB,GAGG;AACD,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA;AAAA,IACA,CAAC,eACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACZ,GAEJ;AAEJ;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AACZ,GAKG;AACD,SACE,qBAAA,UAAA,EACE,UAAA;AAAA,IAAA,qBAAC,QAAA,EAAK,WAAU,kBACd,UAAA;AAAA,MAAA,oBAAC,UAAK,WAAW,GAAG,kBAAkB,YAAY,eAAe,GAC9D,UAAA,MACH;AAAA,MACC,QAAQ,WACP,oBAAC,QAAA,EAAK,WAAU,uEACb,UAAA,KAAA,CACH;AAAA,IAAA,GAEJ;AAAA,IACC,QAAQ,CAAC,+BACP,QAAA,EAAK,WAAU,8CACb,UAAA,MACH;AAAA,IAEF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AAAA,UACT;AAAA,UACA,CAAC,YAAY;AAAA,QAAA;AAAA,MACf;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}

package/dist/data/runtime/use-runtime-bar-overflow.cjs

@@ -5,13 +5,12 @@ function runtimeBarInlineCount({
   width,
   identity,
   trigger,
-  fields,
-  gap
+  fields
 }) {
-  let occupied = identity + trigger + gap;
+  let occupied = identity + trigger;
   let count = 0;
   for (const field of fields) {
-    occupied += field + gap;
+    occupied += field;
     if (occupied > width) break;
     count++;
   }
@@ -31,16 +30,11 @@ function useRuntimeBarOverflow() {
       throw new Error(
         "Runtime bar measurement requires identity and a menu trigger"
       );
-    const spacing = getComputedStyle(measurement).columnGap;
-    const gap = spacing === "normal" || spacing === "" ? 0 : Number.parseFloat(spacing);
-    if (!Number.isFinite(gap))
-      throw new Error(`Invalid runtime bar spacing: ${spacing}`);
     const count = runtimeBarInlineCount({
       width: width - 2,
       identity: identity.getBoundingClientRect().width,
       trigger: trigger.getBoundingClientRect().width,
-      fields: controls.map((node) => node.getBoundingClientRect().width),
-      gap
+      fields: controls.map((node) => node.getBoundingClientRect().width)
     });
     setVisibleCount((previous) => previous === count ? previous : count);
   }, [container, measurement]);

package/dist/data/runtime/use-runtime-bar-overflow.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-runtime-bar-overflow.cjs","sources":["../../../src/data/runtime/use-runtime-bar-overflow.ts"],"sourcesContent":["import { useCallback, useLayoutEffect, useState } from \"react\";\n\nexport function runtimeBarInlineCount({\n  width,\n  identity,\n  trigger,\n  fields,\n  gap,\n}: {\n  width: number;\n  identity: number;\n  trigger: number;\n  fields: number[];\n  gap: number;\n}) {\n  let occupied = identity + trigger + gap;\n  let count = 0;\n  for (const field of fields) {\n    occupied += field + gap;\n    if (occupied > width) break;\n    count++;\n  }\n  return count;\n}\n\nexport function useRuntimeBarOverflow() {\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [measurement, setMeasurement] = useState<HTMLDivElement | null>(null);\n  const [visibleCount, setVisibleCount] = useState(Infinity);\n\n  const measure = useCallback(() => {\n    if (!container || !measurement) return;\n    const width = container.getBoundingClientRect().width;\n    if (width <= 0) return;\n    const [identity, ...controls] = [...measurement.children];\n    const trigger = controls.pop();\n    if (!identity || !trigger)\n      throw new Error(\n        \"Runtime bar measurement requires identity and a menu trigger\",\n      );\n    const spacing = getComputedStyle(measurement).columnGap;\n    const gap =\n      spacing === \"normal\" || spacing === \"\" ? 0 : Number.parseFloat(spacing);\n    if (!Number.isFinite(gap))\n      throw new Error(`Invalid runtime bar spacing: ${spacing}`);\n    const count = runtimeBarInlineCount({\n      width: width - 2,\n      identity: identity.getBoundingClientRect().width,\n      trigger: trigger.getBoundingClientRect().width,\n      fields: controls.map((node) => node.getBoundingClientRect().width),\n      gap,\n    });\n    setVisibleCount((previous) => (previous === count ? previous : count));\n  }, [container, measurement]);\n\n  useLayoutEffect(() => {\n    measure();\n  });\n\n  useLayoutEffect(() => {\n    if (!container || !measurement) return;\n    measure();\n    const observer =\n      typeof ResizeObserver === \"undefined\"\n        ? undefined\n        : new ResizeObserver(measure);\n    observer?.observe(container);\n    observer?.observe(measurement);\n    window.addEventListener(\"resize\", measure);\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener(\"resize\", measure);\n    };\n  }, [container, measurement, measure]);\n\n  return {\n    containerRef: setContainer,\n    measurementRef: setMeasurement,\n    visibleCount,\n  };\n}\n"],"names":["useState","useCallback","useLayoutEffect"],"mappings":";;;AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,MAAI,WAAW,WAAW,UAAU;AACpC,MAAI,QAAQ;AACZ,aAAW,SAAS,QAAQ;AAC1B,gBAAY,QAAQ;AACpB,QAAI,WAAW,MAAO;AACtB;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,wBAAwB;AACtC,QAAM,CAAC,WAAW,YAAY,IAAIA,MAAAA,SAAgC,IAAI;AACtE,QAAM,CAAC,aAAa,cAAc,IAAIA,MAAAA,SAAgC,IAAI;AAC1E,QAAM,CAAC,cAAc,eAAe,IAAIA,MAAAA,SAAS,QAAQ;AAEzD,QAAM,UAAUC,MAAAA,YAAY,MAAM;AAChC,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,UAAM,QAAQ,UAAU,sBAAA,EAAwB;AAChD,QAAI,SAAS,EAAG;AAChB,UAAM,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,GAAG,YAAY,QAAQ;AACxD,UAAM,UAAU,SAAS,IAAA;AACzB,QAAI,CAAC,YAAY,CAAC;AAChB,YAAM,IAAI;AAAA,QACR;AAAA,MAAA;AAEJ,UAAM,UAAU,iBAAiB,WAAW,EAAE;AAC9C,UAAM,MACJ,YAAY,YAAY,YAAY,KAAK,IAAI,OAAO,WAAW,OAAO;AACxE,QAAI,CAAC,OAAO,SAAS,GAAG;AACtB,YAAM,IAAI,MAAM,gCAAgC,OAAO,EAAE;AAC3D,UAAM,QAAQ,sBAAsB;AAAA,MAClC,OAAO,QAAQ;AAAA,MACf,UAAU,SAAS,sBAAA,EAAwB;AAAA,MAC3C,SAAS,QAAQ,sBAAA,EAAwB;AAAA,MACzC,QAAQ,SAAS,IAAI,CAAC,SAAS,KAAK,sBAAA,EAAwB,KAAK;AAAA,MACjE;AAAA,IAAA,CACD;AACD,oBAAgB,CAAC,aAAc,aAAa,QAAQ,WAAW,KAAM;AAAA,EACvE,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3BC,QAAAA,gBAAgB,MAAM;AACpB,YAAA;AAAA,EACF,CAAC;AAEDA,QAAAA,gBAAgB,MAAM;AACpB,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,YAAA;AACA,UAAM,WACJ,OAAO,mBAAmB,cACtB,SACA,IAAI,eAAe,OAAO;AAChC,yCAAU,QAAQ;AAClB,yCAAU,QAAQ;AAClB,WAAO,iBAAiB,UAAU,OAAO;AACzC,WAAO,MAAM;AACX,2CAAU;AACV,aAAO,oBAAoB,UAAU,OAAO;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,WAAW,aAAa,OAAO,CAAC;AAEpC,SAAO;AAAA,IACL,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB;AAAA,EAAA;AAEJ;;;"}
+{"version":3,"file":"use-runtime-bar-overflow.cjs","sources":["../../../src/data/runtime/use-runtime-bar-overflow.ts"],"sourcesContent":["import { useCallback, useLayoutEffect, useState } from \"react\";\n\nexport function runtimeBarInlineCount({\n  width,\n  identity,\n  trigger,\n  fields,\n}: {\n  width: number;\n  identity: number;\n  trigger: number;\n  fields: number[];\n}) {\n  let occupied = identity + trigger;\n  let count = 0;\n  for (const field of fields) {\n    occupied += field;\n    if (occupied > width) break;\n    count++;\n  }\n  return count;\n}\n\nexport function useRuntimeBarOverflow() {\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [measurement, setMeasurement] = useState<HTMLDivElement | null>(null);\n  const [visibleCount, setVisibleCount] = useState(Infinity);\n\n  const measure = useCallback(() => {\n    if (!container || !measurement) return;\n    const width = container.getBoundingClientRect().width;\n    if (width <= 0) return;\n    const [identity, ...controls] = [...measurement.children];\n    const trigger = controls.pop();\n    if (!identity || !trigger)\n      throw new Error(\n        \"Runtime bar measurement requires identity and a menu trigger\",\n      );\n    const count = runtimeBarInlineCount({\n      width: width - 2,\n      identity: identity.getBoundingClientRect().width,\n      trigger: trigger.getBoundingClientRect().width,\n      fields: controls.map((node) => node.getBoundingClientRect().width),\n    });\n    setVisibleCount((previous) => (previous === count ? previous : count));\n  }, [container, measurement]);\n\n  useLayoutEffect(() => {\n    measure();\n  });\n\n  useLayoutEffect(() => {\n    if (!container || !measurement) return;\n    measure();\n    const observer =\n      typeof ResizeObserver === \"undefined\"\n        ? undefined\n        : new ResizeObserver(measure);\n    observer?.observe(container);\n    observer?.observe(measurement);\n    window.addEventListener(\"resize\", measure);\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener(\"resize\", measure);\n    };\n  }, [container, measurement, measure]);\n\n  return {\n    containerRef: setContainer,\n    measurementRef: setMeasurement,\n    visibleCount,\n  };\n}\n"],"names":["useState","useCallback","useLayoutEffect"],"mappings":";;;AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,MAAI,WAAW,WAAW;AAC1B,MAAI,QAAQ;AACZ,aAAW,SAAS,QAAQ;AAC1B,gBAAY;AACZ,QAAI,WAAW,MAAO;AACtB;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,wBAAwB;AACtC,QAAM,CAAC,WAAW,YAAY,IAAIA,MAAAA,SAAgC,IAAI;AACtE,QAAM,CAAC,aAAa,cAAc,IAAIA,MAAAA,SAAgC,IAAI;AAC1E,QAAM,CAAC,cAAc,eAAe,IAAIA,MAAAA,SAAS,QAAQ;AAEzD,QAAM,UAAUC,MAAAA,YAAY,MAAM;AAChC,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,UAAM,QAAQ,UAAU,sBAAA,EAAwB;AAChD,QAAI,SAAS,EAAG;AAChB,UAAM,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,GAAG,YAAY,QAAQ;AACxD,UAAM,UAAU,SAAS,IAAA;AACzB,QAAI,CAAC,YAAY,CAAC;AAChB,YAAM,IAAI;AAAA,QACR;AAAA,MAAA;AAEJ,UAAM,QAAQ,sBAAsB;AAAA,MAClC,OAAO,QAAQ;AAAA,MACf,UAAU,SAAS,sBAAA,EAAwB;AAAA,MAC3C,SAAS,QAAQ,sBAAA,EAAwB;AAAA,MACzC,QAAQ,SAAS,IAAI,CAAC,SAAS,KAAK,sBAAA,EAAwB,KAAK;AAAA,IAAA,CAClE;AACD,oBAAgB,CAAC,aAAc,aAAa,QAAQ,WAAW,KAAM;AAAA,EACvE,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3BC,QAAAA,gBAAgB,MAAM;AACpB,YAAA;AAAA,EACF,CAAC;AAEDA,QAAAA,gBAAgB,MAAM;AACpB,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,YAAA;AACA,UAAM,WACJ,OAAO,mBAAmB,cACtB,SACA,IAAI,eAAe,OAAO;AAChC,yCAAU,QAAQ;AAClB,yCAAU,QAAQ;AAClB,WAAO,iBAAiB,UAAU,OAAO;AACzC,WAAO,MAAM;AACX,2CAAU;AACV,aAAO,oBAAoB,UAAU,OAAO;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,WAAW,aAAa,OAAO,CAAC;AAEpC,SAAO;AAAA,IACL,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB;AAAA,EAAA;AAEJ;;;"}

package/dist/data/runtime/use-runtime-bar-overflow.d.ts

@@ -1,9 +1,8 @@
-export declare function runtimeBarInlineCount({ width, identity, trigger, fields, gap, }: {
+export declare function runtimeBarInlineCount({ width, identity, trigger, fields, }: {
     width: number;
     identity: number;
     trigger: number;
     fields: number[];
-    gap: number;
 }): number;
 export declare function useRuntimeBarOverflow(): {
     containerRef: import('react').Dispatch<import('react').SetStateAction<HTMLDivElement | null>>;

package/dist/data/runtime/use-runtime-bar-overflow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-runtime-bar-overflow.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/use-runtime-bar-overflow.ts"],"names":[],"mappings":"AAEA,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,QAAQ,EACR,OAAO,EACP,MAAM,EACN,GAAG,GACJ,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,GAAG,EAAE,MAAM,CAAC;CACb,UASA;AAED,wBAAgB,qBAAqB;;;;EAuDpC"}
+{"version":3,"file":"use-runtime-bar-overflow.d.ts","sourceRoot":"","sources":["../../../src/data/runtime/use-runtime-bar-overflow.ts"],"names":[],"mappings":"AAEA,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,QAAQ,EACR,OAAO,EACP,MAAM,GACP,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB,UASA;AAED,wBAAgB,qBAAqB;;;;EAiDpC"}

package/dist/data/runtime/use-runtime-bar-overflow.js

@@ -3,13 +3,12 @@ function runtimeBarInlineCount({
   width,
   identity,
   trigger,
-  fields,
-  gap
+  fields
 }) {
-  let occupied = identity + trigger + gap;
+  let occupied = identity + trigger;
   let count = 0;
   for (const field of fields) {
-    occupied += field + gap;
+    occupied += field;
     if (occupied > width) break;
     count++;
   }
@@ -29,16 +28,11 @@ function useRuntimeBarOverflow() {
       throw new Error(
         "Runtime bar measurement requires identity and a menu trigger"
       );
-    const spacing = getComputedStyle(measurement).columnGap;
-    const gap = spacing === "normal" || spacing === "" ? 0 : Number.parseFloat(spacing);
-    if (!Number.isFinite(gap))
-      throw new Error(`Invalid runtime bar spacing: ${spacing}`);
     const count = runtimeBarInlineCount({
       width: width - 2,
       identity: identity.getBoundingClientRect().width,
       trigger: trigger.getBoundingClientRect().width,
-      fields: controls.map((node) => node.getBoundingClientRect().width),
-      gap
+      fields: controls.map((node) => node.getBoundingClientRect().width)
     });
     setVisibleCount((previous) => previous === count ? previous : count);
   }, [container, measurement]);

package/dist/data/runtime/use-runtime-bar-overflow.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-runtime-bar-overflow.js","sources":["../../../src/data/runtime/use-runtime-bar-overflow.ts"],"sourcesContent":["import { useCallback, useLayoutEffect, useState } from \"react\";\n\nexport function runtimeBarInlineCount({\n  width,\n  identity,\n  trigger,\n  fields,\n  gap,\n}: {\n  width: number;\n  identity: number;\n  trigger: number;\n  fields: number[];\n  gap: number;\n}) {\n  let occupied = identity + trigger + gap;\n  let count = 0;\n  for (const field of fields) {\n    occupied += field + gap;\n    if (occupied > width) break;\n    count++;\n  }\n  return count;\n}\n\nexport function useRuntimeBarOverflow() {\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [measurement, setMeasurement] = useState<HTMLDivElement | null>(null);\n  const [visibleCount, setVisibleCount] = useState(Infinity);\n\n  const measure = useCallback(() => {\n    if (!container || !measurement) return;\n    const width = container.getBoundingClientRect().width;\n    if (width <= 0) return;\n    const [identity, ...controls] = [...measurement.children];\n    const trigger = controls.pop();\n    if (!identity || !trigger)\n      throw new Error(\n        \"Runtime bar measurement requires identity and a menu trigger\",\n      );\n    const spacing = getComputedStyle(measurement).columnGap;\n    const gap =\n      spacing === \"normal\" || spacing === \"\" ? 0 : Number.parseFloat(spacing);\n    if (!Number.isFinite(gap))\n      throw new Error(`Invalid runtime bar spacing: ${spacing}`);\n    const count = runtimeBarInlineCount({\n      width: width - 2,\n      identity: identity.getBoundingClientRect().width,\n      trigger: trigger.getBoundingClientRect().width,\n      fields: controls.map((node) => node.getBoundingClientRect().width),\n      gap,\n    });\n    setVisibleCount((previous) => (previous === count ? previous : count));\n  }, [container, measurement]);\n\n  useLayoutEffect(() => {\n    measure();\n  });\n\n  useLayoutEffect(() => {\n    if (!container || !measurement) return;\n    measure();\n    const observer =\n      typeof ResizeObserver === \"undefined\"\n        ? undefined\n        : new ResizeObserver(measure);\n    observer?.observe(container);\n    observer?.observe(measurement);\n    window.addEventListener(\"resize\", measure);\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener(\"resize\", measure);\n    };\n  }, [container, measurement, measure]);\n\n  return {\n    containerRef: setContainer,\n    measurementRef: setMeasurement,\n    visibleCount,\n  };\n}\n"],"names":[],"mappings":";AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,MAAI,WAAW,WAAW,UAAU;AACpC,MAAI,QAAQ;AACZ,aAAW,SAAS,QAAQ;AAC1B,gBAAY,QAAQ;AACpB,QAAI,WAAW,MAAO;AACtB;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,wBAAwB;AACtC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAgC,IAAI;AACtE,QAAM,CAAC,aAAa,cAAc,IAAI,SAAgC,IAAI;AAC1E,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,QAAQ;AAEzD,QAAM,UAAU,YAAY,MAAM;AAChC,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,UAAM,QAAQ,UAAU,sBAAA,EAAwB;AAChD,QAAI,SAAS,EAAG;AAChB,UAAM,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,GAAG,YAAY,QAAQ;AACxD,UAAM,UAAU,SAAS,IAAA;AACzB,QAAI,CAAC,YAAY,CAAC;AAChB,YAAM,IAAI;AAAA,QACR;AAAA,MAAA;AAEJ,UAAM,UAAU,iBAAiB,WAAW,EAAE;AAC9C,UAAM,MACJ,YAAY,YAAY,YAAY,KAAK,IAAI,OAAO,WAAW,OAAO;AACxE,QAAI,CAAC,OAAO,SAAS,GAAG;AACtB,YAAM,IAAI,MAAM,gCAAgC,OAAO,EAAE;AAC3D,UAAM,QAAQ,sBAAsB;AAAA,MAClC,OAAO,QAAQ;AAAA,MACf,UAAU,SAAS,sBAAA,EAAwB;AAAA,MAC3C,SAAS,QAAQ,sBAAA,EAAwB;AAAA,MACzC,QAAQ,SAAS,IAAI,CAAC,SAAS,KAAK,sBAAA,EAAwB,KAAK;AAAA,MACjE;AAAA,IAAA,CACD;AACD,oBAAgB,CAAC,aAAc,aAAa,QAAQ,WAAW,KAAM;AAAA,EACvE,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3B,kBAAgB,MAAM;AACpB,YAAA;AAAA,EACF,CAAC;AAED,kBAAgB,MAAM;AACpB,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,YAAA;AACA,UAAM,WACJ,OAAO,mBAAmB,cACtB,SACA,IAAI,eAAe,OAAO;AAChC,yCAAU,QAAQ;AAClB,yCAAU,QAAQ;AAClB,WAAO,iBAAiB,UAAU,OAAO;AACzC,WAAO,MAAM;AACX,2CAAU;AACV,aAAO,oBAAoB,UAAU,OAAO;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,WAAW,aAAa,OAAO,CAAC;AAEpC,SAAO;AAAA,IACL,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"use-runtime-bar-overflow.js","sources":["../../../src/data/runtime/use-runtime-bar-overflow.ts"],"sourcesContent":["import { useCallback, useLayoutEffect, useState } from \"react\";\n\nexport function runtimeBarInlineCount({\n  width,\n  identity,\n  trigger,\n  fields,\n}: {\n  width: number;\n  identity: number;\n  trigger: number;\n  fields: number[];\n}) {\n  let occupied = identity + trigger;\n  let count = 0;\n  for (const field of fields) {\n    occupied += field;\n    if (occupied > width) break;\n    count++;\n  }\n  return count;\n}\n\nexport function useRuntimeBarOverflow() {\n  const [container, setContainer] = useState<HTMLDivElement | null>(null);\n  const [measurement, setMeasurement] = useState<HTMLDivElement | null>(null);\n  const [visibleCount, setVisibleCount] = useState(Infinity);\n\n  const measure = useCallback(() => {\n    if (!container || !measurement) return;\n    const width = container.getBoundingClientRect().width;\n    if (width <= 0) return;\n    const [identity, ...controls] = [...measurement.children];\n    const trigger = controls.pop();\n    if (!identity || !trigger)\n      throw new Error(\n        \"Runtime bar measurement requires identity and a menu trigger\",\n      );\n    const count = runtimeBarInlineCount({\n      width: width - 2,\n      identity: identity.getBoundingClientRect().width,\n      trigger: trigger.getBoundingClientRect().width,\n      fields: controls.map((node) => node.getBoundingClientRect().width),\n    });\n    setVisibleCount((previous) => (previous === count ? previous : count));\n  }, [container, measurement]);\n\n  useLayoutEffect(() => {\n    measure();\n  });\n\n  useLayoutEffect(() => {\n    if (!container || !measurement) return;\n    measure();\n    const observer =\n      typeof ResizeObserver === \"undefined\"\n        ? undefined\n        : new ResizeObserver(measure);\n    observer?.observe(container);\n    observer?.observe(measurement);\n    window.addEventListener(\"resize\", measure);\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener(\"resize\", measure);\n    };\n  }, [container, measurement, measure]);\n\n  return {\n    containerRef: setContainer,\n    measurementRef: setMeasurement,\n    visibleCount,\n  };\n}\n"],"names":[],"mappings":";AAEO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,MAAI,WAAW,WAAW;AAC1B,MAAI,QAAQ;AACZ,aAAW,SAAS,QAAQ;AAC1B,gBAAY;AACZ,QAAI,WAAW,MAAO;AACtB;AAAA,EACF;AACA,SAAO;AACT;AAEO,SAAS,wBAAwB;AACtC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAgC,IAAI;AACtE,QAAM,CAAC,aAAa,cAAc,IAAI,SAAgC,IAAI;AAC1E,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,QAAQ;AAEzD,QAAM,UAAU,YAAY,MAAM;AAChC,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,UAAM,QAAQ,UAAU,sBAAA,EAAwB;AAChD,QAAI,SAAS,EAAG;AAChB,UAAM,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,GAAG,YAAY,QAAQ;AACxD,UAAM,UAAU,SAAS,IAAA;AACzB,QAAI,CAAC,YAAY,CAAC;AAChB,YAAM,IAAI;AAAA,QACR;AAAA,MAAA;AAEJ,UAAM,QAAQ,sBAAsB;AAAA,MAClC,OAAO,QAAQ;AAAA,MACf,UAAU,SAAS,sBAAA,EAAwB;AAAA,MAC3C,SAAS,QAAQ,sBAAA,EAAwB;AAAA,MACzC,QAAQ,SAAS,IAAI,CAAC,SAAS,KAAK,sBAAA,EAAwB,KAAK;AAAA,IAAA,CAClE;AACD,oBAAgB,CAAC,aAAc,aAAa,QAAQ,WAAW,KAAM;AAAA,EACvE,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3B,kBAAgB,MAAM;AACpB,YAAA;AAAA,EACF,CAAC;AAED,kBAAgB,MAAM;AACpB,QAAI,CAAC,aAAa,CAAC,YAAa;AAChC,YAAA;AACA,UAAM,WACJ,OAAO,mBAAmB,cACtB,SACA,IAAI,eAAe,OAAO;AAChC,yCAAU,QAAQ;AAClB,yCAAU,QAAQ;AAClB,WAAO,iBAAiB,UAAU,OAAO;AACzC,WAAO,MAAM;AACX,2CAAU;AACV,aAAO,oBAAoB,UAAU,OAAO;AAAA,IAC9C;AAAA,EACF,GAAG,CAAC,WAAW,aAAa,OAAO,CAAC;AAEpC,SAAO;AAAA,IACL,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB;AAAA,EAAA;AAEJ;"}

package/dist/data/test-runner/TestRunner.fixtures.d.ts

@@ -4,26 +4,6 @@ import { Test } from './types.js';
 export declare const completedTests: Test[];
 /** Same forest, but as an in-flight run: some running, some queued. */
 export declare const runningTests: Test[];
-/**
- * A suite whose leaves carry very large payloads: a 6×4 deep object, a
- * 500-row array, and an 800-line log — to stress JsonView, LogViewer, and the
- * detail pane's independent scrolling.
- */
-export declare const largeDetailTests: Test[];
-/**
- * A large forest (4 roots × depth 3 × breadth 4 = 340 nodes / 256 leaves) whose
- * every leaf carries the LargePayloads-sized detail (deep object + 500-row array
- * + 800-line log). Used for the dialog stress test: a long scrolling tree on the
- * left and very large detail payloads on the right.
- *
- * Depth is 3, not 4: at depth 4 (~1024 leaves) the jsdom unit test auto-expands
- * the failing branches and renders the whole tree, which OOM'd CI's
- * memory-constrained shared vitest worker (a STACK_TRACE_ERROR on the "very
- * large tree" test) once this package's suite grew. 340 nodes still scrolls and
- * stresses the detail panes while staying within the worker's budget; the
- * browser story renders the same fixture without the jsdom memory ceiling.
- */
-export declare const largeTreeTests: Test[];
 /**
  * Demo adapter proving the registry extension point: nodes named "setup" get a
  * custom detail body, an extra "Context" tab, and a node action — the seam that

package/dist/data/test-runner/TestRunner.fixtures.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TestRunner.fixtures.d.ts","sourceRoot":"","sources":["../../../src/data/test-runner/TestRunner.fixtures.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAIpC,mFAAmF;AACnF,eAAO,MAAM,cAAc,EAAE,IAAI,EAmFhC,CAAC;AAEF,uEAAuE;AACvE,eAAO,MAAM,YAAY,EAAE,IAAI,EA+B9B,CAAC;AAsCF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAE,IAAI,EA0BlC,CAAC;AA0DF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,cAAc,EAAE,IAAI,EAEhC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,eA0C1B,CAAC"}
+{"version":3,"file":"TestRunner.fixtures.d.ts","sourceRoot":"","sources":["../../../src/data/test-runner/TestRunner.fixtures.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAIpC,mFAAmF;AACnF,eAAO,MAAM,cAAc,EAAE,IAAI,EAmFhC,CAAC;AAEF,uEAAuE;AACvE,eAAO,MAAM,YAAY,EAAE,IAAI,EA+B9B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,eA0C1B,CAAC"}