diff --git a/frontend/src/app/main/ui/ds/notifications/context-notification.stories.jsx b/frontend/src/app/main/ui/ds/notifications/context-notification.stories.jsx index f724c2862..e809e5839 100644 --- a/frontend/src/app/main/ui/ds/notifications/context-notification.stories.jsx +++ b/frontend/src/app/main/ui/ds/notifications/context-notification.stories.jsx @@ -40,7 +40,7 @@ export default { render: ({ ...args }) => , }; -export const Default = {}; +export const Base = {}; export const WithLongerText = { args: { @@ -63,6 +63,15 @@ export const WithHTML = { }, }; +export const Default = { + args: { + level: "default", + }, + parameters: { + controls: { exclude: ["level", "isHtml"] }, + }, +}; + export const Info = { args: { level: "info", diff --git a/frontend/src/app/main/ui/ds/notifications/toast.cljs b/frontend/src/app/main/ui/ds/notifications/toast.cljs index e0ff541c7..ee21818a1 100644 --- a/frontend/src/app/main/ui/ds/notifications/toast.cljs +++ b/frontend/src/app/main/ui/ds/notifications/toast.cljs @@ -18,7 +18,7 @@ [:map [:class {:optional true} :string] [:type {:optional true} [:maybe [:enum :toast :context]]] - [:level {:optional true} [:maybe [:enum :info :warning :error :success]]] + [:level {:optional true} [:maybe [:enum :default :info :warning :error :success]]] [:appearance {:optional true} [:enum :neutral :ghost]] [:is-html {:optional true} :boolean] [:on-close {:optional true} fn?]]) @@ -30,7 +30,7 @@ (let [class (dm/str class " " (stl/css :toast)) level (if (string? level) (keyword level) - (d/nilv level :info)) + (d/nilv level :default)) type (if (string? type) (keyword type) (d/nilv type :context)) @@ -51,6 +51,7 @@ [:> "button" {:on-click on-close :aria-label "Close" :class (stl/css-case :close-button true + :level-default (= level :default) :level-warning (= level :warning) :level-error (= level :error) :level-success (= level :success) diff --git a/frontend/src/app/main/ui/ds/notifications/toast.scss b/frontend/src/app/main/ui/ds/notifications/toast.scss index a572aac07..aabed6bd0 100644 --- a/frontend/src/app/main/ui/ds/notifications/toast.scss +++ b/frontend/src/app/main/ui/ds/notifications/toast.scss @@ -26,6 +26,10 @@ z-index: var(--toast-vertical-index); } +.level-default { + --toast-icon-color: var(--color-icon-default); +} + .level-info { --toast-icon-color: var(--color-accent-info); } diff --git a/frontend/src/app/main/ui/ds/notifications/toast.stories.jsx b/frontend/src/app/main/ui/ds/notifications/toast.stories.jsx index daf2df4ee..99f8857fb 100644 --- a/frontend/src/app/main/ui/ds/notifications/toast.stories.jsx +++ b/frontend/src/app/main/ui/ds/notifications/toast.stories.jsx @@ -31,7 +31,7 @@ export default { render: ({ ...args }) => , }; -export const Default = {}; +export const Base = {}; export const WithLongerText = { args: { @@ -51,6 +51,15 @@ export const WithHTML = { }, }; +export const Default = { + args: { + level: "default", + }, + parameters: { + controls: { exclude: ["level", "onClose"] }, + }, +}; + export const Info = { args: { level: "info",