@yamada-ui/alert 1.0.41-dev-20240928131117 → 1.0.42-dev-20240929090514
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/alert.d.mts +7 -7
- package/dist/alert.d.ts +7 -7
- package/dist/alert.js +8 -2
- package/dist/alert.js.map +1 -1
- package/dist/alert.mjs +1 -1
- package/dist/{chunk-N2VISZJK.mjs → chunk-KYRXDK5C.mjs} +9 -3
- package/dist/chunk-KYRXDK5C.mjs.map +1 -0
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +8 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +5 -5
- package/dist/chunk-N2VISZJK.mjs.map +0 -1
package/dist/alert.d.mts
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
|
-
import { AlertStatuses, HTMLUIProps, ThemeProps } from '@yamada-ui/core';
|
|
2
|
+
import { AlertStatuses, HTMLUIProps, ThemeProps, FC } from '@yamada-ui/core';
|
|
3
|
+
import * as react from 'react';
|
|
3
4
|
import * as _yamada_ui_icon from '@yamada-ui/icon';
|
|
4
5
|
import { LoadingProps } from '@yamada-ui/loading';
|
|
5
|
-
import { FC } from 'react';
|
|
6
6
|
|
|
7
7
|
declare const defaultStatuses: {
|
|
8
8
|
readonly info: {
|
|
9
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
9
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
10
10
|
readonly colorScheme: "info";
|
|
11
11
|
};
|
|
12
12
|
readonly success: {
|
|
13
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
13
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
14
14
|
readonly colorScheme: "success";
|
|
15
15
|
};
|
|
16
16
|
readonly warning: {
|
|
17
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
17
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
18
18
|
readonly colorScheme: "warning";
|
|
19
19
|
};
|
|
20
20
|
readonly error: {
|
|
21
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
21
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
22
22
|
readonly colorScheme: "danger";
|
|
23
23
|
};
|
|
24
24
|
readonly loading: {
|
|
@@ -28,7 +28,7 @@ declare const defaultStatuses: {
|
|
|
28
28
|
};
|
|
29
29
|
type Status = keyof typeof defaultStatuses;
|
|
30
30
|
declare const getStatusColorScheme: (status: Status, statuses?: AlertStatuses) => "info" | "success" | "warning" | "danger" | "link" | "primary" | "whiteAlpha" | "blackAlpha" | "gray" | "neutral" | "red" | "rose" | "pink" | "flashy" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "secondary" | (string & {});
|
|
31
|
-
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) => FC<_yamada_ui_icon.IconProps> | _yamada_ui_core.Component<"svg", LoadingProps> | FC;
|
|
31
|
+
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) => react.FC<_yamada_ui_icon.IconProps> | _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,24 +1,24 @@
|
|
|
1
1
|
import * as _yamada_ui_core from '@yamada-ui/core';
|
|
2
|
-
import { AlertStatuses, HTMLUIProps, ThemeProps } from '@yamada-ui/core';
|
|
2
|
+
import { AlertStatuses, HTMLUIProps, ThemeProps, FC } from '@yamada-ui/core';
|
|
3
|
+
import * as react from 'react';
|
|
3
4
|
import * as _yamada_ui_icon from '@yamada-ui/icon';
|
|
4
5
|
import { LoadingProps } from '@yamada-ui/loading';
|
|
5
|
-
import { FC } from 'react';
|
|
6
6
|
|
|
7
7
|
declare const defaultStatuses: {
|
|
8
8
|
readonly info: {
|
|
9
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
9
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
10
10
|
readonly colorScheme: "info";
|
|
11
11
|
};
|
|
12
12
|
readonly success: {
|
|
13
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
13
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
14
14
|
readonly colorScheme: "success";
|
|
15
15
|
};
|
|
16
16
|
readonly warning: {
|
|
17
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
17
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
18
18
|
readonly colorScheme: "warning";
|
|
19
19
|
};
|
|
20
20
|
readonly error: {
|
|
21
|
-
readonly icon: FC<_yamada_ui_icon.IconProps>;
|
|
21
|
+
readonly icon: react.FC<_yamada_ui_icon.IconProps>;
|
|
22
22
|
readonly colorScheme: "danger";
|
|
23
23
|
};
|
|
24
24
|
readonly loading: {
|
|
@@ -28,7 +28,7 @@ declare const defaultStatuses: {
|
|
|
28
28
|
};
|
|
29
29
|
type Status = keyof typeof defaultStatuses;
|
|
30
30
|
declare const getStatusColorScheme: (status: Status, statuses?: AlertStatuses) => "info" | "success" | "warning" | "danger" | "link" | "primary" | "whiteAlpha" | "blackAlpha" | "gray" | "neutral" | "red" | "rose" | "pink" | "flashy" | "orange" | "amber" | "yellow" | "lime" | "green" | "emerald" | "teal" | "cyan" | "sky" | "blue" | "indigo" | "violet" | "purple" | "fuchsia" | "secondary" | (string & {});
|
|
31
|
-
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) => FC<_yamada_ui_icon.IconProps> | _yamada_ui_core.Component<"svg", LoadingProps> | FC;
|
|
31
|
+
declare const getStatusIcon: (status: Status, statuses?: AlertStatuses) => react.FC<_yamada_ui_icon.IconProps> | _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
|
@@ -85,6 +85,8 @@ var Alert = (0, import_core.forwardRef)(
|
|
|
85
85
|
) });
|
|
86
86
|
}
|
|
87
87
|
);
|
|
88
|
+
Alert.displayName = "Alert";
|
|
89
|
+
Alert.__ui__ = "Alert";
|
|
88
90
|
var AlertIcon = ({
|
|
89
91
|
className,
|
|
90
92
|
children,
|
|
@@ -116,6 +118,8 @@ var AlertIcon = ({
|
|
|
116
118
|
}
|
|
117
119
|
);
|
|
118
120
|
};
|
|
121
|
+
AlertIcon.displayName = "AlertIcon";
|
|
122
|
+
AlertIcon.__ui__ = "AlertIcon";
|
|
119
123
|
var AlertTitle = (0, import_core.forwardRef)(
|
|
120
124
|
({ className, ...rest }, ref) => {
|
|
121
125
|
const { styles } = useAlert();
|
|
@@ -134,6 +138,8 @@ var AlertTitle = (0, import_core.forwardRef)(
|
|
|
134
138
|
);
|
|
135
139
|
}
|
|
136
140
|
);
|
|
141
|
+
AlertTitle.displayName = "AlertTitle";
|
|
142
|
+
AlertTitle.__ui__ = "AlertTitle";
|
|
137
143
|
var AlertDescription = (0, import_core.forwardRef)(
|
|
138
144
|
({ className, ...rest }, ref) => {
|
|
139
145
|
const { styles } = useAlert();
|
|
@@ -151,8 +157,8 @@ var AlertDescription = (0, import_core.forwardRef)(
|
|
|
151
157
|
);
|
|
152
158
|
}
|
|
153
159
|
);
|
|
154
|
-
|
|
155
|
-
|
|
160
|
+
AlertDescription.displayName = "AlertDescription";
|
|
161
|
+
AlertDescription.__ui__ = "AlertDescription";
|
|
156
162
|
// Annotate the CommonJS export names for ESM import in node:
|
|
157
163
|
0 && (module.exports = {
|
|
158
164
|
Alert,
|
package/dist/alert.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n AlertStatuses,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { InfoIcon, WarningIcon, CheckIcon } from \"@yamada-ui/icon\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\
|
|
1
|
+
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n AlertStatuses,\n FC,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { InfoIcon, WarningIcon, CheckIcon } from \"@yamada-ui/icon\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n info: { icon: InfoIcon, colorScheme: \"info\" },\n success: { icon: CheckIcon, colorScheme: \"success\" },\n warning: { icon: WarningIcon, colorScheme: \"warning\" },\n error: { icon: WarningIcon, colorScheme: \"danger\" },\n loading: { icon: Loading, colorScheme: \"primary\" },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject }\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 ({ status = \"info\", colorScheme, ...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 w: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n position: \"relative\",\n overflow: \"hidden\",\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 children,\n variant = \"oval\",\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 display=\"inherit\"\n className={cx(\"ui-alert__icon\", className)}\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
|
@@ -63,6 +63,8 @@ var Alert = forwardRef(
|
|
|
63
63
|
) });
|
|
64
64
|
}
|
|
65
65
|
);
|
|
66
|
+
Alert.displayName = "Alert";
|
|
67
|
+
Alert.__ui__ = "Alert";
|
|
66
68
|
var AlertIcon = ({
|
|
67
69
|
className,
|
|
68
70
|
children,
|
|
@@ -94,6 +96,8 @@ var AlertIcon = ({
|
|
|
94
96
|
}
|
|
95
97
|
);
|
|
96
98
|
};
|
|
99
|
+
AlertIcon.displayName = "AlertIcon";
|
|
100
|
+
AlertIcon.__ui__ = "AlertIcon";
|
|
97
101
|
var AlertTitle = forwardRef(
|
|
98
102
|
({ className, ...rest }, ref) => {
|
|
99
103
|
const { styles } = useAlert();
|
|
@@ -112,6 +116,8 @@ var AlertTitle = forwardRef(
|
|
|
112
116
|
);
|
|
113
117
|
}
|
|
114
118
|
);
|
|
119
|
+
AlertTitle.displayName = "AlertTitle";
|
|
120
|
+
AlertTitle.__ui__ = "AlertTitle";
|
|
115
121
|
var AlertDescription = forwardRef(
|
|
116
122
|
({ className, ...rest }, ref) => {
|
|
117
123
|
const { styles } = useAlert();
|
|
@@ -129,8 +135,8 @@ var AlertDescription = forwardRef(
|
|
|
129
135
|
);
|
|
130
136
|
}
|
|
131
137
|
);
|
|
132
|
-
|
|
133
|
-
|
|
138
|
+
AlertDescription.displayName = "AlertDescription";
|
|
139
|
+
AlertDescription.__ui__ = "AlertDescription";
|
|
134
140
|
|
|
135
141
|
export {
|
|
136
142
|
getStatusColorScheme,
|
|
@@ -140,4 +146,4 @@ export {
|
|
|
140
146
|
AlertTitle,
|
|
141
147
|
AlertDescription
|
|
142
148
|
};
|
|
143
|
-
//# sourceMappingURL=chunk-
|
|
149
|
+
//# sourceMappingURL=chunk-KYRXDK5C.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n AlertStatuses,\n FC,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { InfoIcon, WarningIcon, CheckIcon } from \"@yamada-ui/icon\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n info: { icon: InfoIcon, colorScheme: \"info\" },\n success: { icon: CheckIcon, colorScheme: \"success\" },\n warning: { icon: WarningIcon, colorScheme: \"warning\" },\n error: { icon: WarningIcon, colorScheme: \"danger\" },\n loading: { icon: Loading, colorScheme: \"primary\" },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject }\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 ({ status = \"info\", colorScheme, ...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 w: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n position: \"relative\",\n overflow: \"hidden\",\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 children,\n variant = \"oval\",\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 display=\"inherit\"\n className={cx(\"ui-alert__icon\", className)}\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
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -85,6 +85,8 @@ var Alert = (0, import_core.forwardRef)(
|
|
|
85
85
|
) });
|
|
86
86
|
}
|
|
87
87
|
);
|
|
88
|
+
Alert.displayName = "Alert";
|
|
89
|
+
Alert.__ui__ = "Alert";
|
|
88
90
|
var AlertIcon = ({
|
|
89
91
|
className,
|
|
90
92
|
children,
|
|
@@ -116,6 +118,8 @@ var AlertIcon = ({
|
|
|
116
118
|
}
|
|
117
119
|
);
|
|
118
120
|
};
|
|
121
|
+
AlertIcon.displayName = "AlertIcon";
|
|
122
|
+
AlertIcon.__ui__ = "AlertIcon";
|
|
119
123
|
var AlertTitle = (0, import_core.forwardRef)(
|
|
120
124
|
({ className, ...rest }, ref) => {
|
|
121
125
|
const { styles } = useAlert();
|
|
@@ -134,6 +138,8 @@ var AlertTitle = (0, import_core.forwardRef)(
|
|
|
134
138
|
);
|
|
135
139
|
}
|
|
136
140
|
);
|
|
141
|
+
AlertTitle.displayName = "AlertTitle";
|
|
142
|
+
AlertTitle.__ui__ = "AlertTitle";
|
|
137
143
|
var AlertDescription = (0, import_core.forwardRef)(
|
|
138
144
|
({ className, ...rest }, ref) => {
|
|
139
145
|
const { styles } = useAlert();
|
|
@@ -151,8 +157,8 @@ var AlertDescription = (0, import_core.forwardRef)(
|
|
|
151
157
|
);
|
|
152
158
|
}
|
|
153
159
|
);
|
|
154
|
-
|
|
155
|
-
|
|
160
|
+
AlertDescription.displayName = "AlertDescription";
|
|
161
|
+
AlertDescription.__ui__ = "AlertDescription";
|
|
156
162
|
// Annotate the CommonJS export names for ESM import in node:
|
|
157
163
|
0 && (module.exports = {
|
|
158
164
|
Alert,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/alert.tsx"],"sourcesContent":["export { Alert, AlertIcon, AlertTitle, AlertDescription } from \"./alert\"\nexport type {\n AlertProps,\n AlertIconProps,\n AlertTitleProps,\n AlertDescriptionProps,\n} from \"./alert\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n AlertStatuses,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { InfoIcon, WarningIcon, CheckIcon } from \"@yamada-ui/icon\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/alert.tsx"],"sourcesContent":["export { Alert, AlertIcon, AlertTitle, AlertDescription } from \"./alert\"\nexport type {\n AlertProps,\n AlertIconProps,\n AlertTitleProps,\n AlertDescriptionProps,\n} from \"./alert\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n AlertStatuses,\n FC,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { InfoIcon, WarningIcon, CheckIcon } from \"@yamada-ui/icon\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\n\nconst defaultStatuses = {\n info: { icon: InfoIcon, colorScheme: \"info\" },\n success: { icon: CheckIcon, colorScheme: \"success\" },\n warning: { icon: WarningIcon, colorScheme: \"warning\" },\n error: { icon: WarningIcon, colorScheme: \"danger\" },\n loading: { icon: Loading, colorScheme: \"primary\" },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject }\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 ({ status = \"info\", colorScheme, ...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 w: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n position: \"relative\",\n overflow: \"hidden\",\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 children,\n variant = \"oval\",\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 display=\"inherit\"\n className={cx(\"ui-alert__icon\", className)}\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.0.42-dev-20240929090514",
|
|
4
4
|
"description": "Yamada UI alert component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -36,10 +36,10 @@
|
|
|
36
36
|
"url": "https://github.com/yamada-ui/yamada-ui/issues"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@yamada-ui/core": "1.15.1
|
|
40
|
-
"@yamada-ui/icon": "1.1.7
|
|
41
|
-
"@yamada-ui/loading": "1.1.17
|
|
42
|
-
"@yamada-ui/utils": "1.5.2
|
|
39
|
+
"@yamada-ui/core": "1.15.1",
|
|
40
|
+
"@yamada-ui/icon": "1.1.7",
|
|
41
|
+
"@yamada-ui/loading": "1.1.17",
|
|
42
|
+
"@yamada-ui/utils": "1.5.2"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"clean-package": "2.2.0",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n AlertStatuses,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n useTheme,\n} from \"@yamada-ui/core\"\nimport { InfoIcon, WarningIcon, CheckIcon } from \"@yamada-ui/icon\"\nimport type { LoadingProps } from \"@yamada-ui/loading\"\nimport { Loading } from \"@yamada-ui/loading\"\nimport { createContext, cx } from \"@yamada-ui/utils\"\nimport type { FC } from \"react\"\n\nconst defaultStatuses = {\n info: { icon: InfoIcon, colorScheme: \"info\" },\n success: { icon: CheckIcon, colorScheme: \"success\" },\n warning: { icon: WarningIcon, colorScheme: \"warning\" },\n error: { icon: WarningIcon, colorScheme: \"danger\" },\n loading: { icon: Loading, colorScheme: \"primary\" },\n} as const\n\nexport type Status = keyof typeof defaultStatuses\n\ninterface AlertContext {\n status: Status\n styles: { [key: string]: CSSUIObject }\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 ({ status = \"info\", colorScheme, ...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 w: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n position: \"relative\",\n overflow: \"hidden\",\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\nexport interface AlertIconProps extends HTMLUIProps<\"span\"> {\n variant?: LoadingProps[\"variant\"]\n}\n\nexport const AlertIcon: FC<AlertIconProps> = ({\n className,\n children,\n variant = \"oval\",\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 display=\"inherit\"\n className={cx(\"ui-alert__icon\", className)}\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\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\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\nAlert.displayName = \"Alert\"\nAlert.__ui__ = \"Alert\"\n"],"mappings":"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","names":[]}
|