@ngrok/mantle 0.84.1 → 0.84.2

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 (217) hide show
  1. package/dist/accordion.d.ts +14 -10
  2. package/dist/accordion.js +1 -1
  3. package/dist/agent.json +1 -1
  4. package/dist/{alert-Blmunr_D.d.ts → alert-DCVfviBx.d.ts} +18 -3
  5. package/dist/alert-DtBQuuuP.js +1 -0
  6. package/dist/alert-center.d.ts +15 -6
  7. package/dist/alert-center.js +1 -1
  8. package/dist/alert-dialog.d.ts +58 -37
  9. package/dist/alert-dialog.js +1 -1
  10. package/dist/alert.d.ts +1 -1
  11. package/dist/alert.js +1 -1
  12. package/dist/alternate-announcement-BkH4bOKp.js +1 -0
  13. package/dist/anchor-Cqu4GPPV.js +1 -0
  14. package/dist/anchor.d.ts +15 -15
  15. package/dist/anchor.js +1 -1
  16. package/dist/app-layout.js +1 -1
  17. package/dist/area-chart.js +1 -1
  18. package/dist/avatar.js +1 -1
  19. package/dist/badge.d.ts +3 -1
  20. package/dist/badge.js +1 -1
  21. package/dist/bar-chart.d.ts +17 -8
  22. package/dist/bar-chart.js +1 -1
  23. package/dist/breadcrumb.js +1 -1
  24. package/dist/button-B52_vczK.js +1 -0
  25. package/dist/{button-DjsmeoJ2.d.ts → button-B5i9n7Qp.d.ts} +19 -7
  26. package/dist/button-CaM-ZAH5.js +1 -0
  27. package/dist/{button-DwFvQWu4.js → button-DGsTE3P2.js} +1 -1
  28. package/dist/{button-CRCNRnk6.d.ts → button-DO53OA70.d.ts} +2 -2
  29. package/dist/{button-YkYZ0ymH.js → button-Wn-yt0c_.js} +1 -1
  30. package/dist/{button-C39M5h4K.d.ts → button-crUf0hbR.d.ts} +19 -2
  31. package/dist/button.d.ts +3 -3
  32. package/dist/button.js +1 -1
  33. package/dist/calendar.d.ts +20 -4
  34. package/dist/calendar.js +1 -1
  35. package/dist/card.d.ts +10 -6
  36. package/dist/card.js +1 -1
  37. package/dist/centered-layout.js +1 -1
  38. package/dist/chart-B_rZqf8a.js +2 -0
  39. package/dist/checkbox-Gg6nGUnR.js +1 -0
  40. package/dist/checkbox.js +1 -1
  41. package/dist/choice-CT_AdesL.js +1 -0
  42. package/dist/{choice-zOjixuj7.d.ts → choice-PESu-9s8.d.ts} +36 -12
  43. package/dist/choice.d.ts +1 -1
  44. package/dist/choice.js +1 -1
  45. package/dist/{code-block-Dj9otiLi.js → code-block-BE3Q0iAo.js} +2 -2
  46. package/dist/code-block.d.ts +26 -2
  47. package/dist/code-block.js +6 -6
  48. package/dist/code-block_highlight-utils.js +1 -1
  49. package/dist/code.js +1 -1
  50. package/dist/combobox.d.ts +19 -2
  51. package/dist/combobox.js +1 -1
  52. package/dist/command.d.ts +32 -13
  53. package/dist/command.js +1 -1
  54. package/dist/compose-refs-DdUwopIY.js +1 -0
  55. package/dist/{cx-IiQEAKf5.js → cx-0HCjnNv1.js} +1 -1
  56. package/dist/cx.d.ts +3 -3
  57. package/dist/cx.js +1 -1
  58. package/dist/data-table.d.ts +114 -61
  59. package/dist/data-table.js +1 -1
  60. package/dist/description-list.d.ts +43 -9
  61. package/dist/description-list.js +1 -1
  62. package/dist/{dialog-u8PtHYES.d.ts → dialog-B8YvfyIo.d.ts} +5 -3
  63. package/dist/{dialog-CSUE-jw8.js → dialog-CA-1Z0Np.js} +1 -1
  64. package/dist/{dialog-CEk0L7M7.d.ts → dialog-CtLI_uex.d.ts} +5 -3
  65. package/dist/dialog.d.ts +2 -2
  66. package/dist/dialog.js +1 -1
  67. package/dist/{dropdown-menu-CpsUJGbn.d.ts → dropdown-menu-BYapTV0f.d.ts} +8 -5
  68. package/dist/dropdown-menu-BkPBh_8y.d.ts +1 -0
  69. package/dist/{dropdown-menu-Cy7mLIpJ.js → dropdown-menu-lxHsgLiw.js} +1 -1
  70. package/dist/dropdown-menu.d.ts +2 -2
  71. package/dist/dropdown-menu.js +1 -1
  72. package/dist/empty.d.ts +4 -4
  73. package/dist/empty.js +1 -1
  74. package/dist/field.d.ts +91 -38
  75. package/dist/field.js +1 -1
  76. package/dist/flag.d.ts +9 -1
  77. package/dist/flag.js +1 -1
  78. package/dist/hooks.d.ts +15 -18
  79. package/dist/hooks.js +1 -1
  80. package/dist/hover-card.d.ts +11 -3
  81. package/dist/hover-card.js +1 -1
  82. package/dist/{icon-k4E9yNWD.d.ts → icon-BmJ57Tgh.d.ts} +10 -0
  83. package/dist/icon-CGKaq_tV.js +1 -0
  84. package/dist/icon-U24NfYv7.js +1 -0
  85. package/dist/icon-w0HUe7tr.d.ts +42 -0
  86. package/dist/icon.d.ts +2 -2
  87. package/dist/icon.js +1 -1
  88. package/dist/{icons-DEVx1oP9.js → icons-Cie4gcrm.js} +1 -1
  89. package/dist/icons.d.ts +7 -13
  90. package/dist/icons.js +1 -1
  91. package/dist/{in-view-gxyc9Q1_.d.ts → in-view-Ch5vJtWo.d.ts} +10 -5
  92. package/dist/input-BhykQSvJ.js +1 -0
  93. package/dist/input-DQyN6gN0.js +1 -0
  94. package/dist/input.d.ts +22 -10
  95. package/dist/input.js +1 -1
  96. package/dist/{kbd-B9qmYaW8.js → kbd-4_0Y_8rx.js} +1 -1
  97. package/dist/kbd.d.ts +15 -9
  98. package/dist/kbd.js +1 -1
  99. package/dist/{label-C6YH9skg.d.ts → label-Bnfe9YJ6.d.ts} +3 -1
  100. package/dist/label-BqIp6kFx.js +1 -0
  101. package/dist/label.d.ts +1 -1
  102. package/dist/label.js +1 -1
  103. package/dist/layer-container-BTcQpd4K.js +1 -0
  104. package/dist/layer-container.js +1 -1
  105. package/dist/line-chart.js +1 -1
  106. package/dist/{list-7w5k3HiN.js → list-Bo1mExIg.js} +1 -1
  107. package/dist/list.d.ts +37 -14
  108. package/dist/list.js +1 -1
  109. package/dist/live-region-CV7kykeo.js +1 -0
  110. package/dist/live-region.js +1 -1
  111. package/dist/llms.txt +1 -1
  112. package/dist/main.d.ts +4 -2
  113. package/dist/main.js +1 -1
  114. package/dist/media-object.d.ts +5 -12
  115. package/dist/media-object.js +1 -1
  116. package/dist/multi-select.d.ts +45 -13
  117. package/dist/multi-select.js +1 -1
  118. package/dist/otp-input.d.ts +9 -3
  119. package/dist/otp-input.js +1 -1
  120. package/dist/pagination.d.ts +165 -19
  121. package/dist/pagination.js +1 -1
  122. package/dist/{popover-D6x6Bq-G.js → popover-Bp-9B3GR.js} +1 -1
  123. package/dist/{popover-DDuw1UaJ.d.ts → popover-s2LhmzfQ.d.ts} +8 -4
  124. package/dist/popover.d.ts +1 -1
  125. package/dist/popover.js +1 -1
  126. package/dist/primitive-CejGAoGb.js +1 -0
  127. package/dist/progress.d.ts +65 -31
  128. package/dist/progress.js +1 -1
  129. package/dist/qr-code.d.ts +10 -4
  130. package/dist/qr-code.js +1 -1
  131. package/dist/radio-group-HDVxTNPi.js +1 -0
  132. package/dist/radio-group.d.ts +50 -25
  133. package/dist/radio-group.js +1 -1
  134. package/dist/sandbar.d.ts +1 -1
  135. package/dist/sandbar.js +1 -1
  136. package/dist/sandboxed-on-click-UagMFl_U.js +1 -0
  137. package/dist/sandboxed-on-click.d.ts +8 -0
  138. package/dist/sandboxed-on-click.js +1 -1
  139. package/dist/scatter-plot.js +1 -1
  140. package/dist/select-Dov9H2CX.js +1 -0
  141. package/dist/{select-DkFkSYBP.d.ts → select-ouAW88jx.d.ts} +30 -9
  142. package/dist/select.d.ts +1 -1
  143. package/dist/select.js +1 -1
  144. package/dist/selectable-list.d.ts +64 -20
  145. package/dist/selectable-list.js +1 -1
  146. package/dist/{separator-CNDs98Dv.d.ts → separator-Bo4nY_3M.d.ts} +13 -2
  147. package/dist/{separator-D1K7DSTv.js → separator-Da8lDnio.js} +1 -1
  148. package/dist/separator.d.ts +1 -1
  149. package/dist/separator.js +1 -1
  150. package/dist/{sheet-2AQT0DNu.js → sheet-C6UGAvRk.js} +1 -1
  151. package/dist/sheet.d.ts +5 -5
  152. package/dist/sheet.js +1 -1
  153. package/dist/sidebar.d.ts +7 -6
  154. package/dist/sidebar.js +1 -1
  155. package/dist/skeleton-paJOgf-f.js +1 -0
  156. package/dist/skeleton.d.ts +5 -4
  157. package/dist/skeleton.js +1 -1
  158. package/dist/skip-to-main-link.d.ts +9 -6
  159. package/dist/skip-to-main-link.js +1 -1
  160. package/dist/slider.d.ts +7 -3
  161. package/dist/slider.js +1 -1
  162. package/dist/{slot-CxM7jdFi.js → slot-C3gII_9c.js} +1 -1
  163. package/dist/slot.js +1 -1
  164. package/dist/split-button.d.ts +8 -3
  165. package/dist/split-button.js +1 -1
  166. package/dist/switch.js +1 -1
  167. package/dist/{table-D51ZtV4U.d.ts → table-DEI-qvSC.d.ts} +25 -12
  168. package/dist/table-EZNW3nFk.js +1 -0
  169. package/dist/table.d.ts +1 -1
  170. package/dist/table.js +1 -1
  171. package/dist/tabs.js +1 -1
  172. package/dist/text-area.js +1 -1
  173. package/dist/theme-DN-Et3A_.js +1 -0
  174. package/dist/theme-switcher.d.ts +24 -12
  175. package/dist/theme-switcher.js +1 -1
  176. package/dist/theme.d.ts +18 -4
  177. package/dist/theme.js +1 -1
  178. package/dist/toast.d.ts +8 -3
  179. package/dist/toast.js +1 -1
  180. package/dist/tooltip-CkAibjBb.js +1 -0
  181. package/dist/{tooltip-BKWK5c7_.d.ts → tooltip-DA41fxe5.d.ts} +7 -1
  182. package/dist/tooltip.d.ts +1 -1
  183. package/dist/tooltip.js +1 -1
  184. package/dist/{use-breakpoint-Dqu12Szq.js → use-breakpoint-BhJ_3El2.js} +1 -1
  185. package/dist/use-is-apple-platform-CMPzIYjz.js +1 -0
  186. package/dist/use-matches-media-query-DCBT6iNA.js +1 -0
  187. package/dist/use-prefers-reduced-motion-DHYDQk1h.js +1 -0
  188. package/dist/utils.d.ts +1 -1
  189. package/dist/utils.js +1 -1
  190. package/dist/visually-hidden.js +1 -1
  191. package/dist/well.js +1 -1
  192. package/package.json +3 -3
  193. package/dist/alert-D8StKSjK.js +0 -1
  194. package/dist/anchor-BjyGV6tB.js +0 -1
  195. package/dist/button-BCk0KpWb.js +0 -1
  196. package/dist/button-DiDlvAOp.js +0 -1
  197. package/dist/chart-DVt4hvnu.js +0 -2
  198. package/dist/checkbox-0EoxOyMA.js +0 -1
  199. package/dist/choice-BKkfjjAd.js +0 -1
  200. package/dist/compose-refs-BdBMM9ga.js +0 -1
  201. package/dist/dropdown-menu-CNaaABck.d.ts +0 -1
  202. package/dist/icon-CX_gj6sW.d.ts +0 -25
  203. package/dist/icon-d-nMCfAI.js +0 -1
  204. package/dist/icon-lZ48P8Nn.js +0 -1
  205. package/dist/input-BnlpQF0c.js +0 -1
  206. package/dist/input-CXmS0OFN.js +0 -1
  207. package/dist/label-D-D11mlp.js +0 -1
  208. package/dist/layer-container-CglTh9-6.js +0 -1
  209. package/dist/primitive-BSBmlRyy.js +0 -1
  210. package/dist/select-B52tWHOB.js +0 -1
  211. package/dist/skeleton-D86Gsflk.js +0 -1
  212. package/dist/table-C_Nm_RSV.js +0 -1
  213. package/dist/theme-CVfq037P.js +0 -1
  214. package/dist/tooltip-BZRRJgpm.js +0 -1
  215. package/dist/use-is-apple-platform-Cxwrb86L.js +0 -1
  216. package/dist/use-matches-media-query-Bd_GhhVd.js +0 -1
  217. package/dist/use-prefers-reduced-motion-Bk5zAfHY.js +0 -1
