@nurix/ui-component-library 1.1.5-stage.129 → 1.1.5-stage.130

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.js +68 -38
  2. package/dist/index.mjs +68 -38
  3. package/dist/styles.css +2 -2
  4. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -9860,24 +9860,27 @@ var TYPOGRAPHY_TOKENS = {
9860
9860
  // 16px
9861
9861
  b2: "text-sm leading-5 font-normal",
9862
9862
  // 14px
9863
- // Subtext
9864
- "subtext-xs": "text-xs leading-4 font-normal",
9863
+ // Subtext — block so stacked label+subtext rows don't collapse onto
9864
+ // one line when wrapped in a flex/space-y container (default tag is
9865
+ // <span>, which is inline-by-default).
9866
+ "subtext-xs": "block text-xs leading-4 font-normal",
9865
9867
  // 12px
9866
- "subtext-sm": "text-sm leading-5 font-normal",
9868
+ "subtext-sm": "block text-sm leading-5 font-normal",
9867
9869
  // 14px
9868
9870
  // Input
9869
9871
  "input-xs": "text-xs leading-4 font-medium",
9870
9872
  // 12px
9871
9873
  "input-sm": "text-sm leading-5 font-medium",
9872
9874
  // 14px
9873
- // Labels
9874
- "label-sm": "text-xs leading-4 font-medium",
9875
+ // Labels — block so stacked label+subtext rows don't collapse onto
9876
+ // one line (default tag <label> is inline-by-default).
9877
+ "label-sm": "block text-xs leading-4 font-medium",
9875
9878
  // 12px
9876
- "label-sm-mono": "text-xs leading-4 font-medium",
9879
+ "label-sm-mono": "block text-xs leading-4 font-medium",
9877
9880
  // 12px mono
9878
- "label-md": "text-sm leading-5 font-medium",
9881
+ "label-md": "block text-sm leading-5 font-medium",
9879
9882
  // 14px
9880
- "label-lg": "text-base leading-6 font-medium"
9883
+ "label-lg": "block text-base leading-6 font-medium"
9881
9884
  // 16px
9882
9885
  },
