@pibit.ai/cure-design-system 0.3.16 → 0.3.18
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/assets/icons/group-by.svg.js +4 -0
- package/dist/assets/icons/reorder-dots-new.svg.js +4 -0
- package/dist/assets/icons/reorder-dots.svg.js +4 -0
- package/dist/assets/icons/resize-1.svg.js +4 -0
- package/dist/assets/icons/resize-2.svg.js +4 -0
- package/dist/assets/icons/resize-4.svg.js +4 -0
- package/dist/assets/icons/resize-5.svg.js +4 -0
- package/dist/assets/icons/show-summary.svg.js +4 -0
- package/dist/index.d.ts +4 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +124 -62
- package/dist/node_modules/framer-motion/dist/es/components/Reorder/Group.js +46 -0
- package/dist/node_modules/framer-motion/dist/es/components/Reorder/Item.js +34 -0
- package/dist/node_modules/framer-motion/dist/es/components/Reorder/utils/auto-scroll.js +65 -0
- package/dist/node_modules/framer-motion/dist/es/components/Reorder/utils/check-reorder.js +17 -0
- package/dist/node_modules/framer-motion/dist/es/context/ReorderContext.js +5 -0
- package/dist/node_modules/framer-motion/dist/es/gestures/drag/use-drag-controls.js +70 -0
- package/dist/node_modules/framer-motion/dist/es/value/use-combine-values.js +15 -0
- package/dist/node_modules/framer-motion/dist/es/value/use-computed.js +10 -0
- package/dist/node_modules/framer-motion/dist/es/value/use-motion-value.js +15 -0
- package/dist/node_modules/framer-motion/dist/es/value/use-transform.js +23 -0
- package/dist/node_modules/motion-dom/dist/es/projection/node/create-projection-node.js +1 -1
- package/dist/node_modules/motion-dom/dist/es/utils/transform.js +8 -0
- package/dist/node_modules/motion-dom/dist/es/value/index.js +21 -18
- package/dist/node_modules/motion-utils/dist/es/array.js +15 -6
- package/dist/patterns/table/TablePagination.d.ts +23 -0
- package/dist/patterns/table/TablePagination.d.ts.map +1 -0
- package/dist/patterns/table/TablePagination.js +60 -0
- package/dist/patterns/table/TableWrapper.d.ts +2 -81
- package/dist/patterns/table/TableWrapper.d.ts.map +1 -1
- package/dist/patterns/table/TableWrapper.js +726 -157
- package/dist/patterns/table/index.d.ts +13 -2
- package/dist/patterns/table/index.d.ts.map +1 -1
- package/dist/patterns/table/pagination-base.d.ts +78 -0
- package/dist/patterns/table/pagination-base.d.ts.map +1 -0
- package/dist/patterns/table/pagination-base.js +127 -0
- package/dist/patterns/table/pagination-card.d.ts +9 -0
- package/dist/patterns/table/pagination-card.d.ts.map +1 -0
- package/dist/patterns/table/pagination-card.js +65 -0
- package/dist/patterns/table/row-height-icons.d.ts +9 -0
- package/dist/patterns/table/row-height-icons.d.ts.map +1 -0
- package/dist/patterns/table/row-height-icons.js +13 -0
- package/dist/patterns/table/storyHelpers/mockToolbarSlots.d.ts +7 -0
- package/dist/patterns/table/storyHelpers/mockToolbarSlots.d.ts.map +1 -0
- package/dist/patterns/table/storyHelpers/useMockTableState.d.ts +31 -0
- package/dist/patterns/table/storyHelpers/useMockTableState.d.ts.map +1 -0
- package/dist/patterns/table/storyHelpers/useMockTableToolbar.d.ts +3 -0
- package/dist/patterns/table/storyHelpers/useMockTableToolbar.d.ts.map +1 -0
- package/dist/patterns/table/table.d.ts +10 -13
- package/dist/patterns/table/table.d.ts.map +1 -1
- package/dist/patterns/table/table.js +235 -312
- package/dist/patterns/table/toolbar/AlignDropdown.d.ts +11 -0
- package/dist/patterns/table/toolbar/AlignDropdown.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/AlignDropdown.js +77 -0
- package/dist/patterns/table/toolbar/BasicSortPanel.d.ts +6 -0
- package/dist/patterns/table/toolbar/BasicSortPanel.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/BulkActionBar.d.ts +12 -0
- package/dist/patterns/table/toolbar/BulkActionBar.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/BulkActionBar.js +62 -0
- package/dist/patterns/table/toolbar/ColumnHeaderMenu.d.ts +41 -0
- package/dist/patterns/table/toolbar/ColumnHeaderMenu.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/ColumnHeaderMenu.js +171 -0
- package/dist/patterns/table/toolbar/GroupByDropdown.d.ts +11 -0
- package/dist/patterns/table/toolbar/GroupByDropdown.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/GroupByDropdown.js +80 -0
- package/dist/patterns/table/toolbar/HideFieldsDropdown.d.ts +13 -0
- package/dist/patterns/table/toolbar/HideFieldsDropdown.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/HideFieldsDropdown.js +180 -0
- package/dist/patterns/table/toolbar/LegacySortFilterTools.d.ts +9 -0
- package/dist/patterns/table/toolbar/LegacySortFilterTools.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/RowActionsMenu.d.ts +19 -0
- package/dist/patterns/table/toolbar/RowActionsMenu.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/RowActionsMenu.js +84 -0
- package/dist/patterns/table/toolbar/RowHeightDropdown.d.ts +9 -0
- package/dist/patterns/table/toolbar/RowHeightDropdown.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/RowHeightDropdown.js +60 -0
- package/dist/patterns/table/toolbar/ShowSummaryDropdown.d.ts +8 -0
- package/dist/patterns/table/toolbar/ShowSummaryDropdown.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/ShowSummaryDropdown.js +22 -0
- package/dist/patterns/table/toolbar/SummaryFooter.d.ts +16 -0
- package/dist/patterns/table/toolbar/SummaryFooter.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/SummaryFooter.js +83 -0
- package/dist/patterns/table/toolbar/TableToolbar.d.ts +55 -0
- package/dist/patterns/table/toolbar/TableToolbar.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/TableToolbar.js +234 -0
- package/dist/patterns/table/toolbar/ToolbarRadio.d.ts +18 -0
- package/dist/patterns/table/toolbar/ToolbarRadio.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/ToolbarRadio.js +63 -0
- package/dist/patterns/table/toolbar/index.d.ts +24 -0
- package/dist/patterns/table/toolbar/index.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/legacyToolbarTypes.d.ts +69 -0
- package/dist/patterns/table/toolbar/legacyToolbarTypes.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/tableToolbarHelpers.d.ts +35 -0
- package/dist/patterns/table/toolbar/tableToolbarHelpers.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/tableToolbarHelpers.js +259 -0
- package/dist/patterns/table/toolbar/tableToolbarHelpers.test.d.ts +2 -0
- package/dist/patterns/table/toolbar/tableToolbarHelpers.test.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/toolbarExtensions.d.ts +12 -0
- package/dist/patterns/table/toolbar/toolbarExtensions.d.ts.map +1 -0
- package/dist/patterns/table/toolbar/toolbarExtensions.js +18 -0
- package/dist/patterns/table/toolbar-icons.d.ts +8 -0
- package/dist/patterns/table/toolbar-icons.d.ts.map +1 -0
- package/dist/patterns/table/toolbar-icons.js +13 -0
- package/dist/patterns/table/types.d.ts +141 -0
- package/dist/patterns/table/types.d.ts.map +1 -0
- package/dist/patterns/table/useGridKeyboardNavigation.d.ts +38 -0
- package/dist/patterns/table/useGridKeyboardNavigation.d.ts.map +1 -0
- package/dist/patterns/table/useGridKeyboardNavigation.js +65 -0
- package/dist/primitives/checkbox/checkbox.d.ts +2 -2
- package/dist/primitives/checkbox/checkbox.d.ts.map +1 -1
- package/dist/primitives/dropdown/dropdown.d.ts +32 -0
- package/dist/primitives/dropdown/dropdown.d.ts.map +1 -0
- package/dist/primitives/dropdown/dropdown.js +118 -0
- package/dist/primitives/dropdown/index.d.ts +2 -0
- package/dist/primitives/dropdown/index.d.ts.map +1 -0
- package/dist/primitives/select/ExpandableSearchInput.d.ts +5 -1
- package/dist/primitives/select/ExpandableSearchInput.d.ts.map +1 -1
- package/dist/primitives/select/ExpandableSearchInput.js +80 -77
- package/dist/primitives/shimmer/index.d.ts +2 -0
- package/dist/primitives/shimmer/index.d.ts.map +1 -0
- package/dist/primitives/shimmer/shimmer.d.ts +24 -0
- package/dist/primitives/shimmer/shimmer.d.ts.map +1 -0
- package/dist/primitives/shimmer/shimmer.js +37 -0
- package/dist/primitives/tooltip/ellipsis-content.d.ts +12 -0
- package/dist/primitives/tooltip/ellipsis-content.d.ts.map +1 -0
- package/dist/primitives/tooltip/ellipsis-content.js +113 -0
- package/dist/primitives/tooltip/index.d.ts +1 -0
- package/dist/primitives/tooltip/index.d.ts.map +1 -1
- package/dist/styles/components.css +1 -1
- package/dist/styles/theme.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import { jsx as t, jsxs as d } from "react/jsx-runtime";
|
|
2
|
+
import { DotsVertical as u, Check as f } from "@untitledui/icons";
|
|
3
|
+
import { Header as g, MenuSection as x, MenuTrigger as p, Button as h, Separator as y, MenuItem as m, Menu as N, Popover as b } from "react-aria-components";
|
|
4
|
+
import { cn as i } from "../../utils/cn.js";
|
|
5
|
+
const w = ({
|
|
6
|
+
label: e,
|
|
7
|
+
children: o,
|
|
8
|
+
addon: s,
|
|
9
|
+
icon: l,
|
|
10
|
+
unstyled: c,
|
|
11
|
+
isSelected: a = !1,
|
|
12
|
+
...r
|
|
13
|
+
}) => c ? /* @__PURE__ */ t(m, { id: e, textValue: e, ...r }) : /* @__PURE__ */ t(
|
|
14
|
+
m,
|
|
15
|
+
{
|
|
16
|
+
...r,
|
|
17
|
+
className: (n) => i(
|
|
18
|
+
"group block cursor-pointer px-1.5 py-px outline-hidden",
|
|
19
|
+
n.isDisabled && "cursor-not-allowed",
|
|
20
|
+
typeof r.className == "function" ? r.className(n) : r.className
|
|
21
|
+
),
|
|
22
|
+
children: (n) => /* @__PURE__ */ d(
|
|
23
|
+
"div",
|
|
24
|
+
{
|
|
25
|
+
className: i(
|
|
26
|
+
"relative flex items-center rounded-md px-2.5 py-2 outline-focus-ring transition duration-100 ease-linear",
|
|
27
|
+
!n.isDisabled && !a && "group-hover:bg-primary_hover",
|
|
28
|
+
n.isFocused && "bg-primary_hover",
|
|
29
|
+
n.isFocusVisible && !a && "outline-2 -outline-offset-2",
|
|
30
|
+
a && "bg-utility-brand-25"
|
|
31
|
+
),
|
|
32
|
+
children: [
|
|
33
|
+
l && /* @__PURE__ */ t(
|
|
34
|
+
l,
|
|
35
|
+
{
|
|
36
|
+
"aria-hidden": "true",
|
|
37
|
+
className: i(
|
|
38
|
+
"mr-2 size-4 shrink-0 stroke-[2.25px]",
|
|
39
|
+
n.isDisabled ? "text-fg-disabled" : "text-fg-quaternary"
|
|
40
|
+
)
|
|
41
|
+
}
|
|
42
|
+
),
|
|
43
|
+
/* @__PURE__ */ t(
|
|
44
|
+
"span",
|
|
45
|
+
{
|
|
46
|
+
className: i(
|
|
47
|
+
"grow truncate text-sm font-medium",
|
|
48
|
+
n.isDisabled ? "text-disabled" : "text-secondary",
|
|
49
|
+
n.isFocused && "text-secondary_hover"
|
|
50
|
+
),
|
|
51
|
+
children: e || (typeof o == "function" ? o(n) : o)
|
|
52
|
+
}
|
|
53
|
+
),
|
|
54
|
+
a && /* @__PURE__ */ t(f, { size: 16, className: "text-brand-600" }),
|
|
55
|
+
s && /* @__PURE__ */ t(
|
|
56
|
+
"span",
|
|
57
|
+
{
|
|
58
|
+
className: i(
|
|
59
|
+
"ml-3 shrink-0 rounded px-1 py-px text-xs font-medium ring-1 ring-secondary ring-inset",
|
|
60
|
+
n.isDisabled ? "text-disabled" : "text-quaternary"
|
|
61
|
+
),
|
|
62
|
+
children: s
|
|
63
|
+
}
|
|
64
|
+
)
|
|
65
|
+
]
|
|
66
|
+
}
|
|
67
|
+
)
|
|
68
|
+
}
|
|
69
|
+
), D = (e) => /* @__PURE__ */ t(
|
|
70
|
+
N,
|
|
71
|
+
{
|
|
72
|
+
disallowEmptySelection: !0,
|
|
73
|
+
selectionMode: "single",
|
|
74
|
+
...e,
|
|
75
|
+
className: (o) => i(
|
|
76
|
+
"h-min overflow-y-auto py-1 outline-hidden select-none",
|
|
77
|
+
typeof e.className == "function" ? e.className(o) : e.className
|
|
78
|
+
)
|
|
79
|
+
}
|
|
80
|
+
), v = (e) => /* @__PURE__ */ t(
|
|
81
|
+
b,
|
|
82
|
+
{
|
|
83
|
+
placement: "bottom left",
|
|
84
|
+
...e,
|
|
85
|
+
className: (o) => i(
|
|
86
|
+
"max-h-max! w-62 origin-(--trigger-anchor-point) overflow-auto rounded-lg bg-primary shadow-lg ring-1 ring-secondary_alt will-change-transform",
|
|
87
|
+
o.isEntering && "duration-150 ease-out animate-in fade-in placement-right:slide-in-from-left-0.5 placement-top:slide-in-from-bottom-0.5 placement-bottom:slide-in-from-top-0.5",
|
|
88
|
+
o.isExiting && "duration-100 ease-in animate-out fade-out placement-right:slide-out-to-left-0.5 placement-top:slide-out-to-bottom-0.5 placement-bottom:slide-out-to-top-0.5",
|
|
89
|
+
typeof e.className == "function" ? e.className(o) : e.className
|
|
90
|
+
),
|
|
91
|
+
children: e.children
|
|
92
|
+
}
|
|
93
|
+
), M = (e) => /* @__PURE__ */ t(y, { ...e, className: i("my-1 h-px w-full bg-secondary", e.className) }), k = (e) => /* @__PURE__ */ t(
|
|
94
|
+
h,
|
|
95
|
+
{
|
|
96
|
+
...e,
|
|
97
|
+
"aria-label": "Open menu",
|
|
98
|
+
className: (o) => i(
|
|
99
|
+
"cursor-pointer rounded-md text-fg-quaternary transition duration-100 ease-linear",
|
|
100
|
+
(o.isPressed || o.isHovered) && "text-fg-quaternary_hover",
|
|
101
|
+
(o.isPressed || o.isFocusVisible) && "outline-2 outline-offset-2",
|
|
102
|
+
typeof e.className == "function" ? e.className(o) : e.className
|
|
103
|
+
),
|
|
104
|
+
children: /* @__PURE__ */ t(u, { className: "size-5 transition-inherit-all" })
|
|
105
|
+
}
|
|
106
|
+
), S = {
|
|
107
|
+
Root: p,
|
|
108
|
+
Popover: v,
|
|
109
|
+
Menu: D,
|
|
110
|
+
Section: x,
|
|
111
|
+
SectionHeader: g,
|
|
112
|
+
Item: w,
|
|
113
|
+
Separator: M,
|
|
114
|
+
DotsButton: k
|
|
115
|
+
};
|
|
116
|
+
export {
|
|
117
|
+
S as Dropdown
|
|
118
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,iBAAiB,EAAE,KAAK,iBAAiB,EAAE,KAAK,oBAAoB,EAAE,MAAM,YAAY,CAAC"}
|
|
@@ -10,6 +10,10 @@ export interface ExpandableSearchInputProps {
|
|
|
10
10
|
className?: string;
|
|
11
11
|
expandedWidth?: number;
|
|
12
12
|
"aria-label"?: string;
|
|
13
|
+
/** When false, the search field stays expanded. Default true. */
|
|
14
|
+
collapsible?: boolean;
|
|
15
|
+
/** When true, the control is greyed out and can't be expanded or typed in. */
|
|
16
|
+
isDisabled?: boolean;
|
|
13
17
|
}
|
|
14
|
-
export declare const ExpandableSearchInput: ({ size, placeholder, value, onChange, onBlur, onFocus, onKeyDown, className, expandedWidth, "aria-label": ariaLabel, }: ExpandableSearchInputProps) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export declare const ExpandableSearchInput: ({ size, placeholder, value, onChange, onBlur, onFocus, onKeyDown, className, expandedWidth, "aria-label": ariaLabel, collapsible, isDisabled, }: ExpandableSearchInputProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
19
|
//# sourceMappingURL=ExpandableSearchInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpandableSearchInput.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/ExpandableSearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,0BAA0B;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,SAAS,CAAC,EAAE,oBAAoB,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"ExpandableSearchInput.d.ts","sourceRoot":"","sources":["../../../src/primitives/select/ExpandableSearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAC1B,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,0BAA0B;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,SAAS,CAAC,EAAE,oBAAoB,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iEAAiE;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAKD,eAAO,MAAM,qBAAqB,GAAI,iJAanC,0BAA0B,4CAsH5B,CAAC"}
|
|
@@ -1,107 +1,110 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { SearchMd as
|
|
4
|
-
import { ButtonUtility as
|
|
5
|
-
import
|
|
6
|
-
import { cx as
|
|
7
|
-
import { motion as
|
|
8
|
-
import { AnimatePresence as
|
|
9
|
-
const
|
|
10
|
-
size:
|
|
11
|
-
placeholder:
|
|
12
|
-
value:
|
|
13
|
-
onChange:
|
|
1
|
+
import { jsx as s } from "react/jsx-runtime";
|
|
2
|
+
import { useState as F, useRef as l, useEffect as u, useCallback as S } from "react";
|
|
3
|
+
import { SearchMd as L } from "@untitledui/icons";
|
|
4
|
+
import { ButtonUtility as T } from "../button/button-utility.js";
|
|
5
|
+
import _ from "./SearchInput.js";
|
|
6
|
+
import { cx as w } from "../../utils/cn.js";
|
|
7
|
+
import { motion as p } from "../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";
|
|
8
|
+
import { AnimatePresence as j } from "../../node_modules/framer-motion/dist/es/components/AnimatePresence/index.js";
|
|
9
|
+
const M = { sm: 36, md: 40, lg: 44 }, P = 300, X = ({
|
|
10
|
+
size: h = "sm",
|
|
11
|
+
placeholder: x,
|
|
12
|
+
value: d,
|
|
13
|
+
onChange: N,
|
|
14
14
|
onBlur: m,
|
|
15
|
-
onFocus:
|
|
16
|
-
onKeyDown:
|
|
17
|
-
className:
|
|
18
|
-
expandedWidth:
|
|
19
|
-
"aria-label":
|
|
15
|
+
onFocus: v,
|
|
16
|
+
onKeyDown: f,
|
|
17
|
+
className: k,
|
|
18
|
+
expandedWidth: C = P,
|
|
19
|
+
"aria-label": y,
|
|
20
|
+
collapsible: t = !0,
|
|
21
|
+
isDisabled: g = !1
|
|
20
22
|
}) => {
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
e
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
(n = s.current) != null && n.contains(i.target) || e || o(!1);
|
|
23
|
+
const n = !!(d != null && d.trim()), [q, a] = F(t ? n : !0), o = !t || q, c = l(null), E = l(t), A = M[h];
|
|
24
|
+
u(() => {
|
|
25
|
+
const e = E.current === !1;
|
|
26
|
+
E.current = t, !t || n ? a(!0) : e && t && a(!1);
|
|
27
|
+
}, [t, n]), u(() => {
|
|
28
|
+
var r;
|
|
29
|
+
if (!t || !o) return;
|
|
30
|
+
const e = (r = c.current) == null ? void 0 : r.querySelector("input");
|
|
31
|
+
if (!e) return;
|
|
32
|
+
const i = requestAnimationFrame(() => e.focus());
|
|
33
|
+
return () => cancelAnimationFrame(i);
|
|
34
|
+
}, [t, o]), u(() => {
|
|
35
|
+
if (!t || !o) return;
|
|
36
|
+
const e = (i) => {
|
|
37
|
+
var r;
|
|
38
|
+
(r = c.current) != null && r.contains(i.target) || n || a(!1);
|
|
38
39
|
};
|
|
39
|
-
return document.addEventListener("mousedown",
|
|
40
|
-
}, [
|
|
41
|
-
const
|
|
42
|
-
(
|
|
43
|
-
var
|
|
44
|
-
const i =
|
|
45
|
-
i && ((
|
|
40
|
+
return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
|
|
41
|
+
}, [t, o, n]);
|
|
42
|
+
const I = S(
|
|
43
|
+
(e) => {
|
|
44
|
+
var r;
|
|
45
|
+
const i = e.relatedTarget;
|
|
46
|
+
i && ((r = c.current) != null && r.contains(i)) || (t && !n && a(!1), m == null || m(e));
|
|
46
47
|
},
|
|
47
|
-
[m,
|
|
48
|
-
),
|
|
49
|
-
(
|
|
50
|
-
var i,
|
|
51
|
-
|
|
48
|
+
[m, n, t]
|
|
49
|
+
), R = S(
|
|
50
|
+
(e) => {
|
|
51
|
+
var i, r;
|
|
52
|
+
e.key === "Escape" && t && !n && (a(!1), (r = (i = c.current) == null ? void 0 : i.querySelector("button")) == null || r.focus()), f == null || f(e);
|
|
52
53
|
},
|
|
53
|
-
[
|
|
54
|
-
),
|
|
55
|
-
return /* @__PURE__ */
|
|
56
|
-
|
|
54
|
+
[f, n, t]
|
|
55
|
+
), W = { type: "spring", damping: 25, stiffness: 300 };
|
|
56
|
+
return /* @__PURE__ */ s(
|
|
57
|
+
p.div,
|
|
57
58
|
{
|
|
58
|
-
ref:
|
|
59
|
-
className:
|
|
60
|
-
onBlur:
|
|
61
|
-
animate: { width:
|
|
62
|
-
transition:
|
|
63
|
-
children: /* @__PURE__ */
|
|
64
|
-
|
|
59
|
+
ref: c,
|
|
60
|
+
className: w("flex items-center overflow-hidden", k),
|
|
61
|
+
onBlur: I,
|
|
62
|
+
animate: { width: o ? C : A },
|
|
63
|
+
transition: W,
|
|
64
|
+
children: /* @__PURE__ */ s(j, { initial: !1, mode: "popLayout", children: o ? /* @__PURE__ */ s(
|
|
65
|
+
p.div,
|
|
65
66
|
{
|
|
66
67
|
initial: { opacity: 0 },
|
|
67
68
|
animate: { opacity: 1 },
|
|
68
69
|
exit: { opacity: 0 },
|
|
69
70
|
transition: { duration: 0.08 },
|
|
70
71
|
className: "min-w-0 flex-1",
|
|
71
|
-
children: /* @__PURE__ */
|
|
72
|
-
|
|
72
|
+
children: /* @__PURE__ */ s(
|
|
73
|
+
_,
|
|
73
74
|
{
|
|
74
|
-
size:
|
|
75
|
-
placeholder:
|
|
76
|
-
value:
|
|
77
|
-
onChange:
|
|
78
|
-
onFocus:
|
|
79
|
-
onKeyDown:
|
|
75
|
+
size: h,
|
|
76
|
+
placeholder: x,
|
|
77
|
+
value: d,
|
|
78
|
+
onChange: N,
|
|
79
|
+
onFocus: v,
|
|
80
|
+
onKeyDown: R,
|
|
80
81
|
className: "w-full min-w-0",
|
|
81
|
-
"aria-label":
|
|
82
|
+
"aria-label": y,
|
|
83
|
+
isDisabled: g
|
|
82
84
|
}
|
|
83
85
|
)
|
|
84
86
|
},
|
|
85
87
|
"input"
|
|
86
|
-
) : /* @__PURE__ */
|
|
87
|
-
|
|
88
|
+
) : /* @__PURE__ */ s(
|
|
89
|
+
p.div,
|
|
88
90
|
{
|
|
89
91
|
initial: { opacity: 0 },
|
|
90
92
|
animate: { opacity: 1 },
|
|
91
93
|
exit: { opacity: 0 },
|
|
92
94
|
transition: { duration: 0.08 },
|
|
93
95
|
className: "flex flex-shrink-0",
|
|
94
|
-
children: /* @__PURE__ */
|
|
95
|
-
|
|
96
|
+
children: /* @__PURE__ */ s(
|
|
97
|
+
T,
|
|
96
98
|
{
|
|
97
|
-
icon:
|
|
99
|
+
icon: L,
|
|
98
100
|
size: "xs",
|
|
99
101
|
color: "tertiary",
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
102
|
+
isDisabled: g,
|
|
103
|
+
tooltip: y || x || "Search",
|
|
104
|
+
className: w(
|
|
105
|
+
n && "bg-brand_subtle text-brand-500 hover:text-brand-600 hover:bg-brand_subtle/80"
|
|
103
106
|
),
|
|
104
|
-
onClick: () =>
|
|
107
|
+
onClick: () => a(!0)
|
|
105
108
|
}
|
|
106
109
|
)
|
|
107
110
|
},
|
|
@@ -111,5 +114,5 @@ const L = { sm: 36, md: 40, lg: 44 }, R = 300, G = ({
|
|
|
111
114
|
);
|
|
112
115
|
};
|
|
113
116
|
export {
|
|
114
|
-
|
|
117
|
+
X as ExpandableSearchInput
|
|
115
118
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/shimmer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,OAAO,EAClB,WAAW,EACX,aAAa,EACb,UAAU,GACX,MAAM,WAAW,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
|
+
interface ShimmerProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
children?: ReactNode;
|
|
5
|
+
variant?: "default" | "wave" | "pulse";
|
|
6
|
+
}
|
|
7
|
+
declare const Shimmer: FC<ShimmerProps>;
|
|
8
|
+
export declare const ShimmerLine: FC<{
|
|
9
|
+
width?: string;
|
|
10
|
+
height?: string;
|
|
11
|
+
className?: string;
|
|
12
|
+
}>;
|
|
13
|
+
export declare const ShimmerCircle: FC<{
|
|
14
|
+
size?: string;
|
|
15
|
+
className?: string;
|
|
16
|
+
}>;
|
|
17
|
+
export declare const ShimmerBox: FC<{
|
|
18
|
+
width?: string;
|
|
19
|
+
height?: string;
|
|
20
|
+
className?: string;
|
|
21
|
+
rounded?: boolean;
|
|
22
|
+
}>;
|
|
23
|
+
export default Shimmer;
|
|
24
|
+
//# sourceMappingURL=shimmer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"shimmer.d.ts","sourceRoot":"","sources":["../../../src/primitives/shimmer/shimmer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG3C,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;CACxC;AAED,QAAA,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CAkB7B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAUnF,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC;IAAE,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CASnE,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CASA,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { jsxs as o, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import { cn as i } from "../../utils/cn.js";
|
|
3
|
+
const s = ({ className: e = "", children: r, variant: t = "default" }) => {
|
|
4
|
+
const a = () => {
|
|
5
|
+
switch (t) {
|
|
6
|
+
case "wave":
|
|
7
|
+
return "absolute inset-0 animate-[shimmer-wave_2s_infinite] bg-gradient-to-r from-transparent via-white/80 to-transparent";
|
|
8
|
+
case "pulse":
|
|
9
|
+
return "absolute inset-0 animate-pulse bg-secondary/50";
|
|
10
|
+
default:
|
|
11
|
+
return "absolute inset-0 -translate-x-full animate-[shimmer_2s_infinite] bg-gradient-to-r from-transparent via-white/60 to-transparent";
|
|
12
|
+
}
|
|
13
|
+
};
|
|
14
|
+
return /* @__PURE__ */ o("div", { className: i("relative overflow-hidden", e), children: [
|
|
15
|
+
/* @__PURE__ */ n("div", { className: a() }),
|
|
16
|
+
r
|
|
17
|
+
] });
|
|
18
|
+
}, m = ({
|
|
19
|
+
width: e = "100%",
|
|
20
|
+
height: r = "16px",
|
|
21
|
+
className: t = ""
|
|
22
|
+
}) => /* @__PURE__ */ n(s, { className: t, children: /* @__PURE__ */ n("div", { className: i("rounded bg-secondary", t), style: { width: e, height: r } }) }), u = ({
|
|
23
|
+
size: e = "40px",
|
|
24
|
+
className: r = ""
|
|
25
|
+
}) => /* @__PURE__ */ n(s, { className: r, children: /* @__PURE__ */ n("div", { className: i("rounded-full bg-secondary", r), style: { width: e, height: e } }) }), c = ({ width: e = "100%", height: r = "100px", className: t = "", rounded: a = !0 }) => /* @__PURE__ */ n(s, { className: t, children: /* @__PURE__ */ n(
|
|
26
|
+
"div",
|
|
27
|
+
{
|
|
28
|
+
className: i("bg-secondary", a && "rounded", t),
|
|
29
|
+
style: { width: e, height: r }
|
|
30
|
+
}
|
|
31
|
+
) });
|
|
32
|
+
export {
|
|
33
|
+
c as ShimmerBox,
|
|
34
|
+
u as ShimmerCircle,
|
|
35
|
+
m as ShimmerLine,
|
|
36
|
+
s as default
|
|
37
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export type EllipsisContentWithTooltipProps = {
|
|
2
|
+
content: string;
|
|
3
|
+
className?: string;
|
|
4
|
+
link?: boolean;
|
|
5
|
+
tooltipPosition?: "start" | "center" | "end";
|
|
6
|
+
tooltipSide?: "above" | "below";
|
|
7
|
+
textClassName?: string;
|
|
8
|
+
tooltipClassName?: string;
|
|
9
|
+
};
|
|
10
|
+
export declare const EllipsisContentWithTooltip: ({ content, className, link, textClassName, tooltipClassName, }: EllipsisContentWithTooltipProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare const createEllipsisContent: (content: string, className?: string, link?: boolean, tooltipPosition?: "start" | "center" | "end", tooltipSide?: "above" | "below", placeholder?: string, textClassName?: string, tooltipClassName?: string) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
//# sourceMappingURL=ellipsis-content.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ellipsis-content.d.ts","sourceRoot":"","sources":["../../../src/primitives/tooltip/ellipsis-content.tsx"],"names":[],"mappings":"AAWA,MAAM,MAAM,+BAA+B,GAAG;IAC5C,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC7C,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IAChC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,0BAA0B,GAAI,gEAMxC,+BAA+B,4CA4HjC,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAChC,SAAS,MAAM,EACf,YAAW,MAAW,EACtB,OAAO,OAAO,EACd,kBAAiB,OAAO,GAAG,QAAQ,GAAG,KAAe,EACrD,cAAc,OAAO,GAAG,OAAO,EAC/B,cAAc,MAAM,EACpB,gBAAgB,MAAM,EACtB,mBAAmB,MAAM,4CAmB1B,CAAC"}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import { jsxs as v, Fragment as y, jsx as u } from "react/jsx-runtime";
|
|
2
|
+
import { useState as w, useRef as x, useEffect as b } from "react";
|
|
3
|
+
import { createPortal as P } from "react-dom";
|
|
4
|
+
import { computePosition as M, offset as $, autoPlacement as E, size as R, shift as W } from "../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
|
|
5
|
+
import { cx as T } from "../../utils/cn.js";
|
|
6
|
+
const j = ({
|
|
7
|
+
content: e,
|
|
8
|
+
className: c = "",
|
|
9
|
+
link: f = !1,
|
|
10
|
+
textClassName: m = "",
|
|
11
|
+
tooltipClassName: h = ""
|
|
12
|
+
}) => {
|
|
13
|
+
const [i, a] = w(!1), [p, g] = w({ top: -9999, left: -9999 }), o = x(null), s = x(null), n = x(null);
|
|
14
|
+
return b(() => () => {
|
|
15
|
+
n.current != null && clearTimeout(n.current);
|
|
16
|
+
}, []), b(() => {
|
|
17
|
+
if (!i || !o.current || !s.current) return;
|
|
18
|
+
let t = !1;
|
|
19
|
+
return M(o.current, s.current, {
|
|
20
|
+
middleware: [
|
|
21
|
+
$(8),
|
|
22
|
+
E({
|
|
23
|
+
allowedPlacements: [
|
|
24
|
+
"top-start",
|
|
25
|
+
"top",
|
|
26
|
+
"top-end",
|
|
27
|
+
"bottom-start",
|
|
28
|
+
"bottom",
|
|
29
|
+
"bottom-end"
|
|
30
|
+
]
|
|
31
|
+
}),
|
|
32
|
+
R({
|
|
33
|
+
padding: 8,
|
|
34
|
+
apply({ availableWidth: r, availableHeight: l, elements: d }) {
|
|
35
|
+
Object.assign(d.floating.style, {
|
|
36
|
+
maxWidth: `${Math.min(r, 512)}px`,
|
|
37
|
+
maxHeight: `${Math.min(l, window.innerHeight * 0.4)}px`
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
}),
|
|
41
|
+
W({ padding: 8 })
|
|
42
|
+
]
|
|
43
|
+
}).then(({ x: r, y: l }) => {
|
|
44
|
+
t || g({ top: l, left: r });
|
|
45
|
+
}), () => {
|
|
46
|
+
t = !0;
|
|
47
|
+
};
|
|
48
|
+
}, [i]), /* @__PURE__ */ v(y, { children: [
|
|
49
|
+
/* @__PURE__ */ u(
|
|
50
|
+
"span",
|
|
51
|
+
{
|
|
52
|
+
ref: o,
|
|
53
|
+
className: T(
|
|
54
|
+
"whitespace-nowrap overflow-hidden text-ellipsis w-full block",
|
|
55
|
+
m,
|
|
56
|
+
c,
|
|
57
|
+
f ? "!text-[var(--color-brand-600)]" : ""
|
|
58
|
+
),
|
|
59
|
+
onMouseEnter: () => {
|
|
60
|
+
!o.current || !(o.current.scrollWidth > o.current.clientWidth) || (g({ top: -9999, left: -9999 }), a(!0));
|
|
61
|
+
},
|
|
62
|
+
onMouseLeave: (t) => {
|
|
63
|
+
var r;
|
|
64
|
+
(r = s.current) != null && r.contains(t.relatedTarget) || (n.current != null && clearTimeout(n.current), n.current = setTimeout(() => {
|
|
65
|
+
var l, d;
|
|
66
|
+
n.current = null, !((l = s.current) != null && l.matches(":hover")) && !((d = o.current) != null && d.matches(":hover")) && a(!1);
|
|
67
|
+
}, 100));
|
|
68
|
+
},
|
|
69
|
+
children: f ? /* @__PURE__ */ u("a", { href: e, target: "_blank", rel: "noopener noreferrer", children: e }) : e
|
|
70
|
+
}
|
|
71
|
+
),
|
|
72
|
+
i && P(
|
|
73
|
+
/* @__PURE__ */ u(
|
|
74
|
+
"div",
|
|
75
|
+
{
|
|
76
|
+
"data-react-aria-top-layer": "true",
|
|
77
|
+
role: "tooltip",
|
|
78
|
+
ref: s,
|
|
79
|
+
className: T(
|
|
80
|
+
"fixed px-3 py-2 text-xs font-semibold text-white bg-primary-solid rounded-lg shadow-lg z-[9999] max-w-lg max-h-[40vh] overflow-y-auto break-words whitespace-normal",
|
|
81
|
+
h
|
|
82
|
+
),
|
|
83
|
+
style: {
|
|
84
|
+
top: `${p.top}px`,
|
|
85
|
+
left: `${p.left}px`
|
|
86
|
+
},
|
|
87
|
+
onClick: (t) => t.stopPropagation(),
|
|
88
|
+
onMouseLeave: (t) => {
|
|
89
|
+
var r;
|
|
90
|
+
(r = o.current) != null && r.contains(t.relatedTarget) || a(!1);
|
|
91
|
+
},
|
|
92
|
+
children: e
|
|
93
|
+
}
|
|
94
|
+
),
|
|
95
|
+
document.body
|
|
96
|
+
)
|
|
97
|
+
] });
|
|
98
|
+
}, N = (e, c = "", f, m = "start", h, i, a, p) => e === "" || e === "-" ? /* @__PURE__ */ u("span", { className: `text-left ${c}`, children: e || i || "-" }) : /* @__PURE__ */ u(
|
|
99
|
+
j,
|
|
100
|
+
{
|
|
101
|
+
content: e,
|
|
102
|
+
className: c,
|
|
103
|
+
link: f,
|
|
104
|
+
tooltipPosition: m,
|
|
105
|
+
tooltipSide: h,
|
|
106
|
+
textClassName: a,
|
|
107
|
+
tooltipClassName: p
|
|
108
|
+
}
|
|
109
|
+
);
|
|
110
|
+
export {
|
|
111
|
+
j as EllipsisContentWithTooltip,
|
|
112
|
+
N as createEllipsisContent
|
|
113
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,EACP,KAAK,YAAY,EACjB,cAAc,EACd,KAAK,mBAAmB,GACzB,MAAM,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/primitives/tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,EACP,KAAK,YAAY,EACjB,cAAc,EACd,KAAK,mBAAmB,GACzB,MAAM,WAAW,CAAC;AACnB,OAAO,EACL,0BAA0B,EAC1B,qBAAqB,EACrB,KAAK,+BAA+B,GACrC,MAAM,oBAAoB,CAAC"}
|