@salutejs/plasma-new-hope 0.325.0-canary.1954.15294244136.0 → 0.325.0-canary.1954.15297919353.0

package/cjs/components/List/List.css

@@ -1,3 +1,7 @@
 .List_styles_97b8jq_bmg9h6q__1b4a3381{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;height:auto;width:100%;list-style-type:none;padding:0;margin:0;}
 
+.base_1fsqflm_bpv2gh8__25e8bd39.base_1fsqflm_listItemTight__25e8bd39 .base_1fsqflm_s17e6by7__25e8bd39{padding:calc(var(--plasma-list-item-padding-top) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-right) calc(var(--plasma-list-item-padding-bottom) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-left);}
+
 .base_jq4nc8_b1vinxbx__214ad998{gap:var(--plasma-list-gap);}
+
+.base_1p96e1z_b1ybuwod__f4bddc06.base_1p96e1z_listItemDisabled__f4bddc06 .base_1p96e1z_s17e6by7__f4bddc06{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}

package/cjs/components/List/List.js

@@ -6,10 +6,9 @@ var React = require('react');
 var cls = require('classnames');
 var List_styles = require('./List.styles.js');
 var List_tokens = require('./List.tokens.js');
-var base$2 = require('./variations/_variant/base.js');
 var base = require('./variations/_view/base.js');
 var base$1 = require('./variations/_size/base.js');
-var base$3 = require('./variations/_disabled/base.js');
+var base$2 = require('./variations/_disabled/base.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -20,17 +19,16 @@ var listRoot = function listRoot(Root) {
   return /*#__PURE__*/React.forwardRef(function (_ref, outerRootRef) {
     var size = _ref.size,
       view = _ref.view,
-      variant = _ref.variant,
       disabled = _ref.disabled,
+      variant = _ref.variant,
       className = _ref.className,
       children = _ref.children;
     return /*#__PURE__*/React__default.default.createElement(Root, {
       ref: outerRootRef,
       size: size,
       view: view,
-      variant: variant,
       disabled: disabled,
-      className: cls__default.default(List_tokens.classes.listRoot, className)
+      className: cls__default.default(List_tokens.classes.listRoot, className, variant === 'tight' ? List_tokens.classes.tightListItem : '', disabled ? List_tokens.classes.disabledList : '')
     }, children);
   });
 };
@@ -46,11 +44,8 @@ var listConfig = {
     size: {
       css: base$1.base
     },
-    variant: {
-      css: base$2.base
-    },
     disabled: {
-      css: base$3.base
+      css: base$2.base
     }
   },
   defaults: {

package/cjs/components/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport cls from 'classnames';\n\nimport { RootProps } from '../../engines';\n\nimport type { ListProps } from './List.types';\nimport { base } from './List.styles';\nimport { classes } from './List.tokens';\nimport { base as variantCSS } from './variations/_variant/base';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as disabledCSS } from './variations/_disabled/base';\n\nexport const listRoot = (Root: RootProps<HTMLUListElement, ListProps>) =>\n    forwardRef<HTMLUListElement, ListProps>(({ size, view, variant, disabled, className, children }, outerRootRef) => {\n        return (\n            <Root\n                ref={outerRootRef}\n                size={size}\n                view={view}\n                variant={variant}\n                disabled={disabled}\n                className={cls(classes.listRoot, className)}\n            >\n                {children}\n            </Root>\n        );\n    });\n\nexport const listConfig = {\n    name: 'List',\n    tag: 'ul',\n    layout: listRoot,\n    base,\n    variations: {\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        variant: {\n            css: variantCSS,\n        },\n        disabled: {\n            css: disabledCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n        size: 'm',\n    },\n};\n"],"names":["listRoot","Root","forwardRef","_ref","outerRootRef","size","view","variant","disabled","className","children","React","createElement","ref","cls","classes","listConfig","name","tag","layout","base","variations","css","viewCSS","sizeCSS","variantCSS","disabledCSS","defaults"],"mappings":";;;;;;;;;;;;;;;;;;IAaaA,QAAQ,GAAG,SAAXA,QAAQA,CAAIC,IAA4C,EAAA;AAAA,EAAA,oBACjEC,gBAAU,CAA8B,UAAAC,IAAA,EAAyDC,YAAY,EAAK;AAAA,IAAA,IAAvEC,IAAI,GAAAF,IAAA,CAAJE,IAAI;MAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;MAAEC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;MAAEC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;MAAEC,SAAS,GAAAN,IAAA,CAATM,SAAS;MAAEC,QAAQ,GAAAP,IAAA,CAARO,QAAQ,CAAA;AACzF,IAAA,oBACIC,sBAAA,CAAAC,aAAA,CAACX,IAAI,EAAA;AACDY,MAAAA,GAAG,EAAET,YAAa;AAClBC,MAAAA,IAAI,EAAEA,IAAK;AACXC,MAAAA,IAAI,EAAEA,IAAK;AACXC,MAAAA,OAAO,EAAEA,OAAQ;AACjBC,MAAAA,QAAQ,EAAEA,QAAS;AACnBC,MAAAA,SAAS,EAAEK,oBAAG,CAACC,mBAAO,CAACf,QAAQ,EAAES,SAAS,CAAA;AAAE,KAAA,EAE3CC,QACC,CAAC,CAAA;AAEf,GAAC,CAAC,CAAA;AAAA,EAAA;AAEC,IAAMM,UAAU,GAAG;AACtBC,EAAAA,IAAI,EAAE,MAAM;AACZC,EAAAA,GAAG,EAAE,IAAI;AACTC,EAAAA,MAAM,EAAEnB,QAAQ;AAChBoB,EAAAA,IAAI,EAAJA,gBAAI;AACJC,EAAAA,UAAU,EAAE;AACRf,IAAAA,IAAI,EAAE;AACFgB,MAAAA,GAAG,EAAEC,SAAAA;KACR;AACDlB,IAAAA,IAAI,EAAE;AACFiB,MAAAA,GAAG,EAAEE,WAAAA;KACR;AACDjB,IAAAA,OAAO,EAAE;AACLe,MAAAA,GAAG,EAAEG,WAAAA;KACR;AACDjB,IAAAA,QAAQ,EAAE;AACNc,MAAAA,GAAG,EAAEI,WAAAA;AACT,KAAA;GACH;AACDC,EAAAA,QAAQ,EAAE;AACNrB,IAAAA,IAAI,EAAE,SAAS;AACfD,IAAAA,IAAI,EAAE,GAAA;AACV,GAAA;AACJ;;;;;"}
+{"version":3,"file":"List.js","sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport cls from 'classnames';\n\nimport { RootProps } from '../../engines';\n\nimport type { ListProps } from './List.types';\nimport { base } from './List.styles';\nimport { classes } from './List.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as disabledCSS } from './variations/_disabled/base';\n\nexport const listRoot = (Root: RootProps<HTMLUListElement, ListProps>) =>\n    forwardRef<HTMLUListElement, ListProps>(({ size, view, disabled, variant, className, children }, outerRootRef) => {\n        return (\n            <Root\n                ref={outerRootRef}\n                size={size}\n                view={view}\n                disabled={disabled}\n                className={cls(\n                    classes.listRoot,\n                    className,\n                    variant === 'tight' ? classes.tightListItem : '',\n                    disabled ? classes.disabledList : '',\n                )}\n            >\n                {children}\n            </Root>\n        );\n    });\n\nexport const listConfig = {\n    name: 'List',\n    tag: 'ul',\n    layout: listRoot,\n    base,\n    variations: {\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        disabled: {\n            css: disabledCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n        size: 'm',\n    },\n};\n"],"names":["listRoot","Root","forwardRef","_ref","outerRootRef","size","view","disabled","variant","className","children","React","createElement","ref","cls","classes","tightListItem","disabledList","listConfig","name","tag","layout","base","variations","css","viewCSS","sizeCSS","disabledCSS","defaults"],"mappings":";;;;;;;;;;;;;;;;;IAYaA,QAAQ,GAAG,SAAXA,QAAQA,CAAIC,IAA4C,EAAA;AAAA,EAAA,oBACjEC,gBAAU,CAA8B,UAAAC,IAAA,EAAyDC,YAAY,EAAK;AAAA,IAAA,IAAvEC,IAAI,GAAAF,IAAA,CAAJE,IAAI;MAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;MAAEC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;MAAEC,OAAO,GAAAL,IAAA,CAAPK,OAAO;MAAEC,SAAS,GAAAN,IAAA,CAATM,SAAS;MAAEC,QAAQ,GAAAP,IAAA,CAARO,QAAQ,CAAA;AACzF,IAAA,oBACIC,sBAAA,CAAAC,aAAA,CAACX,IAAI,EAAA;AACDY,MAAAA,GAAG,EAAET,YAAa;AAClBC,MAAAA,IAAI,EAAEA,IAAK;AACXC,MAAAA,IAAI,EAAEA,IAAK;AACXC,MAAAA,QAAQ,EAAEA,QAAS;MACnBE,SAAS,EAAEK,oBAAG,CACVC,mBAAO,CAACf,QAAQ,EAChBS,SAAS,EACTD,OAAO,KAAK,OAAO,GAAGO,mBAAO,CAACC,aAAa,GAAG,EAAE,EAChDT,QAAQ,GAAGQ,mBAAO,CAACE,YAAY,GAAG,EACtC,CAAA;AAAE,KAAA,EAEDP,QACC,CAAC,CAAA;AAEf,GAAC,CAAC,CAAA;AAAA,EAAA;AAEC,IAAMQ,UAAU,GAAG;AACtBC,EAAAA,IAAI,EAAE,MAAM;AACZC,EAAAA,GAAG,EAAE,IAAI;AACTC,EAAAA,MAAM,EAAErB,QAAQ;AAChBsB,EAAAA,IAAI,EAAJA,gBAAI;AACJC,EAAAA,UAAU,EAAE;AACRjB,IAAAA,IAAI,EAAE;AACFkB,MAAAA,GAAG,EAAEC,SAAAA;KACR;AACDpB,IAAAA,IAAI,EAAE;AACFmB,MAAAA,GAAG,EAAEE,WAAAA;KACR;AACDnB,IAAAA,QAAQ,EAAE;AACNiB,MAAAA,GAAG,EAAEG,WAAAA;AACT,KAAA;GACH;AACDC,EAAAA,QAAQ,EAAE;AACNtB,IAAAA,IAAI,EAAE,SAAS;AACfD,IAAAA,IAAI,EAAE,GAAA;AACV,GAAA;AACJ;;;;;"}

