@ngrok/mantle 0.84.0 → 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.
- package/dist/accordion.d.ts +14 -10
- package/dist/accordion.js +1 -1
- package/dist/agent.json +1 -1
- package/dist/{alert-Blmunr_D.d.ts → alert-DCVfviBx.d.ts} +18 -3
- package/dist/alert-DtBQuuuP.js +1 -0
- package/dist/alert-center.d.ts +15 -6
- package/dist/alert-center.js +1 -1
- package/dist/alert-dialog.d.ts +58 -37
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.d.ts +1 -1
- package/dist/alert.js +1 -1
- package/dist/alternate-announcement-BkH4bOKp.js +1 -0
- package/dist/anchor-Cqu4GPPV.js +1 -0
- package/dist/anchor.d.ts +15 -15
- package/dist/anchor.js +1 -1
- package/dist/app-layout.js +1 -1
- package/dist/area-chart.js +1 -1
- package/dist/avatar.js +1 -1
- package/dist/badge.d.ts +3 -1
- package/dist/badge.js +1 -1
- package/dist/bar-chart.d.ts +17 -8
- package/dist/bar-chart.js +1 -1
- package/dist/breadcrumb.js +1 -1
- package/dist/button-B52_vczK.js +1 -0
- package/dist/{button-DjsmeoJ2.d.ts → button-B5i9n7Qp.d.ts} +19 -7
- package/dist/button-CaM-ZAH5.js +1 -0
- package/dist/{button-Bc0lEOJ2.js → button-DGsTE3P2.js} +1 -1
- package/dist/{button-CRCNRnk6.d.ts → button-DO53OA70.d.ts} +2 -2
- package/dist/{button-DmJkYfyl.js → button-Wn-yt0c_.js} +1 -1
- package/dist/{button-C39M5h4K.d.ts → button-crUf0hbR.d.ts} +19 -2
- package/dist/button.d.ts +3 -3
- package/dist/button.js +1 -1
- package/dist/calendar.d.ts +20 -4
- package/dist/calendar.js +1 -1
- package/dist/card.d.ts +10 -6
- package/dist/card.js +1 -1
- package/dist/centered-layout.js +1 -1
- package/dist/chart-B_rZqf8a.js +2 -0
- package/dist/checkbox-Gg6nGUnR.js +1 -0
- package/dist/checkbox.js +1 -1
- package/dist/choice-CT_AdesL.js +1 -0
- package/dist/{choice-CVdQrs-m.d.ts → choice-PESu-9s8.d.ts} +46 -12
- package/dist/choice.d.ts +1 -1
- package/dist/choice.js +1 -1
- package/dist/{code-block-Dj9otiLi.js → code-block-BE3Q0iAo.js} +2 -2
- package/dist/code-block.d.ts +26 -2
- package/dist/code-block.js +6 -6
- package/dist/code-block_highlight-utils.js +1 -1
- package/dist/code.js +1 -1
- package/dist/combobox.d.ts +19 -2
- package/dist/combobox.js +1 -1
- package/dist/command.d.ts +32 -13
- package/dist/command.js +1 -1
- package/dist/compose-refs-DdUwopIY.js +1 -0
- package/dist/{cx-IiQEAKf5.js → cx-0HCjnNv1.js} +1 -1
- package/dist/cx.d.ts +3 -3
- package/dist/cx.js +1 -1
- package/dist/data-table.d.ts +114 -61
- package/dist/data-table.js +1 -1
- package/dist/description-list.d.ts +43 -9
- package/dist/description-list.js +1 -1
- package/dist/{dialog-u8PtHYES.d.ts → dialog-B8YvfyIo.d.ts} +5 -3
- package/dist/{dialog-CnlaqHNh.js → dialog-CA-1Z0Np.js} +1 -1
- package/dist/{dialog-CEk0L7M7.d.ts → dialog-CtLI_uex.d.ts} +5 -3
- package/dist/dialog.d.ts +2 -2
- package/dist/dialog.js +1 -1
- package/dist/{dropdown-menu-CpsUJGbn.d.ts → dropdown-menu-BYapTV0f.d.ts} +8 -5
- package/dist/dropdown-menu-BkPBh_8y.d.ts +1 -0
- package/dist/{dropdown-menu-DJDrRzDU.js → dropdown-menu-lxHsgLiw.js} +1 -1
- package/dist/dropdown-menu.d.ts +2 -2
- package/dist/dropdown-menu.js +1 -1
- package/dist/empty.d.ts +4 -4
- package/dist/empty.js +1 -1
- package/dist/field.d.ts +91 -38
- package/dist/field.js +1 -1
- package/dist/flag.d.ts +9 -1
- package/dist/flag.js +1 -1
- package/dist/hooks.d.ts +28 -19
- package/dist/hooks.js +1 -1
- package/dist/hover-card.d.ts +11 -3
- package/dist/hover-card.js +1 -1
- package/dist/{icon-k4E9yNWD.d.ts → icon-BmJ57Tgh.d.ts} +10 -0
- package/dist/icon-CGKaq_tV.js +1 -0
- package/dist/icon-U24NfYv7.js +1 -0
- package/dist/icon-w0HUe7tr.d.ts +42 -0
- package/dist/icon.d.ts +2 -2
- package/dist/icon.js +1 -1
- package/dist/{icons-DEVx1oP9.js → icons-Cie4gcrm.js} +1 -1
- package/dist/icons.d.ts +7 -13
- package/dist/icons.js +1 -1
- package/dist/{in-view-gxyc9Q1_.d.ts → in-view-Ch5vJtWo.d.ts} +10 -5
- package/dist/input-BhykQSvJ.js +1 -0
- package/dist/input-DQyN6gN0.js +1 -0
- package/dist/input.d.ts +22 -10
- package/dist/input.js +1 -1
- package/dist/interactive-target-BXScNeOr.js +1 -0
- package/dist/{kbd-B9qmYaW8.js → kbd-4_0Y_8rx.js} +1 -1
- package/dist/kbd.d.ts +15 -9
- package/dist/kbd.js +1 -1
- package/dist/{label-C6YH9skg.d.ts → label-Bnfe9YJ6.d.ts} +3 -1
- package/dist/label-BqIp6kFx.js +1 -0
- package/dist/label.d.ts +1 -1
- package/dist/label.js +1 -1
- package/dist/layer-container-BTcQpd4K.js +1 -0
- package/dist/layer-container.js +1 -1
- package/dist/line-chart.js +1 -1
- package/dist/list-Bo1mExIg.js +1 -0
- package/dist/list.d.ts +37 -14
- package/dist/list.js +1 -1
- package/dist/live-region-CV7kykeo.js +1 -0
- package/dist/live-region.js +1 -1
- package/dist/llms.txt +1 -1
- package/dist/main.d.ts +4 -2
- package/dist/main.js +1 -1
- package/dist/media-object.d.ts +5 -12
- package/dist/media-object.js +1 -1
- package/dist/multi-select.d.ts +45 -13
- package/dist/multi-select.js +1 -1
- package/dist/otp-input.d.ts +9 -3
- package/dist/otp-input.js +1 -1
- package/dist/pagination.d.ts +165 -19
- package/dist/pagination.js +1 -1
- package/dist/{popover-D6x6Bq-G.js → popover-Bp-9B3GR.js} +1 -1
- package/dist/{popover-DDuw1UaJ.d.ts → popover-s2LhmzfQ.d.ts} +8 -4
- package/dist/popover.d.ts +1 -1
- package/dist/popover.js +1 -1
- package/dist/primitive-CejGAoGb.js +1 -0
- package/dist/progress.d.ts +65 -31
- package/dist/progress.js +1 -1
- package/dist/qr-code.d.ts +10 -4
- package/dist/qr-code.js +1 -1
- package/dist/radio-group-HDVxTNPi.js +1 -0
- package/dist/radio-group.d.ts +50 -25
- package/dist/radio-group.js +1 -1
- package/dist/sandbar.d.ts +1 -1
- package/dist/sandbar.js +1 -1
- package/dist/sandboxed-on-click-UagMFl_U.js +1 -0
- package/dist/sandboxed-on-click.d.ts +8 -0
- package/dist/sandboxed-on-click.js +1 -1
- package/dist/scatter-plot.js +1 -1
- package/dist/select-Dov9H2CX.js +1 -0
- package/dist/{select-DkFkSYBP.d.ts → select-ouAW88jx.d.ts} +30 -9
- package/dist/select.d.ts +1 -1
- package/dist/select.js +1 -1
- package/dist/selectable-list.d.ts +64 -20
- package/dist/selectable-list.js +1 -1
- package/dist/{separator-CNDs98Dv.d.ts → separator-Bo4nY_3M.d.ts} +13 -2
- package/dist/{separator-D0D6VyyM.js → separator-Da8lDnio.js} +1 -1
- package/dist/separator.d.ts +1 -1
- package/dist/separator.js +1 -1
- package/dist/{sheet-BcfnKUit.js → sheet-C6UGAvRk.js} +1 -1
- package/dist/sheet.d.ts +5 -5
- package/dist/sheet.js +1 -1
- package/dist/sidebar.d.ts +7 -6
- package/dist/sidebar.js +1 -1
- package/dist/skeleton-paJOgf-f.js +1 -0
- package/dist/skeleton.d.ts +5 -4
- package/dist/skeleton.js +1 -1
- package/dist/skip-to-main-link.d.ts +9 -6
- package/dist/skip-to-main-link.js +1 -1
- package/dist/slider.d.ts +7 -3
- package/dist/slider.js +1 -1
- package/dist/{slot-DpNWVci8.js → slot-C3gII_9c.js} +1 -1
- package/dist/slot.js +1 -1
- package/dist/split-button.d.ts +8 -3
- package/dist/split-button.js +1 -1
- package/dist/switch.js +1 -1
- package/dist/{table-D51ZtV4U.d.ts → table-DEI-qvSC.d.ts} +25 -12
- package/dist/table-EZNW3nFk.js +1 -0
- package/dist/table.d.ts +1 -1
- package/dist/table.js +1 -1
- package/dist/tabs.js +1 -1
- package/dist/text-area.js +1 -1
- package/dist/theme-DN-Et3A_.js +1 -0
- package/dist/theme-switcher.d.ts +24 -12
- package/dist/theme-switcher.js +1 -1
- package/dist/theme.d.ts +18 -4
- package/dist/theme.js +1 -1
- package/dist/toast.d.ts +8 -3
- package/dist/toast.js +1 -1
- package/dist/tooltip-CkAibjBb.js +1 -0
- package/dist/{tooltip-BKWK5c7_.d.ts → tooltip-DA41fxe5.d.ts} +7 -1
- package/dist/tooltip.d.ts +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/{use-breakpoint-Dqu12Szq.js → use-breakpoint-BhJ_3El2.js} +1 -1
- package/dist/use-is-apple-platform-CMPzIYjz.js +1 -0
- package/dist/use-matches-media-query-DCBT6iNA.js +1 -0
- package/dist/use-prefers-reduced-motion-DHYDQk1h.js +1 -0
- package/dist/utils.d.ts +1 -1
- package/dist/utils.js +1 -1
- package/dist/visually-hidden.js +1 -1
- package/dist/well.js +1 -1
- package/package.json +3 -3
- package/dist/alert-DDjzRuGa.js +0 -1
- package/dist/anchor-D2So_zuy.js +0 -1
- package/dist/button-CC10rP6X.js +0 -1
- package/dist/button-DiDlvAOp.js +0 -1
- package/dist/chart-BDxpXPfo.js +0 -2
- package/dist/checkbox-0EoxOyMA.js +0 -1
- package/dist/choice-CnwfjSEu.js +0 -1
- package/dist/compose-refs-BdBMM9ga.js +0 -1
- package/dist/dropdown-menu-CNaaABck.d.ts +0 -1
- package/dist/icon-CX_gj6sW.d.ts +0 -25
- package/dist/icon-d-nMCfAI.js +0 -1
- package/dist/icon-lZ48P8Nn.js +0 -1
- package/dist/input-BnlpQF0c.js +0 -1
- package/dist/input-CXmS0OFN.js +0 -1
- package/dist/label-D-D11mlp.js +0 -1
- package/dist/layer-container-CglTh9-6.js +0 -1
- package/dist/list-CwL23L_B.js +0 -1
- package/dist/primitive-BWyxJnXn.js +0 -1
- package/dist/select-BK6n6OIK.js +0 -1
- package/dist/skeleton-BhcJMpem.js +0 -1
- package/dist/table-C_Nm_RSV.js +0 -1
- package/dist/theme-CVfq037P.js +0 -1
- package/dist/tooltip-BZRRJgpm.js +0 -1
- package/dist/use-is-apple-platform-Cxwrb86L.js +0 -1
- package/dist/use-matches-media-query-Bd_GhhVd.js +0 -1
- package/dist/use-prefers-reduced-motion-Bk5zAfHY.js +0 -1
|
@@ -40,6 +40,9 @@ import { ComponentProps } from "react";
|
|
|
40
40
|
* </Table.Root>
|
|
41
41
|
* ```
|
|
42
42
|
*
|
|
43
|
+
* `ref` lands on the inner scroll container, so a consumer can read or set its
|
|
44
|
+
* scroll position. Every other prop lands on the outer element.
|
|
45
|
+
*
|
|
43
46
|
* Data attributes it stamps on the outer element, for your own CSS to target:
|
|
44
47
|
*
|
|
45
48
|
* - `data-x-overflow="true" | "false"` — whether the content is wider than the
|
|
@@ -309,7 +312,8 @@ declare const Row: ({ children, ref, ...props }: ComponentProps<"tr">) => import
|
|
|
309
312
|
/**
|
|
310
313
|
* The `<Table.Header>` defines a cell as the header of a group of table cells
|
|
311
314
|
* and may be used as a child of a `<Table.Row>`. The `scope` and `headers`
|
|
312
|
-
* attributes define the exact nature of this group.
|
|
315
|
+
* attributes define the exact nature of this group. `scope` defaults to
|
|
316
|
+
* `"col"`; pass `scope="row"` for a header cell inside a body row.
|
|
313
317
|
*
|
|
314
318
|
* Must be used as a child of a `<Table.Row>`.
|
|
315
319
|
*
|
|
@@ -352,7 +356,7 @@ declare const Row: ({ children, ref, ...props }: ComponentProps<"tr">) => import
|
|
|
352
356
|
*
|
|
353
357
|
* @see https://mantle.ngrok.com/components/data-display/table#tableheader
|
|
354
358
|
*/
|
|
355
|
-
declare const Header: ({ children, className, ref, ...props }: ComponentProps<"th">) => import("react").JSX.Element;
|
|
359
|
+
declare const Header: ({ children, className, ref, scope, ...props }: ComponentProps<"th">) => import("react").JSX.Element;
|
|
356
360
|
/**
|
|
357
361
|
* The `<Table.Cell>` defines a cell of a table that contains data and may be
|
|
358
362
|
* used as a child of a `<Table.Row>`.
|
|
@@ -400,7 +404,7 @@ declare const Header: ({ children, className, ref, ...props }: ComponentProps<"t
|
|
|
400
404
|
declare const Cell: ({ children, className, ref, ...props }: ComponentProps<"td">) => import("react").JSX.Element;
|
|
401
405
|
/**
|
|
402
406
|
* The optional `<Table.Caption>` specifies the caption (or title) of a table,
|
|
403
|
-
* which gives the table
|
|
407
|
+
* which gives the table its accessible name.
|
|
404
408
|
*
|
|
405
409
|
* If used, must be the first child of a `<Table.Element>`.
|
|
406
410
|
*
|
|
@@ -503,7 +507,8 @@ declare const Caption: ({ children, className, ref, ...props }: ComponentProps<"
|
|
|
503
507
|
*/
|
|
504
508
|
declare const Table: {
|
|
505
509
|
/**
|
|
506
|
-
* The
|
|
510
|
+
* The `<Table.Body>` encapsulates a set of `<Table.Row>`s, indicating that they
|
|
511
|
+
* comprise the body of a table's (main) data.
|
|
507
512
|
*
|
|
508
513
|
* @see https://mantle.ngrok.com/components/data-display/table#tablebody
|
|
509
514
|
*
|
|
@@ -542,7 +547,8 @@ declare const Table: {
|
|
|
542
547
|
*/
|
|
543
548
|
readonly Body: typeof Body;
|
|
544
549
|
/**
|
|
545
|
-
*
|
|
550
|
+
* The optional `<Table.Caption>` specifies the caption (or title) of a table,
|
|
551
|
+
* which gives the table its accessible name.
|
|
546
552
|
*
|
|
547
553
|
* @see https://mantle.ngrok.com/components/data-display/table#tablecaption
|
|
548
554
|
*
|
|
@@ -581,7 +587,8 @@ declare const Table: {
|
|
|
581
587
|
*/
|
|
582
588
|
readonly Caption: typeof Caption;
|
|
583
589
|
/**
|
|
584
|
-
*
|
|
590
|
+
* The `<Table.Cell>` defines a cell of a table that contains data and may be
|
|
591
|
+
* used as a child of a `<Table.Row>`.
|
|
585
592
|
*
|
|
586
593
|
* @see https://mantle.ngrok.com/components/data-display/table#tablecell
|
|
587
594
|
*
|
|
@@ -620,7 +627,8 @@ declare const Table: {
|
|
|
620
627
|
*/
|
|
621
628
|
readonly Cell: typeof Cell;
|
|
622
629
|
/**
|
|
623
|
-
*
|
|
630
|
+
* The `<Table.Element>` is a structured way to display data in rows and columns. The API
|
|
631
|
+
* matches the HTML `<table>` element 1:1.
|
|
624
632
|
*
|
|
625
633
|
* @see https://mantle.ngrok.com/components/data-display/table#tableelement
|
|
626
634
|
*
|
|
@@ -659,7 +667,8 @@ declare const Table: {
|
|
|
659
667
|
*/
|
|
660
668
|
readonly Element: typeof Element;
|
|
661
669
|
/**
|
|
662
|
-
* The
|
|
670
|
+
* The `<Table.Foot>` encapsulates a set of `<Table.Row>`s, indicating that they
|
|
671
|
+
* comprise the foot of a table with information about the table's columns.
|
|
663
672
|
*
|
|
664
673
|
* @see https://mantle.ngrok.com/components/data-display/table#tablefoot
|
|
665
674
|
*
|
|
@@ -698,7 +707,7 @@ declare const Table: {
|
|
|
698
707
|
*/
|
|
699
708
|
readonly Foot: typeof Foot;
|
|
700
709
|
/**
|
|
701
|
-
* The
|
|
710
|
+
* The `<Table.Head>` is a container for the table's column headers.
|
|
702
711
|
*
|
|
703
712
|
* @see https://mantle.ngrok.com/components/data-display/table#tablehead
|
|
704
713
|
*
|
|
@@ -737,7 +746,8 @@ declare const Table: {
|
|
|
737
746
|
*/
|
|
738
747
|
readonly Head: typeof Head;
|
|
739
748
|
/**
|
|
740
|
-
*
|
|
749
|
+
* The `<Table.Header>` defines a cell as the header of a group of table cells
|
|
750
|
+
* and may be used as a child of a `<Table.Row>`. `scope` defaults to `"col"`.
|
|
741
751
|
*
|
|
742
752
|
* @see https://mantle.ngrok.com/components/data-display/table#tableheader
|
|
743
753
|
*
|
|
@@ -776,7 +786,9 @@ declare const Table: {
|
|
|
776
786
|
*/
|
|
777
787
|
readonly Header: typeof Header;
|
|
778
788
|
/**
|
|
779
|
-
* The root container element for all
|
|
789
|
+
* The `<Table.Root>` is the root container element for all `Table`s.
|
|
790
|
+
* It draws the border and rounded corners, and scrolls wide content
|
|
791
|
+
* horizontally with a fading scroll edge.
|
|
780
792
|
*
|
|
781
793
|
* @see https://mantle.ngrok.com/components/data-display/table#tableroot
|
|
782
794
|
*
|
|
@@ -815,7 +827,8 @@ declare const Table: {
|
|
|
815
827
|
*/
|
|
816
828
|
readonly Root: typeof Root;
|
|
817
829
|
/**
|
|
818
|
-
*
|
|
830
|
+
* The `<Table.Row>` defines a row of cells in a table. The row's cells can then
|
|
831
|
+
* be established using a mix of `<Table.Cell>` and `<Table.Header>` components.
|
|
819
832
|
*
|
|
820
833
|
* @see https://mantle.ngrok.com/components/data-display/table#tablerow
|
|
821
834
|
*
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{n as e}from"./compose-refs-DdUwopIY.js";import{t}from"./cx-0HCjnNv1.js";import{useLayoutEffect as n,useMemo as r,useRef as i,useState as a}from"react";import{jsx as o}from"react/jsx-runtime";const s={Body:({children:e,className:n,ref:r,...i})=>o(`tbody`,{"data-slot":`table-body`,className:t(`[&>tr+tr>*]:border-t [&>tr+tr>*]:border-card-muted`,`text-body`,`[&>tr]:bg-card [&>tr]:not-only:hover:bg-card-hover [&>tr]:not-only:has-focus-visible:bg-card-hover`,n),ref:r,...i,children:e}),Caption:({children:e,className:n,ref:r,...i})=>o(`caption`,{"data-slot":`table-caption`,ref:r,className:t(`py-4 text-sm text-gray-500`,`border-t border-card-muted`,n),...i,children:e}),Cell:({children:e,className:n,ref:r,...i})=>o(`td`,{"data-slot":`table-cell`,ref:r,className:t(`p-3 align-middle [&:has([role=checkbox])]:pr-0 font-mono text-mono`,n),...i,children:e}),Element:({children:e,className:n,ref:r,...i})=>o(`table`,{"data-slot":`table-element`,ref:r,className:t(`table-auto border-separate border-spacing-0 caption-bottom w-full min-w-full text-left`,n),...i,children:e}),Foot:({children:e,className:n,ref:r,...i})=>o(`tfoot`,{"data-slot":`table-foot`,ref:r,className:t(`font-medium text-body`,`[&>tr:first-child>*]:border-t [&>tr:first-child>*]:border-card-muted`,`[&>tr+tr>*]:border-t [&>tr+tr>*]:border-card-muted`,`[&>tr]:bg-gray-50/50 [&>tr]:hover:bg-card-hover`,n),...i,children:e}),Head:({children:e,className:n,ref:r,...i})=>o(`thead`,{"data-slot":`table-head`,ref:r,className:t(`[&>tr:last-child>*]:border-b [&>tr:last-child>*]:border-card-muted`,`[&>tr+tr>*]:border-t [&>tr+tr>*]:border-card-muted`,`text-muted bg-base`,`[&>tr]:bg-base`,n),...i,children:e}),Header:({children:e,className:n,ref:r,scope:i=`col`,...a})=>o(`th`,{"data-slot":`table-header`,ref:r,scope:i,className:t(`h-11 px-4 text-left align-middle text-sm font-medium [&:has([role=checkbox])]:pr-0`,n),...a,children:e}),Root:({children:n,className:r,ref:i,...a})=>{let s=c(),l=e(s.ref,i);return o(`div`,{"data-slot":`table`,className:t(`group/table relative w-full overflow-hidden rounded-lg border border-card bg-white dark:bg-gray-100`,r),"data-sticky-active":s.state.hasOverflow&&!s.state.scrolledToEnd||void 0,"data-x-overflow":s.state.hasOverflow,"data-x-scroll-end":s.state.hasOverflow&&s.state.scrolledToEnd,...a,children:o(`div`,{className:t(`scrollbar scroll-fade-x overflow-x-auto overflow-y-clip overscroll-x-none`,`has-data-mantle-table-sticky-right:[--_fade-right:black]`),ref:l,children:n})})},Row:({children:e,ref:t,...n})=>o(`tr`,{"data-slot":`table-row`,ref:t,...n,children:e})};function c(){let e=i(null),[t,o]=a({hasOverflow:!1,scrolledToStart:!0,scrolledToEnd:!1});return n(()=>{let t=e.current;if(!t)return;let n=0,r=()=>{let e=t.scrollWidth>t.clientWidth,n=t.scrollLeft<1,r=Math.abs(t.scrollWidth-t.scrollLeft-t.clientWidth)<1;o(t=>t.hasOverflow!==e||t.scrolledToStart!==n||t.scrolledToEnd!==r?{hasOverflow:e,scrolledToStart:n,scrolledToEnd:r}:t)},i=()=>{n===0&&(n=requestAnimationFrame(()=>{n=0,r()}))},a=new ResizeObserver(i);a.observe(t);let s=new MutationObserver(i);return s.observe(t,{childList:!0,subtree:!0}),t.addEventListener(`scroll`,i,{passive:!0}),r(),()=>{cancelAnimationFrame(n),a.disconnect(),s.disconnect(),t.removeEventListener(`scroll`,i)}},[]),r(()=>({ref:e,state:t}),[t])}export{s as t};
|
package/dist/table.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as Table } from "./table-
|
|
1
|
+
import { t as Table } from "./table-DEI-qvSC.js";
|
|
2
2
|
export { Table };
|
package/dist/table.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./table-
|
|
1
|
+
import{t as e}from"./table-EZNW3nFk.js";export{e as Table};
|
package/dist/tabs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{n as e}from"./compose-refs-DdUwopIY.js";import{t}from"./cx-0HCjnNv1.js";import{t as n}from"./booleanish-BfvnW6vy.js";import{t as r}from"./clsx-DUGZgXfJ.js";import{t as i}from"./use-prefers-reduced-motion-DHYDQk1h.js";import{Children as a,cloneElement as o,createContext as s,isValidElement as c,useContext as l,useEffect as u,useMemo as d,useRef as f}from"react";import p from"tiny-invariant";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";import{cva as _}from"class-variance-authority";import{Content as v,List as y,Root as b,Trigger as x}from"@radix-ui/react-tabs";const S=s({orientation:`horizontal`,appearance:`classic`}),C=({className:e,children:n,orientation:r=`horizontal`,appearance:i=`classic`,...a})=>{let o=d(()=>({orientation:r,appearance:i}),[r,i]);return h(b,{"data-slot":`tabs`,"data-appearance":i,className:t(`flex gap-4`,r===`horizontal`?`flex-col`:`flex-row`,e),orientation:r,...a,children:h(S.Provider,{value:o,children:n})})},w=t(`pb-px bg-origin-content bg-no-repeat bg-size-[100%_1px] bg-position-[0_calc(100%+1px)]`,`bg-[image:linear-gradient(var(--color-separator),var(--color-separator))]`,`[--_fade-bottom-border:black]`),T=_(`flex`,{variants:{orientation:{horizontal:`scroll-fade-x flex-row items-center overflow-x-auto overscroll-x-none w-full min-w-0 pt-1 -mt-1 px-1 -mx-1`,vertical:`flex-col items-end gap-3.5 self-stretch`},appearance:{classic:``,pill:``},hideBorder:{true:``,false:``}},compoundVariants:[{orientation:`horizontal`,appearance:`pill`,className:`gap-1 pb-1 -mb-1`},{orientation:`horizontal`,appearance:`classic`,className:`gap-6`},{orientation:`horizontal`,appearance:`classic`,hideBorder:!1,className:w},{orientation:`vertical`,appearance:`classic`,hideBorder:!1,className:`border-r border-separator`}],defaultVariants:{hideBorder:!1}}),E=({className:n,hideBorder:r=!1,ref:a,...o})=>{let{orientation:s,appearance:c}=l(S),d=f(null),p=e(d,a);return u(()=>{let e=d.current;if(!e||s!==`horizontal`)return;let t=new AbortController,{signal:n}=t,r=!1;e.addEventListener(`pointerdown`,()=>{r=!0},{signal:n});let a=()=>{r=!1};return e.addEventListener(`pointerup`,a,{signal:n}),e.addEventListener(`pointercancel`,a,{signal:n}),e.addEventListener(`keydown`,a,{signal:n}),e.addEventListener(`focusin`,t=>{if(!r&&t.target instanceof Element&&t.target!==e){let e=i()?`auto`:`smooth`;t.target.scrollIntoView({behavior:e,inline:`center`,block:`nearest`})}},{signal:n}),()=>{t.abort()}},[s]),h(y,{"aria-orientation":s,"data-slot":`tabs-list`,"data-hide-border":r?``:void 0,className:t(T({orientation:s,appearance:c,hideBorder:r}),n),ref:p,...o})},D=_(`absolute z-0`,{variants:{orientation:{horizontal:`bottom-0 left-0 right-0 h-0.75`,vertical:`-right-px bottom-0 top-0 w-0.75`},appearance:{classic:`group-data-state-active/tab-trigger:bg-neutral-950`,pill:`hidden`}}}),O=()=>{let{orientation:e,appearance:t}=l(S);return h(`span`,{"aria-hidden":!0,className:r(D({orientation:e,appearance:t}))})},k=_(t(`group/tab-trigger relative flex cursor-pointer items-center gap-1 whitespace-nowrap py-3 text-sm font-medium text-gray-600`,`ring-focus-accent outline-hidden`,`aria-disabled:cursor-default aria-disabled:opacity-50`,`focus-visible:ring-4`,`[&>svg]:shrink-0 [&>svg]:size-5`,`not-aria-disabled:hover:text-gray-900`),{variants:{orientation:{horizontal:`rounded-tl-md rounded-tr-md`,vertical:`rounded-bl-md rounded-tl-md pr-3`},appearance:{classic:t(`not-aria-disabled:hover:data-state-active:text-strong`,`data-state-active:text-strong`),pill:t(`not-aria-disabled:hover:data-state-active:text-strong`,`not-aria-disabled:hover:data-state-active:bg-neutral-500/15`,`data-state-active:text-strong`,`data-state-active:bg-neutral-500/15`,`rounded-full py-2 px-3`)}}}),A={Root:C,Content:({className:e,...n})=>h(v,{"data-slot":`tabs-content`,className:t(`focus-visible:ring-focus-accent outline-hidden focus-visible:ring-4`,e),...n}),List:E,Trigger:({"aria-disabled":e,asChild:r=!1,children:i,className:s,disabled:u,ref:d,...f})=>{let{orientation:_,appearance:v}=l(S),y=n(e??u),b={"aria-disabled":e??u,className:t(k({orientation:_,appearance:v}),s),disabled:y,...f};if(r){let e=a.only(i);p(c(e),"When using `asChild`, TabsTrigger must be passed a single child as a JSX tag.");let t=e.props?.children,n=y?{href:void 0,to:void 0}:{};return h(x,{asChild:!0,"data-slot":`tabs-trigger`,...b,ref:d,children:o(y?h(`button`,{type:`button`}):e,n,g(m,{children:[h(O,{}),t]}))})}return g(x,{"data-slot":`tabs-trigger`,ref:d,...b,children:[h(O,{}),i]})},Badge:({className:e,children:n,...r})=>h(`span`,{"data-slot":`tabs-badge`,className:t(`rounded-full bg-neutral-500/20 px-1.5 text-xs font-medium text-gray-600`,`group-data-state-active/tab-trigger:bg-neutral-950/10 group-data-state-active/tab-trigger:text-strong group-hover/tab-trigger:group-enabled/tab-trigger:group-data-state-active/tab-trigger:text-strong`,`group-hover/tab-trigger:group-enabled/tab-trigger:text-gray-700`,e),...r,children:n})};export{A as Tabs};
|
package/dist/text-area.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{n as e}from"./compose-refs-DdUwopIY.js";import{t}from"./cx-0HCjnNv1.js";import{a as n,r}from"./field-Bpptk_9t.js";import{useRef as i,useState as a}from"react";import{jsx as o}from"react/jsx-runtime";const s=({appearance:s,"aria-invalid":c,className:l,onDragEnter:u,onDragLeave:d,onDropCapture:f,ref:p,validation:m,...h})=>{let g=n(),{ariaInvalid:_,validation:v}=r({"aria-invalid":c,validation:m??g}),[y,b]=a(!1),x=i(null),S=e(x,p);return o(`textarea`,{"aria-invalid":_,"data-validation":v||void 0,"data-slot":`text-area`,className:t(`border-input bg-form data-drag-over:border-dashed data-drag-over:ring-4 pointer-coarse:py-[calc(theme(spacing[2.5])-1px)] pointer-coarse:text-base text-sm flex min-h-24 w-full rounded-md border px-3 py-[calc(theme(spacing[2])-1px)] focus-visible:outline-hidden focus-visible:ring-4 disabled:pointer-events-none disabled:opacity-50`,`placeholder:text-placeholder data-drag-over:border-dashed`,`border-form text-strong ring-focus-accent focus:border-accent-600 data-drag-over:border-accent-600`,`data-validation-error:border-danger-600 data-validation-error:ring-focus-danger data-validation-error:focus-visible:border-danger-600 data-validation-error:data-drag-over:border-danger-600`,`data-validation-success:border-success-600 data-validation-success:ring-focus-success data-validation-success:focus-visible:border-success-600 data-validation-success:data-drag-over:border-success-600`,`data-validation-warning:border-warning-600 data-validation-warning:ring-focus-warning data-validation-warning:focus-visible:border-warning-600 data-validation-warning:data-drag-over:border-warning-600`,s===`monospaced`&&`font-mono pointer-coarse:text-base text-xs/5`,l),"data-drag-over":y,onDragEnter:e=>{b(!0),u?.(e)},onDragLeave:e=>{b(!1),d?.(e)},onDropCapture:e=>{b(!1),x.current?.focus(),f?.(e)},ref:S,...h})};export{s as TextArea};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{t as e}from"./cx-0HCjnNv1.js";import{n as t}from"./browser-only-CmEEzfU3.js";import{t as n}from"./use-matches-media-query-DCBT6iNA.js";import{n as r,t as i}from"./cookie-ca4g5CKp.js";import{createContext as a,useContext as o,useEffect as s,useMemo as c,useRef as l,useState as u}from"react";import d from"tiny-invariant";import{jsx as f}from"react/jsx-runtime";const p=[`light`,`dark`,`light-high-contrast`,`dark-high-contrast`],m=[`system`,...p],h=e=>e;function g(e){return typeof e==`string`&&m.includes(e)}const _=e=>e;function v(e){return typeof e==`string`&&p.includes(e)}const y=`(prefers-color-scheme: dark)`,b=`(prefers-contrast: more)`,x=`mantle-ui-theme`,S=`system`,C=a(null);function w({children:e,forceTheme:n,ssrCookie:r}){let[i,a]=u(()=>{let e=F({cookie:t()?document.cookie:r});return E(e,{forceTheme:n}),e}),o=l(null);s(()=>{function e(e){let t=e??F({cookie:document.cookie});a(t),E(t,{forceTheme:n})}e();try{`BroadcastChannel`in window&&(o.current=new BroadcastChannel(x),o.current.addEventListener(`message`,t=>{let n=t?.data?.theme;g(n)&&e(n)}))}catch{}function t(t){t.key===`${x}__ping`&&e()}window.addEventListener(`storage`,t);let r=window.matchMedia(y),i=window.matchMedia(b);function s(){e()}function c(){document.visibilityState===`visible`&&e()}return r.addEventListener(`change`,s),i.addEventListener(`change`,s),window.addEventListener(`pageshow`,s),document.addEventListener(`visibilitychange`,c),()=>{window.removeEventListener(`storage`,t),r.removeEventListener(`change`,s),i.removeEventListener(`change`,s),window.removeEventListener(`pageshow`,s),document.removeEventListener(`visibilitychange`,c),B(o.current),o.current=null}},[n]);let d=c(()=>[i,e=>{z(e),a(e),E(e,{forceTheme:n}),L(e,{broadcastChannel:o.current,pingKey:`${x}__ping`})}],[n,i]);return f(C.Provider,{value:d,children:e})}function T(){let e=o(C);return d(e,`useTheme must be used within a ThemeProvider`),e}function E(e,{forceTheme:n}={}){if(!t())return;let r=window.document.documentElement,i=window.matchMedia(y).matches,a=window.matchMedia(b).matches,o=n??O(e,{prefersDarkMode:i,prefersHighContrast:a}),s=r.dataset.theme,c=r.dataset.appliedTheme,l=g(s)?s:void 0,u=v(c)?c:void 0;(l!==e||u!==o)&&(r.classList.remove(...p),r.classList.add(o),r.dataset.theme=e,r.dataset.appliedTheme=o)}function D(){if(!t())return{appliedTheme:void 0,theme:void 0};let e=window.document.documentElement,n=g(e.dataset.theme)?e.dataset.theme:void 0;return{appliedTheme:v(e.dataset.appliedTheme)?e.dataset.appliedTheme:void 0,theme:n}}function O(e,{prefersDarkMode:t,prefersHighContrast:n}){return e===`system`?A({prefersDarkMode:t,prefersHighContrast:n}):e}function k(){let e=o(C);return O(e==null?`system`:e[0],{prefersDarkMode:n(y),prefersHighContrast:n(b)})}function A({prefersDarkMode:e,prefersHighContrast:t}){return t?e?`dark-high-contrast`:`light-high-contrast`:e?`dark`:`light`}function j(e){let{storageKey:t,defaultTheme:n,themes:r,resolvedThemes:i,prefersDarkModeMediaQuery:a,prefersHighContrastMediaQuery:o,forceTheme:s}=e;function c(e){return typeof e==`string`&&r.includes(e)}function l(e){let t=document.cookie;if(!t)return null;try{let n=t.split(`;`).find(t=>t.trim().startsWith(`${e}=`))?.trim().slice(e.length+1);return n?decodeURIComponent(n):null}catch{return null}}function u(e,t){let n=new Date;n.setFullYear(n.getFullYear()+1);let r=window.location.hostname,i=window.location.protocol,a=r===`ngrok.com`||r.endsWith(`.ngrok.com`)?`; domain=.ngrok.com`:``,o=i===`https:`?`; Secure`:``;return`${e}=${encodeURIComponent(t)}; expires=${n.toUTCString()}; path=/${a}; SameSite=Lax${o}`}function d(e,t){try{document.cookie=u(e,t)}catch{}}function f(e,t,n){return e===`system`?n?t?`dark-high-contrast`:`light-high-contrast`:t?`dark`:`light`:e}let p=null,m=null,h=null;try{p=l(t)}catch{}if(c(p))h=p;else{try{m=window.localStorage?.getItem(t)??null}catch{}c(m)&&(h=m)}let g=c(h)?h:n,_=matchMedia(a).matches,v=matchMedia(o).matches,y=s??f(g,_,v),b=document.documentElement;if(b.dataset.appliedTheme!==y||b.dataset.theme!==g){for(let e of i)b.classList.remove(e);b.classList.add(y),b.dataset.theme=g,b.dataset.appliedTheme=y}let x=c(p);try{if(c(m)&&!x){d(t,m);try{window.localStorage.removeItem(t)}catch{}}else x||d(t,g)}catch{}}function M(e){let t={storageKey:x,defaultTheme:S,themes:m,resolvedThemes:p,prefersDarkModeMediaQuery:y,prefersHighContrastMediaQuery:b,forceTheme:e};return`(${j.toString()})(${JSON.stringify(t)})`}const N=({forceTheme:e,nonce:t})=>f(`script`,{dangerouslySetInnerHTML:{__html:M(e)},nonce:t,suppressHydrationWarning:!0});function P(n={}){let{className:r=``,forceTheme:i,ssrCookie:a}=n??{};return c(()=>{let n,o;if(!t())n=F({cookie:a}),o=O(n,{prefersDarkMode:!1,prefersHighContrast:!1});else{let e=window.matchMedia(y).matches,t=window.matchMedia(b).matches;n=F({cookie:document.cookie}),o=O(n,{prefersDarkMode:e,prefersHighContrast:t})}let s=i??o;return{className:e(r,s),"data-applied-theme":s,"data-theme":n}},[r,i,a])}function F({cookie:e}){if(!e)return S;let t=r(e,x);return g(t)?t:S}function I(e){return i(e,x)}function L(e,t){let{broadcastChannel:n,pingKey:r}=t;try{if(n){n.postMessage({theme:e,timestamp:Date.now()});return}}catch{}try{localStorage.setItem(r,JSON.stringify({theme:e,timestamp:Date.now()}))}catch{}}function R(e){let t=new Date;t.setFullYear(t.getFullYear()+1);let{hostname:n,protocol:r}=window.location,i=n===`ngrok.com`||n.endsWith(`.ngrok.com`)?`; domain=.ngrok.com`:``,a=r===`https:`?`; Secure`:``;return`${x}=${encodeURIComponent(e)}; expires=${t.toUTCString()}; path=/${i}; SameSite=Lax${a}`}function z(e){if(t())try{document.cookie=R(e)}catch{}}function B(e){if(e!=null)try{e.close()}catch{}}export{M as a,P as c,h as d,v as f,m as h,F as i,T as l,p as m,w as n,D as o,g as p,I as r,k as s,N as t,_ as u};
|
package/dist/theme-switcher.d.ts
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { t as WithDataSlot } from "./data-slot-CChfb_cv.js";
|
|
2
2
|
import { t as WithStyleProps } from "./with-style-props-Dq5Vntqy.js";
|
|
3
|
-
import { n as IconButtonProps, r as IconButtonAppearance } from "./button-
|
|
4
|
-
import { t as DropdownMenu } from "./dropdown-menu-
|
|
5
|
-
import "./dropdown-menu-
|
|
3
|
+
import { n as IconButtonProps, r as IconButtonAppearance } from "./button-crUf0hbR.js";
|
|
4
|
+
import { t as DropdownMenu } from "./dropdown-menu-BYapTV0f.js";
|
|
5
|
+
import "./dropdown-menu-BkPBh_8y.js";
|
|
6
6
|
import { ComponentProps } from "react";
|
|
7
7
|
//#region src/components/theme-switcher/theme-switcher.d.ts
|
|
8
8
|
/**
|
|
9
9
|
* The props for the `ThemeDropdownMenuRadioGroup` component.
|
|
10
10
|
*/
|
|
11
|
-
type ThemeDropdownMenuRadioGroupProps = WithStyleProps
|
|
11
|
+
type ThemeDropdownMenuRadioGroupProps = WithStyleProps & Pick<ComponentProps<"div">, "aria-label" | "aria-labelledby">;
|
|
12
12
|
/**
|
|
13
13
|
* Must render inside a `DropdownMenu.Content` or `DropdownMenu.SubContent` —
|
|
14
14
|
* the type system cannot express this constraint, so it is on you to uphold it.
|
|
@@ -21,6 +21,10 @@ type ThemeDropdownMenuRadioGroupProps = WithStyleProps;
|
|
|
21
21
|
* existing menu (e.g. an account menu submenu); for a standalone picker,
|
|
22
22
|
* reach for `ThemeSwitcher` instead.
|
|
23
23
|
*
|
|
24
|
+
* The group is named "Theme" by default. Pass `aria-label` to rename it, or
|
|
25
|
+
* `aria-labelledby` to point at a visible heading such as a
|
|
26
|
+
* `DropdownMenu.Label`.
|
|
27
|
+
*
|
|
24
28
|
* @see https://mantle.ngrok.com/components/forms/theme-switcher
|
|
25
29
|
*
|
|
26
30
|
* @example
|
|
@@ -55,7 +59,7 @@ type ThemeDropdownMenuRadioGroupProps = WithStyleProps;
|
|
|
55
59
|
* </DropdownMenu.Root>
|
|
56
60
|
* ```
|
|
57
61
|
*/
|
|
58
|
-
declare const ThemeDropdownMenuRadioGroup: ({ className, style }: ThemeDropdownMenuRadioGroupProps) => import("react").JSX.Element;
|
|
62
|
+
declare const ThemeDropdownMenuRadioGroup: ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className, style }: ThemeDropdownMenuRadioGroupProps) => import("react").JSX.Element;
|
|
59
63
|
/**
|
|
60
64
|
* The props for the `ThemeSwitcher.Root` component. Identical to
|
|
61
65
|
* `DropdownMenu.Root`'s props — `Root` forwards everything through.
|
|
@@ -132,11 +136,11 @@ type ThemeSwitcherContentProps = ComponentProps<typeof DropdownMenu.Content> & W
|
|
|
132
136
|
/**
|
|
133
137
|
* The popover the trigger opens: a thin forwarding wrapper over
|
|
134
138
|
* `DropdownMenu.Content`. When `children` are omitted (or `null`/`undefined`)
|
|
135
|
-
* it renders `ThemeDropdownMenuRadioGroup`, the five-theme radio group
|
|
139
|
+
* it renders `ThemeDropdownMenuRadioGroup`, the five-theme radio group; pass
|
|
136
140
|
* `children` to own the menu contents instead (compose
|
|
137
141
|
* `ThemeDropdownMenuRadioGroup` yourself alongside extra items). Any
|
|
138
142
|
* non-nullish children replace the default entirely, including render-nothing
|
|
139
|
-
* values like `false
|
|
143
|
+
* values like `false`; a lone `{condition && <Item />}` child suppresses the
|
|
140
144
|
* radio group when the condition is false.
|
|
141
145
|
*
|
|
142
146
|
* @see https://mantle.ngrok.com/components/forms/theme-switcher
|
|
@@ -211,8 +215,11 @@ declare const ThemeSwitcher: {
|
|
|
211
215
|
readonly Root: typeof Root;
|
|
212
216
|
/**
|
|
213
217
|
* The button that opens the theme menu: an `IconButton` (ghost by default)
|
|
214
|
-
*
|
|
215
|
-
*
|
|
218
|
+
* wired up as the menu trigger. The trigger icon is SSR-safe: the applied
|
|
219
|
+
* theme is unknowable server-side, so a `Skeleton` renders until hydration,
|
|
220
|
+
* then the icon matching the applied theme. The icon is owned by the trigger;
|
|
221
|
+
* to render a completely custom trigger, compose `DropdownMenu` +
|
|
222
|
+
* `ThemeDropdownMenuRadioGroup` directly instead.
|
|
216
223
|
*
|
|
217
224
|
* @see https://mantle.ngrok.com/components/forms/theme-switcher
|
|
218
225
|
*
|
|
@@ -226,9 +233,14 @@ declare const ThemeSwitcher: {
|
|
|
226
233
|
*/
|
|
227
234
|
readonly Trigger: typeof Trigger;
|
|
228
235
|
/**
|
|
229
|
-
* The popover the trigger opens:
|
|
230
|
-
*
|
|
231
|
-
* five-theme radio group
|
|
236
|
+
* The popover the trigger opens: a thin forwarding wrapper over
|
|
237
|
+
* `DropdownMenu.Content`. When `children` are omitted (or `null`/`undefined`)
|
|
238
|
+
* it renders `ThemeDropdownMenuRadioGroup`, the five-theme radio group; pass
|
|
239
|
+
* `children` to own the menu contents instead (compose
|
|
240
|
+
* `ThemeDropdownMenuRadioGroup` yourself alongside extra items). Any
|
|
241
|
+
* non-nullish children replace the default entirely, including render-nothing
|
|
242
|
+
* values like `false`; a lone `{condition && <Item />}` child suppresses the
|
|
243
|
+
* radio group when the condition is false.
|
|
232
244
|
*
|
|
233
245
|
* @see https://mantle.ngrok.com/components/forms/theme-switcher
|
|
234
246
|
*
|
package/dist/theme-switcher.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./icon-
|
|
1
|
+
import{t as e}from"./icon-CGKaq_tV.js";import{t}from"./data-slot-EM6s2WEU.js";import{t as n}from"./button-CaM-ZAH5.js";import{t as r}from"./browser-only-CmEEzfU3.js";import{t as i}from"./skeleton-paJOgf-f.js";import{t as a}from"./dropdown-menu-lxHsgLiw.js";import{d as o,h as s,l as c,p as l}from"./theme-DN-Et3A_.js";import{n as u,t as d}from"./icons-Cie4gcrm.js";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m={system:`System Preference`,light:`Light Mode`,dark:`Dark Mode`,"light-high-contrast":`Light High Contrast`,"dark-high-contrast":`Dark High Contrast`},h=({"aria-label":t,"aria-labelledby":n,className:r,style:i})=>{let[d,h]=c();return f(a.RadioGroup,{"aria-label":n==null?t??`Theme`:t,"aria-labelledby":n,"data-slot":`theme-dropdown-menu-radio-group`,className:r,style:i,value:d,onValueChange:e=>{l(e)&&h(e)},children:s.map(t=>p(a.RadioItem,{value:o(t),children:[f(e,{svg:f(u,{theme:t})}),m[t]]},t))})},g={Root:e=>f(a.Root,{...e}),Trigger:({appearance:e=`ghost`,"data-slot":o,disabled:s,label:c=`Change Theme`,ref:l,...u})=>f(a.Trigger,{asChild:!0,disabled:s,children:f(n,{ref:l,appearance:e,disabled:s,"data-slot":t(o,`theme-switcher-trigger`),intent:`neutral`,icon:f(r,{fallback:f(i,{asChild:!0,className:`rounded-full size-5`,children:f(`span`,{})}),children:()=>f(d,{className:`size-5`})}),label:c,...u})}),Content:({children:e,"data-slot":n,...r})=>f(a.Content,{"data-slot":t(n,`theme-switcher-content`),...r,children:e??f(h,{})})};export{h as ThemeDropdownMenuRadioGroup,g as ThemeSwitcher};
|
package/dist/theme.d.ts
CHANGED
|
@@ -206,11 +206,24 @@ type ThemeProviderProps = PropsWithChildren<{
|
|
|
206
206
|
* theme switcher keeps working and unforced pages honor the user's choice.
|
|
207
207
|
*/
|
|
208
208
|
forceTheme?: ResolvedTheme;
|
|
209
|
+
/**
|
|
210
|
+
* The theme cookie pair from the incoming request, read on the server only.
|
|
211
|
+
* Pass the value `extractThemeCookie` returns. Pass the same value to
|
|
212
|
+
* `MantleStyleSheets` and `useInitialHtmlThemeProps`. The server then seeds
|
|
213
|
+
* the context with the stored theme, so the hydrated client agrees with the
|
|
214
|
+
* server HTML. When omitted, the server renders `"system"`. A client with a
|
|
215
|
+
* stored theme then reports a hydration mismatch. The client always reads
|
|
216
|
+
* `document.cookie`.
|
|
217
|
+
*/
|
|
218
|
+
ssrCookie?: string;
|
|
209
219
|
}>;
|
|
210
220
|
/**
|
|
211
221
|
* Tracks the theme preference and applies the resolved class to `<html>`. Stays
|
|
212
222
|
* in sync with the OS media queries and with the other open tabs.
|
|
213
223
|
*
|
|
224
|
+
* On the server, pass `ssrCookie` so the context starts at the stored theme.
|
|
225
|
+
* The hydrated client then agrees with the server HTML.
|
|
226
|
+
*
|
|
214
227
|
* @see https://mantle.ngrok.com/components/primitives/theme#themeprovider
|
|
215
228
|
*
|
|
216
229
|
* @example
|
|
@@ -228,7 +241,7 @@ type ThemeProviderProps = PropsWithChildren<{
|
|
|
228
241
|
* </ThemeProvider>
|
|
229
242
|
* ```
|
|
230
243
|
*/
|
|
231
|
-
declare function ThemeProvider({ children, forceTheme }: ThemeProviderProps): import("react").JSX.Element;
|
|
244
|
+
declare function ThemeProvider({ children, forceTheme, ssrCookie }: ThemeProviderProps): import("react").JSX.Element;
|
|
232
245
|
/**
|
|
233
246
|
* useTheme returns the current theme and a function to set the theme.
|
|
234
247
|
*
|
|
@@ -374,9 +387,10 @@ declare function getStoredTheme({ cookie }: GetStoredThemeOptions): Theme;
|
|
|
374
387
|
/**
|
|
375
388
|
* Extract only the mantle theme cookie from a raw `Cookie` header string.
|
|
376
389
|
*
|
|
377
|
-
* Use this in SSR loaders to
|
|
378
|
-
* {@link useInitialHtmlThemeProps} without exposing
|
|
379
|
-
* (which may contain HttpOnly/session cookies) in
|
|
390
|
+
* Use this in SSR loaders to pass the theme cookie to {@link ThemeProvider},
|
|
391
|
+
* `MantleStyleSheets`, and {@link useInitialHtmlThemeProps} without exposing
|
|
392
|
+
* the full `Cookie` header (which may contain HttpOnly/session cookies) in
|
|
393
|
+
* serialized loader data.
|
|
380
394
|
*
|
|
381
395
|
* @see https://mantle.ngrok.com/components/primitives/theme#extractthemecookie
|
|
382
396
|
*
|
package/dist/theme.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,d as n,f as r,h as i,i as a,l as o,m as s,n as c,o as l,p as u,r as d,s as f,t as p,u as m}from"./theme-
|
|
1
|
+
import{a as e,c as t,d as n,f as r,h as i,i as a,l as o,m as s,n as c,o as l,p as u,r as d,s as f,t as p,u as m}from"./theme-DN-Et3A_.js";import{useEffect as h}from"react";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";const y=`mantle-dark-styles`,b=`mantle-light-high-contrast-styles`,x=`mantle-dark-high-contrast-styles`,S=`(prefers-color-scheme: dark)`,C=`(prefers-contrast: more) and (prefers-color-scheme: light)`,w=`(prefers-contrast: more) and (prefers-color-scheme: dark)`;function T(e,t){let n=t??e,r=n===`light`||n===`dark`,i=n===`light-high-contrast`||n===`dark-high-contrast`;return{dark:r?`all`:S,lightHighContrast:i?`all`:C,darkHighContrast:i?`all`:w}}function E(e){return e}function D(e){let{darkLinkId:t,lightHcLinkId:n,darkHcLinkId:r,mediaDark:i,mediaLightHc:a,mediaDarkHc:o,forceTheme:s}=e,c=document.documentElement.dataset.appliedTheme,l=s??c,u=l===`light`||l===`dark`,d=l===`light-high-contrast`||l===`dark-high-contrast`,f=document.getElementById(t),p=document.getElementById(n),m=document.getElementById(r);f&&(f.media=u?`all`:i),p&&(p.media=d?`all`:a),m&&(m.media=d?`all`:o)}function O(e){let t={darkLinkId:y,lightHcLinkId:b,darkHcLinkId:x,mediaDark:S,mediaLightHc:C,mediaDarkHc:w,forceTheme:e};return`(${D.toString()})(${JSON.stringify(t)})`}function k({darkCssUrl:e,lightHighContrastCssUrl:t,darkHighContrastCssUrl:n,forceTheme:i,nonce:o,ssrCookie:s}){h(()=>{function e(){let e=document.documentElement.dataset.appliedTheme;return r(e)?e:void 0}function t(){let{dark:t,lightHighContrast:n,darkHighContrast:r}=T(e(),i),a=document.getElementById(y),o=document.getElementById(b),s=document.getElementById(x);a&&(a.media=t),o&&(o.media=n),s&&(s.media=r)}t();let n=new MutationObserver(t);return n.observe(document.documentElement,{attributes:!0,attributeFilter:[`data-applied-theme`]}),()=>{n.disconnect()}},[i]);let c=s==null?void 0:a({cookie:s}),l=c===`system`?void 0:c,{dark:u,lightHighContrast:d,darkHighContrast:f}=T(l,i),p=!i&&l==null,m=!i||i!==`light-high-contrast`&&i!==`dark-high-contrast`,S=!i||i===`light-high-contrast`||i===`dark-high-contrast`;return v(g,{children:[m&&_(`link`,{rel:`stylesheet`,id:y,href:e,media:u,suppressHydrationWarning:!0}),S&&_(`link`,{rel:`stylesheet`,id:b,href:t,media:d,suppressHydrationWarning:!0}),S&&_(`link`,{rel:`stylesheet`,id:x,href:n,media:f,suppressHydrationWarning:!0}),p&&_(`script`,{dangerouslySetInnerHTML:{__html:O(i)},nonce:o,suppressHydrationWarning:!0})]})}const A=`https://assets.ngrok.com`,j=`${A}/fonts`,M={roobert:`/roobert/roobert-proportional-vf.woff2`,"jetbrains-mono":`/jetbrains/jetbrainsmono-wght.woff2`,"jetbrains-mono-italic":`/jetbrains/jetbrainsmono-italic-wght.woff2`,"family-regular":`/family/family-regular.woff2`,"family-italic":`/family/family-italic.woff2`};function N(e){let t=e.startsWith(`/`)?e:`/${e}`;return`${j}${t}`}function P(e){return`<${N(M[e])}>; rel=preload; as=font; type="font/woff2"; crossorigin`}const F=({name:e})=>_(`link`,{rel:`preload`,href:N(M[e]),as:`font`,type:`font/woff2`,crossOrigin:`anonymous`});export{m as $resolvedTheme,n as $theme,k as MantleStyleSheets,F as PreloadFont,p as PreventWrongThemeFlashScript,c as ThemeProvider,A as assetsCdnOrigin,d as extractThemeCookie,O as fixMediaScriptContent,N as fontHref,a as getStoredTheme,r as isResolvedTheme,u as isTheme,E as mantleStyleSheetUrls,P as preloadFontLink,e as preventWrongThemeFlashScriptContent,l as readThemeFromHtmlElement,s as resolvedThemes,i as themes,f as useAppliedTheme,t as useInitialHtmlThemeProps,o as useTheme};
|
package/dist/toast.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { n as WithAsChild } from "./as-child-D23mGo4f.js";
|
|
2
2
|
import { t as WithStyleProps } from "./with-style-props-Dq5Vntqy.js";
|
|
3
|
-
import { n as SvgOnlyProps } from "./icon-
|
|
3
|
+
import { n as SvgOnlyProps } from "./icon-w0HUe7tr.js";
|
|
4
4
|
import { ComponentProps, ReactNode } from "react";
|
|
5
5
|
import * as ToastPrimitive from "sonner";
|
|
6
6
|
//#region src/components/toast/toast.d.ts
|
|
@@ -9,6 +9,7 @@ type ToasterProps = WithStyleProps & Pick<ToasterPrimitiveProps, "containerAriaL
|
|
|
9
9
|
/**
|
|
10
10
|
* Time in milliseconds that should elapse before automatically dismissing toasts.
|
|
11
11
|
* When set here, this will be the default duration for all toasts.
|
|
12
|
+
* A value `<= 0` or `Number.POSITIVE_INFINITY` keeps toasts open until the user dismisses them.
|
|
12
13
|
* @default 4000
|
|
13
14
|
*/
|
|
14
15
|
duration_ms?: number;
|
|
@@ -77,7 +78,11 @@ declare const intents: readonly ["danger", "info", "success", "warning"];
|
|
|
77
78
|
* The intent of a toast: the tone or status that the toast's color communicates.
|
|
78
79
|
*/
|
|
79
80
|
type ToastIntent = (typeof intents)[number];
|
|
80
|
-
|
|
81
|
+
/**
|
|
82
|
+
* Props for `Toast.Root`. `asChild` is omitted: the root renders the intent
|
|
83
|
+
* accent bar next to `children`, so a slot would receive two elements and throw.
|
|
84
|
+
*/
|
|
85
|
+
type ToastProps = ComponentProps<"div"> & {
|
|
81
86
|
/**
|
|
82
87
|
* The intent of the toast: the tone or status that the toast's color communicates.
|
|
83
88
|
*/
|
|
@@ -99,7 +104,7 @@ type ToastProps = ComponentProps<"div"> & WithAsChild & {
|
|
|
99
104
|
* </Toast.Root>
|
|
100
105
|
* ```
|
|
101
106
|
*/
|
|
102
|
-
declare const Root: ({
|
|
107
|
+
declare const Root: ({ children, className, intent, ref, ...props }: ToastProps) => import("react").JSX.Element;
|
|
103
108
|
type ToastIconProps = Partial<SvgOnlyProps>;
|
|
104
109
|
/**
|
|
105
110
|
* An icon that visually represents the intent of the toast.
|
package/dist/toast.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-
|
|
1
|
+
import{t as e}from"./cx-0HCjnNv1.js";import{t}from"./icon-CGKaq_tV.js";import{t as n}from"./slot-C3gII_9c.js";import{s as r}from"./theme-DN-Et3A_.js";import{createContext as i,useContext as a,useMemo as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{CheckCircleIcon as l}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as u}from"@phosphor-icons/react/Info";import{WarningIcon as d}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as f}from"@phosphor-icons/react/WarningDiamond";import*as p from"sonner";function m(e){return typeof e==`number`&&e<=0?1/0:e}const h=({className:t,containerAriaLabel:n,dir:i,duration_ms:a=4e3,position:o=`top-center`,style:c})=>{let l=r();return s(p.Toaster,{"data-slot":`toaster`,className:e(`toaster overlay-prompt pointer-events-auto *:duration-200`,t),containerAriaLabel:n,dir:i,duration:m(a),gap:12,position:o??`top-center`,style:c,theme:l,toastOptions:{unstyled:!0}})},g=i(``);function _(e,t){let n=m(t?.duration_ms);return p.toast.custom(t=>s(g.Provider,{value:t,children:e}),{duration:n,...t?.id?{id:t.id}:{},unstyled:!0})}const v=i({intent:`info`}),y={Root:({children:t,className:n,intent:r,ref:i,...a})=>{let l=o(()=>({intent:r}),[r]);return s(v.Provider,{value:l,children:c(`div`,{"data-slot":`toast`,className:e(`relative flex items-start gap-2 text-sm font-sans`,`p-3 pl-3.75`,`bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg`,n),ref:i,...a,children:[s(x,{intent:r}),t]})})},Action:({asChild:t,className:r,onClick:i,ref:o,...c})=>{let l=a(g);return s(t?n:`button`,{"data-slot":`toast-action`,className:e(`shrink-0`,`data-icon-button:-mr-0.5 data-icon-button:-mt-0.5 data-icon-button:rounded-xs`,r),onClick:e=>{i?.(e),!e.defaultPrevented&&p.toast.dismiss(l)},ref:o,...c})},Icon:({className:n,svg:r,ref:i,...o})=>{let c=a(v);switch(c.intent){case`danger`:return s(t,{"data-slot":`toast-icon`,className:e(`text-danger-600`,n),ref:i,svg:r??s(d,{weight:`fill`}),...o});case`warning`:return s(t,{"data-slot":`toast-icon`,className:e(`text-warning-600`,n),ref:i,svg:r??s(f,{weight:`fill`}),...o});case`success`:return s(t,{"data-slot":`toast-icon`,className:e(`text-success-600`,n),ref:i,svg:r??s(l,{weight:`fill`}),...o});case`info`:return s(t,{"data-slot":`toast-icon`,className:e(`text-accent-600`,n),ref:i,svg:r??s(u,{weight:`fill`}),...o});default:throw Error(`Unreachable Case: ${c.intent}`)}},Message:({asChild:t,className:r,ref:i,...a})=>s(t?n:`p`,{"data-slot":`toast-message`,className:e(`text-strong flex-1 text-sm font-body`,r),ref:i,...a})},b={info:`bg-accent-600`,warning:`bg-warning-600`,success:`bg-success-600`,danger:`bg-danger-600`};function x({className:t,intent:n,...r}){return s(`div`,{"aria-hidden":!0,className:e(`z-1 absolute -inset-px right-auto w-1.5 rounded-l`,b[n],t),...r})}export{y as Toast,h as Toaster,_ as makeToast};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{t as e}from"./cx-0HCjnNv1.js";import{r as t}from"./layer-container-BTcQpd4K.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import*as i from"@radix-ui/react-tooltip";const a=({delayDuration:e=0,...t})=>n(i.Provider,{"data-slot":`tooltip-provider`,delayDuration:e??0,...t});function o(e){return n(i.Root,{...e})}function s(e){return n(i.Trigger,{"data-slot":`tooltip-trigger`,...e})}const c={Root:o,Content:({children:a,className:o,ref:s,sideOffset:c=4,...l})=>{let u=t();return n(i.Portal,{container:u,children:r(i.Content,{className:e(`bg-tooltip text-tooltip animate-in fade-in-0 zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 z-50 max-w-72 overflow-visible wrap-break-word rounded-md px-3 py-1.5 text-sm font-sans shadow`,o),"data-slot":`tooltip-content`,ref:s,sideOffset:c,...l,children:[a,n(i.Arrow,{asChild:!0,children:n(`div`,{className:`bg-tooltip z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-xs`})})]})})},Trigger:s};export{a as n,c as t};
|
|
@@ -104,7 +104,13 @@ declare function Trigger(props: ComponentProps<typeof TooltipPrimitive.Trigger>)
|
|
|
104
104
|
* </Tooltip.Root>
|
|
105
105
|
* ```
|
|
106
106
|
*/
|
|
107
|
-
|
|
107
|
+
/**
|
|
108
|
+
* Props for `Tooltip.Content`. `asChild` is omitted: the content renders its own
|
|
109
|
+
* arrow next to `children`, so a slot would receive more than one element and
|
|
110
|
+
* throw.
|
|
111
|
+
*/
|
|
112
|
+
type TooltipContentProps = Omit<ComponentProps<typeof TooltipPrimitive.Content>, "asChild">;
|
|
113
|
+
declare const Content: ({ children, className, ref, sideOffset, ...props }: TooltipContentProps) => import("react").JSX.Element;
|
|
108
114
|
/**
|
|
109
115
|
* A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it.
|
|
110
116
|
*
|
package/dist/tooltip.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as TooltipProvider, t as Tooltip } from "./tooltip-
|
|
1
|
+
import { n as TooltipProvider, t as Tooltip } from "./tooltip-DA41fxe5.js";
|
|
2
2
|
export { Tooltip, TooltipProvider };
|
package/dist/tooltip.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{n as e,t}from"./tooltip-
|
|
1
|
+
import{n as e,t}from"./tooltip-CkAibjBb.js";export{t as Tooltip,e as TooltipProvider};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useSyncExternalStore as e}from"react";const t=[`2xl`,`xl`,`lg`,`md`,`sm`,`xs`,`2xs`],n=[`default`,...t];function r(){return e(_,v,()=>`default`)}function i(t){return e(b(t),S(t),()=>!1)}const a={"2xl":`(min-width: 96rem)`,xl:`(min-width: 80rem)`,lg:`(min-width: 64rem)`,md:`(min-width: 48rem)`,sm:`(min-width: 40rem)`,xs:`(min-width: 30rem)`,"2xs":`(min-width: 22.5rem)`},o={"2xl":`(max-width: 95.99rem)`,xl:`(max-width: 79.99rem)`,lg:`(max-width: 63.99rem)`,md:`(max-width: 47.99rem)`,sm:`(max-width: 39.99rem)`,xs:`(max-width: 29.99rem)`,"2xs":`(max-width: 22.49rem)`};let s=null,c=null;function l(){return s||={"2xl":window.matchMedia(a[`2xl`]),xl:window.matchMedia(a.xl),lg:window.matchMedia(a.lg),md:window.matchMedia(a.md),sm:window.matchMedia(a.sm),xs:window.matchMedia(a.xs),"2xs":window.matchMedia(a[`2xs`])},s}function u(e){return c||={"2xl":window.matchMedia(o[`2xl`]),xl:window.matchMedia(o.xl),lg:window.matchMedia(o.lg),md:window.matchMedia(o.md),sm:window.matchMedia(o.sm),xs:window.matchMedia(o.xs),"2xs":window.matchMedia(o[`2xs`])},c[e]}let d=`default`;const f=new Set;let p=!1;function m(){let e=l();for(let n of t)if(e[n].matches)return n;return`default`}let h=!1;function g(){h||(h=!0,requestAnimationFrame(()=>{h=!1;let e=m();if(e!==d){d=e;for(let e of f)e()}}))}function _(e){if(f.add(e),!p){p=!0;let e=l();d=m();for(let t of Object.values(e))t.addEventListener(`change`,g)}return e(),()=>{if(f.delete(e),f.size===0&&p){p=!1;let e=l();for(let t of Object.values(e))t.removeEventListener(`change`,g)}}}function v(){return d}const y=new Map;function b(e){let t=y.get(e);return t||(t=t=>{let n=u(e),r=!1,i=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener(`change`,i),()=>{n.removeEventListener(`change`,i)}},y.set(e,t),t)}const x=new Map;function S(e){let t=x.get(e);return t||(t=()=>u(e).matches,x.set(e,t),t)}export{r as n,i as r,n as t};
|
|
1
|
+
import{useSyncExternalStore as e}from"react";const t=[`2xl`,`xl`,`lg`,`md`,`sm`,`xs`,`2xs`],n=[`default`,...t];function r(){return e(_,v,()=>`default`)}function i(t){return e(b(t),S(t),()=>!1)}const a={"2xl":`(min-width: 96rem)`,xl:`(min-width: 80rem)`,lg:`(min-width: 64rem)`,md:`(min-width: 48rem)`,sm:`(min-width: 40rem)`,xs:`(min-width: 30rem)`,"2xs":`(min-width: 22.5rem)`},o={"2xl":`(max-width: 95.99rem)`,xl:`(max-width: 79.99rem)`,lg:`(max-width: 63.99rem)`,md:`(max-width: 47.99rem)`,sm:`(max-width: 39.99rem)`,xs:`(max-width: 29.99rem)`,"2xs":`(max-width: 22.49rem)`};let s=null,c=null;function l(){return s||={"2xl":window.matchMedia(a[`2xl`]),xl:window.matchMedia(a.xl),lg:window.matchMedia(a.lg),md:window.matchMedia(a.md),sm:window.matchMedia(a.sm),xs:window.matchMedia(a.xs),"2xs":window.matchMedia(a[`2xs`])},s}function u(e){return c||={"2xl":window.matchMedia(o[`2xl`]),xl:window.matchMedia(o.xl),lg:window.matchMedia(o.lg),md:window.matchMedia(o.md),sm:window.matchMedia(o.sm),xs:window.matchMedia(o.xs),"2xs":window.matchMedia(o[`2xs`])},c[e]}let d=`default`;const f=new Set;let p=!1;function m(){let e=l();for(let n of t)if(e[n].matches)return n;return`default`}let h=!1;function g(){h||(h=!0,requestAnimationFrame(()=>{h=!1;let e=m();if(e!==d){d=e;for(let e of f)e()}}))}function _(e){if(f.add(e),!p){p=!0;let e=l();d=m();for(let t of Object.values(e))t.addEventListener(`change`,g)}return e(),()=>{if(f.delete(e),f.size===0&&p){p=!1;let e=l();for(let t of Object.values(e))t.removeEventListener(`change`,g)}}}function v(){return p||(d=m()),d}const y=new Map;function b(e){let t=y.get(e);return t||(t=t=>{let n=u(e),r=!1,i=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener(`change`,i),()=>{n.removeEventListener(`change`,i)}},y.set(e,t),t)}const x=new Map;function S(e){let t=x.get(e);return t||(t=()=>u(e).matches,x.set(e,t),t)}export{r as n,i as r,n as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useSyncExternalStore as e}from"react";function t(e){return`userAgentData`in e}function n(){if(typeof navigator>`u`)return!1;let e=``;return t(navigator)&&(e=navigator.userAgentData.platform??``),e||=navigator.platform||navigator.userAgent||``,/mac|iphone|ipad|ipod/i.test(e)}function r(){return()=>{}}function i(){return!1}function a(){return e(r,n,i)}export{n,a as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useCallback as e,useRef as t,useSyncExternalStore as n}from"react";function r(r){let i=t(null),a=e(()=>((i.current==null||i.current.query!==r)&&(i.current={query:r,list:window.matchMedia(r)}),i.current.list),[r]),o=e(e=>{let t=a();return t.addEventListener(`change`,e),()=>{t.removeEventListener(`change`,e)}},[a]),s=e(()=>a().matches,[a]);return n(o,s,()=>!1)}export{r as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{n as e}from"./browser-only-CmEEzfU3.js";import{t}from"./use-matches-media-query-DCBT6iNA.js";const n=`(prefers-reduced-motion: no-preference)`;function r(){return!e()||!window.matchMedia(n).matches}function i(){return!t(n)}export{i as n,r as t};
|
package/dist/utils.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { _ as timeSortingDirections, a as AlphanumericSortingDirection, c as TimeSortingDirection, d as isSortingDirection, f as isSortingMode, g as timeSortingByDirection, h as sortingModes, i as $timeSortingDirection, l as alphanumericSortingDirections, m as sortingDirections, n as $sortingDirection, o as SortingDirection, p as isTimeSortingDirection, r as $sortingMode, s as SortingMode, t as $alphanumericSortingDirection, u as isAlphanumericSortingDirection } from "./direction-BjU0bPST.js";
|
|
2
|
-
import { a as composeRefs, i as inView, n as MarginType, r as ViewChangeHandler, s as copyToClipboard, t as InViewOptions } from "./in-view-
|
|
2
|
+
import { a as composeRefs, i as inView, n as MarginType, r as ViewChangeHandler, s as copyToClipboard, t as InViewOptions } from "./in-view-Ch5vJtWo.js";
|
|
3
3
|
//#region src/utils/sorting/compare.d.ts
|
|
4
4
|
/**
|
|
5
5
|
* Compare dates in newest-to-oldest (descending) order.
|
package/dist/utils.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./compose-refs-
|
|
1
|
+
import{t as e}from"./compose-refs-DdUwopIY.js";import{t}from"./copy-to-clipboard-B4UB6pts.js";import{a as n,c as r,d as i,f as a,i as o,l as s,n as c,o as l,p as u,r as d,s as f,t as p,u as m}from"./direction-Wa9W2F61.js";import{t as h}from"./in-view-T_AAYaaF.js";function g(e,t){return Math.sign(t.getTime()-e.getTime())}function _(e,t){return Math.sign(e.getTime()-t.getTime())}export{p as $alphanumericSortingDirection,c as $sortingDirection,d as $sortingMode,o as $timeSortingDirection,n as alphanumericSortingDirections,g as compareDatesNewestToOldest,_ as compareDatesOldestToNewest,e as composeRefs,t as copyToClipboard,h as inView,l as isAlphanumericSortingDirection,f as isSortingDirection,r as isSortingMode,s as isTimeSortingDirection,m as sortingDirections,i as sortingModes,a as timeSortingByDirection,u as timeSortingDirections};
|
package/dist/visually-hidden.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-
|
|
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,className:i,ref:a,...o})=>n(r?t:`span`,{ref:a,"data-slot":`visually-hidden`,className:e(`sr-only`,i),...o});export{r as VisuallyHidden};
|
package/dist/well.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-
|
|
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`,{ref:a,"data-slot":`well`,className:e(`border-card-muted bg-base relative rounded-md border shadow-inner`,i),...o});export{r as Well};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ngrok/mantle",
|
|
3
|
-
"version": "0.84.
|
|
3
|
+
"version": "0.84.2",
|
|
4
4
|
"description": "mantle is ngrok's UI library and design system.",
|
|
5
5
|
"homepage": "https://mantle.ngrok.com",
|
|
6
6
|
"license": "MIT",
|
|
@@ -119,7 +119,7 @@
|
|
|
119
119
|
"./well": "./dist/well.js"
|
|
120
120
|
},
|
|
121
121
|
"dependencies": {
|
|
122
|
-
"@ariakit/react": "0.4.
|
|
122
|
+
"@ariakit/react": "0.4.39",
|
|
123
123
|
"@headlessui/react": "2.2.10",
|
|
124
124
|
"@radix-ui/react-dialog": "1.1.23",
|
|
125
125
|
"@radix-ui/react-dropdown-menu": "2.1.24",
|
|
@@ -133,7 +133,7 @@
|
|
|
133
133
|
"@radix-ui/react-tabs": "1.1.21",
|
|
134
134
|
"@radix-ui/react-tooltip": "1.2.16",
|
|
135
135
|
"@tanstack/react-table": "8.21.3",
|
|
136
|
-
"@tanstack/react-virtual": "3.14.
|
|
136
|
+
"@tanstack/react-virtual": "3.14.11",
|
|
137
137
|
"class-variance-authority": "0.7.1",
|
|
138
138
|
"cmdk": "1.1.1",
|
|
139
139
|
"d3-scale": "4.0.2",
|
package/dist/alert-DDjzRuGa.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-d-nMCfAI.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./types-D85fCNV3.js";import{t as i}from"./button-Bc0lEOJ2.js";import{t as a}from"./button-CC10rP6X.js";import{CaretDownIcon as o}from"@phosphor-icons/react/CaretDown";import{createContext as s,useContext as c,useMemo as l}from"react";import u from"tiny-invariant";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{CheckCircleIcon as p}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as m}from"@phosphor-icons/react/Info";import{MegaphoneIcon as h}from"@phosphor-icons/react/Megaphone";import{WarningIcon as g}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as _}from"@phosphor-icons/react/WarningDiamond";import{XIcon as v}from"@phosphor-icons/react/X";import{cva as y}from"class-variance-authority";const b=s(null),x=d(v,{});function S(){let e=c(b);return u(e,`useAlertContext hook used outside of Alert parent!`),e}const C=({children:e,intent:t})=>{let n=l(()=>({intent:t}),[t]);return d(b.Provider,{value:n,children:e})},w=y(`relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm font-sans`,{variants:{intent:{danger:`border-danger-500/50 bg-danger-500/10 text-danger-700 [&_code]:bg-danger-500/10 [&_code]:border-danger-500/20 [&_code]:text-danger-900 [&_a:not([data-slot=button])]:text-danger-700 [&_a:not([data-slot=button])]:underline`,important:`border-important-500/50 bg-important-500/10 text-important-700 [&_code]:bg-important-500/10 [&_code]:border-important-500/20 [&_code]:text-important-900 [&_a:not([data-slot=button])]:text-important-700 [&_a:not([data-slot=button])]:underline`,info:`border-info-500/50 bg-info-500/10 text-info-700 [&_code]:bg-info-500/10 [&_code]:border-info-500/20 [&_code]:text-info-900 [&_a:not([data-slot=button])]:text-info-700 [&_a:not([data-slot=button])]:underline`,success:`border-success-500/50 bg-success-500/10 text-success-700 [&_code]:bg-success-500/10 [&_code]:border-success-500/20 [&_code]:text-success-900 [&_a:not([data-slot=button])]:text-success-700 [&_a:not([data-slot=button])]:underline`,warning:`border-warning-500/50 bg-warning-500/10 text-warning-700 [&_code]:bg-warning-500/10 [&_code]:border-warning-500/20 [&_code]:text-warning-900 [&_a:not([data-slot=button])]:text-warning-700 [&_a:not([data-slot=button])]:underline`},appearance:{banner:`border-x-0 border-t-0 rounded-none z-50 sticky`,default:``}}}),T=({appearance:t=`default`,className:n,intent:i,ref:a,style:o,...s})=>d(C,{intent:i,children:d(`div`,{ref:a,"data-slot":`alert`,className:e(w({appearance:t,intent:i}),`has-data-alert-dismiss:pr-10`,`has-data-alert-expand:[&_[data-slot=alert-dismiss-icon-button]]:right-16`,`md:has-data-alert-expand:[&_[data-slot=alert-dismiss-icon-button]]:right-24`,`has-data-alert-expand:[&_[data-slot=alert-content]]:pr-12`,`md:has-data-alert-expand:[&_[data-slot=alert-content]]:pr-[5.5rem]`,n),style:r({"--alert-control-color":j(i),"--alert-control-hover-color":M(i),"--alert-control-hover-bg":N(i),...o}),...s})}),E={danger:d(g,{}),important:d(h,{mirrored:!0}),info:d(m,{}),success:d(p,{}),warning:d(_,{})},D=({className:n,ref:r,svg:i,...a})=>{let o=S(),s=E[o.intent];return d(t,{ref:r,"data-slot":`alert-icon`,className:e(`size-5`,n),svg:i??s,...a})},O=({className:t,ref:n,...r})=>d(`div`,{ref:n,"data-slot":`alert-content`,className:e(`min-w-0 flex-1 has-data-alert-dismiss:pr-6`,t),...r}),k=({asChild:t=!1,className:r,ref:i,...a})=>d(t?n:`h5`,{ref:i,"data-slot":`alert-title`,className:e(`font-medium`,r),...a}),A=({asChild:t=!1,className:r,ref:i,...a})=>d(t?n:`div`,{ref:i,"data-slot":`alert-description`,className:e(`text-sm`,r),...a}),j=e=>`var(--color-${e}-700)`,M=e=>`var(--color-${e}-800)`,N=e=>`color-mix(in oklab, var(--color-${e}-500) 10%, transparent)`,P={Root:T,Content:O,ExpandButton:({count:t,expanded:n,className:r,...a})=>f(i,{type:`button`,appearance:`ghost`,intent:`neutral`,size:`sm`,"aria-expanded":n,"aria-label":n?`Collapse additional alerts`:`Show ${t} more ${t===1?`alert`:`alerts`}`,"data-slot":`alert-expand-button`,"data-alert-expand":!0,icon:d(o,{weight:`bold`,className:e(`size-4 transition-transform ease-out duration-150`,n&&`-rotate-180`)}),iconPlacement:`end`,className:e(`right-1.5 top-1.5 absolute gap-1 ps-1.5 pe-1`,`text-[var(--alert-control-color,currentColor)]`,`not-disabled:hover:bg-[var(--alert-control-hover-bg,transparent)] not-disabled:hover:text-[var(--alert-control-hover-color,currentColor)]`,r),...a,children:[f(`span`,{className:`min-w-[2ch] text-center tabular-nums`,children:[`+`,t]}),d(`span`,{className:`hidden md:inline`,children:`more`})]}),Description:A,DismissIconButton:({size:t=`sm`,type:n=`button`,label:r=`Dismiss Alert`,appearance:i=`ghost`,className:o,icon:s=x,...c})=>d(a,{appearance:i,icon:s,intent:`neutral`,label:r,size:t,"data-slot":`alert-dismiss-icon-button`,"data-alert-dismiss":!0,className:e(`right-1.5 top-1.5 absolute`,`text-[var(--alert-control-color,currentColor)]`,`not-disabled:hover:bg-[var(--alert-control-hover-bg,transparent)] not-disabled:hover:text-[var(--alert-control-hover-color,currentColor)]`,o),type:n,...c}),Icon:D,Title:k};export{C as n,P as t};
|
package/dist/anchor-D2So_zuy.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-DpNWVci8.js";import{Children as r,cloneElement as i,isValidElement as a}from"react";import o from"tiny-invariant";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";const u=t=>e(`cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-hidden focus-visible:ring-3 focus-visible:ring-focus-accent`,t),d=({asChild:e,children:d,className:p,rel:m,icon:h,iconPlacement:g=`start`,ref:_,...v})=>{let y=f(m),b={"data-slot":`anchor`,className:u(p),ref:_,rel:y,...v};if(e){let e=r.only(d);o(a(e),"When using `asChild`, Anchor must be passed a single child as a JSX tag.");let u=e.props?.children;return c(n,{...b,children:i(e,{},l(s,{children:[h&&g===`start`&&c(t,{className:`inline-block mr-1.5`,svg:h}),c(`span`,{"data-slot":`anchor-label`,children:u}),h&&g===`end`&&c(t,{className:`inline-block ml-1.5`,svg:h})]}))})}return l(`a`,{...b,children:[h&&g===`start`&&c(t,{className:`inline-block mr-1.5`,svg:h}),c(`span`,{"data-slot":`anchor-label`,children:d}),h&&g===`end`&&c(t,{className:`inline-block ml-1.5`,svg:h})]})};function f(e){return Array.isArray(e)?[...new Set(e)].map(e=>e?.trim()).filter(Boolean).toSorted().join(` `)||void 0:e?.trim()||void 0}export{u as n,f as r,d as t};
|
package/dist/button-CC10rP6X.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./button-DiDlvAOp.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{jsx as l}from"react/jsx-runtime";import{CircleNotchIcon as u}from"@phosphor-icons/react/CircleNotch";const d=({"aria-disabled":d,appearance:f,asChild:p=!1,children:m,className:h,disabled:g,icon:_,intent:v,isLoading:y=!1,label:b,ref:x,size:S=`md`,type:C,...w})=>{let T=r(d??g??y),E=y?l(u,{className:`animate-spin`}):_,D={"aria-disabled":T,"data-slot":`icon-button`,className:e(i({appearance:f,intent:v,isLoading:y,size:S}),h),"data-appearance":f,"data-disabled":T,"data-icon-button":!0,"data-intent":v,"data-loading":y,"data-size":S,disabled:T,ref:x,...w,"aria-label":b},O=l(t,{svg:E});return p?(c(s(m)&&a.only(m),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),l(n,{...D,children:o(m,{},O)})):l(`button`,{...D,type:C??`button`,children:O})};export{d as t};
|
package/dist/button-DiDlvAOp.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{cva as t}from"class-variance-authority";const n=e(`icon-button`,`inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`),r=t(n,{variants:{appearance:{filled:`bg-filled-neutral text-neutral-50 focus-visible:ring-focus-accent focus-visible:border-transparent not-disabled:hover:bg-filled-neutral-hover border-transparent`,ghost:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`,outlined:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},intent:{neutral:``},isLoading:{false:``,true:`opacity-50`},size:{xs:`size-6`,sm:`size-7`,md:`size-9`,lg:`size-10`,xl:`size-12`}},defaultVariants:{intent:`neutral`,size:`md`}});export{r as t};
|