@yamada-ui/alert 1.0.41-dev-20240923182128 → 1.0.41-dev-20240924045835

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/alert.js CHANGED
@@ -151,6 +151,8 @@ var AlertDescription = (0, import_core.forwardRef)(
151
151
  );
152
152
  }
153
153
  );
154
+ Alert.displayName = "Alert";
155
+ Alert.__ui__ = "Alert";
154
156
  // Annotate the CommonJS export names for ESM import in node:
155
157
  0 && (module.exports = {
156
158
  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\"\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"],"mappings":"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","names":[]}
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":[]}
package/dist/alert.mjs CHANGED
@@ -6,7 +6,7 @@ import {
6
6
  AlertTitle,
7
7
  getStatusColorScheme,
8
8
  getStatusIcon
9
- } from "./chunk-IHGU5OQP.mjs";
9
+ } from "./chunk-N2VISZJK.mjs";
10
10
  export {
11
11
  Alert,
12
12
  AlertDescription,
@@ -129,6 +129,8 @@ var AlertDescription = forwardRef(
129
129
  );
130
130
  }
131
131
  );
132
+ Alert.displayName = "Alert";
133
+ Alert.__ui__ = "Alert";
132
134
 
133
135
  export {
134
136
  getStatusColorScheme,
@@ -138,4 +140,4 @@ export {
138
140
  AlertTitle,
139
141
  AlertDescription
140
142
  };
141
- //# sourceMappingURL=chunk-IHGU5OQP.mjs.map
143
+ //# sourceMappingURL=chunk-N2VISZJK.mjs.map
@@ -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\"\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"],"mappings":"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","names":[]}
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":[]}
package/dist/index.js CHANGED
@@ -151,6 +151,8 @@ var AlertDescription = (0, import_core.forwardRef)(
151
151
  );
152
152
  }
153
153
  );
154
+ Alert.displayName = "Alert";
155
+ Alert.__ui__ = "Alert";
154
156
  // Annotate the CommonJS export names for ESM import in node:
155
157
  0 && (module.exports = {
156
158
  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\"\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"],"mappings":"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","names":[]}
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\"\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":[]}
package/dist/index.mjs CHANGED
@@ -4,7 +4,7 @@ import {
4
4
  AlertDescription,
5
5
  AlertIcon,
6
6
  AlertTitle
7
- } from "./chunk-IHGU5OQP.mjs";
7
+ } from "./chunk-N2VISZJK.mjs";
8
8
  export {
9
9
  Alert,
10
10
  AlertDescription,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/alert",
3
- "version": "1.0.41-dev-20240923182128",
3
+ "version": "1.0.41-dev-20240924045835",
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-dev-20240923182128",
40
- "@yamada-ui/icon": "1.1.7-dev-20240923182128",
41
- "@yamada-ui/loading": "1.1.17-dev-20240923182128",
42
- "@yamada-ui/utils": "1.5.2-dev-20240923182128"
39
+ "@yamada-ui/core": "1.15.1-dev-20240924045835",
40
+ "@yamada-ui/icon": "1.1.7-dev-20240924045835",
41
+ "@yamada-ui/loading": "1.1.17-dev-20240924045835",
42
+ "@yamada-ui/utils": "1.5.2-dev-20240924045835"
43
43
  },
44
44
  "devDependencies": {
45
45
  "clean-package": "2.2.0",