package/cjs/components/List/List.tokens.js

@@ -6,7 +6,10 @@ var classes = {
   listRoot: 'list-root',
   listItem: 'list-item',
   filledStretching: 'list-stretching-filled',
-  fixedStretching: 'list-stretching-fixed'
+  fixedStretching: 'list-stretching-fixed',
+  tightListItem: 'list-item-tight',
+  disabledList: 'list-item-disabled',
+  disabledListItem: 'list-item-disabled-item'
 };
 var tokens = {
   listGap: '--plasma-list-gap',
@@ -24,7 +27,7 @@ var tokens = {
   listItemIconLeftColor: '--plasma-list-item-color-icon-left',
   listItemIconRightColor: '--plasma-list-item-color-icon-right',
   listItemGap: '--plasma-list-item-gap',
-  listItemVariantDifference: '--plasma-list-item-variant-difference',
+  listItemTightDifference: '--plasma-list-item-tight-difference',
   listItemColor: '--plasma-list-item-color',
   listItemColorHover: '--plasma-list-item-color-hover',
   listItemFontFamily: '--plasma-list-item-font-family',

package/cjs/components/List/List.tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.tokens.js","sources":["../../../src/components/List/List.tokens.ts"],"sourcesContent":["export const classes = {\n    listRoot: 'list-root',\n    listItem: 'list-item',\n    filledStretching: 'list-stretching-filled',\n    fixedStretching: 'list-stretching-fixed',\n};\n\nexport const tokens = {\n    listGap: '--plasma-list-gap',\n    listWidth: '--plasma-list-width',\n\n    listItemBackground: '--plasma-list-item-background',\n    listItemBackgroundHover: '--plasma-list-item-background-hover',\n    listItemBorderRadius: '--plasma-list-item-border-radius',\n    listItemPaddingLeft: '--plasma-list-item-padding-left',\n    listItemPaddingRight: '--plasma-list-item-padding-right',\n    listItemPaddingTop: '--plasma-list-item-padding-top',\n    listItemPaddingBottom: '--plasma-list-item-padding-bottom',\n    listItemBorderColor: '--plasma-list-item-border-color',\n    listItemBorderColorHover: '--plasma-list-item-border-color-hover',\n    listItemBorderWidth: '--plasma-list-item-border-width',\n    listItemIconLeftColor: '--plasma-list-item-color-icon-left',\n    listItemIconRightColor: '--plasma-list-item-color-icon-right',\n    listItemGap: '--plasma-list-item-gap',\n    listItemVariantDifference: '--plasma-list-item-variant-difference',\n\n    listItemColor: '--plasma-list-item-color',\n    listItemColorHover: '--plasma-list-item-color-hover',\n    listItemFontFamily: '--plasma-list-item-font-family',\n    listItemFontSize: '--plasma-list-item-font-size',\n    listItemFontStyle: '--plasma-list-item-font-style',\n    listItemFontWeight: '--plasma-list-item-font-weight',\n    listItemLetterSpacing: '--plasma-list-item-letter-spacing',\n    listItemLineHeight: '--plasma-list-item-line-height',\n\n    listDisabledOpacity: '--plasma-list-disabled-opacity',\n};\n"],"names":["classes","listRoot","listItem","filledStretching","fixedStretching","tokens","listGap","listWidth","listItemBackground","listItemBackgroundHover","listItemBorderRadius","listItemPaddingLeft","listItemPaddingRight","listItemPaddingTop","listItemPaddingBottom","listItemBorderColor","listItemBorderColorHover","listItemBorderWidth","listItemIconLeftColor","listItemIconRightColor","listItemGap","listItemVariantDifference","listItemColor","listItemColorHover","listItemFontFamily","listItemFontSize","listItemFontStyle","listItemFontWeight","listItemLetterSpacing","listItemLineHeight","listDisabledOpacity"],"mappings":";;;;AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,QAAQ,EAAE,WAAW;AACrBC,EAAAA,QAAQ,EAAE,WAAW;AACrBC,EAAAA,gBAAgB,EAAE,wBAAwB;AAC1CC,EAAAA,eAAe,EAAE,uBAAA;AACrB,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,OAAO,EAAE,mBAAmB;AAC5BC,EAAAA,SAAS,EAAE,qBAAqB;AAEhCC,EAAAA,kBAAkB,EAAE,+BAA+B;AACnDC,EAAAA,uBAAuB,EAAE,qCAAqC;AAC9DC,EAAAA,oBAAoB,EAAE,kCAAkC;AACxDC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,oBAAoB,EAAE,kCAAkC;AACxDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,qBAAqB,EAAE,mCAAmC;AAC1DC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,wBAAwB,EAAE,uCAAuC;AACjEC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,qBAAqB,EAAE,oCAAoC;AAC3DC,EAAAA,sBAAsB,EAAE,qCAAqC;AAC7DC,EAAAA,WAAW,EAAE,wBAAwB;AACrCC,EAAAA,yBAAyB,EAAE,uCAAuC;AAElEC,EAAAA,aAAa,EAAE,0BAA0B;AACzCC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,gBAAgB,EAAE,8BAA8B;AAChDC,EAAAA,iBAAiB,EAAE,+BAA+B;AAClDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,qBAAqB,EAAE,mCAAmC;AAC1DC,EAAAA,kBAAkB,EAAE,gCAAgC;AAEpDC,EAAAA,mBAAmB,EAAE,gCAAA;AACzB;;;;;"}
+{"version":3,"file":"List.tokens.js","sources":["../../../src/components/List/List.tokens.ts"],"sourcesContent":["export const classes = {\n    listRoot: 'list-root',\n    listItem: 'list-item',\n    filledStretching: 'list-stretching-filled',\n    fixedStretching: 'list-stretching-fixed',\n    tightListItem: 'list-item-tight',\n    disabledList: 'list-item-disabled',\n    disabledListItem: 'list-item-disabled-item',\n};\n\nexport const tokens = {\n    listGap: '--plasma-list-gap',\n    listWidth: '--plasma-list-width',\n\n    listItemBackground: '--plasma-list-item-background',\n    listItemBackgroundHover: '--plasma-list-item-background-hover',\n    listItemBorderRadius: '--plasma-list-item-border-radius',\n    listItemPaddingLeft: '--plasma-list-item-padding-left',\n    listItemPaddingRight: '--plasma-list-item-padding-right',\n    listItemPaddingTop: '--plasma-list-item-padding-top',\n    listItemPaddingBottom: '--plasma-list-item-padding-bottom',\n    listItemBorderColor: '--plasma-list-item-border-color',\n    listItemBorderColorHover: '--plasma-list-item-border-color-hover',\n    listItemBorderWidth: '--plasma-list-item-border-width',\n    listItemIconLeftColor: '--plasma-list-item-color-icon-left',\n    listItemIconRightColor: '--plasma-list-item-color-icon-right',\n    listItemGap: '--plasma-list-item-gap',\n    listItemTightDifference: '--plasma-list-item-tight-difference',\n\n    listItemColor: '--plasma-list-item-color',\n    listItemColorHover: '--plasma-list-item-color-hover',\n    listItemFontFamily: '--plasma-list-item-font-family',\n    listItemFontSize: '--plasma-list-item-font-size',\n    listItemFontStyle: '--plasma-list-item-font-style',\n    listItemFontWeight: '--plasma-list-item-font-weight',\n    listItemLetterSpacing: '--plasma-list-item-letter-spacing',\n    listItemLineHeight: '--plasma-list-item-line-height',\n\n    listDisabledOpacity: '--plasma-list-disabled-opacity',\n};\n"],"names":["classes","listRoot","listItem","filledStretching","fixedStretching","tightListItem","disabledList","disabledListItem","tokens","listGap","listWidth","listItemBackground","listItemBackgroundHover","listItemBorderRadius","listItemPaddingLeft","listItemPaddingRight","listItemPaddingTop","listItemPaddingBottom","listItemBorderColor","listItemBorderColorHover","listItemBorderWidth","listItemIconLeftColor","listItemIconRightColor","listItemGap","listItemTightDifference","listItemColor","listItemColorHover","listItemFontFamily","listItemFontSize","listItemFontStyle","listItemFontWeight","listItemLetterSpacing","listItemLineHeight","listDisabledOpacity"],"mappings":";;;;AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,QAAQ,EAAE,WAAW;AACrBC,EAAAA,QAAQ,EAAE,WAAW;AACrBC,EAAAA,gBAAgB,EAAE,wBAAwB;AAC1CC,EAAAA,eAAe,EAAE,uBAAuB;AACxCC,EAAAA,aAAa,EAAE,iBAAiB;AAChCC,EAAAA,YAAY,EAAE,oBAAoB;AAClCC,EAAAA,gBAAgB,EAAE,yBAAA;AACtB,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,OAAO,EAAE,mBAAmB;AAC5BC,EAAAA,SAAS,EAAE,qBAAqB;AAEhCC,EAAAA,kBAAkB,EAAE,+BAA+B;AACnDC,EAAAA,uBAAuB,EAAE,qCAAqC;AAC9DC,EAAAA,oBAAoB,EAAE,kCAAkC;AACxDC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,oBAAoB,EAAE,kCAAkC;AACxDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,qBAAqB,EAAE,mCAAmC;AAC1DC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,wBAAwB,EAAE,uCAAuC;AACjEC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,qBAAqB,EAAE,oCAAoC;AAC3DC,EAAAA,sBAAsB,EAAE,qCAAqC;AAC7DC,EAAAA,WAAW,EAAE,wBAAwB;AACrCC,EAAAA,uBAAuB,EAAE,qCAAqC;AAE9DC,EAAAA,aAAa,EAAE,0BAA0B;AACzCC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,gBAAgB,EAAE,8BAA8B;AAChDC,EAAAA,iBAAiB,EAAE,+BAA+B;AAClDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,qBAAqB,EAAE,mCAAmC;AAC1DC,EAAAA,kBAAkB,EAAE,gCAAgC;AAEpDC,EAAAA,mBAAmB,EAAE,gCAAA;AACzB;;;;;"}

package/cjs/components/List/ui/ListItem.css

@@ -14,5 +14,5 @@
 
 .CellTextbox_styles_rgpies_cz0uqdu__c842929b{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--plasma-cell-textbox-gap);}
 
-.ListItem_styles_1eo5k14_c15dpad4__135d0b75{--plasma-cell-width:100%;--plasma-cell-padding:0rem;--plasma-cell-padding-left-content:0rem;--plasma-cell-padding-content:0rem;--plasma-cell-padding-right-content:0rem;--plasma-cell-textbox-gap:0rem;--plasma-cell-gap:var(--plasma-list-item-gap);--plasma-cell-color:var(--plasma-list-item-color);--plasma-cell-background-color:transparent;}
-.ListItem_styles_1eo5k14_s17e6by7__135d0b75{padding:calc(var(--plasma-list-item-padding-top) - var(--plasma-list-item-variant-difference)) var(--plasma-list-item-padding-right) calc(var(--plasma-list-item-padding-bottom) - var(--plasma-list-item-variant-difference)) var(--plasma-list-item-padding-left);border-radius:var(--plasma-list-item-border-radius);background:var(--plasma-list-item-background);border:var(--plasma-list-item-border-width) solid var(--plasma-list-item-border-color);box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--plasma-list-item-color);font-size:var(--plasma-list-item-font-size);font-weight:var(--plasma-list-item-font-weight);font-family:var(--plasma-list-item-font-family);font-style:var(--plasma-list-item-font-style);line-height:var(--plasma-list-item-line-height);-webkit-letter-spacing:var(--plasma-list-item-letter-spacing);-moz-letter-spacing:var(--plasma-list-item-letter-spacing);-ms-letter-spacing:var(--plasma-list-item-letter-spacing);letter-spacing:var(--plasma-list-item-letter-spacing);}.ListItem_styles_1eo5k14_s17e6by7__135d0b75:hover{background:var(--plasma-list-item-background-hover);border-color:var(--plasma-list-item-border-color-hover);color:var(--plasma-list-item-color-hover);}.ListItem_styles_1eo5k14_s17e6by7__135d0b75[disabled]{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}
+.ListItem_styles_106alid_c15dpad4__4805eda5{--plasma-cell-width:100%;--plasma-cell-padding:0rem;--plasma-cell-padding-left-content:0rem;--plasma-cell-padding-content:0rem;--plasma-cell-padding-right-content:0rem;--plasma-cell-textbox-gap:0rem;--plasma-cell-gap:var(--plasma-list-item-gap);--plasma-cell-color:var(--plasma-list-item-color);--plasma-cell-background-color:transparent;}
+.ListItem_styles_106alid_s17e6by7__4805eda5{padding:var(--plasma-list-item-padding-top) var(--plasma-list-item-padding-right) var(--plasma-list-item-padding-bottom) var(--plasma-list-item-padding-left);border-radius:var(--plasma-list-item-border-radius);background:var(--plasma-list-item-background);border:var(--plasma-list-item-border-width) solid var(--plasma-list-item-border-color);box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--plasma-list-item-color);font-size:var(--plasma-list-item-font-size);font-weight:var(--plasma-list-item-font-weight);font-family:var(--plasma-list-item-font-family);font-style:var(--plasma-list-item-font-style);line-height:var(--plasma-list-item-line-height);-webkit-letter-spacing:var(--plasma-list-item-letter-spacing);-moz-letter-spacing:var(--plasma-list-item-letter-spacing);-ms-letter-spacing:var(--plasma-list-item-letter-spacing);letter-spacing:var(--plasma-list-item-letter-spacing);}.ListItem_styles_106alid_s17e6by7__4805eda5:hover{background:var(--plasma-list-item-background-hover);border-color:var(--plasma-list-item-border-color-hover);color:var(--plasma-list-item-color-hover);}.ListItem_styles_106alid_s17e6by7__4805eda5.ListItem_styles_106alid_listItemDisabledItem__4805eda5{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}

