sherick-ui 1.0.0 → 1.0.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/README.md +25 -29
- package/dist/index.cjs.js +83 -149
- package/dist/index.esm.js +83 -149
- package/package.json +6 -4
- package/dist/index.d.css +0 -2
- package/dist/index.d.css.map +0 -1
package/README.md
CHANGED
|
@@ -1,36 +1,32 @@
|
|
|
1
|
-
|
|
1
|
+
# Sherick UI
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Sherick UI is a collection of UI components for React inspired by Material Design. This package provides a suite of reusable components aimed at enhancing the development of user interfaces in React applications.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## Components
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
npm run dev
|
|
9
|
-
# or
|
|
10
|
-
yarn dev
|
|
11
|
-
# or
|
|
12
|
-
pnpm dev
|
|
13
|
-
# or
|
|
14
|
-
bun dev
|
|
15
|
-
```
|
|
16
|
-
|
|
17
|
-
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
|
18
|
-
|
|
19
|
-
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
|
|
20
|
-
|
|
21
|
-
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
|
|
7
|
+
The package includes the following components:
|
|
22
8
|
|
|
23
|
-
|
|
9
|
+
- **ActionButton**: A versatile button component for user interactions.
|
|
10
|
+
- **Avatar**: A component for displaying user profile pictures or icons.
|
|
11
|
+
- **Badge**: A badge component for displaying count or status.
|
|
12
|
+
- **Card**: A card component to group related content.
|
|
13
|
+
- **Dropdown**: A dropdown menu for selecting options.
|
|
14
|
+
- **Search**: A search input component.
|
|
15
|
+
- **Input**: A standard input field for forms.
|
|
16
|
+
- **Textarea**: A multi-line input field.
|
|
17
|
+
- **Tooltip**: A component for displaying hover tooltips.
|
|
18
|
+
- **Modal**: A modal dialog for displaying content over the application.
|
|
19
|
+
- **Spinner**: A loading spinner to indicate ongoing processes.
|
|
20
|
+
- **Markdown**: A component for rendering Markdown content.
|
|
21
|
+
- **Alert**: A notification or alert message component.
|
|
22
|
+
- **Skeleton**: A placeholder loading component.
|
|
23
|
+
- **Switch**: A toggle switch component.
|
|
24
|
+
- **TabGroup**: A component for tab navigation.
|
|
25
|
+
- **Table**: A table component for displaying data.
|
|
24
26
|
|
|
25
|
-
|
|
27
|
+
## Installation
|
|
26
28
|
|
|
27
|
-
|
|
28
|
-
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
|
29
|
+
You can install the package via npm:
|
|
29
30
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
## Deploy on Vercel
|
|
33
|
-
|
|
34
|
-
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
|
35
|
-
|
|
36
|
-
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
|
|
31
|
+
```bash
|
|
32
|
+
npm install sherick-ui
|
package/dist/index.cjs.js
CHANGED
|
@@ -61,14 +61,14 @@ function _objectWithoutProperties(e, t) {
|
|
|
61
61
|
if (null == e) return {};
|
|
62
62
|
var o,
|
|
63
63
|
r,
|
|
64
|
-
i = _objectWithoutPropertiesLoose
|
|
64
|
+
i = _objectWithoutPropertiesLoose(e, t);
|
|
65
65
|
if (Object.getOwnPropertySymbols) {
|
|
66
66
|
var s = Object.getOwnPropertySymbols(e);
|
|
67
67
|
for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
68
68
|
}
|
|
69
69
|
return i;
|
|
70
70
|
}
|
|
71
|
-
function _objectWithoutPropertiesLoose
|
|
71
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
72
72
|
if (null == r) return {};
|
|
73
73
|
var t = {};
|
|
74
74
|
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
@@ -2792,6 +2792,18 @@ const Check = createLucideIcon("Check", [["path", { d: "M20 6 9 17l-5-5", key: "
|
|
|
2792
2792
|
*/
|
|
2793
2793
|
|
|
2794
2794
|
|
|
2795
|
+
const ChevronDown = createLucideIcon("ChevronDown", [
|
|
2796
|
+
["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]
|
|
2797
|
+
]);
|
|
2798
|
+
|
|
2799
|
+
/**
|
|
2800
|
+
* @license lucide-react v0.390.0 - ISC
|
|
2801
|
+
*
|
|
2802
|
+
* This source code is licensed under the ISC license.
|
|
2803
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
2804
|
+
*/
|
|
2805
|
+
|
|
2806
|
+
|
|
2795
2807
|
const CircleAlert = createLucideIcon("CircleAlert", [
|
|
2796
2808
|
["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
|
|
2797
2809
|
["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
|
|
@@ -2872,6 +2884,19 @@ const LoaderCircle = createLucideIcon("LoaderCircle", [
|
|
|
2872
2884
|
*/
|
|
2873
2885
|
|
|
2874
2886
|
|
|
2887
|
+
const Search$1 = createLucideIcon("Search", [
|
|
2888
|
+
["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
|
|
2889
|
+
["path", { d: "m21 21-4.3-4.3", key: "1qie3q" }]
|
|
2890
|
+
]);
|
|
2891
|
+
|
|
2892
|
+
/**
|
|
2893
|
+
* @license lucide-react v0.390.0 - ISC
|
|
2894
|
+
*
|
|
2895
|
+
* This source code is licensed under the ISC license.
|
|
2896
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
2897
|
+
*/
|
|
2898
|
+
|
|
2899
|
+
|
|
2875
2900
|
const X = createLucideIcon("X", [
|
|
2876
2901
|
["path", { d: "M18 6 6 18", key: "1bl5f8" }],
|
|
2877
2902
|
["path", { d: "m6 6 12 12", key: "d8bk6v" }]
|
|
@@ -2900,11 +2925,11 @@ var loaderVariants = cva("animate-spin text-primary", {
|
|
|
2900
2925
|
size: "medium"
|
|
2901
2926
|
}
|
|
2902
2927
|
});
|
|
2903
|
-
function Spinner(
|
|
2904
|
-
var size =
|
|
2905
|
-
show =
|
|
2906
|
-
children =
|
|
2907
|
-
className =
|
|
2928
|
+
function Spinner(_ref) {
|
|
2929
|
+
var size = _ref.size,
|
|
2930
|
+
show = _ref.show,
|
|
2931
|
+
children = _ref.children,
|
|
2932
|
+
className = _ref.className;
|
|
2908
2933
|
return /*#__PURE__*/React$1.createElement("span", {
|
|
2909
2934
|
className: spinnerVariants({
|
|
2910
2935
|
show: show
|
|
@@ -2916,7 +2941,7 @@ function Spinner(_a) {
|
|
|
2916
2941
|
}), children);
|
|
2917
2942
|
}
|
|
2918
2943
|
|
|
2919
|
-
var _excluded$
|
|
2944
|
+
var _excluded$a = ["children", "variant", "icon", "className", "loading", "onClick"];
|
|
2920
2945
|
var ActionButton = function ActionButton(_ref) {
|
|
2921
2946
|
var children = _ref.children,
|
|
2922
2947
|
_ref$variant = _ref.variant,
|
|
@@ -2926,7 +2951,7 @@ var ActionButton = function ActionButton(_ref) {
|
|
|
2926
2951
|
_ref$loading = _ref.loading,
|
|
2927
2952
|
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
2928
2953
|
onClick = _ref.onClick,
|
|
2929
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
2954
|
+
props = _objectWithoutProperties(_ref, _excluded$a);
|
|
2930
2955
|
return /*#__PURE__*/React.createElement("button", _extends({}, props, {
|
|
2931
2956
|
className: cn("px-6 py-4 rounded-4xl bg-opacity-20 hover:bg-opacity-40 transition-all flex items-center justify-center", (styleMap$2 === null || styleMap$2 === void 0 ? void 0 : styleMap$2[variant]) || styleMap$2["primary"], loading ? "cursor-not-allowed opacity-60" : "cursor-pointer", className),
|
|
2932
2957
|
onClick: onClick
|
|
@@ -2938,66 +2963,7 @@ var ActionButton = function ActionButton(_ref) {
|
|
|
2938
2963
|
}) : null, children);
|
|
2939
2964
|
};
|
|
2940
2965
|
|
|
2941
|
-
|
|
2942
|
-
if (source == null) return {};
|
|
2943
|
-
var target = {};
|
|
2944
|
-
var sourceKeys = Object.keys(source);
|
|
2945
|
-
var key, i;
|
|
2946
|
-
|
|
2947
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
2948
|
-
key = sourceKeys[i];
|
|
2949
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
2950
|
-
target[key] = source[key];
|
|
2951
|
-
}
|
|
2952
|
-
|
|
2953
|
-
return target;
|
|
2954
|
-
}
|
|
2955
|
-
|
|
2956
|
-
var _excluded$W = ["color"];
|
|
2957
|
-
var ChevronDownIcon = /*#__PURE__*/React$1.forwardRef(function (_ref, forwardedRef) {
|
|
2958
|
-
var _ref$color = _ref.color,
|
|
2959
|
-
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2960
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$W);
|
|
2961
|
-
|
|
2962
|
-
return React$1.createElement("svg", Object.assign({
|
|
2963
|
-
width: "15",
|
|
2964
|
-
height: "15",
|
|
2965
|
-
viewBox: "0 0 15 15",
|
|
2966
|
-
fill: "none",
|
|
2967
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
2968
|
-
}, props, {
|
|
2969
|
-
ref: forwardedRef
|
|
2970
|
-
}), React$1.createElement("path", {
|
|
2971
|
-
d: "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
|
|
2972
|
-
fill: color,
|
|
2973
|
-
fillRule: "evenodd",
|
|
2974
|
-
clipRule: "evenodd"
|
|
2975
|
-
}));
|
|
2976
|
-
});
|
|
2977
|
-
|
|
2978
|
-
var _excluded$33 = ["color"];
|
|
2979
|
-
var MagnifyingGlassIcon = /*#__PURE__*/React$1.forwardRef(function (_ref, forwardedRef) {
|
|
2980
|
-
var _ref$color = _ref.color,
|
|
2981
|
-
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2982
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$33);
|
|
2983
|
-
|
|
2984
|
-
return React$1.createElement("svg", Object.assign({
|
|
2985
|
-
width: "15",
|
|
2986
|
-
height: "15",
|
|
2987
|
-
viewBox: "0 0 15 15",
|
|
2988
|
-
fill: "none",
|
|
2989
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
2990
|
-
}, props, {
|
|
2991
|
-
ref: forwardedRef
|
|
2992
|
-
}), React$1.createElement("path", {
|
|
2993
|
-
d: "M10 6.5C10 8.433 8.433 10 6.5 10C4.567 10 3 8.433 3 6.5C3 4.567 4.567 3 6.5 3C8.433 3 10 4.567 10 6.5ZM9.30884 10.0159C8.53901 10.6318 7.56251 11 6.5 11C4.01472 11 2 8.98528 2 6.5C2 4.01472 4.01472 2 6.5 2C8.98528 2 11 4.01472 11 6.5C11 7.56251 10.6318 8.53901 10.0159 9.30884L12.8536 12.1464C13.0488 12.3417 13.0488 12.6583 12.8536 12.8536C12.6583 13.0488 12.3417 13.0488 12.1464 12.8536L9.30884 10.0159Z",
|
|
2994
|
-
fill: color,
|
|
2995
|
-
fillRule: "evenodd",
|
|
2996
|
-
clipRule: "evenodd"
|
|
2997
|
-
}));
|
|
2998
|
-
});
|
|
2999
|
-
|
|
3000
|
-
var _excluded$8 = ["options", "variant", "onSelect", "selected", "className"];
|
|
2966
|
+
var _excluded$9 = ["options", "variant", "onSelect", "selected", "className"];
|
|
3001
2967
|
var Dropdown = function Dropdown(_ref) {
|
|
3002
2968
|
var options = _ref.options,
|
|
3003
2969
|
_ref$variant = _ref.variant,
|
|
@@ -3005,7 +2971,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
3005
2971
|
onSelect = _ref.onSelect,
|
|
3006
2972
|
selected = _ref.selected,
|
|
3007
2973
|
className = _ref.className,
|
|
3008
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
2974
|
+
props = _objectWithoutProperties(_ref, _excluded$9);
|
|
3009
2975
|
var _useState = React$1.useState(false),
|
|
3010
2976
|
_useState2 = _slicedToArray(_useState, 2),
|
|
3011
2977
|
isOpen = _useState2[0],
|
|
@@ -3029,7 +2995,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
3029
2995
|
onClick: function onClick() {
|
|
3030
2996
|
return setIsOpen(!isOpen);
|
|
3031
2997
|
}
|
|
3032
|
-
}, selected || "Select an option", /*#__PURE__*/React.createElement(
|
|
2998
|
+
}, selected || "Select an option", /*#__PURE__*/React.createElement(ChevronDown, {
|
|
3033
2999
|
className: cn("w-5 h-5 ml-2", isOpen ? "transform rotate-180" : "")
|
|
3034
3000
|
})), isOpen && /*#__PURE__*/React.createElement("div", {
|
|
3035
3001
|
className: cn("absolute z-30 backdrop-blur-lg w-full p-2 mt-2 origin-top-right rounded-3xl bg-opacity-20 shadow-lg ring-1 ring-black ring-opacity-5 border border-opacity-30", (bgMap === null || bgMap === void 0 ? void 0 : bgMap[variant]) || bgMap["primary"]),
|
|
@@ -3059,7 +3025,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
3059
3025
|
}));
|
|
3060
3026
|
};
|
|
3061
3027
|
|
|
3062
|
-
var _excluded$
|
|
3028
|
+
var _excluded$8 = ["onSearch", "variant", "className", "loading"];
|
|
3063
3029
|
var _this = undefined;
|
|
3064
3030
|
var Search = function Search(_ref) {
|
|
3065
3031
|
var onSearch = _ref.onSearch,
|
|
@@ -3068,7 +3034,7 @@ var Search = function Search(_ref) {
|
|
|
3068
3034
|
className = _ref.className,
|
|
3069
3035
|
_ref$loading = _ref.loading,
|
|
3070
3036
|
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
3071
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
3037
|
+
props = _objectWithoutProperties(_ref, _excluded$8);
|
|
3072
3038
|
var inputRef = React$1.useRef(null);
|
|
3073
3039
|
var debounce = function debounce(func, delay) {
|
|
3074
3040
|
var timer;
|
|
@@ -3102,12 +3068,12 @@ var Search = function Search(_ref) {
|
|
|
3102
3068
|
className: cn("absolute right-0 px-4 py-4 rounded-4xl bg-gray-400 bg-opacity-0 hover:bg-opacity-10 transition-all", loading ? "cursor-not-allowed opacity-60" : "cursor-pointer")
|
|
3103
3069
|
}, loading ? /*#__PURE__*/React.createElement(Spinner, {
|
|
3104
3070
|
className: "w-6 h-6"
|
|
3105
|
-
}) : /*#__PURE__*/React.createElement(
|
|
3071
|
+
}) : /*#__PURE__*/React.createElement(Search$1, {
|
|
3106
3072
|
className: "w-6 h-6"
|
|
3107
3073
|
})));
|
|
3108
3074
|
};
|
|
3109
3075
|
|
|
3110
|
-
var _excluded$
|
|
3076
|
+
var _excluded$7 = ["placeholder", "label", "onChange", "defaultValue", "className", "required", "error"];
|
|
3111
3077
|
var Input = function Input(_ref) {
|
|
3112
3078
|
var placeholder = _ref.placeholder,
|
|
3113
3079
|
label = _ref.label,
|
|
@@ -3116,7 +3082,7 @@ var Input = function Input(_ref) {
|
|
|
3116
3082
|
className = _ref.className,
|
|
3117
3083
|
required = _ref.required,
|
|
3118
3084
|
error = _ref.error,
|
|
3119
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
3085
|
+
props = _objectWithoutProperties(_ref, _excluded$7);
|
|
3120
3086
|
var _useState = React$1.useState(defaultValue || ""),
|
|
3121
3087
|
_useState2 = _slicedToArray(_useState, 2),
|
|
3122
3088
|
value = _useState2[0],
|
|
@@ -4759,7 +4725,7 @@ function requireImage () {
|
|
|
4759
4725
|
var imageExports = requireImage();
|
|
4760
4726
|
var NextImage = /*@__PURE__*/getDefaultExportFromCjs(imageExports);
|
|
4761
4727
|
|
|
4762
|
-
var _excluded$
|
|
4728
|
+
var _excluded$6 = ["src", "alt", "size", "className"];
|
|
4763
4729
|
var sizeMap = {
|
|
4764
4730
|
sm: {
|
|
4765
4731
|
element: 32,
|
|
@@ -4781,7 +4747,7 @@ var Avatar = function Avatar(_ref) {
|
|
|
4781
4747
|
_ref$size = _ref.size,
|
|
4782
4748
|
size = _ref$size === void 0 ? "md" : _ref$size,
|
|
4783
4749
|
className = _ref.className,
|
|
4784
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4750
|
+
props = _objectWithoutProperties(_ref, _excluded$6);
|
|
4785
4751
|
return /*#__PURE__*/React.createElement("div", {
|
|
4786
4752
|
className: cn("rounded-4xl overflow-hidden", ((_sizeMap$size = sizeMap[size]) === null || _sizeMap$size === void 0 ? void 0 : _sizeMap$size.styles) || ((_sizeMap$md = sizeMap["md"]) === null || _sizeMap$md === void 0 ? void 0 : _sizeMap$md.styles), className)
|
|
4787
4753
|
}, /*#__PURE__*/React.createElement(NextImage, _extends({
|
|
@@ -4793,7 +4759,7 @@ var Avatar = function Avatar(_ref) {
|
|
|
4793
4759
|
}, props)));
|
|
4794
4760
|
};
|
|
4795
4761
|
|
|
4796
|
-
var _excluded$
|
|
4762
|
+
var _excluded$5 = ["placeholder", "label", "onChange", "defaultValue", "className", "required", "error"];
|
|
4797
4763
|
var Textarea = function Textarea(_ref) {
|
|
4798
4764
|
var placeholder = _ref.placeholder,
|
|
4799
4765
|
label = _ref.label,
|
|
@@ -4802,7 +4768,7 @@ var Textarea = function Textarea(_ref) {
|
|
|
4802
4768
|
className = _ref.className,
|
|
4803
4769
|
required = _ref.required,
|
|
4804
4770
|
error = _ref.error,
|
|
4805
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4771
|
+
props = _objectWithoutProperties(_ref, _excluded$5);
|
|
4806
4772
|
var textareaRef = React$1.useRef(null);
|
|
4807
4773
|
React$1.useEffect(function () {
|
|
4808
4774
|
if (defaultValue && textareaRef.current) textareaRef.current.value = defaultValue;
|
|
@@ -4823,12 +4789,12 @@ var Textarea = function Textarea(_ref) {
|
|
|
4823
4789
|
}));
|
|
4824
4790
|
};
|
|
4825
4791
|
|
|
4826
|
-
var _excluded$
|
|
4792
|
+
var _excluded$4 = ["children", "content", "className"];
|
|
4827
4793
|
var Tooltip = function Tooltip(_ref) {
|
|
4828
4794
|
var children = _ref.children,
|
|
4829
4795
|
content = _ref.content,
|
|
4830
4796
|
className = _ref.className,
|
|
4831
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4797
|
+
props = _objectWithoutProperties(_ref, _excluded$4);
|
|
4832
4798
|
var id = React$1.useId();
|
|
4833
4799
|
var _useState = React$1.useState(false),
|
|
4834
4800
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -4858,25 +4824,25 @@ var Tooltip = function Tooltip(_ref) {
|
|
|
4858
4824
|
}, content));
|
|
4859
4825
|
};
|
|
4860
4826
|
|
|
4861
|
-
var ModalContent = function ModalContent(
|
|
4862
|
-
var children =
|
|
4863
|
-
className =
|
|
4827
|
+
var ModalContent = function ModalContent(_ref) {
|
|
4828
|
+
var children = _ref.children,
|
|
4829
|
+
className = _ref.className;
|
|
4864
4830
|
return /*#__PURE__*/React.createElement("div", {
|
|
4865
4831
|
className: cn("px-6 py-4 text-gray-300", className)
|
|
4866
4832
|
}, children);
|
|
4867
4833
|
};
|
|
4868
4834
|
|
|
4869
|
-
var ModalFooter = function ModalFooter(
|
|
4870
|
-
var children =
|
|
4871
|
-
className =
|
|
4835
|
+
var ModalFooter = function ModalFooter(_ref) {
|
|
4836
|
+
var children = _ref.children,
|
|
4837
|
+
className = _ref.className;
|
|
4872
4838
|
return /*#__PURE__*/React.createElement("div", {
|
|
4873
4839
|
className: cn("px-6 py-4 mt-auto", "border-t border-gray-700/50", "flex items-center justify-end gap-3", className)
|
|
4874
4840
|
}, children);
|
|
4875
4841
|
};
|
|
4876
4842
|
|
|
4877
|
-
var ModalHeader = function ModalHeader(
|
|
4878
|
-
var children =
|
|
4879
|
-
className =
|
|
4843
|
+
var ModalHeader = function ModalHeader(_ref) {
|
|
4844
|
+
var children = _ref.children,
|
|
4845
|
+
className = _ref.className;
|
|
4880
4846
|
return /*#__PURE__*/React.createElement("div", {
|
|
4881
4847
|
className: cn("px-6 pt-6 pb-4", className)
|
|
4882
4848
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -4884,30 +4850,31 @@ var ModalHeader = function ModalHeader(_a) {
|
|
|
4884
4850
|
}, children));
|
|
4885
4851
|
};
|
|
4886
4852
|
|
|
4887
|
-
function Modal(
|
|
4888
|
-
var children =
|
|
4889
|
-
open =
|
|
4890
|
-
onClose =
|
|
4891
|
-
className =
|
|
4853
|
+
function Modal(_ref) {
|
|
4854
|
+
var children = _ref.children,
|
|
4855
|
+
open = _ref.open,
|
|
4856
|
+
onClose = _ref.onClose,
|
|
4857
|
+
className = _ref.className;
|
|
4892
4858
|
var modalRef = React$1.useRef(null);
|
|
4893
4859
|
var previouslyFocusedElement = React$1.useRef(null);
|
|
4894
4860
|
React$1.useEffect(function () {
|
|
4895
|
-
var _a;
|
|
4896
4861
|
if (open) {
|
|
4862
|
+
var _modalRef$current;
|
|
4897
4863
|
previouslyFocusedElement.current = document.activeElement;
|
|
4898
4864
|
document.body.style.overflow = "hidden";
|
|
4899
|
-
var
|
|
4865
|
+
var handleKeyDown = function handleKeyDown(event) {
|
|
4900
4866
|
if (event.key === "Escape") {
|
|
4901
4867
|
onClose();
|
|
4902
4868
|
}
|
|
4903
4869
|
};
|
|
4904
|
-
document.addEventListener("keydown",
|
|
4905
|
-
(
|
|
4870
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
4871
|
+
(_modalRef$current = modalRef.current) === null || _modalRef$current === void 0 || _modalRef$current.focus(); // Ensure the modal gets focus.
|
|
4872
|
+
|
|
4906
4873
|
return function () {
|
|
4907
|
-
var
|
|
4908
|
-
document.removeEventListener("keydown",
|
|
4874
|
+
var _previouslyFocusedEle;
|
|
4875
|
+
document.removeEventListener("keydown", handleKeyDown);
|
|
4909
4876
|
document.body.style.overflow = "unset";
|
|
4910
|
-
(
|
|
4877
|
+
(_previouslyFocusedEle = previouslyFocusedElement.current) === null || _previouslyFocusedEle === void 0 || _previouslyFocusedEle.focus(); // Restore focus.
|
|
4911
4878
|
};
|
|
4912
4879
|
}
|
|
4913
4880
|
}, [open, onClose]);
|
|
@@ -4946,14 +4913,14 @@ Modal.Header = ModalHeader;
|
|
|
4946
4913
|
Modal.Content = ModalContent;
|
|
4947
4914
|
Modal.Footer = ModalFooter;
|
|
4948
4915
|
|
|
4949
|
-
var _excluded$
|
|
4916
|
+
var _excluded$3 = ["children", "variant", "icon", "className"];
|
|
4950
4917
|
var Badge = function Badge(_ref) {
|
|
4951
4918
|
var children = _ref.children,
|
|
4952
4919
|
_ref$variant = _ref.variant,
|
|
4953
4920
|
variant = _ref$variant === void 0 ? "primary" : _ref$variant,
|
|
4954
4921
|
icon = _ref.icon,
|
|
4955
4922
|
className = _ref.className,
|
|
4956
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4923
|
+
props = _objectWithoutProperties(_ref, _excluded$3);
|
|
4957
4924
|
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
4958
4925
|
className: cn("px-2 py-2 rounded-4xl bg-opacity-20 hover:bg-opacity-40 transition-all flex items-center justify-center text-xs font-semibold", className, (styleMap$2 === null || styleMap$2 === void 0 ? void 0 : styleMap$2[variant]) || styleMap$2["primary"])
|
|
4959
4926
|
}), icon && /*#__PURE__*/React.createElement("span", {
|
|
@@ -4961,40 +4928,6 @@ var Badge = function Badge(_ref) {
|
|
|
4961
4928
|
}, icon), children);
|
|
4962
4929
|
};
|
|
4963
4930
|
|
|
4964
|
-
/******************************************************************************
|
|
4965
|
-
Copyright (c) Microsoft Corporation.
|
|
4966
|
-
|
|
4967
|
-
Permission to use, copy, modify, and/or distribute this software for any
|
|
4968
|
-
purpose with or without fee is hereby granted.
|
|
4969
|
-
|
|
4970
|
-
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
4971
|
-
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
4972
|
-
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
4973
|
-
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
4974
|
-
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
4975
|
-
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
4976
|
-
PERFORMANCE OF THIS SOFTWARE.
|
|
4977
|
-
***************************************************************************** */
|
|
4978
|
-
/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
|
|
4979
|
-
|
|
4980
|
-
|
|
4981
|
-
function __rest(s, e) {
|
|
4982
|
-
var t = {};
|
|
4983
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4984
|
-
t[p] = s[p];
|
|
4985
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
4986
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
4987
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
4988
|
-
t[p[i]] = s[p[i]];
|
|
4989
|
-
}
|
|
4990
|
-
return t;
|
|
4991
|
-
}
|
|
4992
|
-
|
|
4993
|
-
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
|
4994
|
-
var e = new Error(message);
|
|
4995
|
-
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
4996
|
-
};
|
|
4997
|
-
|
|
4998
4931
|
function ok$1() {}
|
|
4999
4932
|
|
|
5000
4933
|
function unreachable() {}
|
|
@@ -69035,13 +68968,13 @@ var theme = {
|
|
|
69035
68968
|
}]
|
|
69036
68969
|
};
|
|
69037
68970
|
|
|
69038
|
-
var _excluded$
|
|
68971
|
+
var _excluded$2 = ["inline", "className", "language", "children"];
|
|
69039
68972
|
var CodeBlock = function CodeBlock(_ref) {
|
|
69040
68973
|
var inline = _ref.inline;
|
|
69041
68974
|
_ref.className;
|
|
69042
68975
|
var language = _ref.language,
|
|
69043
68976
|
children = _ref.children,
|
|
69044
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
68977
|
+
rest = _objectWithoutProperties(_ref, _excluded$2);
|
|
69045
68978
|
var _useState = React$1.useState(false),
|
|
69046
68979
|
_useState2 = _slicedToArray(_useState, 2),
|
|
69047
68980
|
copied = _useState2[0],
|
|
@@ -69109,16 +69042,17 @@ var CodeBlock = function CodeBlock(_ref) {
|
|
|
69109
69042
|
}));
|
|
69110
69043
|
};
|
|
69111
69044
|
|
|
69112
|
-
var
|
|
69113
|
-
|
|
69045
|
+
var _excluded$1 = ["node", "inline", "className", "children"];
|
|
69046
|
+
var Markdown = function Markdown(_ref) {
|
|
69047
|
+
var children = _ref.children;
|
|
69114
69048
|
return /*#__PURE__*/React.createElement(Markdown$1, {
|
|
69115
69049
|
components: {
|
|
69116
|
-
code: function code(
|
|
69117
|
-
|
|
69118
|
-
var inline =
|
|
69119
|
-
className =
|
|
69120
|
-
children =
|
|
69121
|
-
|
|
69050
|
+
code: function code(_ref2) {
|
|
69051
|
+
_ref2.node;
|
|
69052
|
+
var inline = _ref2.inline,
|
|
69053
|
+
className = _ref2.className,
|
|
69054
|
+
children = _ref2.children;
|
|
69055
|
+
_objectWithoutProperties(_ref2, _excluded$1);
|
|
69122
69056
|
var match = /language-(\w+)/.exec(className || "");
|
|
69123
69057
|
return /*#__PURE__*/React.createElement(CodeBlock, {
|
|
69124
69058
|
inline: inline,
|
package/dist/index.esm.js
CHANGED
|
@@ -59,14 +59,14 @@ function _objectWithoutProperties(e, t) {
|
|
|
59
59
|
if (null == e) return {};
|
|
60
60
|
var o,
|
|
61
61
|
r,
|
|
62
|
-
i = _objectWithoutPropertiesLoose
|
|
62
|
+
i = _objectWithoutPropertiesLoose(e, t);
|
|
63
63
|
if (Object.getOwnPropertySymbols) {
|
|
64
64
|
var s = Object.getOwnPropertySymbols(e);
|
|
65
65
|
for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
66
66
|
}
|
|
67
67
|
return i;
|
|
68
68
|
}
|
|
69
|
-
function _objectWithoutPropertiesLoose
|
|
69
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
70
70
|
if (null == r) return {};
|
|
71
71
|
var t = {};
|
|
72
72
|
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
@@ -2790,6 +2790,18 @@ const Check = createLucideIcon("Check", [["path", { d: "M20 6 9 17l-5-5", key: "
|
|
|
2790
2790
|
*/
|
|
2791
2791
|
|
|
2792
2792
|
|
|
2793
|
+
const ChevronDown = createLucideIcon("ChevronDown", [
|
|
2794
|
+
["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]
|
|
2795
|
+
]);
|
|
2796
|
+
|
|
2797
|
+
/**
|
|
2798
|
+
* @license lucide-react v0.390.0 - ISC
|
|
2799
|
+
*
|
|
2800
|
+
* This source code is licensed under the ISC license.
|
|
2801
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
2802
|
+
*/
|
|
2803
|
+
|
|
2804
|
+
|
|
2793
2805
|
const CircleAlert = createLucideIcon("CircleAlert", [
|
|
2794
2806
|
["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
|
|
2795
2807
|
["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
|
|
@@ -2870,6 +2882,19 @@ const LoaderCircle = createLucideIcon("LoaderCircle", [
|
|
|
2870
2882
|
*/
|
|
2871
2883
|
|
|
2872
2884
|
|
|
2885
|
+
const Search$1 = createLucideIcon("Search", [
|
|
2886
|
+
["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }],
|
|
2887
|
+
["path", { d: "m21 21-4.3-4.3", key: "1qie3q" }]
|
|
2888
|
+
]);
|
|
2889
|
+
|
|
2890
|
+
/**
|
|
2891
|
+
* @license lucide-react v0.390.0 - ISC
|
|
2892
|
+
*
|
|
2893
|
+
* This source code is licensed under the ISC license.
|
|
2894
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
2895
|
+
*/
|
|
2896
|
+
|
|
2897
|
+
|
|
2873
2898
|
const X = createLucideIcon("X", [
|
|
2874
2899
|
["path", { d: "M18 6 6 18", key: "1bl5f8" }],
|
|
2875
2900
|
["path", { d: "m6 6 12 12", key: "d8bk6v" }]
|
|
@@ -2898,11 +2923,11 @@ var loaderVariants = cva("animate-spin text-primary", {
|
|
|
2898
2923
|
size: "medium"
|
|
2899
2924
|
}
|
|
2900
2925
|
});
|
|
2901
|
-
function Spinner(
|
|
2902
|
-
var size =
|
|
2903
|
-
show =
|
|
2904
|
-
children =
|
|
2905
|
-
className =
|
|
2926
|
+
function Spinner(_ref) {
|
|
2927
|
+
var size = _ref.size,
|
|
2928
|
+
show = _ref.show,
|
|
2929
|
+
children = _ref.children,
|
|
2930
|
+
className = _ref.className;
|
|
2906
2931
|
return /*#__PURE__*/React$1.createElement("span", {
|
|
2907
2932
|
className: spinnerVariants({
|
|
2908
2933
|
show: show
|
|
@@ -2914,7 +2939,7 @@ function Spinner(_a) {
|
|
|
2914
2939
|
}), children);
|
|
2915
2940
|
}
|
|
2916
2941
|
|
|
2917
|
-
var _excluded$
|
|
2942
|
+
var _excluded$a = ["children", "variant", "icon", "className", "loading", "onClick"];
|
|
2918
2943
|
var ActionButton = function ActionButton(_ref) {
|
|
2919
2944
|
var children = _ref.children,
|
|
2920
2945
|
_ref$variant = _ref.variant,
|
|
@@ -2924,7 +2949,7 @@ var ActionButton = function ActionButton(_ref) {
|
|
|
2924
2949
|
_ref$loading = _ref.loading,
|
|
2925
2950
|
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
2926
2951
|
onClick = _ref.onClick,
|
|
2927
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
2952
|
+
props = _objectWithoutProperties(_ref, _excluded$a);
|
|
2928
2953
|
return /*#__PURE__*/React.createElement("button", _extends({}, props, {
|
|
2929
2954
|
className: cn("px-6 py-4 rounded-4xl bg-opacity-20 hover:bg-opacity-40 transition-all flex items-center justify-center", (styleMap$2 === null || styleMap$2 === void 0 ? void 0 : styleMap$2[variant]) || styleMap$2["primary"], loading ? "cursor-not-allowed opacity-60" : "cursor-pointer", className),
|
|
2930
2955
|
onClick: onClick
|
|
@@ -2936,66 +2961,7 @@ var ActionButton = function ActionButton(_ref) {
|
|
|
2936
2961
|
}) : null, children);
|
|
2937
2962
|
};
|
|
2938
2963
|
|
|
2939
|
-
|
|
2940
|
-
if (source == null) return {};
|
|
2941
|
-
var target = {};
|
|
2942
|
-
var sourceKeys = Object.keys(source);
|
|
2943
|
-
var key, i;
|
|
2944
|
-
|
|
2945
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
2946
|
-
key = sourceKeys[i];
|
|
2947
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
2948
|
-
target[key] = source[key];
|
|
2949
|
-
}
|
|
2950
|
-
|
|
2951
|
-
return target;
|
|
2952
|
-
}
|
|
2953
|
-
|
|
2954
|
-
var _excluded$W = ["color"];
|
|
2955
|
-
var ChevronDownIcon = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
|
|
2956
|
-
var _ref$color = _ref.color,
|
|
2957
|
-
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2958
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$W);
|
|
2959
|
-
|
|
2960
|
-
return createElement("svg", Object.assign({
|
|
2961
|
-
width: "15",
|
|
2962
|
-
height: "15",
|
|
2963
|
-
viewBox: "0 0 15 15",
|
|
2964
|
-
fill: "none",
|
|
2965
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
2966
|
-
}, props, {
|
|
2967
|
-
ref: forwardedRef
|
|
2968
|
-
}), createElement("path", {
|
|
2969
|
-
d: "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
|
|
2970
|
-
fill: color,
|
|
2971
|
-
fillRule: "evenodd",
|
|
2972
|
-
clipRule: "evenodd"
|
|
2973
|
-
}));
|
|
2974
|
-
});
|
|
2975
|
-
|
|
2976
|
-
var _excluded$33 = ["color"];
|
|
2977
|
-
var MagnifyingGlassIcon = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
|
|
2978
|
-
var _ref$color = _ref.color,
|
|
2979
|
-
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2980
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$33);
|
|
2981
|
-
|
|
2982
|
-
return createElement("svg", Object.assign({
|
|
2983
|
-
width: "15",
|
|
2984
|
-
height: "15",
|
|
2985
|
-
viewBox: "0 0 15 15",
|
|
2986
|
-
fill: "none",
|
|
2987
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
2988
|
-
}, props, {
|
|
2989
|
-
ref: forwardedRef
|
|
2990
|
-
}), createElement("path", {
|
|
2991
|
-
d: "M10 6.5C10 8.433 8.433 10 6.5 10C4.567 10 3 8.433 3 6.5C3 4.567 4.567 3 6.5 3C8.433 3 10 4.567 10 6.5ZM9.30884 10.0159C8.53901 10.6318 7.56251 11 6.5 11C4.01472 11 2 8.98528 2 6.5C2 4.01472 4.01472 2 6.5 2C8.98528 2 11 4.01472 11 6.5C11 7.56251 10.6318 8.53901 10.0159 9.30884L12.8536 12.1464C13.0488 12.3417 13.0488 12.6583 12.8536 12.8536C12.6583 13.0488 12.3417 13.0488 12.1464 12.8536L9.30884 10.0159Z",
|
|
2992
|
-
fill: color,
|
|
2993
|
-
fillRule: "evenodd",
|
|
2994
|
-
clipRule: "evenodd"
|
|
2995
|
-
}));
|
|
2996
|
-
});
|
|
2997
|
-
|
|
2998
|
-
var _excluded$8 = ["options", "variant", "onSelect", "selected", "className"];
|
|
2964
|
+
var _excluded$9 = ["options", "variant", "onSelect", "selected", "className"];
|
|
2999
2965
|
var Dropdown = function Dropdown(_ref) {
|
|
3000
2966
|
var options = _ref.options,
|
|
3001
2967
|
_ref$variant = _ref.variant,
|
|
@@ -3003,7 +2969,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
3003
2969
|
onSelect = _ref.onSelect,
|
|
3004
2970
|
selected = _ref.selected,
|
|
3005
2971
|
className = _ref.className,
|
|
3006
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
2972
|
+
props = _objectWithoutProperties(_ref, _excluded$9);
|
|
3007
2973
|
var _useState = useState(false),
|
|
3008
2974
|
_useState2 = _slicedToArray(_useState, 2),
|
|
3009
2975
|
isOpen = _useState2[0],
|
|
@@ -3027,7 +2993,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
3027
2993
|
onClick: function onClick() {
|
|
3028
2994
|
return setIsOpen(!isOpen);
|
|
3029
2995
|
}
|
|
3030
|
-
}, selected || "Select an option", /*#__PURE__*/React.createElement(
|
|
2996
|
+
}, selected || "Select an option", /*#__PURE__*/React.createElement(ChevronDown, {
|
|
3031
2997
|
className: cn("w-5 h-5 ml-2", isOpen ? "transform rotate-180" : "")
|
|
3032
2998
|
})), isOpen && /*#__PURE__*/React.createElement("div", {
|
|
3033
2999
|
className: cn("absolute z-30 backdrop-blur-lg w-full p-2 mt-2 origin-top-right rounded-3xl bg-opacity-20 shadow-lg ring-1 ring-black ring-opacity-5 border border-opacity-30", (bgMap === null || bgMap === void 0 ? void 0 : bgMap[variant]) || bgMap["primary"]),
|
|
@@ -3057,7 +3023,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
3057
3023
|
}));
|
|
3058
3024
|
};
|
|
3059
3025
|
|
|
3060
|
-
var _excluded$
|
|
3026
|
+
var _excluded$8 = ["onSearch", "variant", "className", "loading"];
|
|
3061
3027
|
var _this = undefined;
|
|
3062
3028
|
var Search = function Search(_ref) {
|
|
3063
3029
|
var onSearch = _ref.onSearch,
|
|
@@ -3066,7 +3032,7 @@ var Search = function Search(_ref) {
|
|
|
3066
3032
|
className = _ref.className,
|
|
3067
3033
|
_ref$loading = _ref.loading,
|
|
3068
3034
|
loading = _ref$loading === void 0 ? false : _ref$loading,
|
|
3069
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
3035
|
+
props = _objectWithoutProperties(_ref, _excluded$8);
|
|
3070
3036
|
var inputRef = useRef(null);
|
|
3071
3037
|
var debounce = function debounce(func, delay) {
|
|
3072
3038
|
var timer;
|
|
@@ -3100,12 +3066,12 @@ var Search = function Search(_ref) {
|
|
|
3100
3066
|
className: cn("absolute right-0 px-4 py-4 rounded-4xl bg-gray-400 bg-opacity-0 hover:bg-opacity-10 transition-all", loading ? "cursor-not-allowed opacity-60" : "cursor-pointer")
|
|
3101
3067
|
}, loading ? /*#__PURE__*/React.createElement(Spinner, {
|
|
3102
3068
|
className: "w-6 h-6"
|
|
3103
|
-
}) : /*#__PURE__*/React.createElement(
|
|
3069
|
+
}) : /*#__PURE__*/React.createElement(Search$1, {
|
|
3104
3070
|
className: "w-6 h-6"
|
|
3105
3071
|
})));
|
|
3106
3072
|
};
|
|
3107
3073
|
|
|
3108
|
-
var _excluded$
|
|
3074
|
+
var _excluded$7 = ["placeholder", "label", "onChange", "defaultValue", "className", "required", "error"];
|
|
3109
3075
|
var Input = function Input(_ref) {
|
|
3110
3076
|
var placeholder = _ref.placeholder,
|
|
3111
3077
|
label = _ref.label,
|
|
@@ -3114,7 +3080,7 @@ var Input = function Input(_ref) {
|
|
|
3114
3080
|
className = _ref.className,
|
|
3115
3081
|
required = _ref.required,
|
|
3116
3082
|
error = _ref.error,
|
|
3117
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
3083
|
+
props = _objectWithoutProperties(_ref, _excluded$7);
|
|
3118
3084
|
var _useState = useState(defaultValue || ""),
|
|
3119
3085
|
_useState2 = _slicedToArray(_useState, 2),
|
|
3120
3086
|
value = _useState2[0],
|
|
@@ -4757,7 +4723,7 @@ function requireImage () {
|
|
|
4757
4723
|
var imageExports = requireImage();
|
|
4758
4724
|
var NextImage = /*@__PURE__*/getDefaultExportFromCjs(imageExports);
|
|
4759
4725
|
|
|
4760
|
-
var _excluded$
|
|
4726
|
+
var _excluded$6 = ["src", "alt", "size", "className"];
|
|
4761
4727
|
var sizeMap = {
|
|
4762
4728
|
sm: {
|
|
4763
4729
|
element: 32,
|
|
@@ -4779,7 +4745,7 @@ var Avatar = function Avatar(_ref) {
|
|
|
4779
4745
|
_ref$size = _ref.size,
|
|
4780
4746
|
size = _ref$size === void 0 ? "md" : _ref$size,
|
|
4781
4747
|
className = _ref.className,
|
|
4782
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4748
|
+
props = _objectWithoutProperties(_ref, _excluded$6);
|
|
4783
4749
|
return /*#__PURE__*/React.createElement("div", {
|
|
4784
4750
|
className: cn("rounded-4xl overflow-hidden", ((_sizeMap$size = sizeMap[size]) === null || _sizeMap$size === void 0 ? void 0 : _sizeMap$size.styles) || ((_sizeMap$md = sizeMap["md"]) === null || _sizeMap$md === void 0 ? void 0 : _sizeMap$md.styles), className)
|
|
4785
4751
|
}, /*#__PURE__*/React.createElement(NextImage, _extends({
|
|
@@ -4791,7 +4757,7 @@ var Avatar = function Avatar(_ref) {
|
|
|
4791
4757
|
}, props)));
|
|
4792
4758
|
};
|
|
4793
4759
|
|
|
4794
|
-
var _excluded$
|
|
4760
|
+
var _excluded$5 = ["placeholder", "label", "onChange", "defaultValue", "className", "required", "error"];
|
|
4795
4761
|
var Textarea = function Textarea(_ref) {
|
|
4796
4762
|
var placeholder = _ref.placeholder,
|
|
4797
4763
|
label = _ref.label,
|
|
@@ -4800,7 +4766,7 @@ var Textarea = function Textarea(_ref) {
|
|
|
4800
4766
|
className = _ref.className,
|
|
4801
4767
|
required = _ref.required,
|
|
4802
4768
|
error = _ref.error,
|
|
4803
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4769
|
+
props = _objectWithoutProperties(_ref, _excluded$5);
|
|
4804
4770
|
var textareaRef = useRef(null);
|
|
4805
4771
|
useEffect(function () {
|
|
4806
4772
|
if (defaultValue && textareaRef.current) textareaRef.current.value = defaultValue;
|
|
@@ -4821,12 +4787,12 @@ var Textarea = function Textarea(_ref) {
|
|
|
4821
4787
|
}));
|
|
4822
4788
|
};
|
|
4823
4789
|
|
|
4824
|
-
var _excluded$
|
|
4790
|
+
var _excluded$4 = ["children", "content", "className"];
|
|
4825
4791
|
var Tooltip = function Tooltip(_ref) {
|
|
4826
4792
|
var children = _ref.children,
|
|
4827
4793
|
content = _ref.content,
|
|
4828
4794
|
className = _ref.className,
|
|
4829
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4795
|
+
props = _objectWithoutProperties(_ref, _excluded$4);
|
|
4830
4796
|
var id = useId();
|
|
4831
4797
|
var _useState = useState(false),
|
|
4832
4798
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -4856,25 +4822,25 @@ var Tooltip = function Tooltip(_ref) {
|
|
|
4856
4822
|
}, content));
|
|
4857
4823
|
};
|
|
4858
4824
|
|
|
4859
|
-
var ModalContent = function ModalContent(
|
|
4860
|
-
var children =
|
|
4861
|
-
className =
|
|
4825
|
+
var ModalContent = function ModalContent(_ref) {
|
|
4826
|
+
var children = _ref.children,
|
|
4827
|
+
className = _ref.className;
|
|
4862
4828
|
return /*#__PURE__*/React.createElement("div", {
|
|
4863
4829
|
className: cn("px-6 py-4 text-gray-300", className)
|
|
4864
4830
|
}, children);
|
|
4865
4831
|
};
|
|
4866
4832
|
|
|
4867
|
-
var ModalFooter = function ModalFooter(
|
|
4868
|
-
var children =
|
|
4869
|
-
className =
|
|
4833
|
+
var ModalFooter = function ModalFooter(_ref) {
|
|
4834
|
+
var children = _ref.children,
|
|
4835
|
+
className = _ref.className;
|
|
4870
4836
|
return /*#__PURE__*/React.createElement("div", {
|
|
4871
4837
|
className: cn("px-6 py-4 mt-auto", "border-t border-gray-700/50", "flex items-center justify-end gap-3", className)
|
|
4872
4838
|
}, children);
|
|
4873
4839
|
};
|
|
4874
4840
|
|
|
4875
|
-
var ModalHeader = function ModalHeader(
|
|
4876
|
-
var children =
|
|
4877
|
-
className =
|
|
4841
|
+
var ModalHeader = function ModalHeader(_ref) {
|
|
4842
|
+
var children = _ref.children,
|
|
4843
|
+
className = _ref.className;
|
|
4878
4844
|
return /*#__PURE__*/React.createElement("div", {
|
|
4879
4845
|
className: cn("px-6 pt-6 pb-4", className)
|
|
4880
4846
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -4882,30 +4848,31 @@ var ModalHeader = function ModalHeader(_a) {
|
|
|
4882
4848
|
}, children));
|
|
4883
4849
|
};
|
|
4884
4850
|
|
|
4885
|
-
function Modal(
|
|
4886
|
-
var children =
|
|
4887
|
-
open =
|
|
4888
|
-
onClose =
|
|
4889
|
-
className =
|
|
4851
|
+
function Modal(_ref) {
|
|
4852
|
+
var children = _ref.children,
|
|
4853
|
+
open = _ref.open,
|
|
4854
|
+
onClose = _ref.onClose,
|
|
4855
|
+
className = _ref.className;
|
|
4890
4856
|
var modalRef = useRef(null);
|
|
4891
4857
|
var previouslyFocusedElement = useRef(null);
|
|
4892
4858
|
useEffect(function () {
|
|
4893
|
-
var _a;
|
|
4894
4859
|
if (open) {
|
|
4860
|
+
var _modalRef$current;
|
|
4895
4861
|
previouslyFocusedElement.current = document.activeElement;
|
|
4896
4862
|
document.body.style.overflow = "hidden";
|
|
4897
|
-
var
|
|
4863
|
+
var handleKeyDown = function handleKeyDown(event) {
|
|
4898
4864
|
if (event.key === "Escape") {
|
|
4899
4865
|
onClose();
|
|
4900
4866
|
}
|
|
4901
4867
|
};
|
|
4902
|
-
document.addEventListener("keydown",
|
|
4903
|
-
(
|
|
4868
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
4869
|
+
(_modalRef$current = modalRef.current) === null || _modalRef$current === void 0 || _modalRef$current.focus(); // Ensure the modal gets focus.
|
|
4870
|
+
|
|
4904
4871
|
return function () {
|
|
4905
|
-
var
|
|
4906
|
-
document.removeEventListener("keydown",
|
|
4872
|
+
var _previouslyFocusedEle;
|
|
4873
|
+
document.removeEventListener("keydown", handleKeyDown);
|
|
4907
4874
|
document.body.style.overflow = "unset";
|
|
4908
|
-
(
|
|
4875
|
+
(_previouslyFocusedEle = previouslyFocusedElement.current) === null || _previouslyFocusedEle === void 0 || _previouslyFocusedEle.focus(); // Restore focus.
|
|
4909
4876
|
};
|
|
4910
4877
|
}
|
|
4911
4878
|
}, [open, onClose]);
|
|
@@ -4944,14 +4911,14 @@ Modal.Header = ModalHeader;
|
|
|
4944
4911
|
Modal.Content = ModalContent;
|
|
4945
4912
|
Modal.Footer = ModalFooter;
|
|
4946
4913
|
|
|
4947
|
-
var _excluded$
|
|
4914
|
+
var _excluded$3 = ["children", "variant", "icon", "className"];
|
|
4948
4915
|
var Badge = function Badge(_ref) {
|
|
4949
4916
|
var children = _ref.children,
|
|
4950
4917
|
_ref$variant = _ref.variant,
|
|
4951
4918
|
variant = _ref$variant === void 0 ? "primary" : _ref$variant,
|
|
4952
4919
|
icon = _ref.icon,
|
|
4953
4920
|
className = _ref.className,
|
|
4954
|
-
props = _objectWithoutProperties(_ref, _excluded$
|
|
4921
|
+
props = _objectWithoutProperties(_ref, _excluded$3);
|
|
4955
4922
|
return /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
|
4956
4923
|
className: cn("px-2 py-2 rounded-4xl bg-opacity-20 hover:bg-opacity-40 transition-all flex items-center justify-center text-xs font-semibold", className, (styleMap$2 === null || styleMap$2 === void 0 ? void 0 : styleMap$2[variant]) || styleMap$2["primary"])
|
|
4957
4924
|
}), icon && /*#__PURE__*/React.createElement("span", {
|
|
@@ -4959,40 +4926,6 @@ var Badge = function Badge(_ref) {
|
|
|
4959
4926
|
}, icon), children);
|
|
4960
4927
|
};
|
|
4961
4928
|
|
|
4962
|
-
/******************************************************************************
|
|
4963
|
-
Copyright (c) Microsoft Corporation.
|
|
4964
|
-
|
|
4965
|
-
Permission to use, copy, modify, and/or distribute this software for any
|
|
4966
|
-
purpose with or without fee is hereby granted.
|
|
4967
|
-
|
|
4968
|
-
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
4969
|
-
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
4970
|
-
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
4971
|
-
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
4972
|
-
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
4973
|
-
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
4974
|
-
PERFORMANCE OF THIS SOFTWARE.
|
|
4975
|
-
***************************************************************************** */
|
|
4976
|
-
/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
|
|
4977
|
-
|
|
4978
|
-
|
|
4979
|
-
function __rest(s, e) {
|
|
4980
|
-
var t = {};
|
|
4981
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4982
|
-
t[p] = s[p];
|
|
4983
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
4984
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
4985
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
4986
|
-
t[p[i]] = s[p[i]];
|
|
4987
|
-
}
|
|
4988
|
-
return t;
|
|
4989
|
-
}
|
|
4990
|
-
|
|
4991
|
-
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
|
4992
|
-
var e = new Error(message);
|
|
4993
|
-
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
4994
|
-
};
|
|
4995
|
-
|
|
4996
4929
|
function ok$1() {}
|
|
4997
4930
|
|
|
4998
4931
|
function unreachable() {}
|
|
@@ -69033,13 +68966,13 @@ var theme = {
|
|
|
69033
68966
|
}]
|
|
69034
68967
|
};
|
|
69035
68968
|
|
|
69036
|
-
var _excluded$
|
|
68969
|
+
var _excluded$2 = ["inline", "className", "language", "children"];
|
|
69037
68970
|
var CodeBlock = function CodeBlock(_ref) {
|
|
69038
68971
|
var inline = _ref.inline;
|
|
69039
68972
|
_ref.className;
|
|
69040
68973
|
var language = _ref.language,
|
|
69041
68974
|
children = _ref.children,
|
|
69042
|
-
rest = _objectWithoutProperties(_ref, _excluded$
|
|
68975
|
+
rest = _objectWithoutProperties(_ref, _excluded$2);
|
|
69043
68976
|
var _useState = useState(false),
|
|
69044
68977
|
_useState2 = _slicedToArray(_useState, 2),
|
|
69045
68978
|
copied = _useState2[0],
|
|
@@ -69107,16 +69040,17 @@ var CodeBlock = function CodeBlock(_ref) {
|
|
|
69107
69040
|
}));
|
|
69108
69041
|
};
|
|
69109
69042
|
|
|
69110
|
-
var
|
|
69111
|
-
|
|
69043
|
+
var _excluded$1 = ["node", "inline", "className", "children"];
|
|
69044
|
+
var Markdown = function Markdown(_ref) {
|
|
69045
|
+
var children = _ref.children;
|
|
69112
69046
|
return /*#__PURE__*/React.createElement(Markdown$1, {
|
|
69113
69047
|
components: {
|
|
69114
|
-
code: function code(
|
|
69115
|
-
|
|
69116
|
-
var inline =
|
|
69117
|
-
className =
|
|
69118
|
-
children =
|
|
69119
|
-
|
|
69048
|
+
code: function code(_ref2) {
|
|
69049
|
+
_ref2.node;
|
|
69050
|
+
var inline = _ref2.inline,
|
|
69051
|
+
className = _ref2.className,
|
|
69052
|
+
children = _ref2.children;
|
|
69053
|
+
_objectWithoutProperties(_ref2, _excluded$1);
|
|
69120
69054
|
var match = /language-(\w+)/.exec(className || "");
|
|
69121
69055
|
return /*#__PURE__*/React.createElement(CodeBlock, {
|
|
69122
69056
|
inline: inline,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sherick-ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "A collection of UI components for React inspired by Material Design.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -9,6 +9,9 @@
|
|
|
9
9
|
"material",
|
|
10
10
|
"design"
|
|
11
11
|
],
|
|
12
|
+
"publishConfig": {
|
|
13
|
+
"access": "public"
|
|
14
|
+
},
|
|
12
15
|
"main": "dist/index.cjs.js",
|
|
13
16
|
"module": "dist/index.esm.js",
|
|
14
17
|
"types": "dist/index.d.ts",
|
|
@@ -19,7 +22,6 @@
|
|
|
19
22
|
],
|
|
20
23
|
"license": "MIT",
|
|
21
24
|
"dependencies": {
|
|
22
|
-
"@radix-ui/react-icons": "^1.3.0",
|
|
23
25
|
"class-variance-authority": "^0.7.0",
|
|
24
26
|
"clsx": "^2.1.1",
|
|
25
27
|
"lucide-react": "^0.390.0",
|
|
@@ -30,8 +32,7 @@
|
|
|
30
32
|
"rehype-katex": "^7.0.0",
|
|
31
33
|
"remark-gfm": "^4.0.0",
|
|
32
34
|
"remark-math": "^6.0.0",
|
|
33
|
-
"tailwind-merge": "^2.3.0"
|
|
34
|
-
"tslib": "^2.8.1"
|
|
35
|
+
"tailwind-merge": "^2.3.0"
|
|
35
36
|
},
|
|
36
37
|
"devDependencies": {
|
|
37
38
|
"@babel/cli": "^7.26.4",
|
|
@@ -57,6 +58,7 @@
|
|
|
57
58
|
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
58
59
|
"rollup-plugin-postcss": "^4.0.2",
|
|
59
60
|
"tailwindcss": "^3.4.1",
|
|
61
|
+
"tslib": "^2.8.1",
|
|
60
62
|
"typescript": "^5"
|
|
61
63
|
},
|
|
62
64
|
"peerDependencies": {
|
package/dist/index.d.css
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
code[class*=language-],pre[class*=language-]{word-wrap:normal;background:none;color:#ccc;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-size:1em;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;text-align:left;white-space:pre;word-break:normal;word-spacing:normal}pre[class*=language-]{margin:.5em 0;overflow:auto;padding:1em}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{border-radius:.3em;padding:.1em;white-space:normal}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#999}.token.punctuation{color:#ccc}.token.attr-name,.token.deleted,.token.namespace,.token.tag{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.function,.token.number{color:#f08d49}.token.class-name,.token.constant,.token.property,.token.symbol{color:#f8c555}.token.atrule,.token.builtin,.token.important,.token.keyword,.token.selector{color:#cc99cd}.token.attr-value,.token.char,.token.regex,.token.string,.token.variable{color:#7ec699}.token.entity,.token.operator,.token.url{color:#67cdcc}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}
|
|
2
|
-
/*# sourceMappingURL=index.d.css.map */
|
package/dist/index.d.css.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["prism-tomorrow.css"],"names":[],"mappings":"AAMA,6CAUC,gBAAiB,CAPjB,eAAgB,CADhB,UAAW,CAEX,6DAAsE,CACtE,aAAc,CAYd,oBAAqB,CACrB,iBAAkB,CAClB,gBAAiB,CACjB,YAAa,CATb,eAAgB,CAEhB,eAAgB,CAChB,aAAc,CACd,UAAW,CATX,eAAgB,CAChB,eAAgB,CAEhB,iBAAkB,CADlB,mBAcD,CAGA,sBAEC,aAAc,CACd,aAAc,CAFd,WAGD,CAEA,uDAEC,kBACD,CAGA,iCAEC,kBAAmB,CADnB,YAAa,CAEb,kBACD,CAEA,8EAKC,UACD,CAEA,mBACC,UACD,CAEA,4DAIC,aACD,CAEA,qBACC,aACD,CAEA,6CAGC,aACD,CAEA,gEAIC,aACD,CAEA,6EAKC,aACD,CAEA,yEAKC,aACD,CAEA,yCAGC,aACD,CAEA,6BAEC,eACD,CACA,cACC,iBACD,CAEA,cACC,WACD,CAEA,gBACC,WACD","file":"index.d.css","sourcesContent":["/**\n * prism.js tomorrow night eighties for JavaScript, CoffeeScript, CSS and HTML\n * Based on https://github.com/chriskempson/tomorrow-theme\n * @author Rose Pritchard\n */\n\ncode[class*=\"language-\"],\npre[class*=\"language-\"] {\n\tcolor: #ccc;\n\tbackground: none;\n\tfont-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n\tfont-size: 1em;\n\ttext-align: left;\n\twhite-space: pre;\n\tword-spacing: normal;\n\tword-break: normal;\n\tword-wrap: normal;\n\tline-height: 1.5;\n\n\t-moz-tab-size: 4;\n\t-o-tab-size: 4;\n\ttab-size: 4;\n\n\t-webkit-hyphens: none;\n\t-moz-hyphens: none;\n\t-ms-hyphens: none;\n\thyphens: none;\n\n}\n\n/* Code blocks */\npre[class*=\"language-\"] {\n\tpadding: 1em;\n\tmargin: .5em 0;\n\toverflow: auto;\n}\n\n:not(pre) > code[class*=\"language-\"],\npre[class*=\"language-\"] {\n\tbackground: #2d2d2d;\n}\n\n/* Inline code */\n:not(pre) > code[class*=\"language-\"] {\n\tpadding: .1em;\n\tborder-radius: .3em;\n\twhite-space: normal;\n}\n\n.token.comment,\n.token.block-comment,\n.token.prolog,\n.token.doctype,\n.token.cdata {\n\tcolor: #999;\n}\n\n.token.punctuation {\n\tcolor: #ccc;\n}\n\n.token.tag,\n.token.attr-name,\n.token.namespace,\n.token.deleted {\n\tcolor: #e2777a;\n}\n\n.token.function-name {\n\tcolor: #6196cc;\n}\n\n.token.boolean,\n.token.number,\n.token.function {\n\tcolor: #f08d49;\n}\n\n.token.property,\n.token.class-name,\n.token.constant,\n.token.symbol {\n\tcolor: #f8c555;\n}\n\n.token.selector,\n.token.important,\n.token.atrule,\n.token.keyword,\n.token.builtin {\n\tcolor: #cc99cd;\n}\n\n.token.string,\n.token.char,\n.token.attr-value,\n.token.regex,\n.token.variable {\n\tcolor: #7ec699;\n}\n\n.token.operator,\n.token.entity,\n.token.url {\n\tcolor: #67cdcc;\n}\n\n.token.important,\n.token.bold {\n\tfont-weight: bold;\n}\n.token.italic {\n\tfont-style: italic;\n}\n\n.token.entity {\n\tcursor: help;\n}\n\n.token.inserted {\n\tcolor: green;\n}\n"]}
|