@yamada-ui/alert 2.0.0-next-20240705212157 → 2.0.0-next-20240706062355

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
@@ -138,7 +138,7 @@ var AlertDescription = (0, import_core.forwardRef)(
138
138
  import_core.ui.span,
139
139
  {
140
140
  ref,
141
- className: (0, import_utils.cx)("ui-alert__desc", className),
141
+ className: (0, import_utils.cx)("ui-alert__description", className),
142
142
  __css: css,
143
143
  ...rest
144
144
  }
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 useMultiComponentStyle,\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\ntype AlertContext = {\n status: Status\n styles: Record<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\ntype AlertOptions = {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport type AlertProps = HTMLUIProps<\"div\"> & ThemeProps<\"Alert\"> & 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] = useMultiComponentStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\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 type AlertIconProps = 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 type AlertTitleProps = HTMLUIProps<\"p\">\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\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 type AlertDescriptionProps = 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 useMultiComponentStyle,\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\ntype AlertContext = {\n status: Status\n styles: Record<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\ntype AlertOptions = {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport type AlertProps = HTMLUIProps<\"div\"> & ThemeProps<\"Alert\"> & 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] = useMultiComponentStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\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 type AlertIconProps = 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 type AlertTitleProps = HTMLUIProps<\"p\">\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\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 type AlertDescriptionProps = 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__description\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\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-6PL6ZUOG.mjs";
9
+ } from "./chunk-Q5YTVPKL.mjs";
10
10
  export {
11
11
  Alert,
12
12
  AlertDescription,
@@ -116,7 +116,7 @@ var AlertDescription = forwardRef(
116
116
  ui.span,
117
117
  {
118
118
  ref,
119
- className: cx("ui-alert__desc", className),
119
+ className: cx("ui-alert__description", className),
120
120
  __css: css,
121
121
  ...rest
122
122
  }
@@ -132,4 +132,4 @@ export {
132
132
  AlertTitle,
133
133
  AlertDescription
134
134
  };
135
- //# sourceMappingURL=chunk-6PL6ZUOG.mjs.map
135
+ //# sourceMappingURL=chunk-Q5YTVPKL.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 useMultiComponentStyle,\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\ntype AlertContext = {\n status: Status\n styles: Record<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\ntype AlertOptions = {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport type AlertProps = HTMLUIProps<\"div\"> & ThemeProps<\"Alert\"> & 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] = useMultiComponentStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\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 type AlertIconProps = 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 type AlertTitleProps = HTMLUIProps<\"p\">\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\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 type AlertDescriptionProps = 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 useMultiComponentStyle,\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\ntype AlertContext = {\n status: Status\n styles: Record<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\ntype AlertOptions = {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport type AlertProps = HTMLUIProps<\"div\"> & ThemeProps<\"Alert\"> & 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] = useMultiComponentStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\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 type AlertIconProps = 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 type AlertTitleProps = HTMLUIProps<\"p\">\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\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 type AlertDescriptionProps = 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__description\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\n"],"mappings":"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","names":[]}
package/dist/index.js CHANGED
@@ -138,7 +138,7 @@ var AlertDescription = (0, import_core.forwardRef)(
138
138
  import_core.ui.span,
139
139
  {
140
140
  ref,
141
- className: (0, import_utils.cx)("ui-alert__desc", className),
141
+ className: (0, import_utils.cx)("ui-alert__description", className),
142
142
  __css: css,
143
143
  ...rest
144
144
  }
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 useMultiComponentStyle,\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\ntype AlertContext = {\n status: Status\n styles: Record<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\ntype AlertOptions = {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport type AlertProps = HTMLUIProps<\"div\"> & ThemeProps<\"Alert\"> & 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] = useMultiComponentStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\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 type AlertIconProps = 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 type AlertTitleProps = HTMLUIProps<\"p\">\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\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 type AlertDescriptionProps = 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":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,kBAMO;AACP,kBAAiD;AAEjD,qBAAwB;AACxB,mBAAkC;AAkE1B;AA/DR,IAAM,kBAAkB;AAAA,EACtB,MAAM,EAAE,MAAM,sBAAU,aAAa,OAAO;AAAA,EAC5C,SAAS,EAAE,MAAM,uBAAW,aAAa,UAAU;AAAA,EACnD,SAAS,EAAE,MAAM,yBAAa,aAAa,UAAU;AAAA,EACrD,OAAO,EAAE,MAAM,yBAAa,aAAa,SAAS;AAAA,EAClD,SAAS,EAAE,MAAM,wBAAS,aAAa,UAAU;AACnD;AASA,IAAM,CAAC,eAAe,QAAQ,QAAI,4BAA4B;AAAA,EAC5D,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAEM,IAAM,uBAAuB,CAClC,QACA,aACA;AA1CF;AA0CK,0DAAW,YAAX,mBAAoB,gBAApB,YAAmC,gBAAgB,MAAM,EAAE;AAAA;AAEzD,IAAM,gBAAgB,CAAC,QAAgB,aAA0B;AA5CxE;AA6CE,0DAAW,YAAX,mBAAoB,SAApB,YAA4B,gBAAgB,MAAM,EAAE;AAAA;AAkB/C,IAAM,YAAQ;AAAA,EACnB,CAAC,EAAE,SAAS,QAAQ,aAAa,GAAG,MAAM,GAAG,QAAQ;AAhEvD;AAiEI,UAAM,EAAE,MAAM,QAAI,sBAAS;AAC3B,UAAM,YAAW,uBAAM,aAAN,mBAAgB,UAAhB,mBAAuB,aAAvB,YAAmC,CAAC;AAErD,sDAAgB,qBAAqB,QAAQ,QAAQ;AAErD,UAAM,CAAC,QAAQ,WAAW,QAAI,oCAAuB,SAAS;AAAA,MAC5D,GAAG;AAAA,MACH;AAAA,IACF,CAAC;AACD,UAAM,EAAE,WAAW,UAAU,GAAG,KAAK,QAAI,4BAAe,WAAW;AAEnE,UAAM,MAAmB;AAAA,MACvB,GAAG,OAAO;AAAA,IACZ;AAEA,WACE,4CAAC,iBAAc,OAAO,EAAE,QAAQ,OAAO,GACrC;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,YAAY,SAAS;AAAA,QACnC,MAAK;AAAA,QACL,OAAO;AAAA,QACN,GAAG;AAAA,QAEH;AAAA;AAAA,IACH,GACF;AAAA,EAEJ;AACF;AAMO,IAAM,YAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AAzGN;AA0GE,QAAM,EAAE,QAAQ,OAAO,IAAI,SAAS;AACpC,QAAM,EAAE,MAAM,QAAI,sBAAS;AAC3B,QAAM,YAAW,uBAAM,aAAN,mBAAgB,UAAhB,mBAAuB,aAAvB,YAAmC,CAAC;AAErD,QAAM,OAAO,cAAc,QAAQ,QAAQ;AAC3C,QAAM,MAAmB;AAAA,IACvB,GAAG,OAAO;AAAA,IACV,GAAI,WAAW,YAAY,OAAO,UAAU,CAAC;AAAA,EAC/C;AAEA,SACE;AAAA,IAAC,eAAG;AAAA,IAAH;AAAA,MACC,SAAQ;AAAA,MACR,eAAW,iBAAG,kBAAkB,SAAS;AAAA,MACzC,OAAO;AAAA,MACN,GAAG;AAAA,MAEH,sBACC;AAAA,QAAC;AAAA;AAAA,UACE,GAAI,WAAW,YACZ,EAAE,SAAS,OAAO,eAAe,IACjC,EAAE,SAAS,OAAO;AAAA;AAAA,MACxB;AAAA;AAAA,EAEJ;AAEJ;AAIO,IAAM,iBAAa;AAAA,EACxB,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,SAAS;AAE5B,UAAM,MAAmB;AAAA,MACvB,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,mBAAmB,SAAS;AAAA,QAC1C,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAIO,IAAM,uBAAmB;AAAA,EAC9B,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AAC/B,UAAM,EAAE,OAAO,IAAI,SAAS;AAE5B,UAAM,MAAmB;AAAA,MACvB,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,iBAAG,kBAAkB,SAAS;AAAA,QACzC,OAAO;AAAA,QACN,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;","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 useMultiComponentStyle,\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\ntype AlertContext = {\n status: Status\n styles: Record<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\ntype AlertOptions = {\n /**\n * The status of the alert.\n *\n * @default 'info'\n */\n status?: Status\n}\n\nexport type AlertProps = HTMLUIProps<\"div\"> & ThemeProps<\"Alert\"> & 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] = useMultiComponentStyle(\"Alert\", {\n ...props,\n colorScheme,\n })\n const { className, children, ...rest } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\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 type AlertIconProps = 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 type AlertTitleProps = HTMLUIProps<\"p\">\n\nexport const AlertTitle = forwardRef<AlertTitleProps, \"p\">(\n ({ className, ...rest }, ref) => {\n const { styles } = useAlert()\n\n const css: CSSUIObject = {\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 type AlertDescriptionProps = 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__description\", className)}\n __css={css}\n {...rest}\n />\n )\n },\n)\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-6PL6ZUOG.mjs";
7
+ } from "./chunk-Q5YTVPKL.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": "2.0.0-next-20240705212157",
3
+ "version": "2.0.0-next-20240706062355",
4
4
  "description": "Yamada UI alert component",
5
5
  "keywords": [
6
6
  "yamada",