package/cjs/components/List/ui/ListItem.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
+var List_tokens = require('../List.tokens.js');
 var ListItem_styles = require('./ListItem.styles.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -17,7 +18,7 @@ var ListItem = function ListItem(_ref) {
     disabled = _ref.disabled,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__default.default.createElement(ListItem_styles.StyledListItem, _rollupPluginBabelHelpers.extends({
-    disabled: disabled
+    className: disabled ? List_tokens.classes.disabledListItem : ''
   }, rest), /*#__PURE__*/React__default.default.createElement(ListItem_styles.CellItem, {
     contentRight: contentRight
   }, children));

package/cjs/components/List/ui/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":["../../../../src/components/List/ui/ListItem.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\n\nimport { StyledListItem, CellItem } from './ListItem.styles';\nimport { ListItemProps } from './ListItem.types';\n\nexport const ListItem: React.FC<HTMLAttributes<HTMLLIElement> & ListItemProps> = ({\n    children,\n    contentRight,\n    disabled,\n    ...rest\n}) => {\n    return (\n        <StyledListItem disabled={disabled} {...rest}>\n            <CellItem contentRight={contentRight}>{children}</CellItem>\n        </StyledListItem>\n    );\n};\n"],"names":["ListItem","_ref","children","contentRight","disabled","rest","_objectWithoutProperties","_excluded","React","createElement","StyledListItem","_extends","CellItem"],"mappings":";;;;;;;;;;;;;IAKaA,QAAiE,GAAG,SAApEA,QAAiEA,CAAAC,IAAA,EAKxE;AAAA,EAAA,IAJFC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,YAAY,GAAAF,IAAA,CAAZE,YAAY;IACZC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;AACLC,IAAAA,IAAI,GAAAC,iDAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAEP,EAAA,oBACIC,sBAAA,CAAAC,aAAA,CAACC,8BAAc,EAAAC,iCAAA,CAAA;AAACP,IAAAA,QAAQ,EAAEA,QAAAA;AAAS,GAAA,EAAKC,IAAI,CACxCG,eAAAA,sBAAA,CAAAC,aAAA,CAACG,wBAAQ,EAAA;AAACT,IAAAA,YAAY,EAAEA,YAAAA;GAAeD,EAAAA,QAAmB,CAC9C,CAAC,CAAA;AAEzB;;;;"}
+{"version":3,"file":"ListItem.js","sources":["../../../../src/components/List/ui/ListItem.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\n\nimport { classes } from '../List.tokens';\n\nimport { StyledListItem, CellItem } from './ListItem.styles';\nimport { ListItemProps } from './ListItem.types';\n\nexport const ListItem: React.FC<HTMLAttributes<HTMLLIElement> & ListItemProps> = ({\n    children,\n    contentRight,\n    disabled,\n    ...rest\n}) => {\n    return (\n        <StyledListItem className={disabled ? classes.disabledListItem : ''} {...rest}>\n            <CellItem contentRight={contentRight}>{children}</CellItem>\n        </StyledListItem>\n    );\n};\n"],"names":["ListItem","_ref","children","contentRight","disabled","rest","_objectWithoutProperties","_excluded","React","createElement","StyledListItem","_extends","className","classes","disabledListItem","CellItem"],"mappings":";;;;;;;;;;;;;;IAOaA,QAAiE,GAAG,SAApEA,QAAiEA,CAAAC,IAAA,EAKxE;AAAA,EAAA,IAJFC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,YAAY,GAAAF,IAAA,CAAZE,YAAY;IACZC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;AACLC,IAAAA,IAAI,GAAAC,iDAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAEP,EAAA,oBACIC,sBAAA,CAAAC,aAAA,CAACC,8BAAc,EAAAC,iCAAA,CAAA;AAACC,IAAAA,SAAS,EAAER,QAAQ,GAAGS,mBAAO,CAACC,gBAAgB,GAAG,EAAA;AAAG,GAAA,EAAKT,IAAI,CACzEG,eAAAA,sBAAA,CAAAC,aAAA,CAACM,wBAAQ,EAAA;AAACZ,IAAAA,YAAY,EAAEA,YAAAA;GAAeD,EAAAA,QAAmB,CAC9C,CAAC,CAAA;AAEzB;;;;"}

package/cjs/components/List/ui/ListItem.styles.js

@@ -1,4 +1,4 @@
-require('./ListItem.styles_1eo5k14.css');
+require('./ListItem.styles_106alid.css');
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/cjs/components/List/ui/ListItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.styles.js","sources":["../../../../src/components/List/ui/ListItem.styles.tsx"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { tokens } from '../List.tokens';\nimport { cellConfig, cellTokens } from '../../Cell';\nimport { component, mergeConfig } from '../../../engines';\n\nconst mergedCellConfig = mergeConfig(cellConfig);\nconst Cell = component(mergedCellConfig);\n\nexport const CellItem = styled(Cell)`\n    ${cellTokens.cellWidth}: 100%;\n\n    ${cellTokens.cellPadding}: 0rem;\n    ${cellTokens.cellPaddingLeftContent}: 0rem;\n    ${cellTokens.cellPaddingContent}: 0rem;\n    ${cellTokens.cellPaddingRightContent}: 0rem;\n\n    ${cellTokens.cellTextboxGap}: 0rem;\n    ${cellTokens.cellGap}: var(${tokens.listItemGap});\n    ${cellTokens.cellColor}: var(${tokens.listItemColor});\n    ${cellTokens.cellBackgroundColor}: transparent;\n`;\n\nexport const StyledListItem = styled.li<{ disabled?: boolean }>`\n    padding: calc(var(${tokens.listItemPaddingTop}) - var(${tokens.listItemVariantDifference}))\n        var(${tokens.listItemPaddingRight})\n        calc(var(${tokens.listItemPaddingBottom}) - var(${tokens.listItemVariantDifference}))\n        var(${tokens.listItemPaddingLeft});\n    border-radius: var(${tokens.listItemBorderRadius});\n    background: var(${tokens.listItemBackground});\n    border: var(${tokens.listItemBorderWidth}) solid var(${tokens.listItemBorderColor});\n\n    box-sizing: border-box;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    color: var(${tokens.listItemColor});\n    font-size: var(${tokens.listItemFontSize});\n    font-weight: var(${tokens.listItemFontWeight});\n    font-family: var(${tokens.listItemFontFamily});\n    font-style: var(${tokens.listItemFontStyle});\n    line-height: var(${tokens.listItemLineHeight});\n    letter-spacing: var(${tokens.listItemLetterSpacing});\n\n    &:hover {\n        background: var(${tokens.listItemBackgroundHover});\n        border-color: var(${tokens.listItemBorderColorHover});\n        color: var(${tokens.listItemColorHover});\n    }\n\n    &[disabled] {\n        cursor: not-allowed;\n        opacity: var(${tokens.listDisabledOpacity});\n    }\n`;\n"],"names":["mergedCellConfig","mergeConfig","cellConfig","Cell","component","_exp","CellItem","styled","name","class","propsAsIs","StyledListItem"],"mappings":";;;;;;;;AAMA,IAAMA,gBAAgB,gBAAGC,kBAAW,CAACC,iBAAU,CAAC,CAAA;AAChD,IAAMC,IAAI,gBAAGC,gBAAS,CAACJ,gBAAgB,CAAC,CAAA;AAAC,IAAAK,IAAA,GANvBA,SAMuBA,IAAAA,GAAA;AAAA,EAAA,OAEVF,IAAI,CAAA;AAAA,CAAA,CAAA;AAA5B,IAAMG,QAAQ,gBAAGC,YAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,UAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAY7B,EAAA;AAEM,IAAMC,cAAc,gBAAGJ,YAAM,CAAA,IAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CAgCnC;;;;;"}
+{"version":3,"file":"ListItem.styles.js","sources":["../../../../src/components/List/ui/ListItem.styles.tsx"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { tokens, classes } from '../List.tokens';\nimport { cellConfig, cellTokens } from '../../Cell';\nimport { component, mergeConfig } from '../../../engines';\n\nconst mergedCellConfig = mergeConfig(cellConfig);\nconst Cell = component(mergedCellConfig);\n\nexport const CellItem = styled(Cell)`\n    ${cellTokens.cellWidth}: 100%;\n\n    ${cellTokens.cellPadding}: 0rem;\n    ${cellTokens.cellPaddingLeftContent}: 0rem;\n    ${cellTokens.cellPaddingContent}: 0rem;\n    ${cellTokens.cellPaddingRightContent}: 0rem;\n\n    ${cellTokens.cellTextboxGap}: 0rem;\n    ${cellTokens.cellGap}: var(${tokens.listItemGap});\n    ${cellTokens.cellColor}: var(${tokens.listItemColor});\n    ${cellTokens.cellBackgroundColor}: transparent;\n`;\n\nexport const StyledListItem = styled.li`\n    padding: var(${tokens.listItemPaddingTop}) var(${tokens.listItemPaddingRight}) var(${tokens.listItemPaddingBottom})\n        var(${tokens.listItemPaddingLeft});\n    border-radius: var(${tokens.listItemBorderRadius});\n    background: var(${tokens.listItemBackground});\n    border: var(${tokens.listItemBorderWidth}) solid var(${tokens.listItemBorderColor});\n\n    box-sizing: border-box;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    color: var(${tokens.listItemColor});\n    font-size: var(${tokens.listItemFontSize});\n    font-weight: var(${tokens.listItemFontWeight});\n    font-family: var(${tokens.listItemFontFamily});\n    font-style: var(${tokens.listItemFontStyle});\n    line-height: var(${tokens.listItemLineHeight});\n    letter-spacing: var(${tokens.listItemLetterSpacing});\n\n    &:hover {\n        background: var(${tokens.listItemBackgroundHover});\n        border-color: var(${tokens.listItemBorderColorHover});\n        color: var(${tokens.listItemColorHover});\n    }\n\n    &.${classes.disabledListItem} {\n        cursor: not-allowed;\n        opacity: var(${tokens.listDisabledOpacity});\n    }\n`;\n"],"names":["mergedCellConfig","mergeConfig","cellConfig","Cell","component","_exp","CellItem","styled","name","class","propsAsIs","StyledListItem"],"mappings":";;;;;;;;AAMA,IAAMA,gBAAgB,gBAAGC,kBAAW,CAACC,iBAAU,CAAC,CAAA;AAChD,IAAMC,IAAI,gBAAGC,gBAAS,CAACJ,gBAAgB,CAAC,CAAA;AAAC,IAAAK,IAAA,GANvBA,SAMuBA,IAAAA,GAAA;AAAA,EAAA,OAEVF,IAAI,CAAA;AAAA,CAAA,CAAA;AAA5B,IAAMG,QAAQ,gBAAGC,YAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,UAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAY7B,EAAA;AAEM,IAAMC,cAAc,gBAAGJ,YAAM,CAAA,IAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CA8BnC;;;;;"}

package/cjs/components/List/ui/ListItem.styles_106alid.css

@@ -0,0 +1,2 @@
+.c15dpad4{--plasma-cell-width:100%;--plasma-cell-padding:0rem;--plasma-cell-padding-left-content:0rem;--plasma-cell-padding-content:0rem;--plasma-cell-padding-right-content:0rem;--plasma-cell-textbox-gap:0rem;--plasma-cell-gap:var(--plasma-list-item-gap);--plasma-cell-color:var(--plasma-list-item-color);--plasma-cell-background-color:transparent;}
+.s17e6by7{padding:var(--plasma-list-item-padding-top) var(--plasma-list-item-padding-right) var(--plasma-list-item-padding-bottom) var(--plasma-list-item-padding-left);border-radius:var(--plasma-list-item-border-radius);background:var(--plasma-list-item-background);border:var(--plasma-list-item-border-width) solid var(--plasma-list-item-border-color);box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--plasma-list-item-color);font-size:var(--plasma-list-item-font-size);font-weight:var(--plasma-list-item-font-weight);font-family:var(--plasma-list-item-font-family);font-style:var(--plasma-list-item-font-style);line-height:var(--plasma-list-item-line-height);-webkit-letter-spacing:var(--plasma-list-item-letter-spacing);-moz-letter-spacing:var(--plasma-list-item-letter-spacing);-ms-letter-spacing:var(--plasma-list-item-letter-spacing);letter-spacing:var(--plasma-list-item-letter-spacing);}.s17e6by7:hover{background:var(--plasma-list-item-background-hover);border-color:var(--plasma-list-item-border-color-hover);color:var(--plasma-list-item-color-hover);}.s17e6by7.list-item-disabled-item{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}

package/cjs/components/List/variations/_disabled/base.js

@@ -1,4 +1,4 @@
-require('./base_x642ct.css');
+require('./base_1p96e1z.css');
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/cjs/components/List/variations/_disabled/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_disabled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nexport const base = css``;\n"],"names":["base"],"mappings":";;;;AAEO,IAAMA,IAAI,GAAQ;;;;"}
+{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_disabled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../List.tokens';\nimport { StyledListItem } from '../../ui/ListItem.styles';\n\nexport const base = css`\n    &.${classes.disabledList} {\n        ${StyledListItem} {\n            cursor: not-allowed;\n            opacity: var(${tokens.listDisabledOpacity});\n        }\n    }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAOhB;;;;"}

package/cjs/components/List/variations/_disabled/base_1p96e1z.css

@@ -0,0 +1 @@
+.b1ybuwod.list-item-disabled .s17e6by7{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}

package/cjs/components/List/variations/_view/base.js

@@ -1,4 +1,4 @@
-require('./base_x642ct.css');
+require('./base_1fsqflm.css');
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/cjs/components/List/variations/_view/base.js.map

@@ -1 +1 @@
-{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nexport const base = css``;\n"],"names":["base"],"mappings":";;;;AAEO,IAAMA,IAAI,GAAQ;;;;"}
+{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../List.tokens';\nimport { StyledListItem } from '../../ui/ListItem.styles';\n\nexport const base = css`\n    &.${classes.tightListItem} {\n        ${StyledListItem} {\n            padding: calc(var(${tokens.listItemPaddingTop}) - var(${tokens.listItemTightDifference}))\n                var(${tokens.listItemPaddingRight})\n                calc(var(${tokens.listItemPaddingBottom}) - var(${tokens.listItemTightDifference}))\n                var(${tokens.listItemPaddingLeft});\n        }\n    }\n`;\n"],"names":["base"],"mappings":";;;;AAKO,IAAMA,IAAI,GAShB;;;;"}

package/cjs/components/List/variations/_view/base_1fsqflm.css

@@ -0,0 +1 @@
+.bpv2gh8.list-item-tight .s17e6by7{padding:calc(var(--plasma-list-item-padding-top) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-right) calc(var(--plasma-list-item-padding-bottom) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-left);}

package/cjs/components/Notification/Notification.css

@@ -1,6 +1,6 @@
 .IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
 
-.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea{width:var(--plasma-notification-width);padding:var(--plasma-notification-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea{padding:var(--plasma-notification-horizontal-layout-padding);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationWithoutCloseIcon__4791b7ea{padding-right:var(--plasma-notification-horizontal-layout-right-padding-without-close-icon);}.base_qkc3i4_bg3tssa__4791b7ea .base_qkc3i4_notificationWrapper__4791b7ea.base_qkc3i4_notificationLayoutHorizontal__4791b7ea.base_qkc3i4_notificationOneLineTextbox__4791b7ea{padding:var(--plasma-notification-padding-one-line-textbox);}
+.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea{padding:var(--plasma-notification-padding);}.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea.base_1g9g70c_notificationLayoutHorizontal__c76a6dea{padding:var(--plasma-notification-horizontal-layout-padding);}.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea.base_1g9g70c_notificationLayoutHorizontal__c76a6dea.base_1g9g70c_notificationWithoutCloseIcon__c76a6dea{padding-right:var(--plasma-notification-horizontal-layout-right-padding-without-close-icon);}.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea.base_1g9g70c_notificationLayoutHorizontal__c76a6dea.base_1g9g70c_notificationOneLineTextbox__c76a6dea{padding:var(--plasma-notification-padding-one-line-textbox);}
 
 .base_1insfd_bmb6i7f__cb9a5237 .base_1insfd_notificationContentBox__cb9a5237.base_1insfd_notificationLayoutVertical__cb9a5237{padding:var(--plasma-notification-content-padding-top) var(--plasma-notification-content-padding-right) var(--plasma-notification-content-padding-bottom) var(--plasma-notification-content-padding-left);}.base_1insfd_bmb6i7f__cb9a5237 .base_1insfd_notificationContentBox__cb9a5237.base_1insfd_notificationLayoutVertical__cb9a5237.base_1insfd_notificationWithoutIcon__cb9a5237{padding-top:var(--plasma-notification-content-padding-top-without-icon);}.base_1insfd_bmb6i7f__cb9a5237 .base_1insfd_notificationCloseIcon__cb9a5237.base_1insfd_notificationLayoutVertical__cb9a5237{top:var(--plasma-notification-close-icon-top);right:var(--plasma-notification-close-icon-right);}
 
@@ -30,14 +30,14 @@
 .Button_styles_8cvmld_s1rjh7ra__4694a0fa{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-self:var(--plasma-button-right-content-align-self);-ms-flex-item-align:var(--plasma-button-right-content-align);align-self:var(--plasma-button-right-content-align-self);margin:var(--s1rjh7ra-0);}
 .Button_styles_8cvmld_b9ga1dj__4694a0fa{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);--plasma_private-btn-br:var(--plasma_computed-btn-br);border-radius:var(--plasma_private-btn-br);}a.Button_styles_8cvmld_b9ga1dj__4694a0fa{-webkit-text-decoration:none;text-decoration:none;}.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_buttonSquare__4694a0fa{width:var(--plasma-button-height);padding:0;}
 
-.Notification_styles_1yt699o_sb12p__ff5174fd{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
-.Notification_styles_1yt699o_crvd7hm__ff5174fd{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_1yt699o_crvd7hm__ff5174fd:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_1yt699o_crvd7hm__ff5174fd.Notification_styles_1yt699o_notificationLayoutHorizontal__ff5174fd{position:relative;}
-.Notification_styles_1yt699o_wg1ga5v__ff5174fd{position:relative;box-sizing:border-box;background:var(--wg1ga5v-0);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);}.Notification_styles_1yt699o_wg1ga5v__ff5174fd.Notification_styles_1yt699o_notificationLayoutHorizontal__ff5174fd{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
-.Notification_styles_1yt699o_b1amsn8a__ff5174fd{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_1yt699o_b1amsn8a__ff5174fd.Notification_styles_1yt699o_notificationLayoutHorizontal__ff5174fd{margin-top:unset;margin-left:unset;}
-.Notification_styles_1yt699o_i14raqr9__ff5174fd{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);color:var(--i14raqr9-0);margin-right:var(--i14raqr9-1);margin-bottom:var(--i14raqr9-2);}.Notification_styles_1yt699o_i14raqr9__ff5174fd.Notification_styles_1yt699o_notificationLayoutHorizontal__ff5174fd{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
-.Notification_styles_1yt699o_c157peez__ff5174fd{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_1yt699o_c157peez__ff5174fd.Notification_styles_1yt699o_notificationLayoutHorizontal__ff5174fd{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
-.Notification_styles_1yt699o_t1vmb0f2__ff5174fd{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_1yt699o_t1vmb0f2__ff5174fd.Notification_styles_1yt699o_notificationLayoutHorizontal__ff5174fd{padding:unset;}
-.Notification_styles_1yt699o_s1k4e58v__ff5174fd{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s1k4e58v-0);}
-.Notification_styles_1yt699o_s92kmpm__ff5174fd{font-family:var(--plasma-notification-content-font-family);font-size:var(--plasma-notification-content-font-size);font-style:var(--plasma-notification-content-font-style);font-weight:var(--plasma-notification-content-font-weight);-webkit-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-content-font-letter-spacing);letter-spacing:var(--plasma-notification-content-font-letter-spacing);line-height:var(--plasma-notification-content-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s92kmpm-0);}
-.Notification_styles_1yt699o_s18m0x6v__ff5174fd{margin-top:1rem;opacity:1;}.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_notificationItemOpened__ff5174fd{-webkit-animation:0.4s Notification_styles_1yt699o_showAnimationS18m0x6v__ff5174fd ease-out;animation:0.4s Notification_styles_1yt699o_showAnimationS18m0x6v__ff5174fd ease-out;}.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_notificationItemOpened__ff5174fd.Notification_styles_1yt699o_notificationLeftToRightAnimation__ff5174fd{-webkit-animation:0.4s Notification_styles_1yt699o_showLeftToRightAnimationS18m0x6v__ff5174fd ease-out;animation:0.4s Notification_styles_1yt699o_showLeftToRightAnimationS18m0x6v__ff5174fd ease-out;}.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_notificationItemOpened__ff5174fd.Notification_styles_1yt699o_notificationTopToCenterAnimation__ff5174fd{-webkit-animation:0.4s Notification_styles_1yt699o_showTopToCenterAnimationS18m0x6v__ff5174fd ease-out;animation:0.4s Notification_styles_1yt699o_showTopToCenterAnimationS18m0x6v__ff5174fd ease-out;}.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_notificationItemOpened__ff5174fd.Notification_styles_1yt699o_notificationBottomToCenterAnimation__ff5174fd{-webkit-animation:0.4s Notification_styles_1yt699o_showBottomToCenterAnimationS18m0x6v__ff5174fd ease-out;animation:0.4s Notification_styles_1yt699o_showBottomToCenterAnimationS18m0x6v__ff5174fd ease-out;}.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_notificationItemHidden__ff5174fd{-webkit-animation:0.4s Notification_styles_1yt699o_hideAnimationS18m0x6v__ff5174fd ease-out;animation:0.4s Notification_styles_1yt699o_hideAnimationS18m0x6v__ff5174fd ease-out;}.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_s18m0x6v__ff5174fd.Notification_styles_1yt699o_notificationItemHidden__ff5174fd.Notification_styles_1yt699o_notificationLeftToRightAnimation__ff5174fd{-webkit-animation:0.4s Notification_styles_1yt699o_hideLeftToRightAnimationS18m0x6v__ff5174fd ease-out;animation:0.4s Notification_styles_1yt699o_hideLeftToRightAnimationS18m0x6v__ff5174fd ease-out;}@-webkit-keyframes Notification_styles_1yt699o_showTopToCenterAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@keyframes Notification_styles_1yt699o_showTopToCenterAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@-webkit-keyframes Notification_styles_1yt699o_showBottomToCenterAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@keyframes Notification_styles_1yt699o_showBottomToCenterAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@-webkit-keyframes Notification_styles_1yt699o_showLeftToRightAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_1yt699o_showLeftToRightAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_1yt699o_hideLeftToRightAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}}@keyframes Notification_styles_1yt699o_hideLeftToRightAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}}@-webkit-keyframes Notification_styles_1yt699o_showAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_1yt699o_showAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_1yt699o_hideAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}@keyframes Notification_styles_1yt699o_hideAnimationS18m0x6v__ff5174fd{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}
-.Notification_styles_1yt699o_sfe5ql2__ff5174fd{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;box-sizing:border-box;padding:0 1.5rem 1.5rem;max-height:100%;-webkit-align-items:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}
+.Notification_styles_1uyb7ob_sb12p__65d2ebe5{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
+.Notification_styles_1uyb7ob_crvd7hm__65d2ebe5{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_1uyb7ob_crvd7hm__65d2ebe5:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_1uyb7ob_crvd7hm__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{position:relative;}
+.Notification_styles_1uyb7ob_wg1ga5v__65d2ebe5{position:relative;width:var(--wg1ga5v-0);max-width:var(--wg1ga5v-1);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);background:var(--wg1ga5v-2);box-sizing:border-box;}.Notification_styles_1uyb7ob_wg1ga5v__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
+.Notification_styles_1uyb7ob_b1amsn8a__65d2ebe5{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_1uyb7ob_b1amsn8a__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{margin-top:unset;margin-left:unset;}
+.Notification_styles_1uyb7ob_i14raqr9__65d2ebe5{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);color:var(--i14raqr9-0);margin-right:var(--i14raqr9-1);margin-bottom:var(--i14raqr9-2);}.Notification_styles_1uyb7ob_i14raqr9__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
+.Notification_styles_1uyb7ob_c157peez__65d2ebe5{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_1uyb7ob_c157peez__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
+.Notification_styles_1uyb7ob_t1vmb0f2__65d2ebe5{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_1uyb7ob_t1vmb0f2__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{padding:unset;}
+.Notification_styles_1uyb7ob_s1k4e58v__65d2ebe5{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s1k4e58v-0);}
+.Notification_styles_1uyb7ob_s92kmpm__65d2ebe5{font-family:var(--plasma-notification-content-font-family);font-size:var(--plasma-notification-content-font-size);font-style:var(--plasma-notification-content-font-style);font-weight:var(--plasma-notification-content-font-weight);-webkit-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-content-font-letter-spacing);letter-spacing:var(--plasma-notification-content-font-letter-spacing);line-height:var(--plasma-notification-content-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s92kmpm-0);}
+.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5{margin-top:1rem;opacity:1;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5.Notification_styles_1uyb7ob_notificationLeftToRightAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5.Notification_styles_1uyb7ob_notificationTopToCenterAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5.Notification_styles_1uyb7ob_notificationBottomToCenterAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemHidden__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemHidden__65d2ebe5.Notification_styles_1uyb7ob_notificationLeftToRightAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;}@-webkit-keyframes Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}}@keyframes Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}}@-webkit-keyframes Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}@keyframes Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}
+.Notification_styles_1uyb7ob_sfe5ql2__65d2ebe5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;box-sizing:border-box;padding:0 1.5rem 1.5rem;max-height:100%;-webkit-align-items:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}