@@ -1,4 +1,4 @@
1
- import { t as Choice } from "./choice-zOjixuj7.js";
1
+ import { t as Choice } from "./choice-PESu-9s8.js";
2
2
  import { t as Input } from "./input-DpnC3Xgj.js";
3
3
  import { ComponentProps, ReactElement, ReactNode } from "react";
4
4
  //#region src/components/selectable-list/selectable-list.d.ts
@@ -157,7 +157,7 @@ type SelectableListRootProps = Omit<ComponentProps<"div">, "onChange"> & {
157
157
  filter?: (option: SelectableListOption, query: string) => boolean;
158
158
  };
159
159
  /**
160
- * Root of a `SelectableList` a filterable, multi-select **grid** of checkbox
160
+ * Root of a `SelectableList`: a filterable, multi-select **grid** of checkbox
161
161
  * rows. Owns selection state (controlled via `value`/`onValueChange` or
162
162
  * uncontrolled via `defaultValue`), the filter query (likewise controlled via
163
163
  * `query`/`onQueryChange` or uncontrolled via `defaultQuery`), and the derived
@@ -253,7 +253,7 @@ type SelectableListItemProps = Omit<ComponentProps<"div">, "children" | "id"> &
253
253
  };
254
254
  /**
255
255
  * A single selectable grid row. Renders a `role="row"` (via the `list`
256
- * primitive) laid out with `Choice` a `role="gridcell"` holding a real
256
+ * primitive) laid out with `Choice`: a `role="gridcell"` holding a real
257
257
  * `Checkbox`, and a `role="gridcell"` holding the title + description. The whole
258
258
  * row is click-to-toggle: the enclosing grid forwards a bare click anywhere on
259
259
  * the row to activation, while clicks on the checkbox, the title label, or any
@@ -310,7 +310,7 @@ declare const Item: ({ children, className, ref, value, ...props }: SelectableLi
310
310
  declare const ItemTitle: (props: ComponentProps<typeof Choice.Label>) => import("react").JSX.Element;
311
311
  /**
312
312
  * The de-emphasized sub-line of a `SelectableList.Item`, rendered as
313
- * `Choice.Description` wired to the row's checkbox via `aria-describedby`
313
+ * `Choice.Description`, wired to the row's checkbox via `aria-describedby`
314
314
  * (never a second label).
315
315
  *
316
316
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
@@ -357,9 +357,9 @@ type SelectableListViewportProps = Omit<ComponentProps<"div">, "children"> & {
357
357
  /**
358
358
  * The scrollable body of a `SelectableList`: a `role="grid"` of `role="row"`
359
359
  * checkbox rows inside the bordered, rounded `bg-popover` viewport. Renders
360
- * **every** filtered row the non-virtualized default; for long lists, swap in
360
+ * **every** filtered row, the non-virtualized default. For long lists, swap in
361
361
  * `SelectableList.VirtualViewport`. Renders nothing when the filter matches
362
- * nothing pair with `SelectableList.Empty`. Pass an `aria-label` (or
362
+ * nothing; pair with `SelectableList.Empty`. Pass an `aria-label` (or
363
363
  * `aria-labelledby`) and **bound the height** (`max-h-*`, `h-*`, or
364
364
  * `min-h-0 flex-1`).
365
365
  *
@@ -396,9 +396,11 @@ type SelectableListVirtualViewportProps = SelectableListViewportProps & {
396
396
  /**
397
397
  * The windowed counterpart to `SelectableList.Viewport`: renders only the
398
398
  * visible slice of filtered rows via `@tanstack/react-virtual`, sharing the
399
- * same grid semantics and row layout. Authored identically to `Viewport` same
400
- * `aria-label`, same optional render-prop so opting into virtualization never
399
+ * same grid semantics and row layout. Authored identically to `Viewport` (same
400
+ * `aria-label`, same optional render prop), so opting into virtualization never
401
401
  * changes the call site. **Bound the height** so the virtualizer has a viewport.
402
+ * The server renders the first slice of rows, sized by `estimateItemHeight` and
403
+ * `overscan`. The rest mount after hydration measures the viewport.
402
404
  *
403
405
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
404
406
  *
@@ -480,7 +482,17 @@ declare const Empty: ({ children, className, ref, ...props }: ComponentProps<"di
480
482
  */
