@yamada-ui/status 1.0.1-next-20241124062938

Sign up to get free protection for your applications and to get access to all the features.
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2023 Hirotomo Yamada
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,22 @@
1
+ # @yamada-ui/status
2
+
3
+ ## Installation
4
+
5
+ ```sh
6
+ pnpm add @yamada-ui/status
7
+ # or
8
+ yarn add @yamada-ui/status
9
+ # or
10
+ npm install @yamada-ui/status
11
+ # or
12
+ bun add @yamada-ui/status
13
+ ```
14
+
15
+ ## Contribution
16
+
17
+ Wouldn't you like to contribute? That's amazing! We have prepared a [contribution guide](https://github.com/yamada-ui/yamada-ui/blob/main/CONTRIBUTING.md) to assist you.
18
+
19
+ ## License
20
+
21
+ This package is licensed under the terms of the
22
+ [MIT license](https://github.com/yamada-ui/yamada-ui/blob/main/LICENSE).
@@ -0,0 +1,71 @@
1
+ "use client"
2
+
3
+ // src/status.tsx
4
+ import {
5
+ forwardRef,
6
+ omitThemeProps,
7
+ ui,
8
+ useComponentMultiStyle,
9
+ useTheme
10
+ } from "@yamada-ui/core";
11
+ import { cx } from "@yamada-ui/utils";
12
+ import { jsx, jsxs } from "react/jsx-runtime";
13
+ var defaultStatuses = {
14
+ error: { colorScheme: "danger" },
15
+ info: { colorScheme: "info" },
16
+ success: { colorScheme: "success" },
17
+ warning: { colorScheme: "warning" }
18
+ };
19
+ var getStatusColorScheme = (status, statuses) => {
20
+ var _a, _b;
21
+ return (_b = (_a = statuses == null ? void 0 : statuses[status]) == null ? void 0 : _a.colorScheme) != null ? _b : defaultStatuses[status].colorScheme;
22
+ };
23
+ var Status = forwardRef(
24
+ ({ colorScheme, value = "info", indicatorProps, labelProps, ...props }, ref) => {
25
+ var _a, _b, _c;
26
+ const { theme } = useTheme();
27
+ const statuses = (_c = (_b = (_a = theme.__config) == null ? void 0 : _a.status) == null ? void 0 : _b.statuses) != null ? _c : {};
28
+ colorScheme != null ? colorScheme : colorScheme = getStatusColorScheme(value, statuses);
29
+ const [styles, mergedProps] = useComponentMultiStyle("Status", {
30
+ ...props,
31
+ colorScheme
32
+ });
33
+ const { className, children, ...rest } = omitThemeProps(mergedProps);
34
+ return /* @__PURE__ */ jsxs(
35
+ ui.div,
36
+ {
37
+ className: cx("ui-status", className),
38
+ __css: { ...styles.container },
39
+ ...rest,
40
+ children: [
41
+ /* @__PURE__ */ jsx(
42
+ ui.div,
43
+ {
44
+ ref,
45
+ className: "ui-status__indicator",
46
+ __css: { ...styles.indicator },
47
+ ...indicatorProps
48
+ }
49
+ ),
50
+ /* @__PURE__ */ jsx(
51
+ ui.p,
52
+ {
53
+ className: "ui-status__label",
54
+ __css: { ...styles.label },
55
+ ...labelProps,
56
+ children
57
+ }
58
+ )
59
+ ]
60
+ }
61
+ );
62
+ }
63
+ );
64
+ Status.displayName = "Status";
65
+ Status.__ui__ = "Status";
66
+
67
+ export {
68
+ getStatusColorScheme,
69
+ Status
70
+ };
71
+ //# sourceMappingURL=chunk-FBZ7ECK2.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/status.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n Statuses,\n StatusValue,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\" },\n info: { colorScheme: \"info\" },\n success: { colorScheme: \"success\" },\n warning: { colorScheme: \"warning\" },\n} as const satisfies Statuses\n\nexport const getStatusColorScheme = (\n status: StatusValue,\n statuses?: Statuses,\n): string =>\n statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\ninterface StatusOptions {\n /**\n * The type of the status\n *\n * @default 'info'\n * */\n value?: StatusValue\n /**\n * The props for the status indicator component\n */\n indicatorProps?: HTMLUIProps\n /**\n * The props for the status label component\n */\n labelProps?: HTMLUIProps\n}\n\nexport interface StatusProps\n extends HTMLUIProps,\n ThemeProps<\"Status\">,\n StatusOptions {}\n\n/**\n * `Status` is component that indicate the status of a process or state.\n *\n * @see Docs https://yamada-ui.com/components/data-display/status\n */\nexport const Status = forwardRef<StatusProps, \"div\">(\n (\n { colorScheme, value = \"info\", indicatorProps, labelProps, ...props },\n ref,\n ) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.status?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(value, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Status\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n return (\n <ui.div\n className={cx(\"ui-status\", className)}\n __css={{ ...styles.container }}\n {...rest}\n >\n <ui.div\n ref={ref}\n className=\"ui-status__indicator\"\n __css={{ ...styles.indicator }}\n {...indicatorProps}\n />\n\n <ui.p\n className=\"ui-status__label\"\n __css={{ ...styles.label }}\n {...labelProps}\n >\n {children}\n </ui.p>\n </ui.div>\n )\n },\n)\n\nStatus.displayName = \"Status\"\nStatus.__ui__ = \"Status\"\n"],"mappings":";;;AAMA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU;AA2Db,SAKE,KALF;AAzDN,IAAM,kBAAkB;AAAA,EACtB,OAAO,EAAE,aAAa,SAAS;AAAA,EAC/B,MAAM,EAAE,aAAa,OAAO;AAAA,EAC5B,SAAS,EAAE,aAAa,UAAU;AAAA,EAClC,SAAS,EAAE,aAAa,UAAU;AACpC;AAEO,IAAM,uBAAuB,CAClC,QACA,aACQ;AAzBV;AA0BE,0DAAW,YAAX,mBAAoB,gBAApB,YAAmC,gBAAgB,MAAM,EAAE;AAAA;AA6BtD,IAAM,SAAS;AAAA,EACpB,CACE,EAAE,aAAa,QAAQ,QAAQ,gBAAgB,YAAY,GAAG,MAAM,GACpE,QACG;AA3DP;AA4DI,UAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,UAAM,YAAW,uBAAM,aAAN,mBAAgB,WAAhB,mBAAwB,aAAxB,YAAoC,CAAC;AAEtD,sDAAgB,qBAAqB,OAAO,QAAQ;AAEpD,UAAM,CAAC,QAAQ,WAAW,IAAI,uBAAuB,UAAU;AAAA,MAC7D,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AACD,UAAM,EAAE,WAAW,UAAU,GAAG,KAAK,IAAI,eAAe,WAAW;AAEnE,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW,GAAG,aAAa,SAAS;AAAA,QACpC,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,QAC5B,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC;AAAA,cACA,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,cAC5B,GAAG;AAAA;AAAA,UACN;AAAA,UAEA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cACxB,GAAG;AAAA,cAEH;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AACrB,OAAO,SAAS;","names":[]}
@@ -0,0 +1,2 @@
1
+ export { Status, StatusProps } from './status.mjs';
2
+ import '@yamada-ui/core';
@@ -0,0 +1,2 @@
1
+ export { Status, StatusProps } from './status.js';
2
+ import '@yamada-ui/core';
package/dist/index.js ADDED
@@ -0,0 +1,89 @@
1
+ "use client"
2
+ "use strict";
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
+
21
+ // src/index.ts
22
+ var src_exports = {};
23
+ __export(src_exports, {
24
+ Status: () => Status
25
+ });
26
+ module.exports = __toCommonJS(src_exports);
27
+
28
+ // src/status.tsx
29
+ var import_core = require("@yamada-ui/core");
30
+ var import_utils = require("@yamada-ui/utils");
31
+ var import_jsx_runtime = require("react/jsx-runtime");
32
+ var defaultStatuses = {
33
+ error: { colorScheme: "danger" },
34
+ info: { colorScheme: "info" },
35
+ success: { colorScheme: "success" },
36
+ warning: { colorScheme: "warning" }
37
+ };
38
+ var getStatusColorScheme = (status, statuses) => {
39
+ var _a, _b;
40
+ return (_b = (_a = statuses == null ? void 0 : statuses[status]) == null ? void 0 : _a.colorScheme) != null ? _b : defaultStatuses[status].colorScheme;
41
+ };
42
+ var Status = (0, import_core.forwardRef)(
43
+ ({ colorScheme, value = "info", indicatorProps, labelProps, ...props }, ref) => {
44
+ var _a, _b, _c;
45
+ const { theme } = (0, import_core.useTheme)();
46
+ const statuses = (_c = (_b = (_a = theme.__config) == null ? void 0 : _a.status) == null ? void 0 : _b.statuses) != null ? _c : {};
47
+ colorScheme != null ? colorScheme : colorScheme = getStatusColorScheme(value, statuses);
48
+ const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("Status", {
49
+ ...props,
50
+ colorScheme
51
+ });
52
+ const { className, children, ...rest } = (0, import_core.omitThemeProps)(mergedProps);
53
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
54
+ import_core.ui.div,
55
+ {
56
+ className: (0, import_utils.cx)("ui-status", className),
57
+ __css: { ...styles.container },
58
+ ...rest,
59
+ children: [
60
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
61
+ import_core.ui.div,
62
+ {
63
+ ref,
64
+ className: "ui-status__indicator",
65
+ __css: { ...styles.indicator },
66
+ ...indicatorProps
67
+ }
68
+ ),
69
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
70
+ import_core.ui.p,
71
+ {
72
+ className: "ui-status__label",
73
+ __css: { ...styles.label },
74
+ ...labelProps,
75
+ children
76
+ }
77
+ )
78
+ ]
79
+ }
80
+ );
81
+ }
82
+ );
83
+ Status.displayName = "Status";
84
+ Status.__ui__ = "Status";
85
+ // Annotate the CommonJS export names for ESM import in node:
86
+ 0 && (module.exports = {
87
+ Status
88
+ });
89
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/index.ts","../src/status.tsx"],"sourcesContent":["export { Status } from \"./status\"\nexport type { StatusProps } from \"./status\"\n","import type {\n HTMLUIProps,\n Statuses,\n StatusValue,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\" },\n info: { colorScheme: \"info\" },\n success: { colorScheme: \"success\" },\n warning: { colorScheme: \"warning\" },\n} as const satisfies Statuses\n\nexport const getStatusColorScheme = (\n status: StatusValue,\n statuses?: Statuses,\n): string =>\n statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\ninterface StatusOptions {\n /**\n * The type of the status\n *\n * @default 'info'\n * */\n value?: StatusValue\n /**\n * The props for the status indicator component\n */\n indicatorProps?: HTMLUIProps\n /**\n * The props for the status label component\n */\n labelProps?: HTMLUIProps\n}\n\nexport interface StatusProps\n extends HTMLUIProps,\n ThemeProps<\"Status\">,\n StatusOptions {}\n\n/**\n * `Status` is component that indicate the status of a process or state.\n *\n * @see Docs https://yamada-ui.com/components/data-display/status\n */\nexport const Status = forwardRef<StatusProps, \"div\">(\n (\n { colorScheme, value = \"info\", indicatorProps, labelProps, ...props },\n ref,\n ) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.status?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(value, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Status\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n return (\n <ui.div\n className={cx(\"ui-status\", className)}\n __css={{ ...styles.container }}\n {...rest}\n >\n <ui.div\n ref={ref}\n className=\"ui-status__indicator\"\n __css={{ ...styles.indicator }}\n {...indicatorProps}\n />\n\n <ui.p\n className=\"ui-status__label\"\n __css={{ ...styles.label }}\n {...labelProps}\n >\n {children}\n </ui.p>\n </ui.div>\n )\n },\n)\n\nStatus.displayName = \"Status\"\nStatus.__ui__ = \"Status\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,kBAMO;AACP,mBAAmB;AA2Db;AAzDN,IAAM,kBAAkB;AAAA,EACtB,OAAO,EAAE,aAAa,SAAS;AAAA,EAC/B,MAAM,EAAE,aAAa,OAAO;AAAA,EAC5B,SAAS,EAAE,aAAa,UAAU;AAAA,EAClC,SAAS,EAAE,aAAa,UAAU;AACpC;AAEO,IAAM,uBAAuB,CAClC,QACA,aACQ;AAzBV;AA0BE,0DAAW,YAAX,mBAAoB,gBAApB,YAAmC,gBAAgB,MAAM,EAAE;AAAA;AA6BtD,IAAM,aAAS;AAAA,EACpB,CACE,EAAE,aAAa,QAAQ,QAAQ,gBAAgB,YAAY,GAAG,MAAM,GACpE,QACG;AA3DP;AA4DI,UAAM,EAAE,MAAM,QAAI,sBAAS;AAC3B,UAAM,YAAW,uBAAM,aAAN,mBAAgB,WAAhB,mBAAwB,aAAxB,YAAoC,CAAC;AAEtD,sDAAgB,qBAAqB,OAAO,QAAQ;AAEpD,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,UAAU;AAAA,MAC7D,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AACD,UAAM,EAAE,WAAW,UAAU,GAAG,KAAK,QAAI,4BAAe,WAAW;AAEnE,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,eAAW,iBAAG,aAAa,SAAS;AAAA,QACpC,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,QAC5B,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC;AAAA,cACA,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,cAC5B,GAAG;AAAA;AAAA,UACN;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cACxB,GAAG;AAAA,cAEH;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AACrB,OAAO,SAAS;","names":[]}
package/dist/index.mjs ADDED
@@ -0,0 +1,8 @@
1
+ "use client"
2
+ import {
3
+ Status
4
+ } from "./chunk-FBZ7ECK2.mjs";
5
+ export {
6
+ Status
7
+ };
8
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -0,0 +1,30 @@
1
+ import * as _yamada_ui_core from '@yamada-ui/core';
2
+ import { StatusValue, Statuses, HTMLUIProps, ThemeProps } from '@yamada-ui/core';
3
+
4
+ declare const getStatusColorScheme: (status: StatusValue, statuses?: Statuses) => string;
5
+ interface StatusOptions {
6
+ /**
7
+ * The type of the status
8
+ *
9
+ * @default 'info'
10
+ * */
11
+ value?: StatusValue;
12
+ /**
13
+ * The props for the status indicator component
14
+ */
15
+ indicatorProps?: HTMLUIProps;
16
+ /**
17
+ * The props for the status label component
18
+ */
19
+ labelProps?: HTMLUIProps;
20
+ }
21
+ interface StatusProps extends HTMLUIProps, ThemeProps<"Status">, StatusOptions {
22
+ }
23
+ /**
24
+ * `Status` is component that indicate the status of a process or state.
25
+ *
26
+ * @see Docs https://yamada-ui.com/components/data-display/status
27
+ */
28
+ declare const Status: _yamada_ui_core.Component<"div", StatusProps>;
29
+
30
+ export { Status, type StatusProps, getStatusColorScheme };
@@ -0,0 +1,30 @@
1
+ import * as _yamada_ui_core from '@yamada-ui/core';
2
+ import { StatusValue, Statuses, HTMLUIProps, ThemeProps } from '@yamada-ui/core';
3
+
4
+ declare const getStatusColorScheme: (status: StatusValue, statuses?: Statuses) => string;
5
+ interface StatusOptions {
6
+ /**
7
+ * The type of the status
8
+ *
9
+ * @default 'info'
10
+ * */
11
+ value?: StatusValue;
12
+ /**
13
+ * The props for the status indicator component
14
+ */
15
+ indicatorProps?: HTMLUIProps;
16
+ /**
17
+ * The props for the status label component
18
+ */
19
+ labelProps?: HTMLUIProps;
20
+ }
21
+ interface StatusProps extends HTMLUIProps, ThemeProps<"Status">, StatusOptions {
22
+ }
23
+ /**
24
+ * `Status` is component that indicate the status of a process or state.
25
+ *
26
+ * @see Docs https://yamada-ui.com/components/data-display/status
27
+ */
28
+ declare const Status: _yamada_ui_core.Component<"div", StatusProps>;
29
+
30
+ export { Status, type StatusProps, getStatusColorScheme };
package/dist/status.js ADDED
@@ -0,0 +1,89 @@
1
+ "use client"
2
+ "use strict";
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
+
21
+ // src/status.tsx
22
+ var status_exports = {};
23
+ __export(status_exports, {
24
+ Status: () => Status,
25
+ getStatusColorScheme: () => getStatusColorScheme
26
+ });
27
+ module.exports = __toCommonJS(status_exports);
28
+ var import_core = require("@yamada-ui/core");
29
+ var import_utils = require("@yamada-ui/utils");
30
+ var import_jsx_runtime = require("react/jsx-runtime");
31
+ var defaultStatuses = {
32
+ error: { colorScheme: "danger" },
33
+ info: { colorScheme: "info" },
34
+ success: { colorScheme: "success" },
35
+ warning: { colorScheme: "warning" }
36
+ };
37
+ var getStatusColorScheme = (status, statuses) => {
38
+ var _a, _b;
39
+ return (_b = (_a = statuses == null ? void 0 : statuses[status]) == null ? void 0 : _a.colorScheme) != null ? _b : defaultStatuses[status].colorScheme;
40
+ };
41
+ var Status = (0, import_core.forwardRef)(
42
+ ({ colorScheme, value = "info", indicatorProps, labelProps, ...props }, ref) => {
43
+ var _a, _b, _c;
44
+ const { theme } = (0, import_core.useTheme)();
45
+ const statuses = (_c = (_b = (_a = theme.__config) == null ? void 0 : _a.status) == null ? void 0 : _b.statuses) != null ? _c : {};
46
+ colorScheme != null ? colorScheme : colorScheme = getStatusColorScheme(value, statuses);
47
+ const [styles, mergedProps] = (0, import_core.useComponentMultiStyle)("Status", {
48
+ ...props,
49
+ colorScheme
50
+ });
51
+ const { className, children, ...rest } = (0, import_core.omitThemeProps)(mergedProps);
52
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
53
+ import_core.ui.div,
54
+ {
55
+ className: (0, import_utils.cx)("ui-status", className),
56
+ __css: { ...styles.container },
57
+ ...rest,
58
+ children: [
59
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
60
+ import_core.ui.div,
61
+ {
62
+ ref,
63
+ className: "ui-status__indicator",
64
+ __css: { ...styles.indicator },
65
+ ...indicatorProps
66
+ }
67
+ ),
68
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
69
+ import_core.ui.p,
70
+ {
71
+ className: "ui-status__label",
72
+ __css: { ...styles.label },
73
+ ...labelProps,
74
+ children
75
+ }
76
+ )
77
+ ]
78
+ }
79
+ );
80
+ }
81
+ );
82
+ Status.displayName = "Status";
83
+ Status.__ui__ = "Status";
84
+ // Annotate the CommonJS export names for ESM import in node:
85
+ 0 && (module.exports = {
86
+ Status,
87
+ getStatusColorScheme
88
+ });
89
+ //# sourceMappingURL=status.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/status.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n Statuses,\n StatusValue,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\" },\n info: { colorScheme: \"info\" },\n success: { colorScheme: \"success\" },\n warning: { colorScheme: \"warning\" },\n} as const satisfies Statuses\n\nexport const getStatusColorScheme = (\n status: StatusValue,\n statuses?: Statuses,\n): string =>\n statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\ninterface StatusOptions {\n /**\n * The type of the status\n *\n * @default 'info'\n * */\n value?: StatusValue\n /**\n * The props for the status indicator component\n */\n indicatorProps?: HTMLUIProps\n /**\n * The props for the status label component\n */\n labelProps?: HTMLUIProps\n}\n\nexport interface StatusProps\n extends HTMLUIProps,\n ThemeProps<\"Status\">,\n StatusOptions {}\n\n/**\n * `Status` is component that indicate the status of a process or state.\n *\n * @see Docs https://yamada-ui.com/components/data-display/status\n */\nexport const Status = forwardRef<StatusProps, \"div\">(\n (\n { colorScheme, value = \"info\", indicatorProps, labelProps, ...props },\n ref,\n ) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.status?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(value, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Status\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n return (\n <ui.div\n className={cx(\"ui-status\", className)}\n __css={{ ...styles.container }}\n {...rest}\n >\n <ui.div\n ref={ref}\n className=\"ui-status__indicator\"\n __css={{ ...styles.indicator }}\n {...indicatorProps}\n />\n\n <ui.p\n className=\"ui-status__label\"\n __css={{ ...styles.label }}\n {...labelProps}\n >\n {children}\n </ui.p>\n </ui.div>\n )\n },\n)\n\nStatus.displayName = \"Status\"\nStatus.__ui__ = \"Status\"\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA,kBAMO;AACP,mBAAmB;AA2Db;AAzDN,IAAM,kBAAkB;AAAA,EACtB,OAAO,EAAE,aAAa,SAAS;AAAA,EAC/B,MAAM,EAAE,aAAa,OAAO;AAAA,EAC5B,SAAS,EAAE,aAAa,UAAU;AAAA,EAClC,SAAS,EAAE,aAAa,UAAU;AACpC;AAEO,IAAM,uBAAuB,CAClC,QACA,aACQ;AAzBV;AA0BE,0DAAW,YAAX,mBAAoB,gBAApB,YAAmC,gBAAgB,MAAM,EAAE;AAAA;AA6BtD,IAAM,aAAS;AAAA,EACpB,CACE,EAAE,aAAa,QAAQ,QAAQ,gBAAgB,YAAY,GAAG,MAAM,GACpE,QACG;AA3DP;AA4DI,UAAM,EAAE,MAAM,QAAI,sBAAS;AAC3B,UAAM,YAAW,uBAAM,aAAN,mBAAgB,WAAhB,mBAAwB,aAAxB,YAAoC,CAAC;AAEtD,sDAAgB,qBAAqB,OAAO,QAAQ;AAEpD,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,UAAU;AAAA,MAC7D,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AACD,UAAM,EAAE,WAAW,UAAU,GAAG,KAAK,QAAI,4BAAe,WAAW;AAEnE,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC,eAAW,iBAAG,aAAa,SAAS;AAAA,QACpC,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,QAC5B,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC;AAAA,cACA,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,UAAU;AAAA,cAC5B,GAAG;AAAA;AAAA,UACN;AAAA,UAEA;AAAA,YAAC,eAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,MAAM;AAAA,cACxB,GAAG;AAAA,cAEH;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;AACrB,OAAO,SAAS;","names":[]}
@@ -0,0 +1,10 @@
1
+ "use client"
2
+ import {
3
+ Status,
4
+ getStatusColorScheme
5
+ } from "./chunk-FBZ7ECK2.mjs";
6
+ export {
7
+ Status,
8
+ getStatusColorScheme
9
+ };
10
+ //# sourceMappingURL=status.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
package/package.json ADDED
@@ -0,0 +1,79 @@
1
+ {
2
+ "name": "@yamada-ui/status",
3
+ "version": "1.0.1-next-20241124062938",
4
+ "description": "Yamada UI status component",
5
+ "keywords": [
6
+ "yamada",
7
+ "yamada ui",
8
+ "react",
9
+ "emotion",
10
+ "component",
11
+ "ui",
12
+ "uikit",
13
+ "styled",
14
+ "style-props",
15
+ "styled-component",
16
+ "css-in-js"
17
+ ],
18
+ "author": "Hirotomo Yamada <hirotomo.yamada@avap.co.jp>",
19
+ "license": "MIT",
20
+ "main": "dist/index.js",
21
+ "files": [
22
+ "dist"
23
+ ],
24
+ "sideEffects": false,
25
+ "publishConfig": {
26
+ "access": "public"
27
+ },
28
+ "homepage": "https://yamada-ui.com",
29
+ "repository": {
30
+ "type": "git",
31
+ "url": "https://github.com/yamada-ui/yamada-ui",
32
+ "directory": "packages/components/status"
33
+ },
34
+ "bugs": {
35
+ "url": "https://github.com/yamada-ui/yamada-ui/issues"
36
+ },
37
+ "dependencies": {
38
+ "@yamada-ui/core": "1.16.0-next-20241124062938",
39
+ "@yamada-ui/utils": "1.5.4"
40
+ },
41
+ "devDependencies": {
42
+ "react": "^18.0.0",
43
+ "clean-package": "2.2.0"
44
+ },
45
+ "peerDependencies": {
46
+ "react": ">=18"
47
+ },
48
+ "clean-package": "../../../clean-package.config.json",
49
+ "tsup": {
50
+ "clean": true,
51
+ "target": "es2019",
52
+ "format": [
53
+ "cjs",
54
+ "esm"
55
+ ],
56
+ "banner": {
57
+ "js": "\"use client\""
58
+ },
59
+ "sourcemap": true
60
+ },
61
+ "module": "dist/index.mjs",
62
+ "types": "dist/index.d.ts",
63
+ "exports": {
64
+ ".": {
65
+ "types": "./dist/index.d.ts",
66
+ "import": "./dist/index.mjs",
67
+ "require": "./dist/index.js"
68
+ },
69
+ "./package.json": "./package.json"
70
+ },
71
+ "scripts": {
72
+ "dev": "pnpm build:fast -- --watch",
73
+ "build": "tsup src --dts",
74
+ "build:fast": "tsup src",
75
+ "clean": "rimraf dist .turbo",
76
+ "typecheck": "tsc --noEmit",
77
+ "gen:docs": "tsx ../../../scripts/generate-docs"
78
+ }
79
+ }