package/cjs/components/Notification/Notification.js

@@ -20,7 +20,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefault(React);
 
-var _excluded = ["role", "title", "children", "actions", "view", "size", "iconPlacement", "showCloseIcon", "layout", "icon", "closeIconType", "textColor", "titleColor", "backgroundColor", "onCloseButtonClick"];
+var _excluded = ["role", "title", "children", "actions", "view", "size", "iconPlacement", "showCloseIcon", "layout", "icon", "closeIconType", "textColor", "titleColor", "backgroundColor", "width", "maxWidth", "onCloseButtonClick"];
 
 /**
  * Компонент для небольших уведомлений пользователя
@@ -44,6 +44,8 @@ var notificationRoot = function notificationRoot(Root) {
       textColor = props.textColor,
       titleColor = props.titleColor,
       backgroundColor = props.backgroundColor,
+      width = props.width,
+      maxWidth = props.maxWidth,
       onCloseButtonClick = props.onCloseButtonClick,
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
     var ariaLive = 'polite';
@@ -71,6 +73,8 @@ var notificationRoot = function notificationRoot(Root) {
       "aria-atomic": ariaAtomic
     }, rest), /*#__PURE__*/React__default.default.createElement(Notification_styles.Wrapper, {
       backgroundColor: backgroundColor,
+      width: width,
+      maxWidth: maxWidth,
       className: index.cx(Notification_tokens.classes.wrapper, index$1.getLayoutClass(layout), oneLineClass, withoutCloseIconClass)
     }, /*#__PURE__*/React__default.default.createElement(Notification_styles.ContentBox, {
       iconPlacement: IconPlacementInternal,

package/cjs/components/Notification/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { RootProps } from '../../engines';\nimport { cx } from '../../utils';\nimport { IconCross } from '../_Icon/Icons/IconCross';\nimport { IconCrossThin } from '../_Icon/Icons/IconCrossThin';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as layoutCSS } from './variations/_layout/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as closeIconTypeCSS } from './variations/_closeIconType/base';\nimport { NotificationLayout, NotificationProps, layouts } from './Notification.types';\nimport {\n    ButtonsWrapper,\n    CloseIconWrapper,\n    ContentBox,\n    IconWrapper,\n    StyledContent,\n    StyledNotification,\n    StyledTitle,\n    TextBox,\n    Wrapper,\n} from './Notification.styles';\nimport { getLayoutClass } from './utils';\n\n/**\n * Компонент для небольших уведомлений пользователя\n */\nexport const notificationRoot = (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) =>\n    forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {\n        const {\n            role = 'status',\n            title,\n            children: content,\n            actions,\n            view,\n            size,\n            iconPlacement,\n            showCloseIcon = true,\n            layout = layouts.vertical as NotificationLayout,\n            icon,\n            closeIconType,\n            textColor,\n            titleColor,\n            backgroundColor,\n            onCloseButtonClick,\n            ...rest\n        } = props;\n\n        let ariaLive: 'assertive' | 'polite' = 'polite';\n        let ariaAtomic = false;\n\n        if (role === 'alert') {\n            ariaLive = 'assertive';\n        } else if (role === 'status') {\n            ariaAtomic = true;\n        }\n\n        const isOneLine = !content || !title;\n        const oneLineClass = isOneLine ? classes.oneLine : undefined;\n        const withoutIconClass = icon ? undefined : classes.withoutIcon;\n        const withoutCloseIconClass = showCloseIcon ? undefined : classes.withoutCloseIcon;\n\n        const IconPlacementInternal = useMemo(() => (icon ? iconPlacement : undefined), [icon, iconPlacement]);\n\n        return (\n            <Root\n                view={view}\n                size={size}\n                layout={layout}\n                closeIconType={closeIconType}\n                ref={ref}\n                role={role}\n                aria-live={ariaLive}\n                aria-atomic={ariaAtomic}\n                {...rest}\n            >\n                <Wrapper\n                    backgroundColor={backgroundColor}\n                    className={cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)}\n                >\n                    <ContentBox\n                        iconPlacement={IconPlacementInternal}\n                        className={cx(classes.contentBox, getLayoutClass(layout), withoutIconClass)}\n                    >\n                        {icon && (\n                            <IconWrapper\n                                iconPlacement={IconPlacementInternal}\n                                className={cx(classes.icon, getLayoutClass(layout))}\n                            >\n                                {icon}\n                            </IconWrapper>\n                        )}\n                        <TextBox\n                            iconPlacement={IconPlacementInternal}\n                            showCloseIcon={showCloseIcon}\n                            className={cx(classes.textbox, getLayoutClass(layout))}\n                        >\n                            {title && (\n                                <StyledTitle className={classes.title} textColor={titleColor}>\n                                    {title}\n                                </StyledTitle>\n                            )}\n                            {content && (\n                                <StyledContent className={classes.text} textColor={textColor}>\n                                    {content}\n                                </StyledContent>\n                            )}\n                        </TextBox>\n                    </ContentBox>\n                    {actions && (\n                        <ButtonsWrapper\n                            iconPlacement={IconPlacementInternal}\n                            className={cx(classes.buttonsWrapper, getLayoutClass(layout))}\n                        >\n                            {actions}\n                        </ButtonsWrapper>\n                    )}\n\n                    {showCloseIcon && (\n                        <CloseIconWrapper\n                            view=\"clear\"\n                            size=\"s\"\n                            onClick={onCloseButtonClick}\n                            className={cx(classes.closeIcon, getLayoutClass(layout))}\n                        >\n                            {closeIconType === 'default' ? (\n                                <IconCross size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            ) : (\n                                <IconCrossThin size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            )}\n                        </CloseIconWrapper>\n                    )}\n                </Wrapper>\n            </Root>\n        );\n    });\n\nexport const notificationConfig = {\n    name: 'Notification',\n    tag: 'div',\n    layout: notificationRoot,\n    base: StyledNotification,\n    variations: {\n        layout: {\n            css: layoutCSS,\n        },\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        closeIconType: {\n            css: closeIconTypeCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n        layout: layouts.vertical,\n        size: 'xs',\n        closeIconType: 'default',\n    },\n};\n"],"names":["notificationRoot","Root","forwardRef","props","ref","_props$role","role","title","content","children","actions","view","size","iconPlacement","_props$showCloseIcon","showCloseIcon","_props$layout","layout","layouts","vertical","icon","closeIconType","textColor","titleColor","backgroundColor","onCloseButtonClick","rest","_objectWithoutProperties","_excluded","ariaLive","ariaAtomic","isOneLine","oneLineClass","classes","oneLine","undefined","withoutIconClass","withoutIcon","withoutCloseIconClass","withoutCloseIcon","IconPlacementInternal","useMemo","React","createElement","_extends","Wrapper","className","cx","wrapper","getLayoutClass","ContentBox","contentBox","IconWrapper","TextBox","textbox","StyledTitle","StyledContent","text","ButtonsWrapper","buttonsWrapper","CloseIconWrapper","onClick","closeIcon","IconCross","sizeCustomProperty","tokens","closeIconSize","color","IconCrossThin","notificationConfig","name","tag","base","StyledNotification","variations","css","layoutCSS","viewCSS","sizeCSS","closeIconTypeCSS","defaults"],"mappings":"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"}
+{"version":3,"file":"Notification.js","sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { RootProps } from '../../engines';\nimport { cx } from '../../utils';\nimport { IconCross } from '../_Icon/Icons/IconCross';\nimport { IconCrossThin } from '../_Icon/Icons/IconCrossThin';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as layoutCSS } from './variations/_layout/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as closeIconTypeCSS } from './variations/_closeIconType/base';\nimport { NotificationLayout, NotificationProps, layouts } from './Notification.types';\nimport {\n    ButtonsWrapper,\n    CloseIconWrapper,\n    ContentBox,\n    IconWrapper,\n    StyledContent,\n    StyledNotification,\n    StyledTitle,\n    TextBox,\n    Wrapper,\n} from './Notification.styles';\nimport { getLayoutClass } from './utils';\n\n/**\n * Компонент для небольших уведомлений пользователя\n */\nexport const notificationRoot = (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) =>\n    forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {\n        const {\n            role = 'status',\n            title,\n            children: content,\n            actions,\n            view,\n            size,\n            iconPlacement,\n            showCloseIcon = true,\n            layout = layouts.vertical as NotificationLayout,\n            icon,\n            closeIconType,\n            textColor,\n            titleColor,\n            backgroundColor,\n            width,\n            maxWidth,\n            onCloseButtonClick,\n            ...rest\n        } = props;\n\n        let ariaLive: 'assertive' | 'polite' = 'polite';\n        let ariaAtomic = false;\n\n        if (role === 'alert') {\n            ariaLive = 'assertive';\n        } else if (role === 'status') {\n            ariaAtomic = true;\n        }\n\n        const isOneLine = !content || !title;\n        const oneLineClass = isOneLine ? classes.oneLine : undefined;\n        const withoutIconClass = icon ? undefined : classes.withoutIcon;\n        const withoutCloseIconClass = showCloseIcon ? undefined : classes.withoutCloseIcon;\n\n        const IconPlacementInternal = useMemo(() => (icon ? iconPlacement : undefined), [icon, iconPlacement]);\n\n        return (\n            <Root\n                view={view}\n                size={size}\n                layout={layout}\n                closeIconType={closeIconType}\n                ref={ref}\n                role={role}\n                aria-live={ariaLive}\n                aria-atomic={ariaAtomic}\n                {...rest}\n            >\n                <Wrapper\n                    backgroundColor={backgroundColor}\n                    width={width}\n                    maxWidth={maxWidth}\n                    className={cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)}\n                >\n                    <ContentBox\n                        iconPlacement={IconPlacementInternal}\n                        className={cx(classes.contentBox, getLayoutClass(layout), withoutIconClass)}\n                    >\n                        {icon && (\n                            <IconWrapper\n                                iconPlacement={IconPlacementInternal}\n                                className={cx(classes.icon, getLayoutClass(layout))}\n                            >\n                                {icon}\n                            </IconWrapper>\n                        )}\n                        <TextBox\n                            iconPlacement={IconPlacementInternal}\n                            showCloseIcon={showCloseIcon}\n                            className={cx(classes.textbox, getLayoutClass(layout))}\n                        >\n                            {title && (\n                                <StyledTitle className={classes.title} textColor={titleColor}>\n                                    {title}\n                                </StyledTitle>\n                            )}\n                            {content && (\n                                <StyledContent className={classes.text} textColor={textColor}>\n                                    {content}\n                                </StyledContent>\n                            )}\n                        </TextBox>\n                    </ContentBox>\n                    {actions && (\n                        <ButtonsWrapper\n                            iconPlacement={IconPlacementInternal}\n                            className={cx(classes.buttonsWrapper, getLayoutClass(layout))}\n                        >\n                            {actions}\n                        </ButtonsWrapper>\n                    )}\n\n                    {showCloseIcon && (\n                        <CloseIconWrapper\n                            view=\"clear\"\n                            size=\"s\"\n                            onClick={onCloseButtonClick}\n                            className={cx(classes.closeIcon, getLayoutClass(layout))}\n                        >\n                            {closeIconType === 'default' ? (\n                                <IconCross size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            ) : (\n                                <IconCrossThin size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n                            )}\n                        </CloseIconWrapper>\n                    )}\n                </Wrapper>\n            </Root>\n        );\n    });\n\nexport const notificationConfig = {\n    name: 'Notification',\n    tag: 'div',\n    layout: notificationRoot,\n    base: StyledNotification,\n    variations: {\n        layout: {\n            css: layoutCSS,\n        },\n        view: {\n            css: viewCSS,\n        },\n        size: {\n            css: sizeCSS,\n        },\n        closeIconType: {\n            css: closeIconTypeCSS,\n        },\n    },\n    defaults: {\n        view: 'default',\n        layout: layouts.vertical,\n        size: 'xs',\n        closeIconType: 'default',\n    },\n};\n"],"names":["notificationRoot","Root","forwardRef","props","ref","_props$role","role","title","content","children","actions","view","size","iconPlacement","_props$showCloseIcon","showCloseIcon","_props$layout","layout","layouts","vertical","icon","closeIconType","textColor","titleColor","backgroundColor","width","maxWidth","onCloseButtonClick","rest","_objectWithoutProperties","_excluded","ariaLive","ariaAtomic","isOneLine","oneLineClass","classes","oneLine","undefined","withoutIconClass","withoutIcon","withoutCloseIconClass","withoutCloseIcon","IconPlacementInternal","useMemo","React","createElement","_extends","Wrapper","className","cx","wrapper","getLayoutClass","ContentBox","contentBox","IconWrapper","TextBox","textbox","StyledTitle","StyledContent","text","ButtonsWrapper","buttonsWrapper","CloseIconWrapper","onClick","closeIcon","IconCross","sizeCustomProperty","tokens","closeIconSize","color","IconCrossThin","notificationConfig","name","tag","base","StyledNotification","variations","css","layoutCSS","viewCSS","sizeCSS","closeIconTypeCSS","defaults"],"mappings":"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"}