@yamada-ui/alert 1.0.44-next-20241027133552 → 1.1.0-dev-20241029032301
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/alert.d.mts +8 -8
- package/dist/alert.d.ts +8 -8
- package/dist/alert.js +5 -5
- package/dist/alert.js.map +1 -1
- package/dist/alert.mjs +1 -1
- package/dist/{chunk-WQNMPM4A.mjs → chunk-GD46XQQQ.mjs} +6 -6
- package/dist/chunk-GD46XQQQ.mjs.map +1 -0
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +5 -5
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +4 -4
- package/dist/chunk-WQNMPM4A.mjs.map +0 -1
package/dist/alert.d.mts
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
|
3
|
-
import { AlertStatuses,
|
|
4
|
-
import * as
|
|
3
|
+
import { AlertStatuses, HTMLUIProps, ThemeProps, FC } from '@yamada-ui/core';
|
|
4
|
+
import * as _yamada_ui_lucide_src_lucide_icon from '@yamada-ui/lucide/src/lucide-icon';
|
|
5
5
|
import { LoadingProps } from '@yamada-ui/loading';
|
|
6
6
|
|
|
7
7
|
declare const defaultStatuses: {
|
|
8
8
|
readonly error: {
|
|
9
9
|
readonly colorScheme: "danger";
|
|
10
|
-
readonly icon:
|
|
10
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
11
11
|
};
|
|
12
12
|
readonly info: {
|
|
13
13
|
readonly colorScheme: "info";
|
|
14
|
-
readonly icon:
|
|
14
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
15
15
|
};
|
|
16
16
|
readonly loading: {
|
|
17
17
|
readonly colorScheme: "primary";
|
|
@@ -19,16 +19,16 @@ declare const defaultStatuses: {
|
|
|
19
19
|
};
|
|
20
20
|
readonly success: {
|
|
21
21
|
readonly colorScheme: "success";
|
|
22
|
-
readonly icon:
|
|
22
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
23
23
|
};
|
|
24
24
|
readonly warning: {
|
|
25
25
|
readonly colorScheme: "warning";
|
|
26
|
-
readonly icon:
|
|
26
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
27
27
|
};
|
|
28
28
|
};
|
|
29
29
|
type Status = keyof typeof defaultStatuses;
|
|
30
|
-
declare const getStatusColorScheme: (status: Status, statuses?: AlertStatuses) => "danger" | "
|
|
31
|
-
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) =>
|
|
30
|
+
declare const getStatusColorScheme: (status: Status, statuses?: AlertStatuses) => "danger" | "link" | "info" | "primary" | "success" | "warning" | "amber" | "blackAlpha" | "blue" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "indigo" | "lime" | "neutral" | "orange" | "pink" | "purple" | "red" | "rose" | "secondary" | "sky" | "teal" | "violet" | "whiteAlpha" | "yellow" | ({} & string);
|
|
31
|
+
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) => _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps> | _yamada_ui_core.Component<"svg", LoadingProps> | react.FC;
|
|
32
32
|
interface AlertOptions {
|
|
33
33
|
/**
|
|
34
34
|
* The status of the alert.
|
package/dist/alert.d.ts
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
|
3
|
-
import { AlertStatuses,
|
|
4
|
-
import * as
|
|
3
|
+
import { AlertStatuses, HTMLUIProps, ThemeProps, FC } from '@yamada-ui/core';
|
|
4
|
+
import * as _yamada_ui_lucide_src_lucide_icon from '@yamada-ui/lucide/src/lucide-icon';
|
|
5
5
|
import { LoadingProps } from '@yamada-ui/loading';
|
|
6
6
|
|
|
7
7
|
declare const defaultStatuses: {
|
|
8
8
|
readonly error: {
|
|
9
9
|
readonly colorScheme: "danger";
|
|
10
|
-
readonly icon:
|
|
10
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
11
11
|
};
|
|
12
12
|
readonly info: {
|
|
13
13
|
readonly colorScheme: "info";
|
|
14
|
-
readonly icon:
|
|
14
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
15
15
|
};
|
|
16
16
|
readonly loading: {
|
|
17
17
|
readonly colorScheme: "primary";
|
|
@@ -19,16 +19,16 @@ declare const defaultStatuses: {
|
|
|
19
19
|
};
|
|
20
20
|
readonly success: {
|
|
21
21
|
readonly colorScheme: "success";
|
|
22
|
-
readonly icon:
|
|
22
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
23
23
|
};
|
|
24
24
|
readonly warning: {
|
|
25
25
|
readonly colorScheme: "warning";
|
|
26
|
-
readonly icon:
|
|
26
|
+
readonly icon: _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps>;
|
|
27
27
|
};
|
|
28
28
|
};
|
|
29
29
|
type Status = keyof typeof defaultStatuses;
|
|
30
|
-
declare const getStatusColorScheme: (status: Status, statuses?: AlertStatuses) => "danger" | "
|
|
31
|
-
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) =>
|
|
30
|
+
declare const getStatusColorScheme: (status: Status, statuses?: AlertStatuses) => "danger" | "link" | "info" | "primary" | "success" | "warning" | "amber" | "blackAlpha" | "blue" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "indigo" | "lime" | "neutral" | "orange" | "pink" | "purple" | "red" | "rose" | "secondary" | "sky" | "teal" | "violet" | "whiteAlpha" | "yellow" | ({} & string);
|
|
31
|
+
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) => _yamada_ui_core.Component<"svg", _yamada_ui_lucide_src_lucide_icon.LucideIconProps> | _yamada_ui_core.Component<"svg", LoadingProps> | react.FC;
|
|
32
32
|
interface AlertOptions {
|
|
33
33
|
/**
|
|
34
34
|
* The status of the alert.
|
package/dist/alert.js
CHANGED
|
@@ -30,16 +30,16 @@ __export(alert_exports, {
|
|
|
30
30
|
});
|
|
31
31
|
module.exports = __toCommonJS(alert_exports);
|
|
32
32
|
var import_core = require("@yamada-ui/core");
|
|
33
|
-
var import_icon = require("@yamada-ui/icon");
|
|
34
33
|
var import_loading = require("@yamada-ui/loading");
|
|
34
|
+
var import_lucide = require("@yamada-ui/lucide");
|
|
35
35
|
var import_utils = require("@yamada-ui/utils");
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var defaultStatuses = {
|
|
38
|
-
error: { colorScheme: "danger", icon:
|
|
39
|
-
info: { colorScheme: "info", icon:
|
|
38
|
+
error: { colorScheme: "danger", icon: import_lucide.TriangleAlert },
|
|
39
|
+
info: { colorScheme: "info", icon: import_lucide.Info },
|
|
40
40
|
loading: { colorScheme: "primary", icon: import_loading.Loading },
|
|
41
|
-
success: { colorScheme: "success", icon:
|
|
42
|
-
warning: { colorScheme: "warning", icon:
|
|
41
|
+
success: { colorScheme: "success", icon: import_lucide.CircleCheckBig },
|
|
42
|
+
warning: { colorScheme: "warning", icon: import_lucide.TriangleAlert }
|
|
43
43
|
};
|
|
44
44
|
var [AlertProvider, useAlert] = (0, import_utils.createContext)({
|
|
45
45
|
name: `AlertStylesContext`,
|
package/dist/alert.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n AlertStatuses,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport {
|
|
1
|
+
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n AlertStatuses,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { CircleCheckBig, Info, TriangleAlert } from \"@yamada-ui/lucide\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\", icon: TriangleAlert },\n info: { colorScheme: \"info\", icon: Info },\n loading: { colorScheme: \"primary\", icon: Loading },\n success: { colorScheme: \"success\", icon: CircleCheckBig },\n warning: { colorScheme: \"warning\", icon: TriangleAlert },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject | undefined }\n}\n\nconst [AlertProvider, useAlert] = createContext<AlertContext>({\n name: `AlertStylesContext`,\n errorMessage: `useAlert returned is 'undefined'. Seems you forgot to wrap the components in \"<Alert />\" `,\n})\n\nexport const getStatusColorScheme = (\n status: Status,\n statuses?: AlertStatuses,\n) => statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\nexport const getStatusIcon = (status: Status, statuses?: AlertStatuses) =>\n statuses?.[status]?.icon ?? defaultStatuses[status].icon\n\ninterface AlertOptions {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport interface AlertProps\n extends HTMLUIProps,\n ThemeProps<\"Alert\">,\n AlertOptions {}\n\n/**\n * `Alert` is a component that conveys information to the user.\n *\n * @see Docs https://yamada-ui.com/components/feedback/alert\n */\nexport const Alert = forwardRef<AlertProps, \"div\">(\n ({ colorScheme, status = \"info\", ...props }, ref) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(status, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n overflow: \"hidden\",\n position: \"relative\",\n w: \"100%\",\n ...styles.container,\n }\n\n return (\n <AlertProvider value={{ status, styles }}>\n <ui.div\n ref={ref}\n className={cx(\"ui-alert\", className)}\n role=\"alert\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.div>\n </AlertProvider>\n )\n },\n)\n\nAlert.displayName = \"Alert\"\nAlert.__ui__ = \"Alert\"\n\nexport interface AlertIconProps extends HTMLUIProps<\"span\"> {\n variant?: LoadingProps[\"variant\"]\n}\n\nexport const AlertIcon: FC<AlertIconProps> = ({\n className,\n variant = \"oval\",\n children,\n ...rest\n}) => {\n const { status, styles } = useAlert()\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n const Icon = getStatusIcon(status, statuses)\n const css: CSSUIObject = {\n ...styles.icon,\n ...(status === \"loading\" ? styles.loading : {}),\n }\n\n return (\n <ui.span\n className={cx(\"ui-alert__icon\", className)}\n display=\"inherit\"\n __css={css}\n {...rest}\n >\n {children || (\n <Icon\n {...(status === \"loading\"\n ? { variant, color: \"currentcolor\" }\n : { boxSize: \"100%\" })}\n />\n )}\n </ui.span>\n )\n}\n\nAlertIcon.displayName = \"AlertIcon\"\nAlertIcon.__ui__ = \"AlertIcon\"\n\nexport interface AlertTitleProps extends HTMLUIProps<\"p\"> {}\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n display: \"block\",\n ...styles.title,\n }\n\n return (\n <ui.p\n ref={ref}\n className={cx(\"ui-alert__title\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertTitle.displayName = \"AlertTitle\"\nAlertTitle.__ui__ = \"AlertTitle\"\n\nexport interface AlertDescriptionProps extends HTMLUIProps<\"span\"> {}\n\nexport const AlertDescription = forwardRef<AlertDescriptionProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n ...styles.description,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-alert__desc\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertDescription.displayName = \"AlertDescription\"\nAlertDescription.__ui__ = \"AlertDescription\"\n"],"mappings":"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","names":[]}
|
package/dist/alert.mjs
CHANGED
|
@@ -8,16 +8,16 @@ import {
|
|
|
8
8
|
useComponentMultiStyle,
|
|
9
9
|
useTheme
|
|
10
10
|
} from "@yamada-ui/core";
|
|
11
|
-
import { CheckIcon, InfoIcon, WarningIcon } from "@yamada-ui/icon";
|
|
12
11
|
import { Loading } from "@yamada-ui/loading";
|
|
12
|
+
import { CircleCheckBig, Info, TriangleAlert } from "@yamada-ui/lucide";
|
|
13
13
|
import { createContext, cx } from "@yamada-ui/utils";
|
|
14
14
|
import { jsx } from "react/jsx-runtime";
|
|
15
15
|
var defaultStatuses = {
|
|
16
|
-
error: { colorScheme: "danger", icon:
|
|
17
|
-
info: { colorScheme: "info", icon:
|
|
16
|
+
error: { colorScheme: "danger", icon: TriangleAlert },
|
|
17
|
+
info: { colorScheme: "info", icon: Info },
|
|
18
18
|
loading: { colorScheme: "primary", icon: Loading },
|
|
19
|
-
success: { colorScheme: "success", icon:
|
|
20
|
-
warning: { colorScheme: "warning", icon:
|
|
19
|
+
success: { colorScheme: "success", icon: CircleCheckBig },
|
|
20
|
+
warning: { colorScheme: "warning", icon: TriangleAlert }
|
|
21
21
|
};
|
|
22
22
|
var [AlertProvider, useAlert] = createContext({
|
|
23
23
|
name: `AlertStylesContext`,
|
|
@@ -146,4 +146,4 @@ export {
|
|
|
146
146
|
AlertTitle,
|
|
147
147
|
AlertDescription
|
|
148
148
|
};
|
|
149
|
-
//# sourceMappingURL=chunk-
|
|
149
|
+
//# sourceMappingURL=chunk-GD46XQQQ.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n AlertStatuses,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { CircleCheckBig, Info, TriangleAlert } from \"@yamada-ui/lucide\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\", icon: TriangleAlert },\n info: { colorScheme: \"info\", icon: Info },\n loading: { colorScheme: \"primary\", icon: Loading },\n success: { colorScheme: \"success\", icon: CircleCheckBig },\n warning: { colorScheme: \"warning\", icon: TriangleAlert },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject | undefined }\n}\n\nconst [AlertProvider, useAlert] = createContext<AlertContext>({\n name: `AlertStylesContext`,\n errorMessage: `useAlert returned is 'undefined'. Seems you forgot to wrap the components in \"<Alert />\" `,\n})\n\nexport const getStatusColorScheme = (\n status: Status,\n statuses?: AlertStatuses,\n) => statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\nexport const getStatusIcon = (status: Status, statuses?: AlertStatuses) =>\n statuses?.[status]?.icon ?? defaultStatuses[status].icon\n\ninterface AlertOptions {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport interface AlertProps\n extends HTMLUIProps,\n ThemeProps<\"Alert\">,\n AlertOptions {}\n\n/**\n * `Alert` is a component that conveys information to the user.\n *\n * @see Docs https://yamada-ui.com/components/feedback/alert\n */\nexport const Alert = forwardRef<AlertProps, \"div\">(\n ({ colorScheme, status = \"info\", ...props }, ref) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(status, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n overflow: \"hidden\",\n position: \"relative\",\n w: \"100%\",\n ...styles.container,\n }\n\n return (\n <AlertProvider value={{ status, styles }}>\n <ui.div\n ref={ref}\n className={cx(\"ui-alert\", className)}\n role=\"alert\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.div>\n </AlertProvider>\n )\n },\n)\n\nAlert.displayName = \"Alert\"\nAlert.__ui__ = \"Alert\"\n\nexport interface AlertIconProps extends HTMLUIProps<\"span\"> {\n variant?: LoadingProps[\"variant\"]\n}\n\nexport const AlertIcon: FC<AlertIconProps> = ({\n className,\n variant = \"oval\",\n children,\n ...rest\n}) => {\n const { status, styles } = useAlert()\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n const Icon = getStatusIcon(status, statuses)\n const css: CSSUIObject = {\n ...styles.icon,\n ...(status === \"loading\" ? styles.loading : {}),\n }\n\n return (\n <ui.span\n className={cx(\"ui-alert__icon\", className)}\n display=\"inherit\"\n __css={css}\n {...rest}\n >\n {children || (\n <Icon\n {...(status === \"loading\"\n ? { variant, color: \"currentcolor\" }\n : { boxSize: \"100%\" })}\n />\n )}\n </ui.span>\n )\n}\n\nAlertIcon.displayName = \"AlertIcon\"\nAlertIcon.__ui__ = \"AlertIcon\"\n\nexport interface AlertTitleProps extends HTMLUIProps<\"p\"> {}\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n display: \"block\",\n ...styles.title,\n }\n\n return (\n <ui.p\n ref={ref}\n className={cx(\"ui-alert__title\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertTitle.displayName = \"AlertTitle\"\nAlertTitle.__ui__ = \"AlertTitle\"\n\nexport interface AlertDescriptionProps extends HTMLUIProps<\"span\"> {}\n\nexport const AlertDescription = forwardRef<AlertDescriptionProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n ...styles.description,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-alert__desc\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertDescription.displayName = \"AlertDescription\"\nAlertDescription.__ui__ = \"AlertDescription\"\n"],"mappings":"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","names":[]}
|
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { Alert, AlertDescription, AlertDescriptionProps, AlertIcon, AlertIconProps, AlertProps, AlertTitle, AlertTitleProps } from './alert.mjs';
|
|
2
2
|
import 'react';
|
|
3
3
|
import '@yamada-ui/core';
|
|
4
|
-
import '@yamada-ui/icon';
|
|
4
|
+
import '@yamada-ui/lucide/src/lucide-icon';
|
|
5
5
|
import '@yamada-ui/loading';
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { Alert, AlertDescription, AlertDescriptionProps, AlertIcon, AlertIconProps, AlertProps, AlertTitle, AlertTitleProps } from './alert.js';
|
|
2
2
|
import 'react';
|
|
3
3
|
import '@yamada-ui/core';
|
|
4
|
-
import '@yamada-ui/icon';
|
|
4
|
+
import '@yamada-ui/lucide/src/lucide-icon';
|
|
5
5
|
import '@yamada-ui/loading';
|
package/dist/index.js
CHANGED
|
@@ -30,16 +30,16 @@ module.exports = __toCommonJS(src_exports);
|
|
|
30
30
|
|
|
31
31
|
// src/alert.tsx
|
|
32
32
|
var import_core = require("@yamada-ui/core");
|
|
33
|
-
var import_icon = require("@yamada-ui/icon");
|
|
34
33
|
var import_loading = require("@yamada-ui/loading");
|
|
34
|
+
var import_lucide = require("@yamada-ui/lucide");
|
|
35
35
|
var import_utils = require("@yamada-ui/utils");
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var defaultStatuses = {
|
|
38
|
-
error: { colorScheme: "danger", icon:
|
|
39
|
-
info: { colorScheme: "info", icon:
|
|
38
|
+
error: { colorScheme: "danger", icon: import_lucide.TriangleAlert },
|
|
39
|
+
info: { colorScheme: "info", icon: import_lucide.Info },
|
|
40
40
|
loading: { colorScheme: "primary", icon: import_loading.Loading },
|
|
41
|
-
success: { colorScheme: "success", icon:
|
|
42
|
-
warning: { colorScheme: "warning", icon:
|
|
41
|
+
success: { colorScheme: "success", icon: import_lucide.CircleCheckBig },
|
|
42
|
+
warning: { colorScheme: "warning", icon: import_lucide.TriangleAlert }
|
|
43
43
|
};
|
|
44
44
|
var [AlertProvider, useAlert] = (0, import_utils.createContext)({
|
|
45
45
|
name: `AlertStylesContext`,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/alert.tsx"],"sourcesContent":["export { Alert, AlertDescription, AlertIcon, AlertTitle } from \"./alert\"\nexport type {\n AlertDescriptionProps,\n AlertIconProps,\n AlertProps,\n AlertTitleProps,\n} from \"./alert\"\n","import type {\n AlertStatuses,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport {
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/alert.tsx"],"sourcesContent":["export { Alert, AlertDescription, AlertIcon, AlertTitle } from \"./alert\"\nexport type {\n AlertDescriptionProps,\n AlertIconProps,\n AlertProps,\n AlertTitleProps,\n} from \"./alert\"\n","import type {\n AlertStatuses,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { CircleCheckBig, Info, TriangleAlert } from \"@yamada-ui/lucide\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\", icon: TriangleAlert },\n info: { colorScheme: \"info\", icon: Info },\n loading: { colorScheme: \"primary\", icon: Loading },\n success: { colorScheme: \"success\", icon: CircleCheckBig },\n warning: { colorScheme: \"warning\", icon: TriangleAlert },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject | undefined }\n}\n\nconst [AlertProvider, useAlert] = createContext<AlertContext>({\n name: `AlertStylesContext`,\n errorMessage: `useAlert returned is 'undefined'. Seems you forgot to wrap the components in \"<Alert />\" `,\n})\n\nexport const getStatusColorScheme = (\n status: Status,\n statuses?: AlertStatuses,\n) => statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\nexport const getStatusIcon = (status: Status, statuses?: AlertStatuses) =>\n statuses?.[status]?.icon ?? defaultStatuses[status].icon\n\ninterface AlertOptions {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport interface AlertProps\n extends HTMLUIProps,\n ThemeProps<\"Alert\">,\n AlertOptions {}\n\n/**\n * `Alert` is a component that conveys information to the user.\n *\n * @see Docs https://yamada-ui.com/components/feedback/alert\n */\nexport const Alert = forwardRef<AlertProps, \"div\">(\n ({ colorScheme, status = \"info\", ...props }, ref) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(status, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n overflow: \"hidden\",\n position: \"relative\",\n w: \"100%\",\n ...styles.container,\n }\n\n return (\n <AlertProvider value={{ status, styles }}>\n <ui.div\n ref={ref}\n className={cx(\"ui-alert\", className)}\n role=\"alert\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.div>\n </AlertProvider>\n )\n },\n)\n\nAlert.displayName = \"Alert\"\nAlert.__ui__ = \"Alert\"\n\nexport interface AlertIconProps extends HTMLUIProps<\"span\"> {\n variant?: LoadingProps[\"variant\"]\n}\n\nexport const AlertIcon: FC<AlertIconProps> = ({\n className,\n variant = \"oval\",\n children,\n ...rest\n}) => {\n const { status, styles } = useAlert()\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n const Icon = getStatusIcon(status, statuses)\n const css: CSSUIObject = {\n ...styles.icon,\n ...(status === \"loading\" ? styles.loading : {}),\n }\n\n return (\n <ui.span\n className={cx(\"ui-alert__icon\", className)}\n display=\"inherit\"\n __css={css}\n {...rest}\n >\n {children || (\n <Icon\n {...(status === \"loading\"\n ? { variant, color: \"currentcolor\" }\n : { boxSize: \"100%\" })}\n />\n )}\n </ui.span>\n )\n}\n\nAlertIcon.displayName = \"AlertIcon\"\nAlertIcon.__ui__ = \"AlertIcon\"\n\nexport interface AlertTitleProps extends HTMLUIProps<\"p\"> {}\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n display: \"block\",\n ...styles.title,\n }\n\n return (\n <ui.p\n ref={ref}\n className={cx(\"ui-alert__title\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertTitle.displayName = \"AlertTitle\"\nAlertTitle.__ui__ = \"AlertTitle\"\n\nexport interface AlertDescriptionProps extends HTMLUIProps<\"span\"> {}\n\nexport const AlertDescription = forwardRef<AlertDescriptionProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n ...styles.description,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-alert__desc\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertDescription.displayName = \"AlertDescription\"\nAlertDescription.__ui__ = \"AlertDescription\"\n"],"mappings":"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","names":[]}
|
package/dist/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/alert",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.0-dev-20241029032301",
|
|
4
4
|
"description": "Yamada UI alert component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -36,9 +36,9 @@
|
|
|
36
36
|
"url": "https://github.com/yamada-ui/yamada-ui/issues"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@yamada-ui/core": "1.15.4-
|
|
40
|
-
"@yamada-ui/
|
|
41
|
-
"@yamada-ui/loading": "1.1.20-
|
|
39
|
+
"@yamada-ui/core": "1.15.4-dev-20241029032301",
|
|
40
|
+
"@yamada-ui/lucide": "1.7.2-dev-20241029032301",
|
|
41
|
+
"@yamada-ui/loading": "1.1.20-dev-20241029032301",
|
|
42
42
|
"@yamada-ui/utils": "1.5.4"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n AlertStatuses,\n CSSUIObject,\n FC,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { CheckIcon, InfoIcon, WarningIcon } from \"@yamada-ui/icon\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n error: { colorScheme: \"danger\", icon: WarningIcon },\n info: { colorScheme: \"info\", icon: InfoIcon },\n loading: { colorScheme: \"primary\", icon: Loading },\n success: { colorScheme: \"success\", icon: CheckIcon },\n warning: { colorScheme: \"warning\", icon: WarningIcon },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject | undefined }\n}\n\nconst [AlertProvider, useAlert] = createContext<AlertContext>({\n name: `AlertStylesContext`,\n errorMessage: `useAlert returned is 'undefined'. Seems you forgot to wrap the components in \"<Alert />\" `,\n})\n\nexport const getStatusColorScheme = (\n status: Status,\n statuses?: AlertStatuses,\n) => statuses?.[status]?.colorScheme ?? defaultStatuses[status].colorScheme\n\nexport const getStatusIcon = (status: Status, statuses?: AlertStatuses) =>\n statuses?.[status]?.icon ?? defaultStatuses[status].icon\n\ninterface AlertOptions {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport interface AlertProps\n extends HTMLUIProps,\n ThemeProps<\"Alert\">,\n AlertOptions {}\n\n/**\n * `Alert` is a component that conveys information to the user.\n *\n * @see Docs https://yamada-ui.com/components/feedback/alert\n */\nexport const Alert = forwardRef<AlertProps, \"div\">(\n ({ colorScheme, status = \"info\", ...props }, ref) => {\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n colorScheme ??= getStatusColorScheme(status, statuses)\n\n const [styles, mergedProps] = useComponentMultiStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n overflow: \"hidden\",\n position: \"relative\",\n w: \"100%\",\n ...styles.container,\n }\n\n return (\n <AlertProvider value={{ status, styles }}>\n <ui.div\n ref={ref}\n className={cx(\"ui-alert\", className)}\n role=\"alert\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.div>\n </AlertProvider>\n )\n },\n)\n\nAlert.displayName = \"Alert\"\nAlert.__ui__ = \"Alert\"\n\nexport interface AlertIconProps extends HTMLUIProps<\"span\"> {\n variant?: LoadingProps[\"variant\"]\n}\n\nexport const AlertIcon: FC<AlertIconProps> = ({\n className,\n variant = \"oval\",\n children,\n ...rest\n}) => {\n const { status, styles } = useAlert()\n const { theme } = useTheme()\n const statuses = theme.__config?.alert?.statuses ?? {}\n\n const Icon = getStatusIcon(status, statuses)\n const css: CSSUIObject = {\n ...styles.icon,\n ...(status === \"loading\" ? styles.loading : {}),\n }\n\n return (\n <ui.span\n className={cx(\"ui-alert__icon\", className)}\n display=\"inherit\"\n __css={css}\n {...rest}\n >\n {children || (\n <Icon\n {...(status === \"loading\"\n ? { variant, color: \"currentcolor\" }\n : { boxSize: \"100%\" })}\n />\n )}\n </ui.span>\n )\n}\n\nAlertIcon.displayName = \"AlertIcon\"\nAlertIcon.__ui__ = \"AlertIcon\"\n\nexport interface AlertTitleProps extends HTMLUIProps<\"p\"> {}\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n display: \"block\",\n ...styles.title,\n }\n\n return (\n <ui.p\n ref={ref}\n className={cx(\"ui-alert__title\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertTitle.displayName = \"AlertTitle\"\nAlertTitle.__ui__ = \"AlertTitle\"\n\nexport interface AlertDescriptionProps extends HTMLUIProps<\"span\"> {}\n\nexport const AlertDescription = forwardRef<AlertDescriptionProps, \"span\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\n ...styles.description,\n }\n\n return (\n <ui.span\n ref={ref}\n className={cx(\"ui-alert__desc\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n\nAlertDescription.displayName = \"AlertDescription\"\nAlertDescription.__ui__ = \"AlertDescription\"\n"],"mappings":"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","names":[]}
|