9883
9886
  /**
@@ -10613,7 +10616,7 @@ var PlaySelect = React23.forwardRef(
10613
10616
  children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(TriggerIcon, { className: cn(!isSelectedPlaying && "ml-px") })
10614
10617
  }
10615
10618
  );
10616
- const defaultTriggerClassName = "!h-8 !rounded-full !px-3 !py-0 !gap-2";
10619
+ const defaultTriggerClassName = "!h-8 !rounded-xl !px-3 !py-0 !gap-2";
10617
10620
  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
10618
10621
  "div",
10619
10622
  {
@@ -17511,8 +17514,10 @@ var RULE_BUILDER_TOKENS = {
17511
17514
  // White card — Figma: bg-white, rounded-[12px], overflow-clip
17512
17515
  card: "flex flex-col gap-2 overflow-clip pb-2 rounded-xl bg-token-white w-full",
17513
17516
  cardCollapsed: "flex flex-col overflow-clip rounded-xl bg-token-white w-full",
17514
- // Header row — Figma: p-2, justify-between, items-center
17515
- header: "flex items-center justify-between p-2 w-full bg-token-white",
17517
+ // Header row — Figma 6587:470, p-2, justify-between, items-center.
17518
+ // Acts as the rule's expand/collapse toggle: hover and pressed states use
17519
+ // the standard interaction tokens (matches Accordion / sectionTrigger).
17520
+ header: "group flex items-center justify-between p-2 w-full bg-token-white cursor-pointer rounded-xl transition-colors hover:bg-interaction-hov-solid-primary active:bg-interaction-pressed-opacity-secondary",
17516
17521
  headerActions: "flex items-center gap-3 shrink-0",
17517
17522
  // Body — Figma: flex-col, gap-2, px-2
17518
17523
  body: "flex flex-col gap-2 px-2 w-full",
@@ -17582,34 +17587,59 @@ var RuleBuilder = React49.forwardRef(
17582
17587
  {
17583
17588
  className: open ? RULE_BUILDER_TOKENS.card : RULE_BUILDER_TOKENS.cardCollapsed,
17584
17589
  children: [
17585
- /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: RULE_BUILDER_TOKENS.header, children: [
17586
- /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Badge, { variant: "default", interactive: false, leadingIcon: titleIconNode, children: title }),
17587
- /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: RULE_BUILDER_TOKENS.headerActions, children: [
17588
- onDelete ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
17589
- Button,
17590
- {
17591
- variant: "iconLink",
17592
- size: "iconXs",
17593
- leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.Trash2, {}),
17594
- onClick: onDelete,
17595
- "aria-label": "Delete rule",
17596
- "data-testid": "rule-builder-delete"
17597
- }
17598
- ) : null,
17599
- /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
17600
- Button,
17601
- {
17602
- variant: "iconLink",
17603
- size: "iconXs",
17604
- leadingIcon: open ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.ChevronUp, {}) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.ChevronDown, {}),
17605
- onClick: handleToggle,
17606
- "aria-expanded": open,
17607
- "aria-label": open ? "Collapse rule" : "Expand rule",
17608
- "data-testid": "rule-builder-toggle"
17590
+ /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
17591
+ "div",
17592
+ {
17593
+ role: "button",
17594
+ tabIndex: 0,
17595
+ className: RULE_BUILDER_TOKENS.header,
17596
+ onClick: handleToggle,
17597
+ onKeyDown: (e) => {
17598
+ if (e.key === "Enter" || e.key === " ") {
17599
+ e.preventDefault();
17600
+ handleToggle();
17609
17601
  }
17610
- )
17611
- ] })
17612
- ] }),
17602
+ },
17603
+ "aria-expanded": open,
17604
+ "aria-label": open ? "Collapse rule" : "Expand rule",
17605
+ "data-testid": "rule-builder-header",
17606
+ children: [
17607
+ /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Badge, { variant: "default", interactive: false, leadingIcon: titleIconNode, children: title }),
17608
+ /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
17609
+ "div",
17610
+ {
17611
+ className: RULE_BUILDER_TOKENS.headerActions,
17612
+ onClick: (e) => e.stopPropagation(),
17613
+ children: [
17614
+ onDelete ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
17615
+ Button,
17616
+ {
17617
+ variant: "iconLink",
17618
+ size: "iconXs",
17619
+ leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.Trash2, {}),
17620
+ onClick: onDelete,
17621
+ "aria-label": "Delete rule",
17622
+ "data-testid": "rule-builder-delete"
17623
+ }
17624
+ ) : null,
17625
+ /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
17626
+ Button,
17627
+ {
17628
+ variant: "iconLink",
17629
+ size: "iconXs",
17630
+ leadingIcon: open ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.ChevronUp, {}) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.ChevronDown, {}),
17631
+ onClick: handleToggle,
17632
+ "aria-expanded": open,
17633
+ "aria-label": open ? "Collapse rule" : "Expand rule",
17634
+ "data-testid": "rule-builder-toggle"
17635
+ }
17636
+ )
17637
+ ]
17638
+ }
17639
+ )
17640
+ ]
17641
+ }
17642
+ ),
17613
17643
  open ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.body, children }) : null
17614
17644
  ]
17615
17645
  }
package/dist/index.mjs CHANGED
@@ -9746,24 +9746,27 @@ var TYPOGRAPHY_TOKENS = {
9746
9746
  // 16px
9747
9747
  b2: "text-sm leading-5 font-normal",
9748
9748
  // 14px
9749
- // Subtext
9750
- "subtext-xs": "text-xs leading-4 font-normal",
9749
+ // Subtext — block so stacked label+subtext rows don't collapse onto
9750
+ // one line when wrapped in a flex/space-y container (default tag is
9751
+ // <span>, which is inline-by-default).
9752
+ "subtext-xs": "block text-xs leading-4 font-normal",
9751
9753
  // 12px
9752
- "subtext-sm": "text-sm leading-5 font-normal",
9754
+ "subtext-sm": "block text-sm leading-5 font-normal",
9753
9755
  // 14px
9754
9756
  // Input
9755
9757
  "input-xs": "text-xs leading-4 font-medium",
9756
9758
  // 12px
9757
9759
  "input-sm": "text-sm leading-5 font-medium",
9758
9760
  // 14px
9759
- // Labels
9760
- "label-sm": "text-xs leading-4 font-medium",
9761
+ // Labels — block so stacked label+subtext rows don't collapse onto
9762
+ // one line (default tag <label> is inline-by-default).
9763
+ "label-sm": "block text-xs leading-4 font-medium",
9761
9764
  // 12px
9762
- "label-sm-mono": "text-xs leading-4 font-medium",
9765
+ "label-sm-mono": "block text-xs leading-4 font-medium",
9763
9766
  // 12px mono
9764
- "label-md": "text-sm leading-5 font-medium",
9767
+ "label-md": "block text-sm leading-5 font-medium",
9765
9768
  // 14px
9766
- "label-lg": "text-base leading-6 font-medium"
9769
+ "label-lg": "block text-base leading-6 font-medium"
9767
9770
  // 16px
9768
9771
  },
9769
9772
  /**
@@ -10499,7 +10502,7 @@ var PlaySelect = React23.forwardRef(
10499
10502
  children: /* @__PURE__ */ jsx20(TriggerIcon, { className: cn(!isSelectedPlaying && "ml-px") })