481
483
  declare const SelectableList: {
482
484
  /**
483
- * Root: owns selection + filter state and the derived filtered options.
485
+ * Root of a `SelectableList`: a filterable, multi-select **grid** of checkbox
486
+ * rows. Owns selection state (controlled via `value`/`onValueChange` or
487
+ * uncontrolled via `defaultValue`), the filter query (likewise controlled via
488
+ * `query`/`onQueryChange` or uncontrolled via `defaultQuery`), and the derived
489
+ * filtered options (a case-insensitive `label` substring match by default, or
490
+ * your own `filter` predicate), and shares them with the parts below it.
491
+ *
492
+ * Compose it with `SelectableList.Filter` (optional search box),
493
+ * `SelectableList.SelectAll` (optional tri-state header), a viewport
494
+ * (`SelectableList.Viewport`, or the windowed `SelectableList.VirtualViewport`),
495
+ * and `SelectableList.Empty` (shown when the filter matches nothing).
484
496
  *
485
497
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
486
498
  *
@@ -496,7 +508,10 @@ declare const SelectableList: {
496
508
  */
497
509
  readonly Root: typeof Root;
498
510
  /**
499
- * Optional filter/search box (mantle `Input` + magnifying-glass icon).
511
+ * The filter/search box for a `SelectableList`. Renders the mantle `Input` with
512
+ * a leading magnifying-glass icon and drives the list's filter query (a
513
+ * case-insensitive substring match over each option's plain text: `labelText`,
514
+ * or a string `label`). Optional; omit it for a non-filterable list.
500
515
  *
501
516
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
502
517
  *
@@ -512,7 +527,10 @@ declare const SelectableList: {
512
527
  */
513
528
  readonly Filter: typeof Filter;
514
529
  /**
515
- * Optional tri-state "select all" header over the filtered options.
530
+ * A tri-state "select all" header for a `SelectableList`. Reflects the selection
531
+ * of the **currently filtered** options: checked when all are selected,
532
+ * indeterminate when only some are, unchecked when none are. Toggling it
533
+ * selects or clears that filtered set. Optional. Children are the visible label.
516
534
  *
517
535
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
518
536
  *
@@ -528,8 +546,13 @@ declare const SelectableList: {
528
546
  */
529
547
  readonly SelectAll: typeof SelectAll;
530
548
  /**
531
- * The scrollable grid of rows (non-virtualized). Give it an `aria-label`;
532
- * pass a render-prop child for a custom row layout, or omit it for the default.
549
+ * The scrollable body of a `SelectableList`: a `role="grid"` of `role="row"`
550
+ * checkbox rows inside the bordered, rounded `bg-popover` viewport. Renders
551
+ * **every** filtered row, the non-virtualized default. For long lists, swap in
552
+ * `SelectableList.VirtualViewport`. Renders nothing when the filter matches
553
+ * nothing; pair with `SelectableList.Empty`. Pass an `aria-label` (or
554
+ * `aria-labelledby`) and **bound the height** (`max-h-*`, `h-*`, or
555
+ * `min-h-0 flex-1`).
533
556
  *
534
557
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
535
558
  *
@@ -545,7 +568,13 @@ declare const SelectableList: {
545
568
  */
546
569
  readonly Viewport: typeof Viewport;
547
570
  /**
548
- * The windowed grid of rows — same surface as `Viewport`, for long lists.
571
+ * The windowed counterpart to `SelectableList.Viewport`: renders only the
572
+ * visible slice of filtered rows via `@tanstack/react-virtual`, sharing the
573
+ * same grid semantics and row layout. Authored identically to `Viewport` (same
574
+ * `aria-label`, same optional render prop), so opting into virtualization never
575
+ * changes the call site. **Bound the height** so the virtualizer has a viewport.
576
+ * The server renders the first slice of rows, sized by `estimateItemHeight` and
577
+ * `overscan`. The rest mount after hydration measures the viewport.
549
578
  *
550
579
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
551
580
  *
@@ -561,8 +590,16 @@ declare const SelectableList: {
561
590
  */
562
591
  readonly VirtualViewport: typeof VirtualViewport;
563
592
  /**
564
- * A selectable grid row for custom viewport rendering. Reads its selection
565
- * and disabled state from the list by `value`.
593
+ * A single selectable grid row. Renders a `role="row"` (via the `list`
594
+ * primitive) laid out with `Choice`: a `role="gridcell"` holding a real
595
+ * `Checkbox`, and a `role="gridcell"` holding the title + description. The whole
596
+ * row is click-to-toggle: the enclosing grid forwards a bare click anywhere on
597
+ * the row to activation, while clicks on the checkbox, the title label, or any
598
+ * nested interactive content are left to those controls (no double-toggle).
599
+ * Selection and disabled state are read from the list by `value`.
600
+ *
601
+ * Render it from a viewport's render-prop child for a custom row layout; the
602
+ * default row (title + description) uses it under the hood.
566
603
  *
567
604
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
568
605
  *
@@ -585,7 +622,9 @@ declare const SelectableList: {
585
622
  */
586
623
  readonly Item: typeof Item;
587
624
  /**
588
- * Emphasized title (`Choice.Label`) for a `SelectableList.Item`.
625
+ * The emphasized title of a `SelectableList.Item`, rendered as `Choice.Label`,
626
+ * a real `<label>` wired to the row's checkbox, so clicking it toggles the row
627
+ * and it supplies the checkbox's accessible name.
589
628
  *
590
629
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
591
630
  *
@@ -608,7 +647,9 @@ declare const SelectableList: {
608
647
  */
609
648
  readonly ItemTitle: typeof ItemTitle;
610
649
  /**
611
- * De-emphasized sub-line (`Choice.Description`) for a `SelectableList.Item`.
650
+ * The de-emphasized sub-line of a `SelectableList.Item`, rendered as
651
+ * `Choice.Description`, wired to the row's checkbox via `aria-describedby`
652
+ * (never a second label).
612
653
  *
613
654
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
614
655
  *
@@ -631,8 +672,11 @@ declare const SelectableList: {
631
672
  */
632
673
  readonly ItemDescription: typeof ItemDescription;
633
674
  /**
634
- * Shown when the filter matches no options — a polite `role="status"` live
635
- * region, so the empty state is announced as the filter narrows.
675
+ * Shown in place of the viewport when the active filter matches no options.
676
+ * Renders its children (e.g. "No results found.") in muted, centered text.
677
+ * It is a polite `role="status"` live region that stays mounted (visually
678
+ * hidden while there are matches), so screen-reader users hear the message
679
+ * when their filter empties the list instead of the grid silently vanishing.
636
680
  *
637
681
  * @see https://mantle.ngrok.com/components/data-display/selectable-list
638
682
  *
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{n as t,t as n}from"./checkbox-0EoxOyMA.js";import{t as r}from"./choice-BKkfjjAd.js";import{n as i,t as a}from"./input-BnlpQF0c.js";import{n as o,r as s,t as c}from"./list-7w5k3HiN.js";import{cloneElement as l,createContext as u,isValidElement as d,useCallback as f,useContext as p,useId as m,useMemo as h,useState as g}from"react";import _ from"tiny-invariant";import{jsx as v,jsxs as y}from"react/jsx-runtime";import{MagnifyingGlassIcon as b}from"@phosphor-icons/react/MagnifyingGlass";function x(e){return e.labelText==null?typeof e.label==`string`?e.label:``:e.labelText}function S(e,t){let n=t.trim().toLowerCase();return n===``?e:e.filter(e=>x(e).toLowerCase().includes(n))}function C(e,t){return e.includes(t)?e.filter(e=>e!==t):[...e,t]}function w(e,t){let n=0,r=0;for(let i of e)i.disabled||(n+=1,t.has(i.value)&&(r+=1));return n===0?{allSelected:!1,someSelected:!1}:{allSelected:r===n,someSelected:r>0}}const T=u(null);function E(e){let t=p(T);return _(t,`SelectableList.${e} must be rendered inside SelectableList.Root.`),t}const D=[],O=({className:t,defaultQuery:n,defaultValue:r,filter:i,onQueryChange:a,onValueChange:o,options:s,query:c,ref:l,value:u,...d})=>{let p=m(),_=u!=null,[y,b]=g(r??D),x=_?u:y,w=c!=null,[E,O]=g(n??``),k=w?c:E,A=f(e=>{_||b(e),o?.(e)},[_,o]),j=f(e=>{w||O(e),a?.(e)},[w,a]),M=h(()=>new Set(x),[x]),N=h(()=>new Set(s.filter(e=>e.disabled).map(e=>e.value)),[s]),P=h(()=>i==null?S(s,k):s.filter(e=>i(e,k)),[s,k,i]),F=h(()=>({listId:p,filteredOptions:P,query:k,setQuery:j,selectedValues:x,selectedSet:M,disabledSet:N,toggle:e=>{N.has(e)||A(C(x,e))},setSelection:A}),[p,P,k,j,x,M,N,A]);return v(T.Provider,{value:F,children:v(`div`,{ref:l,"data-slot":`selectable-list`,className:e(`flex w-full flex-col gap-3`,t),...d})})},k=({"aria-label":e=`Filter`,ref:t,...n})=>{let{query:r,setQuery:o}=E(`Filter`);return y(a,{ref:t,type:`text`,"data-slot":`selectable-list-filter`,"aria-label":e,value:r,onChange:e=>o(e.target.value),...n,children:[v(b,{}),v(i,{})]})},A=({children:r,className:i,ref:a,...o})=>{let{filteredOptions:s,selectedValues:c,selectedSet:l,setSelection:u}=E(`SelectAll`),d=m(),{allSelected:f,someSelected:p}=w(s,l),h=t({allSelected:f,someSelected:p}),g=s.some(e=>!e.disabled),_=()=>{let e=s.filter(e=>!e.disabled).map(e=>e.value);if(f){let t=new Set(e);u(c.filter(e=>!t.has(e)));return}u([...new Set([...c,...e])])};return y(`label`,{ref:a,htmlFor:d,"data-slot":`selectable-list-select-all`,className:e(`text-strong flex cursor-pointer items-center gap-2 text-sm font-medium font-sans`,i),...o,children:[v(n,{id:d,checked:h,onChange:_,disabled:!g}),r]})};function j(e,t){return`${e}-control-${encodeURIComponent(t)}`}const M=({children:t,className:i,ref:a,value:s,...c})=>{let{listId:l,selectedSet:u,disabledSet:d,toggle:f}=E(`Item`),p=j(l,s),m=u.has(s),h=d.has(s);return v(o,{ref:a,asChild:!0,selected:m,disabled:h,className:e(`px-2 py-1.5 text-sm`,`cursor-pointer aria-disabled:cursor-default`,i),...c,"data-slot":`selectable-list-item`,"data-value":s,children:y(r.Root,{id:p,disabled:h,children:[v(r.Indicator,{role:`gridcell`,children:v(n,{checked:m,onChange:()=>f(s),tabIndex:-1})}),v(r.Content,{role:`gridcell`,children:t})]})})},N=e=>v(r.Label,{"data-slot":`selectable-list-item-title`,...e}),P=e=>v(r.Description,{"data-slot":`selectable-list-item-description`,...e});function F(e){return y(M,{value:e.value,children:[v(N,{children:e.label}),e.description!=null&&v(P,{children:e.description})]})}function I(e,t){let n=[],r=[];for(let i of e){let e=t(i);d(e)&&(n.push(l(e,{key:i.value})),r.push(i))}return{items:n,options:r}}function L(e,t){let{filteredOptions:n,listId:r,toggle:i}=E(e),a=t??F,{items:o,options:s}=h(()=>I(n,a),[n,a]),c=f(e=>{let t=s[e];t!=null&&i(t.value)},[s,i]),l=f(e=>{let t=s[e];return t==null?``:j(r,t.value)},[s,r]),u=f(e=>s[e]?.disabled===!0,[s]);return{isEmpty:o.length===0,isItemDisabled:u,onActivate:c,itemId:l,items:o}}const R={Root:O,Filter:k,SelectAll:A,Viewport:({children:e,ref:t,...n})=>{let{isEmpty:r,isItemDisabled:i,onActivate:a,itemId:o,items:c}=L(`Viewport`,e);return r?null:v(s,{ref:t,"data-slot":`selectable-list-viewport`,semantics:`grid`,...n,"aria-multiselectable":!0,isItemDisabled:i,onActivate:a,itemId:o,children:c})},VirtualViewport:({children:e,ref:t,...n})=>{let{isEmpty:r,isItemDisabled:i,onActivate:a,itemId:o,items:s}=L(`VirtualViewport`,e);return r?null:v(c,{ref:t,"data-slot":`selectable-list-viewport`,semantics:`grid`,...n,"aria-multiselectable":!0,isItemDisabled:i,onActivate:a,itemId:o,children:s})},Item:M,ItemTitle:N,ItemDescription:P,Empty:({children:t,className:n,ref:r,...i})=>{let{filteredOptions:a}=E(`Empty`),o=a.length===0;return v(`div`,{ref:r,"data-slot":`selectable-list-empty`,role:`status`,className:e(!o&&`sr-only`,o&&`text-muted border-popover bg-popover flex items-center justify-center rounded-md border px-3 py-8 text-center text-sm`,n),...i,children:o?t:null})}};export{R as SelectableList,S as filterSelectableOptions,x as optionLabelText,w as summarizeSelection,C as toggleSelectionValue};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{n as t,t as n}from"./checkbox-Gg6nGUnR.js";import{t as r}from"./choice-CT_AdesL.js";import{t as i}from"./use-callback-ref-IYti9y7x.js";import{n as a,t as o}from"./input-BhykQSvJ.js";import{n as s,r as c,t as l}from"./list-Bo1mExIg.js";import{cloneElement as u,createContext as d,isValidElement as f,useCallback as p,useContext as m,useId as h,useMemo as g,useState as _}from"react";import v from"tiny-invariant";import{jsx as y,jsxs as b}from"react/jsx-runtime";import{MagnifyingGlassIcon as x}from"@phosphor-icons/react/MagnifyingGlass";function S(e){return e.labelText==null?typeof e.label==`string`?e.label:``:e.labelText}function C(e,t){let n=t.trim().toLowerCase();return n===``?e:e.filter(e=>S(e).toLowerCase().includes(n))}function w(e,t){return e.includes(t)?e.filter(e=>e!==t):[...e,t]}function T(e,t){let n=0,r=0;for(let i of e)i.disabled||(n+=1,t.has(i.value)&&(r+=1));return n===0?{allSelected:!1,someSelected:!1}:{allSelected:r===n,someSelected:r>0}}const E=d(null);function D(e){let t=m(E);return v(t,`SelectableList.${e} must be rendered inside SelectableList.Root.`),t}const O=[],k=({className:t,defaultQuery:n,defaultValue:r,filter:a,onQueryChange:o,onValueChange:s,options:c,query:l,ref:u,value:d,...f})=>{let m=h(),v=d!=null,[b,x]=_(r??O),S=v?d:b,T=l!=null,[D,k]=_(n??``),A=T?l:D,j=i(s),M=i(o),N=p(e=>{v||x(e),j(e)},[v,j]),P=p(e=>{T||k(e),M(e)},[T,M]),F=g(()=>new Set(S),[S]),I=g(()=>new Set(c.filter(e=>e.disabled).map(e=>e.value)),[c]),L=g(()=>a==null?C(c,A):c.filter(e=>a(e,A)),[c,A,a]),R=g(()=>({listId:m,filteredOptions:L,query:A,setQuery:P,selectedValues:S,selectedSet:F,disabledSet:I,toggle:e=>{I.has(e)||N(w(S,e))},setSelection:N}),[m,L,A,P,S,F,I,N]);return y(E.Provider,{value:R,children:y(`div`,{ref:u,"data-slot":`selectable-list`,className:e(`flex w-full flex-col gap-3`,t),...f})})},A=({"aria-label":e=`Filter`,ref:t,...n})=>{let{query:r,setQuery:i}=D(`Filter`);return b(o,{ref:t,type:`text`,"data-slot":`selectable-list-filter`,"aria-label":e,value:r,onChange:e=>i(e.target.value),...n,children:[y(x,{"aria-hidden":!0}),y(a,{})]})},j=({children:r,className:i,ref:a,...o})=>{let{filteredOptions:s,selectedValues:c,selectedSet:l,setSelection:u}=D(`SelectAll`),d=h(),{allSelected:f,someSelected:p}=T(s,l),m=t({allSelected:f,someSelected:p}),g=s.some(e=>!e.disabled),_=()=>{let e=s.filter(e=>!e.disabled).map(e=>e.value);if(f){let t=new Set(e);u(c.filter(e=>!t.has(e)));return}u([...new Set([...c,...e])])};return b(`label`,{ref:a,htmlFor:d,"data-slot":`selectable-list-select-all`,className:e(`text-strong flex cursor-pointer items-center gap-2 text-sm font-medium font-sans`,i),...o,children:[y(n,{id:d,checked:m,onChange:_,disabled:!g}),r]})};function M(e,t){return`${e}-control-${encodeURIComponent(t)}`}const N=({children:t,className:i,ref:a,value:o,...c})=>{let{listId:l,selectedSet:u,disabledSet:d,toggle:f}=D(`Item`),p=M(l,o),m=u.has(o),h=d.has(o);return y(s,{ref:a,asChild:!0,selected:m,disabled:h,className:e(`px-2 py-1.5 text-sm`,`cursor-pointer aria-disabled:cursor-default`,i),...c,"data-slot":`selectable-list-item`,"data-value":o,children:b(r.Root,{id:p,disabled:h,children:[y(r.Indicator,{role:`gridcell`,children:y(n,{checked:m,onChange:()=>f(o),tabIndex:-1})}),y(r.Content,{role:`gridcell`,children:t})]})})},P=e=>y(r.Label,{"data-slot":`selectable-list-item-title`,...e}),F=e=>y(r.Description,{"data-slot":`selectable-list-item-description`,...e});function I(e){return b(N,{value:e.value,children:[y(P,{children:e.label}),e.description!=null&&y(F,{children:e.description})]})}function L(e,t){let n=[],r=[];for(let i of e){let e=t(i);f(e)&&(n.push(u(e,{key:i.value})),r.push(i))}return{items:n,options:r}}function R(e,t){let{filteredOptions:n,listId:r,toggle:i}=D(e),a=t??I,{items:o,options:s}=g(()=>L(n,a),[n,a]),c=p(e=>{let t=s[e];t!=null&&i(t.value)},[s,i]),l=p(e=>{let t=s[e];return t==null?``:M(r,t.value)},[s,r]),u=p(e=>s[e]?.disabled===!0,[s]);return{isEmpty:o.length===0,isItemDisabled:u,onActivate:c,itemId:l,items:o}}const z={Root:k,Filter:A,SelectAll:j,Viewport:({children:e,ref:t,...n})=>{let{isEmpty:r,isItemDisabled:i,onActivate:a,itemId:o,items:s}=R(`Viewport`,e);return r?null:y(c,{ref:t,"data-slot":`selectable-list-viewport`,semantics:`grid`,...n,"aria-multiselectable":!0,isItemDisabled:i,onActivate:a,itemId:o,children:s})},VirtualViewport:({children:e,ref:t,...n})=>{let{isEmpty:r,isItemDisabled:i,onActivate:a,itemId:o,items:s}=R(`VirtualViewport`,e);return r?null:y(l,{ref:t,"data-slot":`selectable-list-viewport`,semantics:`grid`,...n,"aria-multiselectable":!0,isItemDisabled:i,onActivate:a,itemId:o,children:s})},Item:N,ItemTitle:P,ItemDescription:F,Empty:({children:t,className:n,ref:r,...i})=>{let{filteredOptions:a}=D(`Empty`),o=a.length===0;return y(`div`,{ref:r,"data-slot":`selectable-list-empty`,role:`status`,className:e(!o&&`sr-only`,o&&`text-muted border-popover bg-popover flex items-center justify-center rounded-md border px-3 py-8 text-center text-sm`,n),...i,children:o?t:null})}};export{z as SelectableList,C as filterSelectableOptions,S as optionLabelText,T as summarizeSelection,w as toggleSelectionValue};
@@ -1,5 +1,5 @@
1
1
  import { n as WithAsChild } from "./as-child-D23mGo4f.js";
2
- import { ComponentProps, HTMLAttributes } from "react";
2
+ import { ComponentProps } from "react";
3
3
  //#region src/components/separator/separator.d.ts
4
4
  declare const orientations: readonly ["horizontal", "vertical"];
5
5
  type Orientation = (typeof orientations)[number];
@@ -7,6 +7,11 @@ type Orientation = (typeof orientations)[number];
7
7
  * A container to layout a group of horizontal separators and other children.
8
8
  * Overrides all children `Separator`s to be `orientation="horizontal"`.
9
9
  *
10
+ * | Data Attribute | Value | Description |
11
+ * | ---------------------------------- | -------------------------------- | ------------------------------------------------- |
12
+ * | `data-slot` | `"horizontal-separator-group"` | Names the part. |
13
+ * | `data-horizontal-separator-group` | present | Presence-only. Child separators stretch under it. |
14
+ *
10
15
  * @see https://mantle.ngrok.com/components/structure/separator
11
16
  *
12
17
  * @example
@@ -28,7 +33,7 @@ type Orientation = (typeof orientations)[number];
28
33
  * </HorizontalSeparatorGroup>
29
34
  * ```
30
35
  */
31
- declare const HorizontalSeparatorGroup: ({ className, children, asChild, ...props }: HTMLAttributes<HTMLDivElement> & WithAsChild) => import("react").JSX.Element;
36
+ declare const HorizontalSeparatorGroup: ({ className, children, asChild, ...props }: ComponentProps<"div"> & WithAsChild) => import("react").JSX.Element;
32
37
  type SeparatorProps = ComponentProps<"div"> & WithAsChild & {
33
38
  /**
34
39
  * Either `horizontal` or `vertical`.
@@ -53,6 +58,12 @@ type SeparatorProps = ComponentProps<"div"> & WithAsChild & {
53
58
  * your own dividers with `bg-separator` / `border-separator` / `divide-separator`
54
59
  * so they stay consistent with separators across the system.
55
60
  *
61
+ * | Data Attribute | Value | Description |
62
+ * | ------------------ | ------------------------------ | ------------------------------------------------------------------ |
63
+ * | `data-slot` | `"separator"` | Names the part. |
64
+ * | `data-orientation` | `"horizontal"` \| `"vertical"` | The resolved orientation, after a `HorizontalSeparatorGroup` wins. |
65
+ * | `data-separator` | present | Presence-only. Lets a group exempt separators from `shrink-0`. |
66
+ *
56
67
  * @see https://mantle.ngrok.com/components/structure/separator
57
68
  *
58
69
  * @example
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-CxM7jdFi.js";import{createContext as n,useContext as r}from"react";import{jsx as i}from"react/jsx-runtime";const a=[`horizontal`,`vertical`],o=n({}),s={orientation:`horizontal`},c=({className:n,children:r,asChild:a,...c})=>{let l=a?t:`div`;return i(o.Provider,{value:s,children:i(l,{"data-slot":`horizontal-separator-group`,"data-horizontal-separator-group":!0,className:e(`group flex items-center gap-2 [&>*:not([data-separator])]:shrink-0`,n),...c,children:r})})},l=({asChild:n=!1,children:a,className:s,orientation:c,ref:l,semantic:d=!1,...f})=>{let p=n?t:`div`,m=r(o).orientation??(u(c)?c:`horizontal`),h=d?{"aria-orientation":m===`vertical`?m:void 0,role:`separator`}:{role:`none`};return i(p,{"data-slot":`separator`,className:e(`separator`,`bg-separator`,m===`horizontal`?`h-px w-full group-data-horizontal-separator-group:flex-1`:`h-full w-px`,s),"data-orientation":m,"data-separator":!0,...h,ref:l,...n?{children:a}:{},...f})};function u(e){return typeof e==`string`&&a.includes(e)}export{l as n,c as t};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./slot-C3gII_9c.js";import{createContext as n,useContext as r}from"react";import{jsx as i}from"react/jsx-runtime";const a=[`horizontal`,`vertical`],o=n({}),s={orientation:`horizontal`},c=({className:n,children:r,asChild:a,...c})=>{let l=a?t:`div`;return i(o.Provider,{value:s,children:i(l,{"data-slot":`horizontal-separator-group`,"data-horizontal-separator-group":!0,className:e(`group flex items-center gap-2 [&>*:not([data-separator])]:shrink-0`,n),...c,children:r})})},l=({asChild:n=!1,children:a,className:s,orientation:c,ref:l,semantic:d=!1,...f})=>{let p=n?t:`div`,m=r(o).orientation??(u(c)?c:`horizontal`),h=d?{"aria-orientation":m===`vertical`?m:void 0,role:`separator`}:{role:`none`};return i(p,{"data-slot":`separator`,className:e(`separator`,`bg-separator`,m===`horizontal`?`h-px w-full group-data-horizontal-separator-group:flex-1`:`h-full w-px`,s),"data-orientation":m,"data-separator":!0,...h,ref:l,...n?{children:a}:{},...f})};function u(e){return typeof e==`string`&&a.includes(e)}export{l as n,c as t};
@@ -1,2 +1,2 @@
1
- import { n as Separator, t as HorizontalSeparatorGroup } from "./separator-CNDs98Dv.js";
1
+ import { n as Separator, t as HorizontalSeparatorGroup } from "./separator-Bo4nY_3M.js";
2
2
  export { HorizontalSeparatorGroup, Separator };
package/dist/separator.js CHANGED
@@ -1 +1 @@
1
- import{n as e,t}from"./separator-D1K7DSTv.js";export{t as HorizontalSeparatorGroup,e as Separator};
1
+ import{n as e,t}from"./separator-Da8lDnio.js";export{t as HorizontalSeparatorGroup,e as Separator};
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./button-BCk0KpWb.js";import{t as n}from"./layer-container-CglTh9-6.js";import{a as r,c as i,i as a,n as o,o as s,r as c,s as l,t as u}from"./primitive-BSBmlRyy.js";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{XIcon as p}from"@phosphor-icons/react/X";import{cva as m}from"class-variance-authority";const h=s,g=i,_=u,v=r,y=({className:t,ref:n,...r})=>d(a,{"data-slot":`sheet-overlay`,className:e(`bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-60 backdrop-blur-xs`,t),...r,ref:n}),b=m(`bg-dialog border-dialog inset-y-0 h-full w-full fixed flex flex-col shadow-lg outline-hidden transition ease-in-out focus-within:outline-hidden data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in`,{variants:{side:{left:`data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r`,right:`data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l`}},defaultVariants:{side:`right`}}),x={Root:h,Actions:({children:t,className:n,ref:r,...i})=>d(`div`,{"data-slot":`sheet-actions`,className:e(`flex h-full items-center gap-2`,n),...i,ref:r,children:t}),Body:({className:t,...n})=>d(`div`,{"data-slot":`sheet-body`,className:e(`scrollbar scrollbar-gutter-stable text-body flex-1 overflow-y-auto p-6`,t),...n}),Close:_,CloseIconButton:({size:e=`md`,type:n=`button`,label:r=`Close Sheet`,appearance:i=`ghost`,intent:a=`neutral`,...o})=>d(u,{asChild:!0,children:d(t,{"data-slot":`sheet-close-icon-button`,appearance:i,icon:d(p,{}),intent:a,label:r,size:e,type:n,...o})}),Content:({children:t,className:r,preferredWidth:i=`sm:max-w-[30rem]`,side:a=`right`,ref:s,...c})=>f(v,{children:[d(y,{}),d(n,{"data-slot":`sheet-positioner`,className:`fixed z-60`,children:d(o,{"data-slot":`sheet-content`,"data-mantle-modal-content":!0,className:e(b({side:a}),i,r),ref:s,...c,children:t})})]}),Description:({className:t,ref:n,...r})=>d(c,{"data-slot":`sheet-description`,ref:n,className:e(`text-body text-sm`,t),...r}),Footer:({className:t,...n})=>d(`div`,{"data-slot":`sheet-footer`,className:e(`border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5`,t),...n}),Header:({className:t,...n})=>d(`div`,{"data-slot":`sheet-header`,className:e(`border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4`,`has-[.icon-button]:pr-4`,t),...n}),Title:({className:t,ref:n,...r})=>d(l,{"data-slot":`sheet-title`,ref:n,className:e(`text-strong flex-1 truncate text-lg font-medium`,t),...r}),TitleGroup:({children:t,className:n,ref:r,...i})=>d(`div`,{"data-slot":`sheet-title-group`,className:e(`flex items-center justify-between gap-2`,n),...i,ref:r,children:t}),Trigger:g};export{x as t};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./button-CaM-ZAH5.js";import{t as n}from"./layer-container-BTcQpd4K.js";import{a as r,c as i,i as a,n as o,o as s,r as c,s as l,t as u}from"./primitive-CejGAoGb.js";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{XIcon as p}from"@phosphor-icons/react/X";import{cva as m}from"class-variance-authority";const h=s,g=i,_=u,v=r,y=({className:t,ref:n,...r})=>d(a,{"data-slot":`sheet-overlay`,className:e(`bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-60 backdrop-blur-xs`,t),...r,ref:n}),b=m(`bg-dialog border-dialog inset-y-0 h-full w-full fixed flex flex-col shadow-lg outline-hidden transition ease-in-out focus-within:outline-hidden data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in`,{variants:{side:{left:`data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r`,right:`data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l`}},defaultVariants:{side:`right`}}),x={Root:h,Actions:({children:t,className:n,ref:r,...i})=>d(`div`,{"data-slot":`sheet-actions`,className:e(`flex h-full items-center gap-2`,n),...i,ref:r,children:t}),Body:({className:t,...n})=>d(`div`,{"data-slot":`sheet-body`,className:e(`scrollbar scrollbar-gutter-stable text-body flex-1 overflow-y-auto p-6`,t),...n}),Close:_,CloseIconButton:({size:e=`md`,type:n=`button`,label:r=`Close Sheet`,appearance:i=`ghost`,intent:a=`neutral`,...o})=>d(u,{asChild:!0,children:d(t,{"data-slot":`sheet-close-icon-button`,appearance:i,icon:d(p,{}),intent:a,label:r,size:e,type:n,...o})}),Content:({children:t,className:r,preferredWidth:i=`sm:max-w-[30rem]`,side:a=`right`,ref:s,...c})=>f(v,{children:[d(y,{}),d(n,{"data-slot":`sheet-positioner`,className:`fixed z-60`,children:d(o,{"data-slot":`sheet-content`,"data-mantle-modal-content":!0,className:e(b({side:a}),i,r),ref:s,...c,children:t})})]}),Description:({className:t,ref:n,...r})=>d(c,{"data-slot":`sheet-description`,ref:n,className:e(`text-body text-sm`,t),...r}),Footer:({className:t,...n})=>d(`div`,{"data-slot":`sheet-footer`,className:e(`border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5`,t),...n}),Header:({className:t,...n})=>d(`div`,{"data-slot":`sheet-header`,className:e(`border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4`,`has-[.icon-button]:pr-4`,t),...n}),Title:({className:t,ref:n,...r})=>d(l,{"data-slot":`sheet-title`,ref:n,className:e(`text-strong flex-1 truncate text-lg font-medium`,t),...r}),TitleGroup:({children:t,className:n,ref:r,...i})=>d(`div`,{"data-slot":`sheet-title-group`,className:e(`flex items-center justify-between gap-2`,n),...i,ref:r,children:t}),Trigger:g};export{x as t};
package/dist/sheet.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { i as IconButtonIntent, n as IconButtonProps, r as IconButtonAppearance } from "./button-C39M5h4K.js";
2
- import { n as Content$1, o as Root, r as Description$1, s as Title$1 } from "./dialog-u8PtHYES.js";
1
+ import { n as Content$1, r as Description$1, s as Title$1, u as primitive_d_exports } from "./dialog-B8YvfyIo.js";
2
+ import { i as IconButtonIntent, n as IconButtonProps, r as IconButtonAppearance } from "./button-crUf0hbR.js";
3
3
  import { ComponentProps, HTMLAttributes } from "react";
4
4
  import { VariantProps } from "class-variance-authority";
5
5
  //#region src/components/sheet/sheet.d.ts
@@ -506,8 +506,8 @@ declare const Actions: ({ children, className, ref, ...props }: ComponentProps<"
506
506
  * A container that overlays the current view from the edge of the screen.
507
507
  * It is a lightweight way of allowing users to complete a task without losing
508
508
  * contextual information of the view beneath it. Use Sheet for side-panel
509
- * content that slides in from any edge filter panels, detail/inspector
510
- * views, navigation drawers, mobile menus. For a centered modal that
509
+ * content that slides in from the left or right edge: filter panels,
510
+ * detail/inspector views, navigation drawers, mobile menus. For a centered modal that
511
511
  * interrupts the user, use `Dialog` (or `AlertDialog` for destructive
512
512
  * confirmations).
513
513
  *
@@ -672,7 +672,7 @@ declare const Sheet: {
672
672
  * </Sheet.Root>
673
673
  * ```
674
674
  */
675
- readonly Root: typeof Root;
675
+ readonly Root: import("react").FC<import("@radix-ui/react-dialog").DialogProps>;
676
676
  /**
677
677
  * A group container for the actions of a `Sheet`. Typically rendered as a child of `Sheet.TitleGroup`.
678
678
  *
package/dist/sheet.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./sheet-2AQT0DNu.js";export{e as Sheet};
1
+ import{t as e}from"./sheet-C6UGAvRk.js";export{e as Sheet};
package/dist/sidebar.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  import { n as WithAsChild } from "./as-child-D23mGo4f.js";
2
2
  import { t as WithDataSlot } from "./data-slot-CChfb_cv.js";
3
- import { n as IconButtonProps } from "./button-C39M5h4K.js";
4
- import { n as Separator } from "./separator-CNDs98Dv.js";
5
- import { t as Tooltip } from "./tooltip-BKWK5c7_.js";
3
+ import { n as IconButtonProps } from "./button-crUf0hbR.js";
4
+ import { n as Separator } from "./separator-Bo4nY_3M.js";
5
+ import { t as Tooltip } from "./tooltip-DA41fxe5.js";
6
6
  import { ComponentProps, ReactElement, ReactNode } from "react";
7
7
  //#region src/components/sidebar/sidebar.d.ts
8
8
  /**
@@ -390,9 +390,10 @@ type SidebarTriggerProps = Omit<IconButtonProps, "appearance" | "asChild" | "chi
390
390
  * so the app-wide delay and hover settings stay app-wide.
391
391
  *
392
392
  * It also stamps `aria-keyshortcuts` for the `⌘B` / `Ctrl+B` chord the root
393
- * binds, resolved after hydration: the server cannot know the host, so the
394
- * first paint is the non-Apple answer. Both the attribute and the chips are
395
- * omitted under `Sidebar.Root keyboardShortcut={false}`.
393
+ * binds. The server cannot know the host, so the server HTML and the hydration
394
+ * render carry `Control+B`. React corrects it once after hydration. A trigger
395
+ * that mounts after hydration reads the platform in its first render. Both the
396
+ * attribute and the chips are omitted under `Sidebar.Root keyboardShortcut={false}`.
396
397
  *
397
398
  * **Data attributes:**
398
399
  *
package/dist/sidebar.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./data-slot-EM6s2WEU.js";import{t as n}from"./slot-CxM7jdFi.js";import{t as r}from"./button-BCk0KpWb.js";import{t as i}from"./use-is-hydrated-DDCqXmju.js";import{n as a}from"./separator-D1K7DSTv.js";import{n as o,t as s}from"./use-is-apple-platform-Cxwrb86L.js";import{t as c}from"./use-callback-ref-IYti9y7x.js";import{n as l}from"./cookie-ca4g5CKp.js";import{t as u}from"./sheet-2AQT0DNu.js";import{r as d}from"./use-breakpoint-Dqu12Szq.js";import{t as f}from"./tooltip-BZRRJgpm.js";import{createContext as p,useCallback as m,useContext as h,useEffect as g,useId as _,useMemo as v,useRef as y,useState as b}from"react";import x from"tiny-invariant";import{Fragment as S,jsx as C,jsxs as w}from"react/jsx-runtime";import{SidebarSimpleIcon as T}from"@phosphor-icons/react/SidebarSimple";const E={sm:`hidden sm:block`,md:`hidden md:block`,lg:`hidden lg:block`},D=p(null);function O(){let e=h(D);return x(e,`useSidebar must be used within Sidebar.Root.`),e}function k(e){let t=h(D);return x(t,`Sidebar.${e} must be rendered inside Sidebar.Root.`),t}const A=[];function j(e){return e instanceof HTMLElement?e.isContentEditable||e.tagName===`INPUT`||e.tagName===`TEXTAREA`||e.tagName===`SELECT`:!1}function M(){let e=Symbol(`sidebar-keyboard-shortcut`);return A.push(e),{isOwner:()=>A[0]===e,release:()=>{let t=A.indexOf(e);t!==-1&&A.splice(t,1)}}}const N=({children:e,defaultOpen:t=!0,keyboardShortcut:n=!0,mobileBreakpoint:r=`lg`,onOpenChange:i,onOpenMobileChange:a,open:s,openMobile:l})=>{let u=d(r),f=_(),p=s!=null,[h,x]=b(t),S=p?s:h,w=m(e=>{p||x(e),i?.(e)},[p,i]),T=l!=null,[E,O]=b(!1),k=T?l:E,A=m(e=>{T||O(e),a?.(e)},[T,a]),N=y(u);g(()=>{let e=N.current&&!u;N.current=u,e&&k&&A(!1)},[u,k,A]);let P=m(()=>{u?A(!k):w(!S)},[u,S,k,w,A]),F=c(P);g(()=>{if(!n)return;let e=M(),t=o(),r=n=>{if(!e.isOwner()||j(n.target))return;let r=t?n.metaKey:n.ctrlKey,i=t?n.ctrlKey:n.metaKey;n.key.toLowerCase()===`b`&&r&&!i&&!n.altKey&&!n.shiftKey&&(n.preventDefault(),F())};return window.addEventListener(`keydown`,r),()=>{window.removeEventListener(`keydown`,r),e.release()}},[n,F]);let I=v(()=>({isMobile:u,keyboardShortcut:n,mobileBreakpoint:r,navId:f,open:S,openMobile:k,setOpen:w,setOpenMobile:A,toggle:P}),[u,n,r,f,S,k,w,A,P]);return C(D.Provider,{value:I,children:e})},P=({"aria-label":n,"aria-labelledby":r,children:a,className:o,"data-slot":s,...c})=>{let{isMobile:l,mobileBreakpoint:d,navId:f,open:p,openMobile:m,setOpenMobile:h}=k(`Nav`),g=i(),_=n??(r==null?`Main`:void 0);return l?C(u.Root,{open:m,onOpenChange:h,children:w(u.Content,{side:`left`,preferredWidth:`sm:max-w-(--sidebar-width-mobile,18rem)`,"data-slot":t(s,`sidebar-nav`),"data-mobile":``,...r==null?null:{"aria-labelledby":r},className:e(`bg-base w-(--sidebar-width-mobile,18rem) max-w-full p-0`,o),...c,children:[C(u.Title,{className:`sr-only`,children:_??`Sidebar`}),C(`nav`,{id:f,"aria-label":_,"aria-labelledby":r,className:`flex h-full w-full min-w-0 flex-col text-sm`,children:a})]})}):C(`div`,{"data-slot":t(s,`sidebar-nav`),"data-state":p?`expanded`:`collapsed`,"data-hydrated":g?``:void 0,className:e(`group/sidebar-nav bg-base relative h-full w-(--sidebar-width,13rem) shrink-0 overflow-hidden`,`data-[state=collapsed]:w-(--sidebar-width-icon,3.25rem)`,!g&&E[d],g&&[`transition-[width] duration-200 ease-linear motion-reduce:transition-none`],o),...c,children:C(`nav`,{id:f,"aria-label":_,"aria-labelledby":r,className:`absolute inset-y-0 left-0 flex w-full min-w-0 flex-col text-sm`,children:a})})},F=C(T,{}),I=({label:e,shortcut:t})=>t==null?e:w(`span`,{className:`flex items-center gap-1.5`,children:[e,C(`span`,{"aria-hidden":!0,className:`inline-flex shrink-0 items-center gap-0.5 [&_kbd]:h-4 [&_kbd]:min-w-4 [&_kbd]:bg-neutral-500/25 [&_kbd]:px-0.5 [&_kbd]:text-xs`,children:t})]}),L=({appearance:e=`ghost`,"data-slot":n,icon:i=F,intent:a=`neutral`,label:o=`Toggle Sidebar`,onClick:c,shortcut:l,...u})=>{let{isMobile:d,keyboardShortcut:p,navId:m,open:h,openMobile:g,toggle:_}=k(`Trigger`),v=s(),y=d?g:h,b=!d||g,x=p?l:void 0,S=v?`Meta+B`:`Control+B`;return w(f.Root,{children:[C(f.Trigger,{asChild:!0,children:C(r,{appearance:e,"aria-controls":b?m:void 0,"aria-expanded":y,"aria-keyshortcuts":p?S:void 0,"data-slot":t(n,`sidebar-trigger`),"data-state":y?`expanded`:`collapsed`,icon:i,intent:a,label:o,onClick:e=>{c?.(e),e.defaultPrevented||_()},...u})}),C(f.Content,{"data-slot":`sidebar-trigger-tooltip`,children:C(I,{label:o,shortcut:x})})]})},R=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`div`,{"data-slot":t(o,`sidebar-header`),className:e(`grid grid-cols-1 grid-rows-(--sidebar-header-height,4.5rem) shrink-0 items-center px-3`,`group-data-[state=expanded]/sidebar-nav:pr-1`,a),...s,children:i}),z=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`div`,{"data-slot":t(o,`sidebar-body`),className:e(`scrollbar scrollbar-gutter-stable scroll-fade-y flex-1 scroll-py-6 space-y-2 overflow-y-auto overflow-x-hidden px-3 pt-1.5 pb-4`,`group-data-[state=expanded]/sidebar-nav:pr-1`,`group-data-[state=collapsed]/sidebar-nav:scrollbar-none`,`group-data-[state=collapsed]/sidebar-nav:scrollbar-gutter-auto`,`group-data-[state=collapsed]/sidebar-nav:[&::-webkit-scrollbar]:hidden`,a),...s,children:i}),B=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`div`,{"data-slot":t(o,`sidebar-footer`),className:e(`shrink-0 px-3 pt-3 pb-3.5`,`group-data-[state=expanded]/sidebar-nav:pr-1`,a),...s,children:i}),V=p(null),H=({asChild:r,children:i,className:a,"data-slot":o,...s})=>{let[c,l]=b(null),u=v(()=>({mountedLabelId:c,setMountedLabelId:l}),[c]),d=r?n:`div`;return C(V.Provider,{value:u,children:C(d,{"data-slot":t(o,`sidebar-group`),className:e(`pt-0.5`,a),...s,children:i})})},U=({asChild:r,children:i,className:a,"data-slot":o,id:s,...c})=>{let l=h(V),u=_(),d=s??(l==null?void 0:u),f=l?.setMountedLabelId;return g(()=>{if(f!=null&&d!=null)return f(d),()=>{f(null)}},[f,d]),C(r?n:`div`,{id:d,"data-slot":t(o,`sidebar-group-label`),className:e(`text-muted flex min-w-0 items-center gap-2 truncate px-2 py-1 text-xs font-medium`,`group-data-[state=collapsed]/sidebar-nav:opacity-0`,`group-data-[state=collapsed]/sidebar-nav:pointer-events-none`,`group-data-hydrated/sidebar-nav:transition-opacity group-data-hydrated/sidebar-nav:duration-200 group-data-hydrated/sidebar-nav:ease-linear group-data-hydrated/sidebar-nav:motion-reduce:transition-none`,a),...c,children:i})},W=({"aria-labelledby":r,asChild:i,children:a,className:o,"data-slot":s,...c})=>{let l=h(V);return C(i?n:`ul`,{"aria-labelledby":r??l?.mountedLabelId??void 0,"data-slot":t(s,`sidebar-list`),className:e(`mb-2 space-y-px`,o),...c,children:a})},G=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`li`,{"data-slot":t(o,`sidebar-item`),className:e(`list-none`,a),...s,children:i}),K=[`ring-focus-accent flex w-full min-w-0 items-center gap-2 truncate rounded-md px-2 py-1 text-left font-normal transition-none focus:outline-hidden focus-visible:ring-4`,`text-body hover:text-strong hover:bg-neutral-500/10`,`data-state-open:bg-neutral-500/15 data-state-open:text-strong`,`group-data-[state=collapsed]/sidebar-nav:ml-1`,`group-data-[state=collapsed]/sidebar-nav:w-7`,`group-data-[state=collapsed]/sidebar-nav:p-1`],q={Root:N,Nav:P,Trigger:L,Header:R,Body:z,Footer:B,Group:H,GroupLabel:U,List:W,Item:G,ItemButton:({asChild:r,children:i,className:a,current:o,"data-slot":s,type:c,...l})=>C(r?n:`button`,{"data-slot":t(s,`sidebar-item-button`),"data-current":o?``:void 0,"aria-current":o?`page`:void 0,type:r?c:c??`button`,className:e(K,`data-current:bg-neutral-500/15 data-current:text-strong`,`aria-[current=page]:bg-neutral-500/15 aria-[current=page]:text-strong`,`[&>svg]:text-muted hover:[&>svg]:text-strong data-current:[&>svg]:text-strong aria-[current=page]:[&>svg]:text-strong [&>svg:first-child]:size-5 [&>svg]:shrink-0`,a),...l,children:i}),SearchTrigger:({asChild:r,children:i,className:a,"data-slot":o,shortcut:s,type:c,...l})=>{let u=r?n:`button`,d=s==null?i:w(S,{children:[i,C(`span`,{"aria-hidden":!0,className:e(`pointer-events-none -mr-1 ml-auto inline-flex shrink-0 items-center gap-0.5 opacity-0 select-none`,`group-hover:opacity-100 group-focus-visible:opacity-100`,`group-data-[state=collapsed]/sidebar-nav:hidden`,`[&_kbd]:text-body [&_kbd]:h-5 [&_kbd]:min-w-5 [&_kbd]:bg-neutral-500/20 [&_kbd]:px-1 [&_kbd]:text-xs [&_kbd]:font-normal`),children:s})]});return C(u,{"data-slot":t(o,`sidebar-search-trigger`),type:r?c:c??`button`,className:e(`group`,K,`[&>svg:first-child]:text-muted hover:[&>svg:first-child]:text-strong [&>svg:first-child]:size-5 [&>svg]:shrink-0`,a),...l,children:d})},SwitcherTrigger:({asChild:r,children:i,className:a,"data-slot":o,type:s,...c})=>C(r?n:`button`,{"data-slot":t(o,`sidebar-switcher-trigger`),type:r?s:s??`button`,className:e(`text-body hover:text-strong hover:bg-neutral-500/10 flex w-full min-w-0 items-center gap-2 rounded-[0.625rem] py-1 pr-1.5 pl-1 text-left font-medium transition-none`,`data-state-open:bg-neutral-500/15 data-state-open:text-strong`,`ring-focus-accent focus:outline-hidden focus-visible:ring-4`,`*:first:size-7`,`group-data-[state=collapsed]/sidebar-nav:w-9`,`group-data-[state=collapsed]/sidebar-nav:p-1`,`group-data-[state=collapsed]/sidebar-nav:[&>:not(:first-child)]:sr-only`,a),...c,children:i}),Tooltip:({children:e,"data-slot":n,label:r,shortcut:i,side:a=`right`,...o})=>{let{isMobile:s,open:c}=k(`Tooltip`),l=!s&&!c,[u,d]=b(!1),[p,m]=b(l);return p!==l&&(m(l),d(!1)),w(f.Root,{disableHoverableContent:!0,onOpenChange:e=>{d(e&&l)},open:l&&u,children:[C(f.Trigger,{asChild:!0,children:e}),C(f.Content,{"data-slot":t(n,`sidebar-tooltip`),side:a,...o,children:C(I,{label:r,shortcut:i})})]})},Separator:({className:n,"data-slot":r,...i})=>C(a,{"data-slot":t(r,`sidebar-separator`),className:e(`my-3`,`group-data-[state=collapsed]/sidebar-nav:w-9`,n),...i})},J=`mantle-sidebar-state`,Y={collapsed:`collapsed`,expanded:`expanded`};function X(e){let t=l(e,J);if(t===Y.expanded)return!0;if(t===Y.collapsed)return!1}function Z(e,t={}){let{domain:n,maxAge:r=31536e3,path:i=`/`,sameSite:a=`Lax`,secure:o=!1}=t,s=e?Y.expanded:Y.collapsed,c=[`${J}=${s}`,`Max-Age=${r}`,`Path=${i}`];return n!=null&&c.push(`Domain=${n}`),c.push(`SameSite=${a}`),o&&c.push(`Secure`),c.join(`; `)}export{J as SIDEBAR_STATE_COOKIE_NAME,q as Sidebar,X as extractSidebarStateCookie,Z as serializeSidebarStateCookie,O as useSidebar};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./data-slot-EM6s2WEU.js";import{t as n}from"./slot-C3gII_9c.js";import{t as r}from"./button-CaM-ZAH5.js";import{t as i}from"./use-is-hydrated-DDCqXmju.js";import{n as a}from"./separator-Da8lDnio.js";import{n as o,t as s}from"./use-is-apple-platform-CMPzIYjz.js";import{t as c}from"./use-callback-ref-IYti9y7x.js";import{n as l}from"./cookie-ca4g5CKp.js";import{t as u}from"./sheet-C6UGAvRk.js";import{r as d}from"./use-breakpoint-BhJ_3El2.js";import{t as f}from"./tooltip-CkAibjBb.js";import{createContext as p,useCallback as m,useContext as h,useEffect as g,useId as _,useMemo as v,useRef as y,useState as b}from"react";import x from"tiny-invariant";import{Fragment as S,jsx as C,jsxs as w}from"react/jsx-runtime";import{SidebarSimpleIcon as T}from"@phosphor-icons/react/SidebarSimple";const E={sm:`hidden sm:block`,md:`hidden md:block`,lg:`hidden lg:block`},D=p(null);function O(){let e=h(D);return x(e,`useSidebar must be used within Sidebar.Root.`),e}function k(e){let t=h(D);return x(t,`Sidebar.${e} must be rendered inside Sidebar.Root.`),t}const A=[];function j(e){return e instanceof HTMLElement?e.isContentEditable||e.tagName===`INPUT`||e.tagName===`TEXTAREA`||e.tagName===`SELECT`:!1}function M(){let e=Symbol(`sidebar-keyboard-shortcut`);return A.push(e),{isOwner:()=>A[0]===e,release:()=>{let t=A.indexOf(e);t!==-1&&A.splice(t,1)}}}const N=({children:e,defaultOpen:t=!0,keyboardShortcut:n=!0,mobileBreakpoint:r=`lg`,onOpenChange:i,onOpenMobileChange:a,open:s,openMobile:l})=>{let u=d(r),f=_(),p=s!=null,[h,x]=b(t),S=p?s:h,w=m(e=>{p||x(e),i?.(e)},[p,i]),T=l!=null,[E,O]=b(!1),k=T?l:E,A=m(e=>{T||O(e),a?.(e)},[T,a]),N=y(u);g(()=>{let e=N.current&&!u;N.current=u,e&&k&&A(!1)},[u,k,A]);let P=m(()=>{u?A(!k):w(!S)},[u,S,k,w,A]),F=c(P);g(()=>{if(!n)return;let e=M(),t=o(),r=n=>{if(!e.isOwner()||j(n.target))return;let r=t?n.metaKey:n.ctrlKey,i=t?n.ctrlKey:n.metaKey;n.key.toLowerCase()===`b`&&r&&!i&&!n.altKey&&!n.shiftKey&&(n.preventDefault(),F())};return window.addEventListener(`keydown`,r),()=>{window.removeEventListener(`keydown`,r),e.release()}},[n,F]);let I=v(()=>({isMobile:u,keyboardShortcut:n,mobileBreakpoint:r,navId:f,open:S,openMobile:k,setOpen:w,setOpenMobile:A,toggle:P}),[u,n,r,f,S,k,w,A,P]);return C(D.Provider,{value:I,children:e})},P=({"aria-label":n,"aria-labelledby":r,children:a,className:o,"data-slot":s,...c})=>{let{isMobile:l,mobileBreakpoint:d,navId:f,open:p,openMobile:m,setOpenMobile:h}=k(`Nav`),g=i(),_=n??(r==null?`Main`:void 0);return l?C(u.Root,{open:m,onOpenChange:h,children:w(u.Content,{side:`left`,preferredWidth:`sm:max-w-(--sidebar-width-mobile,18rem)`,"data-slot":t(s,`sidebar-nav`),"data-mobile":``,...r==null?null:{"aria-labelledby":r},className:e(`bg-base w-(--sidebar-width-mobile,18rem) max-w-full p-0`,o),...c,children:[C(u.Title,{className:`sr-only`,children:_??`Sidebar`}),C(`nav`,{id:f,"aria-label":_,"aria-labelledby":r,className:`flex h-full w-full min-w-0 flex-col text-sm`,children:a})]})}):C(`div`,{"data-slot":t(s,`sidebar-nav`),"data-state":p?`expanded`:`collapsed`,"data-hydrated":g?``:void 0,className:e(`group/sidebar-nav bg-base relative h-full w-(--sidebar-width,13rem) shrink-0 overflow-hidden`,`data-[state=collapsed]:w-(--sidebar-width-icon,3.25rem)`,!g&&E[d],g&&`transition-[width] duration-200 ease-linear motion-reduce:transition-none`,o),...c,children:C(`nav`,{id:f,"aria-label":_,"aria-labelledby":r,className:`absolute inset-y-0 left-0 flex w-full min-w-0 flex-col text-sm`,children:a})})},F=C(T,{}),I=({label:e,shortcut:t})=>t==null?e:w(`span`,{className:`flex items-center gap-1.5`,children:[e,C(`span`,{"aria-hidden":!0,className:`inline-flex shrink-0 items-center gap-0.5 [&_kbd]:h-4 [&_kbd]:min-w-4 [&_kbd]:bg-neutral-500/25 [&_kbd]:px-0.5 [&_kbd]:text-xs`,children:t})]}),L=({appearance:e=`ghost`,"data-slot":n,icon:i=F,intent:a=`neutral`,label:o=`Toggle Sidebar`,onClick:c,shortcut:l,...u})=>{let{isMobile:d,keyboardShortcut:p,navId:m,open:h,openMobile:g,toggle:_}=k(`Trigger`),v=s(),y=d?g:h,b=!d||g,x=p?l:void 0,S=v?`Meta+B`:`Control+B`;return w(f.Root,{children:[C(f.Trigger,{asChild:!0,children:C(r,{appearance:e,"aria-controls":b?m:void 0,"aria-expanded":y,"aria-keyshortcuts":p?S:void 0,"data-slot":t(n,`sidebar-trigger`),"data-state":y?`expanded`:`collapsed`,icon:i,intent:a,label:o,onClick:e=>{c?.(e),e.defaultPrevented||_()},...u})}),C(f.Content,{"data-slot":`sidebar-trigger-tooltip`,children:C(I,{label:o,shortcut:x})})]})},R=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`div`,{"data-slot":t(o,`sidebar-header`),className:e(`grid grid-cols-1 grid-rows-(--sidebar-header-height,4.5rem) shrink-0 items-center px-3`,`group-data-[state=expanded]/sidebar-nav:pr-1`,a),...s,children:i}),z=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`div`,{"data-slot":t(o,`sidebar-body`),className:e(`scrollbar scrollbar-gutter-stable scroll-fade-y flex-1 scroll-py-6 space-y-2 overflow-y-auto overflow-x-hidden px-3 pt-1.5 pb-4`,`group-data-[state=expanded]/sidebar-nav:pr-1`,`group-data-[state=collapsed]/sidebar-nav:scrollbar-none`,`group-data-[state=collapsed]/sidebar-nav:scrollbar-gutter-auto`,`group-data-[state=collapsed]/sidebar-nav:[&::-webkit-scrollbar]:hidden`,a),...s,children:i}),B=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`div`,{"data-slot":t(o,`sidebar-footer`),className:e(`shrink-0 px-3 pt-3 pb-3.5`,`group-data-[state=expanded]/sidebar-nav:pr-1`,a),...s,children:i}),V=p(null),H=({asChild:r,children:i,className:a,"data-slot":o,...s})=>{let[c,l]=b(null),u=v(()=>({mountedLabelId:c,setMountedLabelId:l}),[c]),d=r?n:`div`;return C(V.Provider,{value:u,children:C(d,{"data-slot":t(o,`sidebar-group`),className:e(`pt-0.5`,a),...s,children:i})})},U=({asChild:r,children:i,className:a,"data-slot":o,id:s,...c})=>{let l=h(V),u=_(),d=s??(l==null?void 0:u),f=l?.setMountedLabelId;return g(()=>{if(f!=null&&d!=null)return f(d),()=>{f(null)}},[f,d]),C(r?n:`div`,{id:d,"data-slot":t(o,`sidebar-group-label`),className:e(`text-muted flex min-w-0 items-center gap-2 truncate px-2 py-1 text-xs font-medium`,`group-data-[state=collapsed]/sidebar-nav:opacity-0`,`group-data-[state=collapsed]/sidebar-nav:pointer-events-none`,`group-data-hydrated/sidebar-nav:transition-opacity group-data-hydrated/sidebar-nav:duration-200 group-data-hydrated/sidebar-nav:ease-linear group-data-hydrated/sidebar-nav:motion-reduce:transition-none`,a),...c,children:i})},W=({"aria-labelledby":r,asChild:i,children:a,className:o,"data-slot":s,...c})=>{let l=h(V);return C(i?n:`ul`,{"aria-labelledby":r??l?.mountedLabelId??void 0,"data-slot":t(s,`sidebar-list`),className:e(`mb-2 space-y-px`,o),...c,children:a})},G=({asChild:r,children:i,className:a,"data-slot":o,...s})=>C(r?n:`li`,{"data-slot":t(o,`sidebar-item`),className:e(`list-none`,a),...s,children:i}),K=[`ring-focus-accent flex w-full min-w-0 items-center gap-2 truncate rounded-md px-2 py-1 text-left font-normal transition-none focus:outline-hidden focus-visible:ring-4`,`text-body hover:text-strong hover:bg-neutral-500/10`,`data-state-open:bg-neutral-500/15 data-state-open:text-strong`,`group-data-[state=collapsed]/sidebar-nav:ml-1`,`group-data-[state=collapsed]/sidebar-nav:w-7`,`group-data-[state=collapsed]/sidebar-nav:p-1`].join(` `),q={Root:N,Nav:P,Trigger:L,Header:R,Body:z,Footer:B,Group:H,GroupLabel:U,List:W,Item:G,ItemButton:({asChild:r,children:i,className:a,current:o,"data-slot":s,type:c,...l})=>C(r?n:`button`,{"data-slot":t(s,`sidebar-item-button`),"data-current":o?``:void 0,"aria-current":o?`page`:void 0,type:r?c:c??`button`,className:e(K,`data-current:bg-neutral-500/15 data-current:text-strong`,`aria-[current=page]:bg-neutral-500/15 aria-[current=page]:text-strong`,`[&>svg]:text-muted hover:[&>svg]:text-strong data-current:[&>svg]:text-strong aria-[current=page]:[&>svg]:text-strong [&>svg:first-child]:size-5 [&>svg]:shrink-0`,a),...l,children:i}),SearchTrigger:({asChild:r,children:i,className:a,"data-slot":o,shortcut:s,type:c,...l})=>{let u=r?n:`button`,d=s==null?i:w(S,{children:[i,C(`span`,{"aria-hidden":!0,className:e(`pointer-events-none -mr-1 ml-auto inline-flex shrink-0 items-center gap-0.5 opacity-0 select-none`,`group-hover:opacity-100 group-focus-visible:opacity-100`,`group-data-[state=collapsed]/sidebar-nav:hidden`,`[&_kbd]:text-body [&_kbd]:h-5 [&_kbd]:min-w-5 [&_kbd]:bg-neutral-500/20 [&_kbd]:px-1 [&_kbd]:text-xs [&_kbd]:font-normal`),children:s})]});return C(u,{"data-slot":t(o,`sidebar-search-trigger`),type:r?c:c??`button`,className:e(`group`,K,`[&>svg:first-child]:text-muted hover:[&>svg:first-child]:text-strong [&>svg:first-child]:size-5 [&>svg]:shrink-0`,a),...l,children:d})},SwitcherTrigger:({asChild:r,children:i,className:a,"data-slot":o,type:s,...c})=>C(r?n:`button`,{"data-slot":t(o,`sidebar-switcher-trigger`),type:r?s:s??`button`,className:e(`text-body hover:text-strong hover:bg-neutral-500/10 flex w-full min-w-0 items-center gap-2 rounded-[0.625rem] py-1 pr-1.5 pl-1 text-left font-medium transition-none`,`data-state-open:bg-neutral-500/15 data-state-open:text-strong`,`ring-focus-accent focus:outline-hidden focus-visible:ring-4`,`*:first:size-7`,`group-data-[state=collapsed]/sidebar-nav:w-9`,`group-data-[state=collapsed]/sidebar-nav:p-1`,`group-data-[state=collapsed]/sidebar-nav:[&>:not(:first-child)]:sr-only`,a),...c,children:i}),Tooltip:({children:e,"data-slot":n,label:r,shortcut:i,side:a=`right`,...o})=>{let{isMobile:s,open:c}=k(`Tooltip`),l=!s&&!c,[u,d]=b(!1),[p,m]=b(l);return p!==l&&(m(l),d(!1)),w(f.Root,{disableHoverableContent:!0,onOpenChange:e=>{d(e&&l)},open:l&&u,children:[C(f.Trigger,{asChild:!0,children:e}),C(f.Content,{"data-slot":t(n,`sidebar-tooltip`),side:a,...o,children:C(I,{label:r,shortcut:i})})]})},Separator:({className:n,"data-slot":r,...i})=>C(a,{"data-slot":t(r,`sidebar-separator`),className:e(`my-3`,`group-data-[state=collapsed]/sidebar-nav:w-9`,n),...i})},J=`mantle-sidebar-state`,Y={collapsed:`collapsed`,expanded:`expanded`};function X(e){let t=l(e,J);if(t===Y.expanded)return!0;if(t===Y.collapsed)return!1}function Z(e,t={}){let{domain:n,maxAge:r=31536e3,path:i=`/`,sameSite:a=`Lax`,secure:o=!1}=t,s=e?Y.expanded:Y.collapsed,c=[`${J}=${s}`,`Max-Age=${r}`,`Path=${i}`];return n!=null&&c.push(`Domain=${n}`),c.push(`SameSite=${a}`),o&&c.push(`Secure`),c.join(`; `)}export{J as SIDEBAR_STATE_COOKIE_NAME,q as Sidebar,X as extractSidebarStateCookie,Z as serializeSidebarStateCookie,O as useSidebar};
@@ -0,0 +1 @@
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./slot-C3gII_9c.js";import{jsx as n}from"react/jsx-runtime";const r=({asChild:r=!1,className:i,ref:a,...o})=>n(r?t:`div`,{"data-slot":`skeleton`,"aria-hidden":!0,className:e(`dark-high-contrast:bg-black/30 high-contrast:bg-black/30 h-4 animate-pulse rounded-md bg-gray-300/25 dark:bg-gray-950/10`,i),ref:a,...o});export{r as t};
@@ -1,7 +1,7 @@
1
1
  import { t as SelfClosingWithAsChild } from "./as-child-D23mGo4f.js";
2
2
  import { ComponentProps } from "react";
3
3
  //#region src/components/skeleton/skeleton.d.ts
4
- type Props = Exclude<ComponentProps<"div">, "children"> & SelfClosingWithAsChild;
4
+ type Props = Omit<ComponentProps<"div">, "children"> & SelfClosingWithAsChild;
5
5
  /**
6
6
  * A skeleton is a placeholder for content that is loading. By rendering a
7
7
  * neutral block where real content will eventually appear, you give the
@@ -24,9 +24,10 @@ type Props = Exclude<ComponentProps<"div">, "children"> & SelfClosingWithAsChild
24
24
  * — the more closely the skeleton matches, the less layout shift on swap.
25
25
  *
26
26
  * **Accessibility.** Skeletons are decorative and convey no semantic
27
- * meaning to assistive tech. If the underlying region is loading, also
28
- * announce it to screen readers — e.g. wrap in an element with
29
- * `role="status"` and a visually-hidden "Loading…" label.
27
+ * meaning to assistive tech, so the element renders `aria-hidden="true"` by
28
+ * default; pass `aria-hidden={false}` to opt out. If the underlying region
29
+ * is loading, also announce it to screen readers, for example wrap it in an
30
+ * element with `role="status"` and a visually-hidden "Loading…" label.
30
31
  *
31
32
  * @see https://mantle.ngrok.com/components/feedback/skeleton
32
33
  *
package/dist/skeleton.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./skeleton-D86Gsflk.js";export{e as Skeleton};
1
+ import{t as e}from"./skeleton-paJOgf-f.js";export{e as Skeleton};
@@ -1,6 +1,7 @@
1
+ import { t as WithDataSlot } from "./data-slot-CChfb_cv.js";
1
2
  import { ComponentProps } from "react";
2
3
  //#region src/components/skip-to-main-link/skip-to-main-link.d.ts
3
- type SkipToMainLinkProps = Omit<ComponentProps<"a">, "href"> & {
4
+ type SkipToMainLinkProps = Omit<ComponentProps<"a">, "href"> & WithDataSlot & {
4
5
  /**
5
6
  * The id of the target element to focus when the link is activated.
6
7
  * Must match the `id` on the `<Main>` (or any focusable landmark) you
@@ -14,10 +15,12 @@ type SkipToMainLinkProps = Omit<ComponentProps<"a">, "href"> & {
14
15
  * A visually-hidden-until-focused "skip link" that lets keyboard users jump
15
16
  * past repeated navigation and land directly on the page's main content
16
17
  * landmark. When activated, it updates the URL hash and focuses the element
17
- * identified by `targetId` (defaulting to `"main"`) without scrolling. It
18
- * still renders a plain anchor with `href="#${targetId}"` to preserve link
19
- * semantics, support copy-link / no-JavaScript fallback behavior, and avoid
20
- * any router dependency in React Router, Next.js, or plain HTML.
18
+ * identified by `targetId` (defaulting to `"main"`). The focus call scrolls a
19
+ * target that sits off screen into view, so a sighted keyboard user sees where
20
+ * focus went. It still renders a plain anchor with `href="#${targetId}"`
21
+ * to preserve link semantics, support copy-link / no-JavaScript fallback
22
+ * behavior, and avoid any router dependency in React Router, Next.js, or plain
23
+ * HTML.
21
24
  *
22
25
  * Pair with the `<Main>` component (or any element with a matching `id`
23
26
  * and `tabIndex={-1}`) so it can receive focus.
@@ -33,6 +36,6 @@ type SkipToMainLinkProps = Omit<ComponentProps<"a">, "href"> & {
33
36
  * </Main>
34
37
  * ```
35
38
  */
36
- declare const SkipToMainLink: ({ children, className, onClick, targetId, ...props }: SkipToMainLinkProps) => import("react").JSX.Element;
39
+ declare const SkipToMainLink: ({ children, className, "data-slot": dataSlot, onClick, targetId, ...props }: SkipToMainLinkProps) => import("react").JSX.Element;
37
40
  //#endregion
38
41
  export { SkipToMainLink };
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./anchor-BjyGV6tB.js";import{jsx as n}from"react/jsx-runtime";const r=({children:r=`Skip to main content`,className:i,onClick:a,targetId:o=`main`,...s})=>n(t,{...s,"data-slot":`skip-to-main-link`,href:`#${o}`,onClick:e=>{e.preventDefault(),window.history.replaceState(null,``,`#${o}`),document.getElementById(o)?.focus({preventScroll:!0}),a?.(e)},className:e(`not-focus:sr-only bg-card fixed top-2 left-2 z-max px-4 py-2 shadow-lg`,i),children:r});export{r as SkipToMainLink};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./data-slot-EM6s2WEU.js";import{t as n}from"./anchor-Cqu4GPPV.js";import{jsx as r}from"react/jsx-runtime";const i=({children:i=`Skip to main content`,className:a,"data-slot":o,onClick:s,targetId:c=`main`,...l})=>r(n,{...l,"data-slot":t(o,`skip-to-main-link`),href:`#${c}`,onClick:e=>{e.preventDefault(),window.history.replaceState(null,``,`#${c}`),document.getElementById(c)?.focus(),s?.(e)},className:e(`not-focus:sr-only bg-card fixed top-2 left-2 z-max px-4 py-2 shadow-lg`,a),children:i});export{i as SkipToMainLink};
package/dist/slider.d.ts CHANGED
@@ -36,11 +36,13 @@ type SliderValueProps = {
36
36
  type SliderProps = SliderBaseProps & SliderValueProps & {
37
37
  /**
38
38
  * The color of the slider range. Accepts any Tailwind `bg-*` class.
39
- * @default "bg-accent-500"
39
+ * @default "bg-accent-600"
40
40
  */
41
41
  color?: `bg-${string}`;
42
42
  /**
43
- * Whether to show tick marks along the track at each `step` interval.
43
+ * Whether to show tick marks along the track: one per `step`, spread
44
+ * evenly across the track. When the range is not a multiple of `step`,
45
+ * the ticks do not land on the step values.
44
46
  * @default false
45
47
  */
46
48
  showTicks?: boolean;
@@ -53,7 +55,9 @@ type SliderProps = SliderBaseProps & SliderValueProps & {
53
55
  * `aria-errormessage` onto each thumb via `FieldControlContext`. Because
54
56
  * slider thumbs are ARIA slider widgets rather than native labelable controls,
55
57
  * pass `aria-label` or `aria-labelledby` to `Slider`; Mantle forwards those
56
- * labels to the rendered thumb(s).
58
+ * labels to the rendered thumb(s). `aria-label` derives a distinct name per
59
+ * thumb ("Minimum Price", "Maximum Price"). `aria-labelledby` names every
60
+ * thumb with the same text, so prefer `aria-label` for a range slider.
57
61
  *
58
62
  * @see https://mantle.ngrok.com/components/forms/slider
59
63
  *
package/dist/slider.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./field-B1wqeZr4.js";import{useContext as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import*as a from"@radix-ui/react-slider";function o({"aria-describedby":o,"aria-errormessage":l,"aria-invalid":u,"aria-label":d,"aria-labelledby":f,className:p,color:m=`bg-accent-600`,defaultValue:h,id:g,max:_=100,min:v=0,minStepsBetweenThumbs:y=1,name:b,step:x=1,showTicks:S=!1,value:C,...w}){let T=n(t),E=C==null?void 0:Array.isArray(C)?C:[C],D=h==null?void 0:Array.isArray(h)?h:[h],O=E??D??[v],k=s(S,v,_,x);return i(a.Root,{"data-slot":`slider`,defaultValue:D,value:E,...T?{}:{"aria-describedby":o,"aria-errormessage":l,"aria-invalid":u,id:g},min:v,minStepsBetweenThumbs:y,max:_,name:b,step:x,className:e(`[--slider-thumb-size:--spacing(4.5)]`,`data-orientation-vertical:min-h-40 relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-orientation-vertical:h-full data-orientation-vertical:w-auto data-orientation-vertical:flex-col`,k>0&&`mb-3`,p),...w,children:[r(a.Track,{"data-slot":`slider-track`,className:e(`bg-neutral-300 rounded-full relative grow overflow-hidden`,`data-orientation-horizontal:h-1.5 data-orientation-horizontal:w-full`,`data-orientation-vertical:w-1.5 data-orientation-vertical:h-full`),children:r(a.Range,{"data-slot":`slider-range`,className:e(`absolute select-none data-orientation-horizontal:h-full data-orientation-vertical:w-full`,m)})}),Array.from({length:O.length},(t,n)=>r(a.Thumb,{"data-slot":`slider-thumb`,"aria-describedby":T?.[`aria-describedby`]??o,"aria-errormessage":T?.[`aria-errormessage`]??l,"aria-invalid":T?.[`aria-invalid`]??u,"aria-label":c({ariaLabel:d,index:n,thumbCount:O.length}),"aria-labelledby":f,id:n===0?T?.id:void 0,className:e(`bg-card border-card relative size-(--slider-thumb-size) rounded-full border`,`shadow-md transition-[color,box-shadow]`,`after:absolute after:-inset-2`,`focus-visible:ring-3 focus-visible:ring-accent-500/20 focus-visible:outline-hidden`,`block shrink-0 cursor-pointer select-none`,`data-disabled:pointer-events-none data-disabled:cursor-default`)},n)),k>0&&r(`div`,{"data-slot":`slider-ticks`,className:`absolute top-full mt-1.5 flex w-full justify-between px-[calc(var(--slider-thumb-size)/2)]`,"aria-hidden":`true`,children:Array.from({length:k},(e,t)=>r(`span`,{"data-slot":`slider-tick`,className:`bg-card-border h-1.5 w-px`},t))})]})}function s(e,t,n,r){let i=n-t;return!e||!Number.isFinite(i)||!Number.isFinite(r)||r<=0||i<=0?0:Math.floor(i/r)+1}function c({ariaLabel:e,index:t,thumbCount:n}){if(e)return n===1?e:n===2?`${t===0?`Minimum`:`Maximum`} ${e}`:`${e} ${t+1} of ${n}`}export{o as Slider};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./field-B1wqeZr4.js";import{useContext as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import*as a from"@radix-ui/react-slider";function o({"aria-describedby":o,"aria-errormessage":l,"aria-invalid":u,"aria-label":d,"aria-labelledby":f,className:p,color:m=`bg-accent-600`,defaultValue:h,id:g,max:_=100,min:v=0,minStepsBetweenThumbs:y=1,name:b,step:x=1,showTicks:S=!1,value:C,...w}){let T=n(t),E=C==null?void 0:Array.isArray(C)?C:[C],D=h==null?void 0:Array.isArray(h)?h:[h],O=E??D??[v],k=s(S,v,_,x);return i(a.Root,{"data-slot":`slider`,defaultValue:D,value:E,...T?{}:{"aria-describedby":o,"aria-errormessage":l,"aria-invalid":u,id:g},min:v,minStepsBetweenThumbs:y,max:_,name:b,step:x,className:e(`[--slider-thumb-size:--spacing(4.5)]`,`data-orientation-vertical:min-h-40 relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-orientation-vertical:h-full data-orientation-vertical:w-auto data-orientation-vertical:flex-col`,k>0&&`mb-3`,p),...w,children:[r(a.Track,{"data-slot":`slider-track`,className:e(`bg-neutral-300 rounded-full relative grow overflow-hidden`,`data-orientation-horizontal:h-1.5 data-orientation-horizontal:w-full`,`data-orientation-vertical:w-1.5 data-orientation-vertical:h-full`),children:r(a.Range,{"data-slot":`slider-range`,className:e(`absolute select-none data-orientation-horizontal:h-full data-orientation-vertical:w-full`,m)})}),Array.from({length:O.length},(t,n)=>r(a.Thumb,{"data-slot":`slider-thumb`,"aria-describedby":T?.[`aria-describedby`]??o,"aria-errormessage":T?.[`aria-errormessage`]??l,"aria-invalid":T?.[`aria-invalid`]??u,"aria-label":c({ariaLabel:d,index:n,thumbCount:O.length}),"aria-labelledby":f,id:n===0?T?.id:void 0,className:e(`bg-card border-card relative size-(--slider-thumb-size) rounded-full border`,`shadow-md transition-[color,box-shadow]`,`after:absolute after:-inset-2`,`focus-visible:ring-3 focus-visible:ring-accent-500/20 focus-visible:outline-hidden`,`block shrink-0 cursor-pointer select-none`,`data-disabled:pointer-events-none data-disabled:cursor-default`)},n)),k>0&&r(`div`,{"data-slot":`slider-ticks`,className:`absolute top-full mt-1.5 flex w-full justify-between px-[calc(var(--slider-thumb-size)/2)]`,"aria-hidden":`true`,children:Array.from({length:k},(e,t)=>r(`span`,{"data-slot":`slider-tick`,className:`bg-card-border h-1.5 w-px`},t))})]})}function s(e,t,n,r){let i=n-t;return!e||!Number.isFinite(i)||!Number.isFinite(r)||r<=0||i<=0?0:Math.floor(i/r)+1}function c({ariaLabel:e,index:t,thumbCount:n}){if(e)return n===1?e:n===2?`${t===0?`Minimum`:`Maximum`} ${e}`:`${e} ${t+1} of ${n}`}export{o as Slider};
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./data-slot-EM6s2WEU.js";import{Children as n,createElement as r,isValidElement as i}from"react";import{jsx as a}from"react/jsx-runtime";import{createSlot as o}from"@radix-ui/react-slot";const s=o(`Slot`);function c(t,n){return typeof n==`function`?(...r)=>e(t,n(...r)):e(t,n)}function l(e,t){return typeof t==`function`?(...n)=>({...e,...t(...n)}):e==null?t:t==null?e:{...e,...t}}const u=({children:e,className:o,"data-slot":u,ref:d,style:f,...p})=>{if(!i(e))return n.only(e);let{className:m,style:h,"data-slot":g,..._}=e.props,v=t(u,g);return a(s,{ref:d,...p,className:c(o,m),style:l(f,h),children:r(e.type,{..._,...v!=null&&{"data-slot":v},key:e.key??void 0})})};export{u as t};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./data-slot-EM6s2WEU.js";import{Children as n,createElement as r,isValidElement as i}from"react";import{jsx as a}from"react/jsx-runtime";import{createSlot as o}from"@radix-ui/react-slot";const s=o(`Slot`);function c(t,n){return typeof n==`function`?(...r)=>e(t,n(...r)):e(t,n)}function l(e,t){return typeof t==`function`?(...n)=>({...e,...t(...n)}):e==null?t:t==null?e:{...e,...t}}const u=({children:e,className:o,"data-slot":u,ref:d,style:f,...p})=>{if(!i(e))return n.only(e);let{className:m,style:h,"data-slot":g,..._}=e.props,v=t(u,g);return a(s,{ref:d,...p,className:c(o,m),style:l(f,h),children:r(e.type,{..._,...v!=null&&{"data-slot":v},key:e.key??void 0})})};export{u as t};
package/dist/slot.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./slot-CxM7jdFi.js";export{e as Slot};
1
+ import{t as e}from"./slot-C3gII_9c.js";export{e as Slot};
@@ -1,7 +1,7 @@
1
- import { t as Button } from "./button-DjsmeoJ2.js";
2
- import { t as IconButton } from "./button-C39M5h4K.js";
1
+ import { t as Button } from "./button-B5i9n7Qp.js";
2
+ import { t as IconButton } from "./button-crUf0hbR.js";
3
3
  import { t as ButtonSize } from "./button-BCoI4bhP.js";
4
- import { t as DropdownMenu } from "./dropdown-menu-CpsUJGbn.js";
4
+ import { t as DropdownMenu } from "./dropdown-menu-BYapTV0f.js";
5
5
  import { ComponentProps, ReactNode } from "react";
6
6
  //#region src/components/split-button/split-button.d.ts
7
7
  type RootProps = ComponentProps<typeof DropdownMenu.Root> & ComponentProps<"div"> & {
@@ -18,6 +18,11 @@ type RootProps = ComponentProps<typeof DropdownMenu.Root> & ComponentProps<"div"
18
18
  * of related alternatives. Best for when users typically want one action but
19
19
  * occasionally need variants.
20
20
  *
21
+ * | Data Attribute | Value | Description |
22
+ * | -------------- | ------------------------------------------- | -------------------------------------------------- |
23
+ * | `data-slot` | `"split-button"` | On the wrapping `<div>`. |
24
+ * | `data-size` | `"xs"` \| `"sm"` \| `"md"` \| `"lg"` \| `"xl"` | The `size` prop, which both halves render at. |
25
+ *
21
26
  * @see https://mantle.ngrok.com/components/actions/split-button#splitbuttonroot
22
27
  *
23
28
  * @example
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./button-DwFvQWu4.js";import{t as r}from"./button-BCk0KpWb.js";import{t as i}from"./dropdown-menu-Cy7mLIpJ.js";import{CaretDownIcon as a}from"@phosphor-icons/react/CaretDown";import{createContext as o,useContext as s,useMemo as c}from"react";import{jsx as l}from"react/jsx-runtime";const u=o({size:`md`}),d={Root:({className:t,children:n,dir:r,open:a,defaultOpen:o,onOpenChange:s,modal:d,size:f=`md`,ref:p,...m})=>{let h=c(()=>({size:f}),[f]);return l(i.Root,{dir:r,open:a,defaultOpen:o,onOpenChange:s,modal:d,children:l(u.Provider,{value:h,children:l(`div`,{"data-slot":`split-button`,"data-size":f,className:e(`flex flex-row [&>*:first-child]:rounded-r-none [&>*:last-child]:rounded-l-none [&>*:not(:first-child):not(:last-child)]:rounded-none [&>*:not(:first-child)]:-ml-px [&>*:focus]:relative [&>*:focus]:z-10 [&>*:hover]:relative [&>*:hover]:z-10 *:active:scale-100!`,t),ref:p,...m,children:n})})})},PrimaryAction:e=>{let{size:t}=s(u);return l(n,{appearance:`outlined`,intent:`neutral`,size:t,...e})},MenuTrigger:({icon:e,...n})=>{let{size:o}=s(u);return l(i.Trigger,{asChild:!0,className:`group`,children:l(r,{icon:e??l(t,{svg:l(a,{weight:`bold`,className:`size-4 group-data-[state=open]:-rotate-180 transition-transform ease-out duration-150`})}),appearance:`outlined`,intent:`neutral`,size:o,...n})})},MenuContent:({align:e=`end`,...t})=>l(i.Content,{align:e,...t}),MenuItem:({className:t,...n})=>l(i.Item,{className:e(`gap-2`,t),...n})};export{d as SplitButton};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./icon-CGKaq_tV.js";import{t as n}from"./button-DGsTE3P2.js";import{t as r}from"./button-CaM-ZAH5.js";import{t as i}from"./dropdown-menu-lxHsgLiw.js";import{CaretDownIcon as a}from"@phosphor-icons/react/CaretDown";import{createContext as o,useContext as s,useMemo as c}from"react";import{jsx as l}from"react/jsx-runtime";const u=o({size:`md`}),d={Root:({className:t,children:n,dir:r,open:a,defaultOpen:o,onOpenChange:s,modal:d,size:f=`md`,ref:p,...m})=>{let h=c(()=>({size:f}),[f]);return l(i.Root,{dir:r,open:a,defaultOpen:o,onOpenChange:s,modal:d,children:l(u.Provider,{value:h,children:l(`div`,{"data-slot":`split-button`,"data-size":f,className:e(`flex flex-row [&>*:first-child]:rounded-r-none [&>*:last-child]:rounded-l-none [&>*:not(:first-child):not(:last-child)]:rounded-none [&>*:not(:first-child)]:-ml-px [&>*:focus]:relative [&>*:focus]:z-10 [&>*:hover]:relative [&>*:hover]:z-10 *:active:scale-100!`,t),ref:p,...m,children:n})})})},PrimaryAction:e=>{let{size:t}=s(u);return l(n,{appearance:`outlined`,intent:`neutral`,size:t,...e})},MenuTrigger:({icon:e,...n})=>{let{size:o}=s(u);return l(i.Trigger,{asChild:!0,className:`group`,children:l(r,{icon:e??l(t,{svg:l(a,{weight:`bold`,className:`size-4 group-data-[state=open]:-rotate-180 transition-transform ease-out duration-150`})}),appearance:`outlined`,intent:`neutral`,size:o,...n})})},MenuContent:({align:e=`end`,...t})=>l(i.Content,{align:e,...t}),MenuItem:({className:t,...n})=>l(i.Item,{className:e(`gap-2`,t),...n})};export{d as SplitButton};
package/dist/switch.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./booleanish-BfvnW6vy.js";import{t as n}from"./clsx-DUGZgXfJ.js";import{a as r,r as i}from"./field-Bpptk_9t.js";import{jsx as a}from"react/jsx-runtime";import{Root as o,Thumb as s}from"@radix-ui/react-switch";const c=({"aria-invalid":c,"aria-readonly":l,className:u,readOnly:d,onClick:f,ref:p,validation:m,...h})=>{let g=t(d??l),_=r(),{ariaInvalid:v,validation:y}=i({"aria-invalid":c,validation:m??_});return a(o,{"aria-invalid":v,"aria-readonly":g,"data-slot":`switch`,"data-validation":y||void 0,className:e(`peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full outline-hidden`,`disabled:cursor-default disabled:opacity-50`,`focus-visible:border-accent-600 focus-visible:ring-focus-accent focus-visible:outline-hidden focus-visible:ring-4`,`data-state-checked:bg-accent-600 data-state-unchecked:bg-gray-400`,`data-validation-success:data-state-checked:bg-success-600 focus-visible:data-validation-success:ring-focus-success`,`data-validation-warning:data-state-checked:bg-warning-600 focus-visible:data-validation-warning:ring-focus-warning`,`data-validation-error:data-state-checked:bg-danger-600 focus-visible:data-validation-error:ring-focus-danger`,u),onClick:e=>{if(g){e.preventDefault(),e.stopPropagation();return}f?.(e)},ref:p,...h,children:a(s,{className:n(`pointer-events-none block size-4 rounded-full bg-[#fff] shadow-md ring-0 transition-transform`,`data-state-checked:translate-x-4.5 data-state-unchecked:translate-x-0.5`)})})};export{c as Switch};
1
+ import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./booleanish-BfvnW6vy.js";import{t as n}from"./clsx-DUGZgXfJ.js";import{a as r,r as i}from"./field-Bpptk_9t.js";import{jsx as a}from"react/jsx-runtime";import{Root as o,Thumb as s}from"@radix-ui/react-switch";const c=({"aria-invalid":c,"aria-readonly":l,className:u,readOnly:d,onClick:f,ref:p,validation:m,...h})=>{let g=t(d??l),_=r(),{ariaInvalid:v,validation:y}=i({"aria-invalid":c,validation:m??_});return a(o,{"aria-invalid":v,"aria-readonly":g,"data-slot":`switch`,"data-validation":y||void 0,className:e(`peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full outline-hidden`,`disabled:cursor-default disabled:opacity-50`,`focus-visible:border-accent-600 focus-visible:ring-focus-accent focus-visible:outline-hidden focus-visible:ring-4`,`data-state-checked:bg-accent-600 data-state-unchecked:bg-gray-400`,`data-validation-success:data-state-checked:bg-success-600 focus-visible:data-validation-success:ring-focus-success`,`data-validation-warning:data-state-checked:bg-warning-600 focus-visible:data-validation-warning:ring-focus-warning`,`data-validation-error:data-state-checked:bg-danger-600 focus-visible:data-validation-error:ring-focus-danger`,u),onClick:e=>{if(g){e.preventDefault();return}f?.(e)},ref:p,...h,children:a(s,{className:n(`pointer-events-none block size-4 rounded-full bg-[#fff] shadow-md ring-0 transition-transform`,`data-state-checked:translate-x-4.5 data-state-unchecked:translate-x-0.5`)})})};export{c as Switch};