@foxford/ui 2.88.0-beta-e1cd83a-20251209 → 2.89.0-beta-1917b0e-20251209
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/components/Notification/Notification.js +1 -1
- package/components/Notification/Notification.js.map +1 -1
- package/components/Notification/Notification.mjs +1 -1
- package/components/Notification/Notification.mjs.map +1 -1
- package/components/Notification/layouts.js +2 -0
- package/components/Notification/layouts.js.map +1 -0
- package/components/Notification/layouts.mjs +2 -0
- package/components/Notification/layouts.mjs.map +1 -0
- package/components/Notification/sizes.js +2 -0
- package/components/Notification/sizes.js.map +1 -0
- package/components/Notification/sizes.mjs +2 -0
- package/components/Notification/sizes.mjs.map +1 -0
- package/components/Notification/style.js +1 -1
- package/components/Notification/style.js.map +1 -1
- package/components/Notification/style.mjs +1 -1
- package/components/Notification/style.mjs.map +1 -1
- package/dts/index.d.ts +347 -182
- package/package.json +2 -2
- package/components/Notification/constants.js +0 -2
- package/components/Notification/constants.js.map +0 -1
- package/components/Notification/constants.mjs +0 -2
- package/components/Notification/constants.mjs.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var
|
|
1
|
+
'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var renderSlot=require('../../shared/utils/renderSlot.js');var sizes=require('./sizes.js');var style=require('./style.js');var layouts=require('./layouts.js');var jsxRuntime=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Text=require('../Text/Text.js');const createText=(e,t)=>typeof e=='string'||typeof e=='number'?jsxRuntime.jsx(Text.Text,{...t,children:e}):null;const Notification=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:s="m",status:r="system",withIcon:o=!1,layout:n="horizontal",discardButton:i,icon:a,children:l,content:c,title:u,text:d,addon:p,sizeXXS:S,sizeXS:x,sizeS:y,sizeM:j,sizeL:z,sizeXL:m,layoutXXS:T,layoutXS:h,layoutS:I,layoutM:R,layoutL:X,layoutXL:b,...P}=e;const f={size:s,sizeXXS:S,sizeXS:x,sizeS:y,sizeM:j,sizeL:z,sizeXL:m};const w={layout:n,layoutXXS:T,layoutXS:h,layoutS:I,layoutM:R,layoutL:X,layoutXL:b};const L={...f,preset:'brand',name:'infoCircle',sizes:sizes.SIZES_ICON};const k={...f,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',weight:700,sizes:d?sizes.SIZES_TITLE:sizes.SIZES_TITLE_WITHOUT_TEXT};const E={...f,as:'p',appearance:'body',wordBreak:'break-word',color:'content-onmain-primary',sizes:sizes.SIZES_TEXT};const q={...f,preset:'brand',black:!0,sizes:sizes.SIZES_ACTION};const N={...f,preset:'brand',underline:!0,textProps:{appearance:'body',wordBreak:'break-word'}};const v={...f,icon:'close',square:!0};const _={iconProps:L,titleProps:k,textProps:E,buttonProps:q,anchorProps:N,discardButtonProps:v};return jsxRuntime.jsx(style.Root,{...P,...f,status:r,ref:t,children:l?renderSlot.renderSlot({slot:l,props:_}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[o?jsxRuntime.jsx(style.Icon,{children:renderSlot.renderSlot({slot:a,props:L,fallback:jsxRuntime.jsx(Icon.Icon,{...L})})}):null,jsxRuntime.jsxs(style.Container,{...w,layouts:layouts.LAYOUTS_CONTAINER,children:[jsxRuntime.jsx(style.Content,{children:renderSlot.renderSlot({slot:c,props:{titleProps:k,textProps:E},fallback:jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[renderSlot.renderSlot({slot:u,props:k,fallback:createText(u,k)}),renderSlot.renderSlot({slot:d,props:E,fallback:createText(d,E)})]})})}),p?jsxRuntime.jsx(style.Addon,{...w,layouts:layouts.LAYOUTS_ADDON,children:renderSlot.renderSlot({slot:p,props:{anchorProps:N,buttonProps:q}})}):null]}),i?jsxRuntime.jsx(style.DiscardButton,{children:renderSlot.renderSlot({slot:i,props:v})}):null]})})})),{displayName:'Notification',sizes:sizes.SIZES});exports.Notification=Notification;
|
|
2
2
|
//# sourceMappingURL=Notification.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notification.js","sources":["../../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport {
|
|
1
|
+
{"version":3,"file":"Notification.js","sources":["../../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport type { IconProps } from 'components/Icon'\nimport { Icon } from 'components/Icon'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ButtonProps } from 'components/Button'\nimport type { AnchorProps } from 'components/Anchor'\nimport type { TextProps } from 'components/Text'\nimport { Text } from 'components/Text'\nimport { renderSlot } from 'shared/utils/renderSlot'\nimport { SIZES, SIZES_ICON, SIZES_TEXT, SIZES_ACTION, SIZES_TITLE, SIZES_TITLE_WITHOUT_TEXT } from './sizes'\nimport * as Styled from './style'\nimport type { NotificationProps } from './types'\nimport { LAYOUTS_ADDON, LAYOUTS_CONTAINER } from './layouts'\n\nconst COMPONENT_NAME = 'Notification'\n\nconst createText = (content: unknown, props: TextProps) => {\n return typeof content === 'string' || typeof content === 'number' ? <Text {...props}>{content}</Text> : null\n}\n\n/**\n *\n * *v1.0.0*\n *\n * Компонент для отображения информационных сообщений, встроенных в интерфейс.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n *\n */\nconst Notification: React.ForwardRefExoticComponent<NotificationProps> = withMergedProps<\n NotificationProps,\n HTMLDivElement\n>(\n forwardRef<HTMLDivElement, MergedProps<NotificationProps>>((props, ref) => {\n const {\n size = 'm',\n status = 'system',\n withIcon = false,\n layout = 'horizontal',\n discardButton,\n icon,\n children,\n content,\n title,\n text,\n addon,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n layoutXXS,\n layoutXS,\n layoutS,\n layoutM,\n layoutL,\n layoutXL,\n ...restProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const layoutProps = {\n layout,\n layoutXXS,\n layoutXS,\n layoutS,\n layoutM,\n layoutL,\n layoutXL,\n }\n\n const iconProps: IconProps = {\n ...sizeProps,\n preset: 'brand',\n name: 'infoCircle',\n sizes: SIZES_ICON,\n }\n\n const titleProps: TextProps = {\n ...sizeProps,\n as: 'p',\n appearance: 'body',\n color: 'content-onmain-primary',\n wordBreak: 'break-word',\n weight: 700,\n sizes: text ? SIZES_TITLE : SIZES_TITLE_WITHOUT_TEXT,\n }\n\n const textProps: TextProps = {\n ...sizeProps,\n as: 'p',\n appearance: 'body',\n wordBreak: 'break-word',\n color: 'content-onmain-primary',\n sizes: SIZES_TEXT,\n }\n\n const buttonProps: ButtonProps = {\n ...sizeProps,\n preset: 'brand',\n black: true,\n sizes: SIZES_ACTION,\n }\n\n const anchorProps: AnchorProps = {\n ...sizeProps,\n preset: 'brand',\n underline: true,\n textProps: {\n appearance: 'body',\n wordBreak: 'break-word',\n },\n }\n\n const discardButtonProps: IconButtonProps = {\n ...sizeProps,\n icon: 'close',\n square: true,\n }\n\n const rootProps = { iconProps, titleProps, textProps, buttonProps, anchorProps, discardButtonProps }\n\n return (\n <Styled.Root {...restProps} {...sizeProps} status={status} ref={ref}>\n {children ? (\n renderSlot({\n slot: children,\n props: rootProps,\n })\n ) : (\n <>\n {withIcon ? (\n <Styled.Icon>\n {renderSlot({\n slot: icon,\n props: iconProps,\n fallback: <Icon {...iconProps} />,\n })}\n </Styled.Icon>\n ) : null}\n\n <Styled.Container {...layoutProps} layouts={LAYOUTS_CONTAINER}>\n <Styled.Content>\n {renderSlot({\n slot: content,\n props: { titleProps, textProps },\n fallback: (\n <>\n {renderSlot({\n slot: title,\n props: titleProps,\n fallback: createText(title, titleProps),\n })}\n {renderSlot({\n slot: text,\n props: textProps,\n fallback: createText(text, textProps),\n })}\n </>\n ),\n })}\n </Styled.Content>\n\n {addon ? (\n <Styled.Addon {...layoutProps} layouts={LAYOUTS_ADDON}>\n {renderSlot({\n slot: addon,\n props: { anchorProps, buttonProps },\n })}\n </Styled.Addon>\n ) : null}\n </Styled.Container>\n\n {discardButton ? (\n <Styled.DiscardButton>\n {renderSlot({\n slot: discardButton,\n props: discardButtonProps,\n })}\n </Styled.DiscardButton>\n ) : null}\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Notification }\n"],"names":["createText","content","props","_jsx","jsx","Text","children","Notification","withMergedProps","forwardRef","ref","size","status","withIcon","layout","discardButton","icon","title","text","addon","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","restProps","sizeProps","layoutProps","iconProps","preset","name","sizes","SIZES_ICON","titleProps","as","appearance","color","wordBreak","weight","SIZES_TITLE","SIZES_TITLE_WITHOUT_TEXT","textProps","SIZES_TEXT","buttonProps","black","SIZES_ACTION","anchorProps","underline","discardButtonProps","square","rootProps","Styled","renderSlot","slot","_jsxs","jsxs","_Fragment","fallback","Icon","layouts","LAYOUTS_CONTAINER","LAYOUTS_ADDON","displayName","SIZES"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES,
|
|
1
|
+
import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{renderSlot}from'../../shared/utils/renderSlot.mjs';import{SIZES,SIZES_ICON,SIZES_TITLE,SIZES_TITLE_WITHOUT_TEXT,SIZES_TEXT,SIZES_ACTION}from'./sizes.mjs';import{Root,Icon,Container,Content,Addon,DiscardButton}from'./style.mjs';import{LAYOUTS_CONTAINER,LAYOUTS_ADDON}from'./layouts.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Icon as Icon$1}from'../Icon/Icon.mjs';import{Text}from'../Text/Text.mjs';const createText=(o,t)=>typeof o=='string'||typeof o=='number'?jsx(Text,{...t,children:o}):null;const Notification=withMergedProps(forwardRef(((o,t)=>{const{size:r="m",status:e="system",withIcon:s=!1,layout:n="horizontal",discardButton:a,icon:i,children:l,content:c,title:p,text:d,addon:S,sizeXXS:m,sizeXS:u,sizeS:T,sizeM:I,sizeL:y,sizeXL:x,layoutXXS:f,layoutXS:E,layoutS:z,layoutM:h,layoutL:j,layoutXL:X,..._}=o;const b={size:r,sizeXXS:m,sizeXS:u,sizeS:T,sizeM:I,sizeL:y,sizeXL:x};const L={layout:n,layoutXXS:f,layoutXS:E,layoutS:z,layoutM:h,layoutL:j,layoutXL:X};const N={...b,preset:'brand',name:'infoCircle',sizes:SIZES_ICON};const O={...b,as:'p',appearance:'body',color:'content-onmain-primary',wordBreak:'break-word',weight:700,sizes:d?SIZES_TITLE:SIZES_TITLE_WITHOUT_TEXT};const P={...b,as:'p',appearance:'body',wordBreak:'break-word',color:'content-onmain-primary',sizes:SIZES_TEXT};const w={...b,preset:'brand',black:!0,sizes:SIZES_ACTION};const A={...b,preset:'brand',underline:!0,textProps:{appearance:'body',wordBreak:'break-word'}};const Z={...b,icon:'close',square:!0};const k={iconProps:N,titleProps:O,textProps:P,buttonProps:w,anchorProps:A,discardButtonProps:Z};return jsx(Root,{..._,...b,status:e,ref:t,children:l?renderSlot({slot:l,props:k}):jsxs(Fragment,{children:[s?jsx(Icon,{children:renderSlot({slot:i,props:N,fallback:jsx(Icon$1,{...N})})}):null,jsxs(Container,{...L,layouts:LAYOUTS_CONTAINER,children:[jsx(Content,{children:renderSlot({slot:c,props:{titleProps:O,textProps:P},fallback:jsxs(Fragment,{children:[renderSlot({slot:p,props:O,fallback:createText(p,O)}),renderSlot({slot:d,props:P,fallback:createText(d,P)})]})})}),S?jsx(Addon,{...L,layouts:LAYOUTS_ADDON,children:renderSlot({slot:S,props:{anchorProps:A,buttonProps:w}})}):null]}),a?jsx(DiscardButton,{children:renderSlot({slot:a,props:Z})}):null]})})})),{displayName:'Notification',sizes:SIZES});export{Notification};
|
|
2
2
|
//# sourceMappingURL=Notification.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Notification.mjs","sources":["../../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport { Icon } from 'components/Icon'\nimport {
|
|
1
|
+
{"version":3,"file":"Notification.mjs","sources":["../../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport type { MergedProps } from 'hocs/withMergedProps'\nimport type { IconProps } from 'components/Icon'\nimport { Icon } from 'components/Icon'\nimport type { IconButtonProps } from 'components/IconButton'\nimport type { ButtonProps } from 'components/Button'\nimport type { AnchorProps } from 'components/Anchor'\nimport type { TextProps } from 'components/Text'\nimport { Text } from 'components/Text'\nimport { renderSlot } from 'shared/utils/renderSlot'\nimport { SIZES, SIZES_ICON, SIZES_TEXT, SIZES_ACTION, SIZES_TITLE, SIZES_TITLE_WITHOUT_TEXT } from './sizes'\nimport * as Styled from './style'\nimport type { NotificationProps } from './types'\nimport { LAYOUTS_ADDON, LAYOUTS_CONTAINER } from './layouts'\n\nconst COMPONENT_NAME = 'Notification'\n\nconst createText = (content: unknown, props: TextProps) => {\n return typeof content === 'string' || typeof content === 'number' ? <Text {...props}>{content}</Text> : null\n}\n\n/**\n *\n * *v1.0.0*\n *\n * Компонент для отображения информационных сообщений, встроенных в интерфейс.\n *\n * Поддерживается \"ref\" и все нативные атрибуты \\<div\\> элемента.\n *\n */\nconst Notification: React.ForwardRefExoticComponent<NotificationProps> = withMergedProps<\n NotificationProps,\n HTMLDivElement\n>(\n forwardRef<HTMLDivElement, MergedProps<NotificationProps>>((props, ref) => {\n const {\n size = 'm',\n status = 'system',\n withIcon = false,\n layout = 'horizontal',\n discardButton,\n icon,\n children,\n content,\n title,\n text,\n addon,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n layoutXXS,\n layoutXS,\n layoutS,\n layoutM,\n layoutL,\n layoutXL,\n ...restProps\n } = props\n\n const sizeProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }\n\n const layoutProps = {\n layout,\n layoutXXS,\n layoutXS,\n layoutS,\n layoutM,\n layoutL,\n layoutXL,\n }\n\n const iconProps: IconProps = {\n ...sizeProps,\n preset: 'brand',\n name: 'infoCircle',\n sizes: SIZES_ICON,\n }\n\n const titleProps: TextProps = {\n ...sizeProps,\n as: 'p',\n appearance: 'body',\n color: 'content-onmain-primary',\n wordBreak: 'break-word',\n weight: 700,\n sizes: text ? SIZES_TITLE : SIZES_TITLE_WITHOUT_TEXT,\n }\n\n const textProps: TextProps = {\n ...sizeProps,\n as: 'p',\n appearance: 'body',\n wordBreak: 'break-word',\n color: 'content-onmain-primary',\n sizes: SIZES_TEXT,\n }\n\n const buttonProps: ButtonProps = {\n ...sizeProps,\n preset: 'brand',\n black: true,\n sizes: SIZES_ACTION,\n }\n\n const anchorProps: AnchorProps = {\n ...sizeProps,\n preset: 'brand',\n underline: true,\n textProps: {\n appearance: 'body',\n wordBreak: 'break-word',\n },\n }\n\n const discardButtonProps: IconButtonProps = {\n ...sizeProps,\n icon: 'close',\n square: true,\n }\n\n const rootProps = { iconProps, titleProps, textProps, buttonProps, anchorProps, discardButtonProps }\n\n return (\n <Styled.Root {...restProps} {...sizeProps} status={status} ref={ref}>\n {children ? (\n renderSlot({\n slot: children,\n props: rootProps,\n })\n ) : (\n <>\n {withIcon ? (\n <Styled.Icon>\n {renderSlot({\n slot: icon,\n props: iconProps,\n fallback: <Icon {...iconProps} />,\n })}\n </Styled.Icon>\n ) : null}\n\n <Styled.Container {...layoutProps} layouts={LAYOUTS_CONTAINER}>\n <Styled.Content>\n {renderSlot({\n slot: content,\n props: { titleProps, textProps },\n fallback: (\n <>\n {renderSlot({\n slot: title,\n props: titleProps,\n fallback: createText(title, titleProps),\n })}\n {renderSlot({\n slot: text,\n props: textProps,\n fallback: createText(text, textProps),\n })}\n </>\n ),\n })}\n </Styled.Content>\n\n {addon ? (\n <Styled.Addon {...layoutProps} layouts={LAYOUTS_ADDON}>\n {renderSlot({\n slot: addon,\n props: { anchorProps, buttonProps },\n })}\n </Styled.Addon>\n ) : null}\n </Styled.Container>\n\n {discardButton ? (\n <Styled.DiscardButton>\n {renderSlot({\n slot: discardButton,\n props: discardButtonProps,\n })}\n </Styled.DiscardButton>\n ) : null}\n </>\n )}\n </Styled.Root>\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { Notification }\n"],"names":["createText","content","props","_jsx","Text","children","Notification","withMergedProps","forwardRef","ref","size","status","withIcon","layout","discardButton","icon","title","text","addon","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","layoutXXS","layoutXS","layoutS","layoutM","layoutL","layoutXL","restProps","sizeProps","layoutProps","iconProps","preset","name","sizes","SIZES_ICON","titleProps","as","appearance","color","wordBreak","weight","SIZES_TITLE","SIZES_TITLE_WITHOUT_TEXT","textProps","SIZES_TEXT","buttonProps","black","SIZES_ACTION","anchorProps","underline","discardButtonProps","square","rootProps","Styled","renderSlot","slot","_jsxs","_Fragment","fallback","Icon","layouts","LAYOUTS_CONTAINER","LAYOUTS_ADDON","displayName","SIZES"],"mappings":"ggBAkBA,MAAMA,WAAaA,CAACC,EAAkBC,WACtBD,GAAY,iBAAmBA,GAAY,SAAWE,IAACC,KAAI,IAAKF,EAAKG,SAAGJ,IAAkB,KAYpGK,MAAAA,aAAmEC,gBAIvEC,YAA2D,CAACN,EAAOO,KACjE,MAAMC,KACJA,EAAO,IAAGC,OACVA,EAAS,SAAQC,SACjBA,GAAW,EAAKC,OAChBA,EAAS,aAAYC,cACrBA,EAAaC,KACbA,EAAIV,SACJA,EAAQJ,QACRA,EAAOe,MACPA,EAAKC,KACLA,EAAIC,MACJA,EAAKC,QACLA,EAAOC,OACPA,EAAMC,MACNA,EAAKC,MACLA,EAAKC,MACLA,EAAKC,OACLA,EAAMC,UACNA,EAASC,SACTA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,QACPA,EAAOC,SACPA,KACGC,GACD7B,EAEJ,MAAM8B,EAAY,CAChBtB,OACAS,UACAC,SACAC,QACAC,QACAC,QACAC,UAGF,MAAMS,EAAc,CAClBpB,SACAY,YACAC,WACAC,UACAC,UACAC,UACAC,YAGF,MAAMI,EAAuB,IACxBF,EACHG,OAAQ,QACRC,KAAM,aACNC,MAAOC,YAGT,MAAMC,EAAwB,IACzBP,EACHQ,GAAI,IACJC,WAAY,OACZC,MAAO,yBACPC,UAAW,aACXC,OAAQ,IACRP,MAAOpB,EAAO4B,YAAcC,0BAG9B,MAAMC,EAAuB,IACxBf,EACHQ,GAAI,IACJC,WAAY,OACZE,UAAW,aACXD,MAAO,yBACPL,MAAOW,YAGT,MAAMC,EAA2B,IAC5BjB,EACHG,OAAQ,QACRe,OAAO,EACPb,MAAOc,cAGT,MAAMC,EAA2B,IAC5BpB,EACHG,OAAQ,QACRkB,WAAW,EACXN,UAAW,CACTN,WAAY,OACZE,UAAW,eAIf,MAAMW,EAAsC,IACvCtB,EACHjB,KAAM,QACNwC,QAAQ,GAGV,MAAMC,EAAY,CAAEtB,YAAWK,aAAYQ,YAAWE,cAAaG,cAAaE,sBAEhF,OACEnD,IAACsD,KAAW,IAAK1B,KAAeC,EAAWrB,OAAQA,EAAQF,IAAKA,EAAIJ,SACjEA,EACCqD,WAAW,CACTC,KAAMtD,EACNH,MAAOsD,IAGTI,KAAAC,SAAA,CAAAxD,UACGO,EACCT,IAACsD,KAAW,CAAApD,SACTqD,WAAW,CACVC,KAAM5C,EACNb,MAAOgC,EACP4B,SAAU3D,IAAC4D,OAAI,IAAK7B,QAGtB,KAEJ0B,KAACH,UAAgB,IAAKxB,EAAa+B,QAASC,kBAAkB5D,SAC5DF,CAAAA,IAACsD,QAAc,CAAApD,SACZqD,WAAW,CACVC,KAAM1D,EACNC,MAAO,CAAEqC,aAAYQ,aACrBe,SACEF,KAAAC,SAAA,CAAAxD,SAAA,CACGqD,WAAW,CACVC,KAAM3C,EACNd,MAAOqC,EACPuB,SAAU9D,WAAWgB,EAAOuB,KAE7BmB,WAAW,CACVC,KAAM1C,EACNf,MAAO6C,EACPe,SAAU9D,WAAWiB,EAAM8B,YAOpC7B,EACCf,IAACsD,MAAY,IAAKxB,EAAa+B,QAASE,cAAc7D,SACnDqD,WAAW,CACVC,KAAMzC,EACNhB,MAAO,CAAEkD,cAAaH,mBAGxB,QAGLnC,EACCX,IAACsD,cAAoB,CAAApD,SAClBqD,WAAW,CACVC,KAAM7C,EACNZ,MAAOoD,MAGT,SAGI,IAGlB,CACEa,YAvLmB,eAwLnB9B,MAAO+B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layouts.js","sources":["../../../../src/components/Notification/layouts.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Layout } from './types'\n\nexport const LAYOUTS_CONTAINER: Record<Layout, CSSProperties> = {\n vertical: {\n flexDirection: 'column',\n },\n horizontal: {\n flexDirection: 'row',\n },\n}\n\nexport const LAYOUTS_ADDON: Record<Layout, CSSProperties> = {\n vertical: {\n marginTop: 'var(--gap-container)',\n },\n horizontal: {\n marginTop: 0,\n },\n}\n"],"names":["vertical","marginTop","horizontal","flexDirection"],"mappings":"mCAY4D,CAC1DA,SAAU,CACRC,UAAW,wBAEbC,WAAY,CACVD,UAAW,8BAdiD,CAC9DD,SAAU,CACRG,cAAe,UAEjBD,WAAY,CACVC,cAAe"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"layouts.mjs","sources":["../../../../src/components/Notification/layouts.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { Layout } from './types'\n\nexport const LAYOUTS_CONTAINER: Record<Layout, CSSProperties> = {\n vertical: {\n flexDirection: 'column',\n },\n horizontal: {\n flexDirection: 'row',\n },\n}\n\nexport const LAYOUTS_ADDON: Record<Layout, CSSProperties> = {\n vertical: {\n marginTop: 'var(--gap-container)',\n },\n horizontal: {\n marginTop: 0,\n },\n}\n"],"names":["LAYOUTS_CONTAINER","vertical","flexDirection","horizontal","LAYOUTS_ADDON","marginTop"],"mappings":"AAGO,MAAMA,kBAAmD,CAC9DC,SAAU,CACRC,cAAe,UAEjBC,WAAY,CACVD,cAAe,QAIZ,MAAME,cAA+C,CAC1DH,SAAU,CACRI,UAAW,wBAEbF,WAAY,CACVE,UAAW"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use strict';var sizes=require('../Button/sizes.js');require('../Button/Button.js');const SIZES_ACTION={l:sizes.SIZES.l,m:sizes.SIZES.s,s:sizes.SIZES.s};exports.SIZES={l:{padding:20,borderRadius:12,minHeight:68,'--gap':'12px','--gap-container':'11px'},m:{padding:16,borderRadius:10,minHeight:58,'--gap':'10px','--gap-container':'8px'},s:{padding:12,borderRadius:8,minHeight:44,'--gap':'8px','--gap-container':'6px'}},exports.SIZES_ACTION=SIZES_ACTION,exports.SIZES_ICON={l:{fontSize:28},m:{fontSize:24},s:{fontSize:20}},exports.SIZES_TEXT={l:{fontSize:18,marginTop:2},m:{fontSize:16,marginTop:3},s:{fontSize:14,marginTop:1}},exports.SIZES_TITLE={l:{fontSize:20,marginTop:1,marginBottom:5},m:{fontSize:20,marginTop:-1,marginBottom:2},s:{fontSize:16,marginTop:1,marginBottom:1}},exports.SIZES_TITLE_WITHOUT_TEXT={l:{fontSize:20,marginTop:1,marginBottom:0},m:{fontSize:20,marginTop:-1,marginBottom:0},s:{fontSize:16,marginTop:1,marginBottom:0}};
|
|
2
|
+
//# sourceMappingURL=sizes.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sizes.js","sources":["../../../../src/components/Notification/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_BUTTON } from 'components/Button'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: {\n padding: 20,\n borderRadius: 12,\n minHeight: 68,\n '--gap': '12px',\n '--gap-container': '11px',\n },\n m: {\n padding: 16,\n borderRadius: 10,\n minHeight: 58,\n '--gap': '10px',\n '--gap-container': '8px',\n },\n s: {\n padding: 12,\n borderRadius: 8,\n minHeight: 44,\n '--gap': '8px',\n '--gap-container': '6px',\n },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n l: { fontSize: 28 },\n m: { fontSize: 24 },\n s: { fontSize: 20 },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n l: { fontSize: 20, marginTop: 1, marginBottom: 5 },\n m: { fontSize: 20, marginTop: -1, marginBottom: 2 },\n s: { fontSize: 16, marginTop: 1, marginBottom: 1 },\n}\n\nexport const SIZES_TITLE_WITHOUT_TEXT: Record<Size, CSSProperties> = {\n l: { fontSize: 20, marginTop: 1, marginBottom: 0 },\n m: { fontSize: 20, marginTop: -1, marginBottom: 0 },\n s: { fontSize: 16, marginTop: 1, marginBottom: 0 },\n}\n\nexport const SIZES_TEXT: Record<Size, CSSProperties> = {\n l: { fontSize: 18, marginTop: 2 },\n m: { fontSize: 16, marginTop: 3 },\n s: { fontSize: 14, marginTop: 1 },\n}\n\nexport const SIZES_ACTION: Record<Size, CSSProperties> = {\n l: SIZES_BUTTON.l,\n m: SIZES_BUTTON.s,\n s: SIZES_BUTTON.s,\n}\n"],"names":["SIZES_ACTION","l","SIZES_BUTTON","SIZES","m","s","padding","borderRadius","minHeight","fontSize","marginTop","marginBottom"],"mappings":"oFAoDO,MAAMA,aAA4C,CACvDC,EAAGC,MAAYC,MAACF,EAChBG,EAAGF,MAAYC,MAACE,EAChBA,EAAGH,MAAYC,MAACE,iBAnDgC,CAChDJ,EAAG,CACDK,QAAS,GACTC,aAAc,GACdC,UAAW,GACX,QAAS,OACT,kBAAmB,QAErBJ,EAAG,CACDE,QAAS,GACTC,aAAc,GACdC,UAAW,GACX,QAAS,OACT,kBAAmB,OAErBH,EAAG,CACDC,QAAS,GACTC,aAAc,EACdC,UAAW,GACX,QAAS,MACT,kBAAmB,6DAIgC,CACrDP,EAAG,CAAEQ,SAAU,IACfL,EAAG,CAAEK,SAAU,IACfJ,EAAG,CAAEI,SAAU,wBAesC,CACrDR,EAAG,CAAEQ,SAAU,GAAIC,UAAW,GAC9BN,EAAG,CAAEK,SAAU,GAAIC,UAAW,GAC9BL,EAAG,CAAEI,SAAU,GAAIC,UAAW,wBAfwB,CACtDT,EAAG,CAAEQ,SAAU,GAAIC,UAAW,EAAGC,aAAc,GAC/CP,EAAG,CAAEK,SAAU,GAAIC,WAAY,EAAGC,aAAc,GAChDN,EAAG,CAAEI,SAAU,GAAIC,UAAW,EAAGC,aAAc,qCAGoB,CACnEV,EAAG,CAAEQ,SAAU,GAAIC,UAAW,EAAGC,aAAc,GAC/CP,EAAG,CAAEK,SAAU,GAAIC,WAAY,EAAGC,aAAc,GAChDN,EAAG,CAAEI,SAAU,GAAIC,UAAW,EAAGC,aAAc"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{SIZES as SIZES$1}from'../Button/sizes.mjs';import'../Button/Button.mjs';const SIZES={l:{padding:20,borderRadius:12,minHeight:68,'--gap':'12px','--gap-container':'11px'},m:{padding:16,borderRadius:10,minHeight:58,'--gap':'10px','--gap-container':'8px'},s:{padding:12,borderRadius:8,minHeight:44,'--gap':'8px','--gap-container':'6px'}};const SIZES_ICON={l:{fontSize:28},m:{fontSize:24},s:{fontSize:20}};const SIZES_TITLE={l:{fontSize:20,marginTop:1,marginBottom:5},m:{fontSize:20,marginTop:-1,marginBottom:2},s:{fontSize:16,marginTop:1,marginBottom:1}};const SIZES_TITLE_WITHOUT_TEXT={l:{fontSize:20,marginTop:1,marginBottom:0},m:{fontSize:20,marginTop:-1,marginBottom:0},s:{fontSize:16,marginTop:1,marginBottom:0}};const SIZES_TEXT={l:{fontSize:18,marginTop:2},m:{fontSize:16,marginTop:3},s:{fontSize:14,marginTop:1}};const SIZES_ACTION={l:SIZES$1.l,m:SIZES$1.s,s:SIZES$1.s};export{SIZES,SIZES_ACTION,SIZES_ICON,SIZES_TEXT,SIZES_TITLE,SIZES_TITLE_WITHOUT_TEXT};
|
|
2
|
+
//# sourceMappingURL=sizes.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sizes.mjs","sources":["../../../../src/components/Notification/sizes.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { SIZES as SIZES_BUTTON } from 'components/Button'\nimport type { Size } from './types'\n\nexport const SIZES: Record<Size, CSSProperties> = {\n l: {\n padding: 20,\n borderRadius: 12,\n minHeight: 68,\n '--gap': '12px',\n '--gap-container': '11px',\n },\n m: {\n padding: 16,\n borderRadius: 10,\n minHeight: 58,\n '--gap': '10px',\n '--gap-container': '8px',\n },\n s: {\n padding: 12,\n borderRadius: 8,\n minHeight: 44,\n '--gap': '8px',\n '--gap-container': '6px',\n },\n}\n\nexport const SIZES_ICON: Record<Size, CSSProperties> = {\n l: { fontSize: 28 },\n m: { fontSize: 24 },\n s: { fontSize: 20 },\n}\n\nexport const SIZES_TITLE: Record<Size, CSSProperties> = {\n l: { fontSize: 20, marginTop: 1, marginBottom: 5 },\n m: { fontSize: 20, marginTop: -1, marginBottom: 2 },\n s: { fontSize: 16, marginTop: 1, marginBottom: 1 },\n}\n\nexport const SIZES_TITLE_WITHOUT_TEXT: Record<Size, CSSProperties> = {\n l: { fontSize: 20, marginTop: 1, marginBottom: 0 },\n m: { fontSize: 20, marginTop: -1, marginBottom: 0 },\n s: { fontSize: 16, marginTop: 1, marginBottom: 0 },\n}\n\nexport const SIZES_TEXT: Record<Size, CSSProperties> = {\n l: { fontSize: 18, marginTop: 2 },\n m: { fontSize: 16, marginTop: 3 },\n s: { fontSize: 14, marginTop: 1 },\n}\n\nexport const SIZES_ACTION: Record<Size, CSSProperties> = {\n l: SIZES_BUTTON.l,\n m: SIZES_BUTTON.s,\n s: SIZES_BUTTON.s,\n}\n"],"names":["SIZES","l","padding","borderRadius","minHeight","m","s","SIZES_ICON","fontSize","SIZES_TITLE","marginTop","marginBottom","SIZES_TITLE_WITHOUT_TEXT","SIZES_TEXT","SIZES_ACTION","SIZES_BUTTON"],"mappings":"+EAIO,MAAMA,MAAqC,CAChDC,EAAG,CACDC,QAAS,GACTC,aAAc,GACdC,UAAW,GACX,QAAS,OACT,kBAAmB,QAErBC,EAAG,CACDH,QAAS,GACTC,aAAc,GACdC,UAAW,GACX,QAAS,OACT,kBAAmB,OAErBE,EAAG,CACDJ,QAAS,GACTC,aAAc,EACdC,UAAW,GACX,QAAS,MACT,kBAAmB,QAIhB,MAAMG,WAA0C,CACrDN,EAAG,CAAEO,SAAU,IACfH,EAAG,CAAEG,SAAU,IACfF,EAAG,CAAEE,SAAU,KAGV,MAAMC,YAA2C,CACtDR,EAAG,CAAEO,SAAU,GAAIE,UAAW,EAAGC,aAAc,GAC/CN,EAAG,CAAEG,SAAU,GAAIE,WAAY,EAAGC,aAAc,GAChDL,EAAG,CAAEE,SAAU,GAAIE,UAAW,EAAGC,aAAc,IAG1C,MAAMC,yBAAwD,CACnEX,EAAG,CAAEO,SAAU,GAAIE,UAAW,EAAGC,aAAc,GAC/CN,EAAG,CAAEG,SAAU,GAAIE,WAAY,EAAGC,aAAc,GAChDL,EAAG,CAAEE,SAAU,GAAIE,UAAW,EAAGC,aAAc,IAG1C,MAAME,WAA0C,CACrDZ,EAAG,CAAEO,SAAU,GAAIE,UAAW,GAC9BL,EAAG,CAAEG,SAAU,GAAIE,UAAW,GAC9BJ,EAAG,CAAEE,SAAU,GAAIE,UAAW,IAGzB,MAAMI,aAA4C,CACvDb,EAAGc,QAAad,EAChBI,EAAGU,QAAaT,EAChBA,EAAGS,QAAaT"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');function _interopDefault(
|
|
1
|
+
'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var responsiveLayout=require('../../mixins/responsive-layout.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardNotificationProp=style.createShouldForwardProp((o=>!['status'].includes(o)));const template=o=>`\n color: ${o.color};\n background-color: ${o.backgroundColor};\n`;const COLOR_SCHEMA={system:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],...o.palette}))),info:styled.css(["",""],(o=>template({color:o.theme.colors['alert-info'],backgroundColor:o.theme.colors['alert-bg-info-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['alert-success'],backgroundColor:o.theme.colors['alert-bg-success-100'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['alert-error'],backgroundColor:o.theme.colors['alert-bg-error-100'],...o.palette}))),warning:styled.css(["",""],(o=>template({color:o.theme.colors['alert-warning'],backgroundColor:o.theme.colors['alert-bg-warning-100'],...o.palette})))};const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardNotificationProp}).withConfig({displayName:"Notification__Root",componentId:"ui__sc-19hb9p3-0"})(["box-sizing:border-box;display:flex;min-width:min-content;& > *:not(:last-child){margin-right:var(--gap);}"," "," ",""],(o=>COLOR_SCHEMA[o.status]),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Container=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Container",componentId:"ui__sc-19hb9p3-1"})(["box-sizing:border-box;display:flex;align-items:flex-start;flex-grow:1;& > *:not(:last-child){margin-right:var(--gap-container);}",""],responsiveLayout.responsiveLayout);const Icon=styled__default.default.div.withConfig({displayName:"Notification__Icon",componentId:"ui__sc-19hb9p3-2"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const DiscardButton=styled__default.default.div.withConfig({displayName:"Notification__DiscardButton",componentId:"ui__sc-19hb9p3-3"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const Content=styled__default.default.div.withConfig({displayName:"Notification__Content",componentId:"ui__sc-19hb9p3-4"})(["box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;flex-basis:58%;flex-grow:1;width:100%;height:fit-content;"]);const Addon=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Addon",componentId:"ui__sc-19hb9p3-5"})(["box-sizing:border-box;display:flex;height:100%;",""],responsiveLayout.responsiveLayout);exports.Addon=Addon,exports.Container=Container,exports.Content=Content,exports.DiscardButton=DiscardButton,exports.Icon=Icon,exports.Root=Root;
|
|
2
2
|
//# sourceMappingURL=style.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus } from './types'\n\nconst
|
|
1
|
+
{"version":3,"file":"style.js","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { ResponsiveLayoutInterpolationProps } from 'shared/interfaces'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus, Layout } from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardNotificationProp = createShouldForwardProp((propKey) => !['status'].includes(propKey))\n\nconst template = (palette: NotificationPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA: Record<\n NotificationStatus,\n FlattenInterpolation<ThemedStyledProps<StyledNotificationProps, DefaultTheme>>\n> = {\n system: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-secondary'],\n ...props.palette,\n })}\n `,\n info: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-info'],\n backgroundColor: props.theme.colors['alert-bg-info-100'],\n ...props.palette,\n })}\n `,\n success: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-success'],\n backgroundColor: props.theme.colors['alert-bg-success-100'],\n ...props.palette,\n })}\n `,\n error: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-error'],\n backgroundColor: props.theme.colors['alert-bg-error-100'],\n ...props.palette,\n })}\n `,\n warning: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-warning'],\n backgroundColor: props.theme.colors['alert-bg-warning-100'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledNotificationProps>({\n shouldForwardProp: shouldForwardNotificationProp,\n})`\n box-sizing: border-box;\n display: flex;\n min-width: min-content;\n\n & > *:not(:last-child) {\n margin-right: var(--gap);\n }\n\n ${(props) => COLOR_SCHEMA[props.status]}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n flex-grow: 1;\n\n & > *:not(:last-child) {\n margin-right: var(--gap-container);\n }\n\n ${responsiveLayout}\n`\n\nexport const Icon = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const DiscardButton = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const Content = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-basis: 58%;\n flex-grow: 1;\n width: 100%;\n height: fit-content;\n`\n\nexport const Addon = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n height: 100%;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardNotificationProp","createShouldForwardProp","template","palette","color","backgroundColor","COLOR_SCHEMA","system","css","props","theme","colors","info","success","error","warning","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","status","responsiveSize","responsiveMargin","Container","responsiveLayout","Icon","DiscardButton","Content","Addon"],"mappings":"qZASA,MAAMA,kBAAqBC,IACxB,CAAC,SAAU,YAAa,WAAY,UAAW,UAAW,UAAW,WAAY,WAAWC,SAASD,GAExG,MAAME,8BAAgCC,MAAAA,yBAAyBH,IAAa,CAAC,UAAUC,SAASD,KAEhG,MAAMI,SAAYC,GAAiC,cACxCA,EAAQC,+BACGD,EAAQE,qBAG9B,MAAMC,aAGF,CACFC,OAAQC,OAAGA,IAAA,CAAA,GAAA,KACNC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,0BAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,0BACjCF,EAAMN,YAGfS,KAAMJ,OAAGA,IAAA,CAAA,GAAA,KACJC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,cAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,wBACjCF,EAAMN,YAGfU,QAASL,OAAGA,IAAA,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,YAGfW,MAAON,OAAGA,IAAA,CAAA,GAAA,KACLC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,eAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,yBACjCF,EAAMN,YAGfY,QAASP,OAAGA,IAAA,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,aAKV,MAAMa,KAAOC,gBAAAA,QAAOC,IAAIC,WAAoC,CACjEC,kBAAmBpB,gCACnBmB,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAFkBL,CAElB,CAAA,4GAAA,IAAA,IAAA,KASGR,GAAUH,aAAaG,EAAMc,SAE9BC,eAAAA,eACAC,iBAAAA,kBAGG,MAAMC,UAAYT,gBAAAA,QAAOC,IAAIC,WAAuD,CACzFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,0BAAAC,YAAA,oBAFuBL,CAEvB,CAAA,mIAAA,IAUEU,iBAAAA,wBAGSC,KAAOX,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAAVL,CAKnB,CAAA,+EAEYY,cAAgBZ,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,8BAAAC,YAAA,oBAAVL,CAK5B,CAAA,+EAEYa,QAAUb,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,wBAAAC,YAAA,oBAAVL,CAStB,CAAA,8IAEM,MAAMc,MAAQd,gBAAAA,QAAOC,IAAIC,WAAuD,CACrFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,sBAAAC,YAAA,oBAFmBL,CAEnB,CAAA,kDAAA,IAKEU,iBAAgBA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';const shouldForwardNotificationProp=createShouldForwardProp((o=>!['status'
|
|
1
|
+
import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{responsiveLayout}from'../../mixins/responsive-layout.mjs';const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardNotificationProp=createShouldForwardProp((o=>!['status'].includes(o)));const template=o=>`\n color: ${o.color};\n background-color: ${o.backgroundColor};\n`;const COLOR_SCHEMA={system:css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],...o.palette}))),info:css(["",""],(o=>template({color:o.theme.colors['alert-info'],backgroundColor:o.theme.colors['alert-bg-info-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['alert-success'],backgroundColor:o.theme.colors['alert-bg-success-100'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['alert-error'],backgroundColor:o.theme.colors['alert-bg-error-100'],...o.palette}))),warning:css(["",""],(o=>template({color:o.theme.colors['alert-warning'],backgroundColor:o.theme.colors['alert-bg-warning-100'],...o.palette})))};const Root=styled.div.withConfig({shouldForwardProp:shouldForwardNotificationProp}).withConfig({displayName:"Notification__Root",componentId:"ui__sc-19hb9p3-0"})(["box-sizing:border-box;display:flex;min-width:min-content;& > *:not(:last-child){margin-right:var(--gap);}"," "," ",""],(o=>COLOR_SCHEMA[o.status]),responsiveSize,responsiveMargin);const Container=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Container",componentId:"ui__sc-19hb9p3-1"})(["box-sizing:border-box;display:flex;align-items:flex-start;flex-grow:1;& > *:not(:last-child){margin-right:var(--gap-container);}",""],responsiveLayout);const Icon=styled.div.withConfig({displayName:"Notification__Icon",componentId:"ui__sc-19hb9p3-2"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const DiscardButton=styled.div.withConfig({displayName:"Notification__DiscardButton",componentId:"ui__sc-19hb9p3-3"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const Content=styled.div.withConfig({displayName:"Notification__Content",componentId:"ui__sc-19hb9p3-4"})(["box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;flex-basis:58%;flex-grow:1;width:100%;height:fit-content;"]);const Addon=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Addon",componentId:"ui__sc-19hb9p3-5"})(["box-sizing:border-box;display:flex;height:100%;",""],responsiveLayout);export{Addon,Container,Content,DiscardButton,Icon,Root};
|
|
2
2
|
//# sourceMappingURL=style.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus } from './types'\n\nconst
|
|
1
|
+
{"version":3,"file":"style.mjs","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { ResponsiveLayoutInterpolationProps } from 'shared/interfaces'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus, Layout } from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardNotificationProp = createShouldForwardProp((propKey) => !['status'].includes(propKey))\n\nconst template = (palette: NotificationPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA: Record<\n NotificationStatus,\n FlattenInterpolation<ThemedStyledProps<StyledNotificationProps, DefaultTheme>>\n> = {\n system: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-secondary'],\n ...props.palette,\n })}\n `,\n info: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-info'],\n backgroundColor: props.theme.colors['alert-bg-info-100'],\n ...props.palette,\n })}\n `,\n success: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-success'],\n backgroundColor: props.theme.colors['alert-bg-success-100'],\n ...props.palette,\n })}\n `,\n error: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-error'],\n backgroundColor: props.theme.colors['alert-bg-error-100'],\n ...props.palette,\n })}\n `,\n warning: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-warning'],\n backgroundColor: props.theme.colors['alert-bg-warning-100'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledNotificationProps>({\n shouldForwardProp: shouldForwardNotificationProp,\n})`\n box-sizing: border-box;\n display: flex;\n min-width: min-content;\n\n & > *:not(:last-child) {\n margin-right: var(--gap);\n }\n\n ${(props) => COLOR_SCHEMA[props.status]}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n flex-grow: 1;\n\n & > *:not(:last-child) {\n margin-right: var(--gap-container);\n }\n\n ${responsiveLayout}\n`\n\nexport const Icon = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const DiscardButton = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const Content = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-basis: 58%;\n flex-grow: 1;\n width: 100%;\n height: fit-content;\n`\n\nexport const Addon = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n height: 100%;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardNotificationProp","createShouldForwardProp","template","palette","color","backgroundColor","COLOR_SCHEMA","system","css","props","theme","colors","info","success","error","warning","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","status","responsiveSize","responsiveMargin","Container","responsiveLayout","Icon","DiscardButton","Content","Addon"],"mappings":"4SASA,MAAMA,kBAAqBC,IACxB,CAAC,SAAU,YAAa,WAAY,UAAW,UAAW,UAAW,WAAY,WAAWC,SAASD,GAExG,MAAME,8BAAgCC,yBAAyBH,IAAa,CAAC,UAAUC,SAASD,KAEhG,MAAMI,SAAYC,GAAiC,cACxCA,EAAQC,+BACGD,EAAQE,qBAG9B,MAAMC,aAGF,CACFC,OAAQC,IAAG,CAAA,GAAA,KACNC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,0BAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,0BACjCF,EAAMN,YAGfS,KAAMJ,IAAG,CAAA,GAAA,KACJC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,cAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,wBACjCF,EAAMN,YAGfU,QAASL,IAAG,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,YAGfW,MAAON,IAAG,CAAA,GAAA,KACLC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,eAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,yBACjCF,EAAMN,YAGfY,QAASP,IAAG,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,aAKV,MAAMa,KAAOC,OAAOC,IAAIC,WAAoC,CACjEC,kBAAmBpB,gCACnBmB,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAFkBL,CAElB,CAAA,4GAAA,IAAA,IAAA,KASGR,GAAUH,aAAaG,EAAMc,SAE9BC,eACAC,kBAGG,MAAMC,UAAYT,OAAOC,IAAIC,WAAuD,CACzFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,0BAAAC,YAAA,oBAFuBL,CAEvB,CAAA,mIAAA,IAUEU,wBAGSC,KAAOX,OAAOC,IAAGC,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAAVL,CAKnB,CAAA,+EAEYY,cAAgBZ,OAAOC,IAAGC,WAAA,CAAAE,YAAA,8BAAAC,YAAA,oBAAVL,CAK5B,CAAA,+EAEYa,QAAUb,OAAOC,IAAGC,WAAA,CAAAE,YAAA,wBAAAC,YAAA,oBAAVL,CAStB,CAAA,8IAEM,MAAMc,MAAQd,OAAOC,IAAIC,WAAuD,CACrFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,sBAAAC,YAAA,oBAFmBL,CAEnB,CAAA,kDAAA,IAKEU"}
|