10500
10503
  }
10501
10504
  );
10502
- const defaultTriggerClassName = "!h-8 !rounded-full !px-3 !py-0 !gap-2";
10505
+ const defaultTriggerClassName = "!h-8 !rounded-xl !px-3 !py-0 !gap-2";
10503
10506
  return /* @__PURE__ */ jsxs15(
10504
10507
  "div",
10505
10508
  {
@@ -17420,8 +17423,10 @@ var RULE_BUILDER_TOKENS = {
17420
17423
  // White card — Figma: bg-white, rounded-[12px], overflow-clip
17421
17424
  card: "flex flex-col gap-2 overflow-clip pb-2 rounded-xl bg-token-white w-full",
17422
17425
  cardCollapsed: "flex flex-col overflow-clip rounded-xl bg-token-white w-full",
17423
- // Header row — Figma: p-2, justify-between, items-center
17424
- header: "flex items-center justify-between p-2 w-full bg-token-white",
17426
+ // Header row — Figma 6587:470, p-2, justify-between, items-center.
17427
+ // Acts as the rule's expand/collapse toggle: hover and pressed states use
17428
+ // the standard interaction tokens (matches Accordion / sectionTrigger).
17429
+ header: "group flex items-center justify-between p-2 w-full bg-token-white cursor-pointer rounded-xl transition-colors hover:bg-interaction-hov-solid-primary active:bg-interaction-pressed-opacity-secondary",
17425
17430
  headerActions: "flex items-center gap-3 shrink-0",
17426
17431
  // Body — Figma: flex-col, gap-2, px-2
17427
17432
  body: "flex flex-col gap-2 px-2 w-full",
@@ -17491,34 +17496,59 @@ var RuleBuilder = React49.forwardRef(
17491
17496
  {
17492
17497
  className: open ? RULE_BUILDER_TOKENS.card : RULE_BUILDER_TOKENS.cardCollapsed,
17493
17498
  children: [
17494
- /* @__PURE__ */ jsxs36("div", { className: RULE_BUILDER_TOKENS.header, children: [
17495
- /* @__PURE__ */ jsx45(Badge, { variant: "default", interactive: false, leadingIcon: titleIconNode, children: title }),
17496
- /* @__PURE__ */ jsxs36("div", { className: RULE_BUILDER_TOKENS.headerActions, children: [
17497
- onDelete ? /* @__PURE__ */ jsx45(
17498
- Button,
17499
- {
17500
- variant: "iconLink",
17501
- size: "iconXs",
17502
- leadingIcon: /* @__PURE__ */ jsx45(Trash23, {}),
17503
- onClick: onDelete,
17504
- "aria-label": "Delete rule",
17505
- "data-testid": "rule-builder-delete"
17506
- }
17507
- ) : null,
17508
- /* @__PURE__ */ jsx45(
17509
- Button,
17510
- {
17511
- variant: "iconLink",
17512
- size: "iconXs",
17513
- leadingIcon: open ? /* @__PURE__ */ jsx45(ChevronUp2, {}) : /* @__PURE__ */ jsx45(ChevronDown9, {}),
17514
- onClick: handleToggle,
17515
- "aria-expanded": open,
17516
- "aria-label": open ? "Collapse rule" : "Expand rule",
17517
- "data-testid": "rule-builder-toggle"
17499
+ /* @__PURE__ */ jsxs36(
17500
+ "div",
17501
+ {
17502
+ role: "button",
17503
+ tabIndex: 0,
17504
+ className: RULE_BUILDER_TOKENS.header,
17505
+ onClick: handleToggle,
17506
+ onKeyDown: (e) => {
17507
+ if (e.key === "Enter" || e.key === " ") {
17508
+ e.preventDefault();
17509
+ handleToggle();
17518
17510
  }
17519
- )
17520
- ] })
17521
- ] }),
17511
+ },
17512
+ "aria-expanded": open,
17513
+ "aria-label": open ? "Collapse rule" : "Expand rule",
17514
+ "data-testid": "rule-builder-header",
17515
+ children: [
17516
+ /* @__PURE__ */ jsx45(Badge, { variant: "default", interactive: false, leadingIcon: titleIconNode, children: title }),
17517
+ /* @__PURE__ */ jsxs36(
17518
+ "div",
17519
+ {
17520
+ className: RULE_BUILDER_TOKENS.headerActions,
17521
+ onClick: (e) => e.stopPropagation(),
17522
+ children: [
17523
+ onDelete ? /* @__PURE__ */ jsx45(
17524
+ Button,
17525
+ {
17526
+ variant: "iconLink",
17527
+ size: "iconXs",
17528
+ leadingIcon: /* @__PURE__ */ jsx45(Trash23, {}),
17529
+ onClick: onDelete,
17530
+ "aria-label": "Delete rule",
17531
+ "data-testid": "rule-builder-delete"
17532
+ }
17533
+ ) : null,
17534
+ /* @__PURE__ */ jsx45(
17535
+ Button,
17536
+ {
17537
+ variant: "iconLink",
17538
+ size: "iconXs",
17539
+ leadingIcon: open ? /* @__PURE__ */ jsx45(ChevronUp2, {}) : /* @__PURE__ */ jsx45(ChevronDown9, {}),
17540
+ onClick: handleToggle,
17541
+ "aria-expanded": open,
17542
+ "aria-label": open ? "Collapse rule" : "Expand rule",
17543
+ "data-testid": "rule-builder-toggle"
17544
+ }
17545
+ )
17546
+ ]
17547
+ }
17548
+ )
17549
+ ]
17550
+ }
17551
+ ),
17522
17552
  open ? /* @__PURE__ */ jsx45("div", { className: RULE_BUILDER_TOKENS.body, children }) : null
17523
17553
  ]
17524
17554
  }
package/dist/styles.css CHANGED
@@ -1099,8 +1099,8 @@
1099
1099
  .lego-land .overflow-y-auto {
1100
1100
  overflow-y: auto;
1101
1101
  }
1102
- .lego-land .\!rounded-full {
1103
- border-radius: calc(infinity * 1px) !important;
1102
+ .lego-land .\!rounded-xl {
1103
+ border-radius: var(--radius-xl) !important;
1104
1104
  }
1105
1105
  .lego-land .rounded {
1106
1106
  border-radius: 0.25rem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nurix/ui-component-library",
3
- "version": "1.1.5-stage.129",
3
+ "version": "1.1.5-stage.130",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",