@consta/uikit 5.30.0 → 5.32.0

package/__internal__/src/components/FileCanary/types.d.ts

@@ -0,0 +1,25 @@
+import { IconComponent } from '@consta/icons/Icon';
+import { AsTags } from '../../utils/types/AsTags';
+import { PropsWithAsAttributes } from '../../utils/types/PropsWithAsAttributes';
+export declare const filePropSize: readonly ["s", "m"];
+export type FilePropSize = (typeof filePropSize)[number];
+export declare const filePropSizeDefault: FilePropSize;
+export type FileTypeConfig = {
+    color: string;
+    icon: IconComponent;
+};
+export type FileConfig = Record<string, FileTypeConfig>;
+export type FileBaseProps<As extends AsTags = 'div'> = PropsWithAsAttributes<{
+    size: FilePropSize;
+    icon: IconComponent;
+    extension: string;
+    color: string;
+    className?: string;
+}, As>;
+export type FileBaseComponent = <As extends AsTags = 'div'>(props: FileBaseProps<As>) => React.ReactElement;
+export type FileProps<As extends AsTags = 'div'> = PropsWithAsAttributes<{
+    size?: FilePropSize;
+    extension: string;
+    className?: string;
+}, As>;
+export type FileComponent = <As extends AsTags = 'div'>(props: FileProps<As>) => React.ReactElement;

package/__internal__/src/components/FileCanary/types.js

@@ -0,0 +1,2 @@
+export var filePropSize=["s","m"];export var filePropSizeDefault=filePropSize[1];
+//# sourceMappingURL=types.js.map

package/__internal__/src/components/FileCanary/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":["filePropSize","filePropSizeDefault"],"sources":["../../../../../src/components/FileCanary/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\n\nimport { AsTags } from '##/utils/types/AsTags';\nimport { PropsWithAsAttributes } from '##/utils/types/PropsWithAsAttributes';\n\nexport const filePropSize = ['s', 'm'] as const;\nexport type FilePropSize = (typeof filePropSize)[number];\nexport const filePropSizeDefault: FilePropSize = filePropSize[1];\n\nexport type FileTypeConfig = {\n  color: string;\n  icon: IconComponent;\n};\n\nexport type FileConfig = Record<string, FileTypeConfig>;\n\nexport type FileBaseProps<As extends AsTags = 'div'> = PropsWithAsAttributes<\n  {\n    size: FilePropSize;\n    icon: IconComponent;\n    extension: string;\n    color: string;\n    className?: string;\n  },\n  As\n>;\n\nexport type FileBaseComponent = <As extends AsTags = 'div'>(\n  props: FileBaseProps<As>,\n) => React.ReactElement;\n\nexport type FileProps<As extends AsTags = 'div'> = PropsWithAsAttributes<\n  {\n    size?: FilePropSize;\n    extension: string;\n    className?: string;\n  },\n  As\n>;\n\nexport type FileComponent = <As extends AsTags = 'div'>(\n  props: FileProps<As>,\n) => React.ReactElement;\n"],"mappings":"AAKA,MAAO,IAAMA,aAAY,CAAG,CAAC,GAAD,CAAM,GAAN,CAArB,CAEP,MAAO,IAAMC,oBAAiC,CAAGD,YAAY,CAAC,CAAD,CAAtD"}

package/__internal__/src/components/FlatSelect/FlatSelect.css

@@ -1,9 +1,9 @@
 .FlatSelect{--flat-select-radius-round:calc(var(--flat-select-control-height)/2)}.FlatSelect_withAnchor{background:var(--color-bg-default)}.FlatSelect_form_default{border-radius:var(--control-radius)}.FlatSelect_form_round{border-radius:calc(var(--flat-select-control-height)/2)}.FlatSelect_view_clear .FlatSelect-Input{border-bottom:1px solid var(--color-bg-border)}.FlatSelect-Input_border{border:1px solid var(--color-bg-border)}.FlatSelect-Input_form_default{border-radius:var(--control-radius) var(--control-radius) 0 0}.FlatSelect-Input_form_round{border-radius:var(--flat-select-radius-round) var(--flat-select-radius-round) 0 0}.FlatSelect-List{--flat-select-list-border-top-left-radius:0;--flat-select-list-border-top-right-radius:0;--flat-select-list-border-bottom-right-radius:0;--flat-select-list-border-bottom-left-radius:0;border-radius:var(--flat-select-list-border-top-left-radius) var(--flat-select-list-border-top-right-radius) var(--flat-select-list-border-bottom-right-radius) var(--flat-select-list-border-bottom-left-radius)}.FlatSelect-List_borderHorizontal{border-left:1px solid var(--color-bg-border);border-right:1px solid var(--color-bg-border)}.FlatSelect-List_borderBottom{border-bottom:1px solid var(--color-bg-border)}.FlatSelect-List_borderTop{border-top:1px solid var(--color-bg-border)}.FlatSelect-List_formTop_default{--flat-select-list-border-top-right-radius:var(--control-radius);--flat-select-list-border-top-left-radius:var(--control-radius)}.FlatSelect-List_formTop_round{--flat-select-list-border-top-right-radius:var(
-            --flat-select-radius-round
-          );--flat-select-list-border-top-left-radius:var(
-            --flat-select-radius-round
-          )}.FlatSelect-List_formBottom_default{--flat-select-list-border-bottom-right-radius:var(--control-radius);--flat-select-list-border-bottom-left-radius:var(--control-radius)}.FlatSelect-List_formBottom_round{--flat-select-list-border-bottom-right-radius:var(
-            --flat-select-radius-round
-          );--flat-select-list-border-bottom-left-radius:var(
-            --flat-select-radius-round
-          )}
+          --flat-select-radius-round
+        );--flat-select-list-border-top-left-radius:var(
+          --flat-select-radius-round
+        )}.FlatSelect-List_formBottom_default{--flat-select-list-border-bottom-right-radius:var(--control-radius);--flat-select-list-border-bottom-left-radius:var(--control-radius)}.FlatSelect-List_formBottom_round{--flat-select-list-border-bottom-right-radius:var(
+          --flat-select-radius-round
+        );--flat-select-list-border-bottom-left-radius:var(
+          --flat-select-radius-round
+        )}

package/__internal__/src/components/FlatSelect/FlatSelect.js

@@ -1,2 +1,2 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["form","disabled","value","isLoading","listRef","renderItem","getGroupLabel","labelForCreate","labelForEmptyItems","virtualScroll","onScrollToBottom","style","className","placeholder","iconClear","input","inputValue","inputDefaultValue","inputRef","size","view","bordered","getGroupKey","getItemDisabled","getItemGroupKey","getItemKey","getItemLabel","items","onChange","onCreate","onInput","multiple","groups","onOpen","ignoreOutsideClicksRefs","clearButton","selectAll","selectAllLabel","autoFocus","footer","listClassName","anchorRef","iconLeft","direction","spareDirection","possibleDirections"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./FlatSelect.css";import React,{forwardRef}from"react";import{FieldInput}from"../FieldComponents";import{useForkRef}from"../../hooks/useForkRef";import{cnMixSpace}from"../../mixs/MixSpace";import{cn}from"../../utils/bem";import{useSendToAtom,withCtx}from"../../utils/state";import{withDefault}from"./defaultProps";import{FlatSelectControlLayout}from"./FlatSelectControlLayout";import{FlatSelectFooter}from"./FlatSelectFooter";import{FlatSelectList}from"./FlatSelectList";import{FlatSelectRoot}from"./FlatSelectRoot";import{useFlatSelect}from"./useFlatSelect";import{useRenderItem}from"./useRenderItem";export var cnFlatSelect=cn("FlatSelect");var FlatSelectRender=function(a,b){var c=withDefault(a),d=useSendToAtom(c),e=c.form,f=c.disabled,g=c.value,h=c.isLoading,i=c.listRef,j=c.renderItem,k=c.getGroupLabel,l=c.labelForCreate,m=c.labelForEmptyItems,n=c.virtualScroll,o=c.onScrollToBottom,p=c.style,q=c.className,r=c.placeholder,s=c.iconClear,t=c.input,u=c.inputValue,v=c.inputDefaultValue,w=c.inputRef,x=c.size,y=c.view,z=c.bordered,A=c.getGroupKey,B=c.getItemDisabled,C=c.getItemGroupKey,D=c.getItemKey,E=c.getItemLabel,F=c.items,G=c.onChange,H=c.onCreate,I=c.onInput,J=c.multiple,K=c.groups,L=c.onOpen,M=c.ignoreOutsideClicksRefs,N=c.clearButton,O=c.selectAll,P=c.selectAllLabel,Q=c.autoFocus,R=c.footer,S=c.listClassName,T=c.anchorRef,U=c.iconLeft,V=c.direction,W=c.spareDirection,X=c.possibleDirections,Y=_objectWithoutProperties(c,_excluded),Z=useFlatSelect({propsAtom:d}),$=Z.getOptionActions,_=Z.openAtom,aa=Z.visibleItemsAtom,ba=Z.inputFocusAtom,ca=Z.handleInputFocus,da=Z.handleInputBlur,ea=Z.inputRef,fa=Z.handleInputChange,ga=Z.clearValue,ha=Z.optionsRefs,ia=Z.disabledAtom,ja=Z.listRef,ka=Z.clearButtonAtom,la=Z.highlightedIndexAtom,ma=Z.getItemKeyAtom,na=Z.valueAtom,oa=Z.onChangeAll,pa=Z.onChange,qa=Z.inputValueAtom,ra=Z.hasItemsAtom,sa=Z.groupsCounterAtom,ta=Z.dropdownZIndexAtom,ua=Z.rootRef,va=useRenderItem({getItemLabel:E,getItemDisabled:B,multiple:J,disabled:f,size:x,renderItem:j}),wa=!t||T||z?"clear":y,xa=!!T||z,ya=useForkRef([ea,w]);return React.createElement(FlatSelectRoot,Object.assign({},Y,{ref:useForkRef([b,ua]),className:cnFlatSelect({view:wa,bordered:"clear"===wa?xa:void 0,form:xa?e:void 0,size:x},[q]),style:_objectSpread(_objectSpread({},p),{},_defineProperty({},"--flat-select-control-height","var(--control-height-".concat(x,")"))),anchorRef:T,openAtom:_,tabIndex:0,direction:V,spareDirection:W,possibleDirections:X}),t&&React.createElement("div",{className:cnFlatSelect("Input",{border:"clear"===wa?xa:void 0,form:xa?e:void 0},["clear"===wa?cnMixSpace({pV:"2xs",pH:"s"}):void 0])},React.createElement(FlatSelectControlLayout,{form:e,disabled:f,separator:!0,onClear:ga,focusAtom:ba,iconClear:s,leftSide:U&&React.createElement(U,{size:"s"}),clearButtonAtom:ka,size:x,view:wa,valueAtom:qa},React.createElement(FieldInput,{onFocus:ca,onBlur:da,ref:ya,onChange:fa,value:u,defaultValue:v,disabled:f,placeholder:r}))),React.createElement(FlatSelectList,{className:cnFlatSelect("List",{borderTop:"clear"!==wa||t?void 0:xa,borderHorizontal:"clear"===wa?xa:void 0,borderBottom:"clear"!==wa||R?void 0:xa,formTop:xa&&!t?e:void 0,formBottom:xa&&!R?e:void 0},[S]),view:wa,size:x,form:e,valueAtom:na,getItemKeyAtom:ma,openAtom:_,getOptionActions:$,listRef:useForkRef([ja,i]),renderItem:va,getGroupLabel:k,visibleItemsAtom:aa,labelForCreate:l,isLoading:h,labelForEmptyItems:m,itemsRefs:ha,virtualScroll:n,onScrollToBottom:o,highlightedIndexAtom:la,onChangeAll:oa,onChange:pa,inputValueAtom:qa,hasItemsAtom:ra,groupsCounterAtom:sa,dropdownZIndexAtom:ta,selectAllLabel:P,disabledAtom:ia}),R&&React.createElement(FlatSelectFooter,{view:wa,bordered:xa,form:e,footer:R}))};export var FlatSelect=withCtx(forwardRef(FlatSelectRender));
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["form","disabled","value","isLoading","listRef","renderItem","getGroupLabel","labelForCreate","labelForEmptyItems","virtualScroll","onScrollToBottom","style","className","placeholder","iconClear","input","inputValue","inputDefaultValue","inputRef","size","view","bordered","getGroupKey","getItemDisabled","getItemGroupKey","getItemKey","getItemLabel","items","onChange","onCreate","onInput","multiple","groups","onOpen","ignoreOutsideClicksRefs","clearButton","selectAll","selectAllLabel","autoFocus","footer","listClassName","anchorRef","iconLeft","direction","spareDirection","possibleDirections","container"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./FlatSelect.css";import React,{forwardRef}from"react";import{FieldInput}from"../FieldComponents";import{useForkRef}from"../../hooks/useForkRef";import{cnMixSpace}from"../../mixs/MixSpace";import{cn}from"../../utils/bem";import{useSendToAtom,withCtx}from"../../utils/state";import{withDefault}from"./defaultProps";import{FlatSelectControlLayout}from"./FlatSelectControlLayout";import{FlatSelectFooter}from"./FlatSelectFooter";import{FlatSelectList}from"./FlatSelectList";import{FlatSelectRoot}from"./FlatSelectRoot";import{useFlatSelect}from"./useFlatSelect";import{useRenderItem}from"./useRenderItem";export var cnFlatSelect=cn("FlatSelect");var FlatSelectRender=function(a,b){var c=withDefault(a),d=useSendToAtom(c),e=c.form,f=c.disabled,g=c.value,h=c.isLoading,i=c.listRef,j=c.renderItem,k=c.getGroupLabel,l=c.labelForCreate,m=c.labelForEmptyItems,n=c.virtualScroll,o=c.onScrollToBottom,p=c.style,q=c.className,r=c.placeholder,s=c.iconClear,t=c.input,u=c.inputValue,v=c.inputDefaultValue,w=c.inputRef,x=c.size,y=c.view,z=c.bordered,A=c.getGroupKey,B=c.getItemDisabled,C=c.getItemGroupKey,D=c.getItemKey,E=c.getItemLabel,F=c.items,G=c.onChange,H=c.onCreate,I=c.onInput,J=c.multiple,K=c.groups,L=c.onOpen,M=c.ignoreOutsideClicksRefs,N=c.clearButton,O=c.selectAll,P=c.selectAllLabel,Q=c.autoFocus,R=c.footer,S=c.listClassName,T=c.anchorRef,U=c.iconLeft,V=c.direction,W=c.spareDirection,X=c.possibleDirections,Y=c.container,Z=_objectWithoutProperties(c,_excluded),$=useFlatSelect({propsAtom:d}),_=$.getOptionActions,aa=$.openAtom,ba=$.visibleItemsAtom,ca=$.inputFocusAtom,da=$.handleInputFocus,ea=$.handleInputBlur,fa=$.inputRef,ga=$.handleInputChange,ha=$.clearValue,ia=$.optionsRefs,ja=$.disabledAtom,ka=$.listRef,la=$.clearButtonAtom,ma=$.highlightedIndexAtom,na=$.getItemKeyAtom,oa=$.valueAtom,pa=$.onChangeAll,qa=$.onChange,ra=$.inputValueAtom,sa=$.hasItemsAtom,ta=$.groupsCounterAtom,ua=$.dropdownZIndexAtom,va=$.rootRef,wa=useRenderItem({getItemLabel:E,getItemDisabled:B,multiple:J,disabled:f,size:x,renderItem:j}),xa=!t||T||z?"clear":y,ya=!!T||z,za=useForkRef([fa,w]);return React.createElement(FlatSelectRoot,Object.assign({},Z,{ref:useForkRef([b,va]),className:cnFlatSelect({view:xa,bordered:"clear"===xa?ya:void 0,form:ya?e:void 0,size:x},[q]),style:_objectSpread(_objectSpread({},p),{},_defineProperty({},"--flat-select-control-height","var(--control-height-".concat(x,")"))),anchorRef:T,openAtom:aa,tabIndex:0,direction:V,spareDirection:W,possibleDirections:X,container:Y}),t&&React.createElement("div",{className:cnFlatSelect("Input",{border:"clear"===xa?ya:void 0,form:ya?e:void 0},["clear"===xa?cnMixSpace({pV:"2xs",pH:"s"}):void 0])},React.createElement(FlatSelectControlLayout,{form:e,disabled:f,separator:!0,onClear:ha,focusAtom:ca,iconClear:s,leftSide:U&&React.createElement(U,{size:"s"}),clearButtonAtom:la,size:x,view:xa,valueAtom:ra},React.createElement(FieldInput,{onFocus:da,onBlur:ea,ref:za,onChange:ga,value:u,defaultValue:v,disabled:f,placeholder:r}))),React.createElement(FlatSelectList,{className:cnFlatSelect("List",{borderTop:"clear"!==xa||t?void 0:ya,borderHorizontal:"clear"===xa?ya:void 0,borderBottom:"clear"!==xa||R?void 0:ya,formTop:ya&&!t?e:void 0,formBottom:ya&&!R?e:void 0},[S]),view:xa,size:x,form:e,valueAtom:oa,getItemKeyAtom:na,openAtom:aa,getOptionActions:_,listRef:useForkRef([ka,i]),renderItem:wa,getGroupLabel:k,visibleItemsAtom:ba,labelForCreate:l,isLoading:h,labelForEmptyItems:m,itemsRefs:ia,virtualScroll:n,onScrollToBottom:o,highlightedIndexAtom:ma,onChangeAll:pa,onChange:qa,inputValueAtom:ra,hasItemsAtom:sa,groupsCounterAtom:ta,dropdownZIndexAtom:ua,selectAllLabel:P,disabledAtom:ja}),R&&React.createElement(FlatSelectFooter,{view:xa,bordered:ya,form:e,footer:R}))};export var FlatSelect=withCtx(forwardRef(FlatSelectRender));
 //# sourceMappingURL=FlatSelect.js.map

package/__internal__/src/components/FlatSelect/FlatSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlatSelect.js","names":["React","forwardRef","FieldInput","useForkRef","cnMixSpace","cn","useSendToAtom","withCtx","withDefault","FlatSelectControlLayout","FlatSelectFooter","FlatSelectList","FlatSelectRoot","useFlatSelect","useRenderItem","cnFlatSelect","FlatSelectRender","p","ref","props","propsAtom","form","disabled","value","isLoading","listRefProp","listRef","renderItemProp","renderItem","getGroupLabel","labelForCreate","labelForEmptyItems","virtualScroll","onScrollToBottom","style","className","placeholder","iconClear","input","inputValue","inputDefaultValue","inputRefProp","inputRef","size","viewProp","view","borderedProp","bordered","getGroupKey","getItemDisabled","getItemGroupKey","getItemKey","getItemLabel","items","onChangeProp","onChange","onCreateProp","onCreate","onInput","multiple","groups","onOpen","ignoreOutsideClicksRefs","clearButton","selectAll","selectAllLabel","autoFocus","footer","listClassName","anchorRef","IconLeft","iconLeft","direction","spareDirection","possibleDirections","otherProps","getOptionActions","openAtom","visibleItemsAtom","inputFocusAtom","handleInputFocus","handleInputBlur","handleInputChange","clearValue","optionsRefs","disabledAtom","clearButtonAtom","highlightedIndexAtom","getItemKeyAtom","valueAtom","onChangeAll","inputValueAtom","hasItemsAtom","groupsCounterAtom","dropdownZIndexAtom","rootRef","fieldInputRef","border","pV","pH","borderTop","borderHorizontal","borderBottom","formTop","formBottom","FlatSelect"],"sources":["../../../../../src/components/FlatSelect/FlatSelect.tsx"],"sourcesContent":["import './FlatSelect.css';\n\nimport React, { forwardRef } from 'react';\n\nimport { FieldInput } from '##/components/FieldComponents';\nimport { useForkRef } from '##/hooks/useForkRef';\nimport { cnMixSpace } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { useSendToAtom, withCtx } from '##/utils/state';\n\nimport { withDefault } from './defaultProps';\nimport { FlatSelectControlLayout } from './FlatSelectControlLayout';\nimport { FlatSelectFooter } from './FlatSelectFooter';\nimport { FlatSelectList } from './FlatSelectList';\nimport { FlatSelectRoot } from './FlatSelectRoot';\nimport {\n  FlatSelectComponent,\n  FlatSelectGroupDefault,\n  FlatSelectItemDefault,\n  FlatSelectProps,\n} from './types';\nimport { useFlatSelect } from './useFlatSelect';\nimport { useRenderItem } from './useRenderItem';\n\nexport const cnFlatSelect = cn('FlatSelect');\n\nconst FlatSelectRender = (\n  p: FlatSelectProps,\n  ref: React.Ref<HTMLDivElement>,\n) => {\n  const props = withDefault(p);\n  const propsAtom = useSendToAtom(props);\n\n  const {\n    form,\n    disabled,\n    value,\n    isLoading,\n    listRef: listRefProp,\n    renderItem: renderItemProp,\n    getGroupLabel,\n    labelForCreate,\n    labelForEmptyItems,\n    virtualScroll,\n    onScrollToBottom,\n    style,\n    className,\n    placeholder,\n    iconClear,\n    input,\n    inputValue,\n    inputDefaultValue,\n    inputRef: inputRefProp,\n    size,\n    view: viewProp,\n    bordered: borderedProp,\n    getGroupKey,\n    getItemDisabled,\n    getItemGroupKey,\n    getItemKey,\n    getItemLabel,\n    items,\n    onChange: onChangeProp,\n    onCreate: onCreateProp,\n    onInput,\n    multiple,\n    groups,\n    onOpen,\n    ignoreOutsideClicksRefs,\n    clearButton,\n    selectAll,\n    selectAllLabel,\n    autoFocus,\n    footer,\n    listClassName,\n    anchorRef,\n    iconLeft: IconLeft,\n    direction,\n    spareDirection,\n    possibleDirections,\n    ...otherProps\n  } = props;\n\n  const {\n    getOptionActions,\n    openAtom,\n    visibleItemsAtom,\n    inputFocusAtom,\n    handleInputFocus,\n    handleInputBlur,\n    inputRef,\n    handleInputChange,\n    clearValue,\n    optionsRefs,\n    disabledAtom,\n    listRef,\n    clearButtonAtom,\n    highlightedIndexAtom,\n    getItemKeyAtom,\n    valueAtom,\n    onChangeAll,\n    onChange,\n    inputValueAtom,\n    hasItemsAtom,\n    groupsCounterAtom,\n    dropdownZIndexAtom,\n    rootRef,\n  } = useFlatSelect<FlatSelectItemDefault, FlatSelectGroupDefault, false>({\n    propsAtom,\n  });\n\n  const renderItem = useRenderItem({\n    getItemLabel,\n    getItemDisabled,\n    multiple,\n    disabled,\n    size,\n    renderItem: renderItemProp,\n  });\n\n  const view = !input || anchorRef || borderedProp ? 'clear' : viewProp;\n  const bordered = anchorRef ? true : borderedProp;\n  const fieldInputRef = useForkRef([inputRef, inputRefProp]);\n\n  return (\n    // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n    <FlatSelectRoot\n      {...otherProps}\n      ref={useForkRef([ref, rootRef])}\n      className={cnFlatSelect(\n        {\n          view,\n          bordered: view === 'clear' ? bordered : undefined,\n          form: bordered ? form : undefined,\n          size,\n        },\n        [className],\n      )}\n      style={{\n        ...style,\n        ['--flat-select-control-height' as string]: `var(--control-height-${size})`,\n      }}\n      anchorRef={anchorRef}\n      openAtom={openAtom}\n      tabIndex={0}\n      direction={direction}\n      spareDirection={spareDirection}\n      possibleDirections={possibleDirections}\n    >\n      {input && (\n        <div\n          className={cnFlatSelect(\n            'Input',\n            {\n              border: view === 'clear' ? bordered : undefined,\n              form: bordered ? form : undefined,\n            },\n            [view === 'clear' ? cnMixSpace({ pV: '2xs', pH: 's' }) : undefined],\n          )}\n        >\n          <FlatSelectControlLayout\n            form={form}\n            disabled={disabled}\n            separator\n            onClear={clearValue}\n            focusAtom={inputFocusAtom}\n            iconClear={iconClear}\n            leftSide={IconLeft && <IconLeft size=\"s\" />}\n            clearButtonAtom={clearButtonAtom}\n            size={size}\n            view={view}\n            valueAtom={inputValueAtom}\n          >\n            <FieldInput\n              onFocus={handleInputFocus}\n              onBlur={handleInputBlur}\n              ref={fieldInputRef}\n              onChange={handleInputChange}\n              value={inputValue}\n              defaultValue={inputDefaultValue}\n              disabled={disabled}\n              placeholder={placeholder}\n            />\n          </FlatSelectControlLayout>\n        </div>\n      )}\n      <FlatSelectList\n        className={cnFlatSelect(\n          'List',\n          {\n            borderTop: view === 'clear' && !input ? bordered : undefined,\n            borderHorizontal: view === 'clear' ? bordered : undefined,\n            borderBottom: view === 'clear' && !footer ? bordered : undefined,\n            formTop: bordered && !input ? form : undefined,\n            formBottom: bordered && !footer ? form : undefined,\n          },\n          [listClassName],\n        )}\n        view={view}\n        size={size}\n        form={form}\n        valueAtom={valueAtom}\n        getItemKeyAtom={getItemKeyAtom}\n        openAtom={openAtom}\n        getOptionActions={getOptionActions}\n        listRef={useForkRef([listRef, listRefProp])}\n        renderItem={renderItem}\n        getGroupLabel={getGroupLabel}\n        visibleItemsAtom={visibleItemsAtom}\n        labelForCreate={labelForCreate}\n        isLoading={isLoading}\n        labelForEmptyItems={labelForEmptyItems}\n        itemsRefs={optionsRefs}\n        virtualScroll={virtualScroll}\n        onScrollToBottom={onScrollToBottom}\n        highlightedIndexAtom={highlightedIndexAtom}\n        onChangeAll={onChangeAll}\n        onChange={onChange}\n        inputValueAtom={inputValueAtom}\n        hasItemsAtom={hasItemsAtom}\n        groupsCounterAtom={groupsCounterAtom}\n        dropdownZIndexAtom={dropdownZIndexAtom}\n        selectAllLabel={selectAllLabel}\n        disabledAtom={disabledAtom}\n      />\n      {footer && (\n        <FlatSelectFooter\n          view={view}\n          bordered={bordered}\n          form={form}\n          footer={footer}\n        />\n      )}\n    </FlatSelectRoot>\n  );\n};\n\nexport const FlatSelect = withCtx(\n  forwardRef(FlatSelectRender),\n) as FlatSelectComponent;\n"],"mappings":"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"}
+{"version":3,"file":"FlatSelect.js","names":["React","forwardRef","FieldInput","useForkRef","cnMixSpace","cn","useSendToAtom","withCtx","withDefault","FlatSelectControlLayout","FlatSelectFooter","FlatSelectList","FlatSelectRoot","useFlatSelect","useRenderItem","cnFlatSelect","FlatSelectRender","p","ref","props","propsAtom","form","disabled","value","isLoading","listRefProp","listRef","renderItemProp","renderItem","getGroupLabel","labelForCreate","labelForEmptyItems","virtualScroll","onScrollToBottom","style","className","placeholder","iconClear","input","inputValue","inputDefaultValue","inputRefProp","inputRef","size","viewProp","view","borderedProp","bordered","getGroupKey","getItemDisabled","getItemGroupKey","getItemKey","getItemLabel","items","onChangeProp","onChange","onCreateProp","onCreate","onInput","multiple","groups","onOpen","ignoreOutsideClicksRefs","clearButton","selectAll","selectAllLabel","autoFocus","footer","listClassName","anchorRef","IconLeft","iconLeft","direction","spareDirection","possibleDirections","container","otherProps","getOptionActions","openAtom","visibleItemsAtom","inputFocusAtom","handleInputFocus","handleInputBlur","handleInputChange","clearValue","optionsRefs","disabledAtom","clearButtonAtom","highlightedIndexAtom","getItemKeyAtom","valueAtom","onChangeAll","inputValueAtom","hasItemsAtom","groupsCounterAtom","dropdownZIndexAtom","rootRef","fieldInputRef","border","pV","pH","borderTop","borderHorizontal","borderBottom","formTop","formBottom","FlatSelect"],"sources":["../../../../../src/components/FlatSelect/FlatSelect.tsx"],"sourcesContent":["import './FlatSelect.css';\n\nimport React, { forwardRef } from 'react';\n\nimport { FieldInput } from '##/components/FieldComponents';\nimport { useForkRef } from '##/hooks/useForkRef';\nimport { cnMixSpace } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { useSendToAtom, withCtx } from '##/utils/state';\n\nimport { withDefault } from './defaultProps';\nimport { FlatSelectControlLayout } from './FlatSelectControlLayout';\nimport { FlatSelectFooter } from './FlatSelectFooter';\nimport { FlatSelectList } from './FlatSelectList';\nimport { FlatSelectRoot } from './FlatSelectRoot';\nimport {\n  FlatSelectComponent,\n  FlatSelectGroupDefault,\n  FlatSelectItemDefault,\n  FlatSelectProps,\n} from './types';\nimport { useFlatSelect } from './useFlatSelect';\nimport { useRenderItem } from './useRenderItem';\n\nexport const cnFlatSelect = cn('FlatSelect');\n\nconst FlatSelectRender = (\n  p: FlatSelectProps,\n  ref: React.Ref<HTMLDivElement>,\n) => {\n  const props = withDefault(p);\n  const propsAtom = useSendToAtom(props);\n\n  const {\n    form,\n    disabled,\n    value,\n    isLoading,\n    listRef: listRefProp,\n    renderItem: renderItemProp,\n    getGroupLabel,\n    labelForCreate,\n    labelForEmptyItems,\n    virtualScroll,\n    onScrollToBottom,\n    style,\n    className,\n    placeholder,\n    iconClear,\n    input,\n    inputValue,\n    inputDefaultValue,\n    inputRef: inputRefProp,\n    size,\n    view: viewProp,\n    bordered: borderedProp,\n    getGroupKey,\n    getItemDisabled,\n    getItemGroupKey,\n    getItemKey,\n    getItemLabel,\n    items,\n    onChange: onChangeProp,\n    onCreate: onCreateProp,\n    onInput,\n    multiple,\n    groups,\n    onOpen,\n    ignoreOutsideClicksRefs,\n    clearButton,\n    selectAll,\n    selectAllLabel,\n    autoFocus,\n    footer,\n    listClassName,\n    anchorRef,\n    iconLeft: IconLeft,\n    direction,\n    spareDirection,\n    possibleDirections,\n    container,\n    ...otherProps\n  } = props;\n\n  const {\n    getOptionActions,\n    openAtom,\n    visibleItemsAtom,\n    inputFocusAtom,\n    handleInputFocus,\n    handleInputBlur,\n    inputRef,\n    handleInputChange,\n    clearValue,\n    optionsRefs,\n    disabledAtom,\n    listRef,\n    clearButtonAtom,\n    highlightedIndexAtom,\n    getItemKeyAtom,\n    valueAtom,\n    onChangeAll,\n    onChange,\n    inputValueAtom,\n    hasItemsAtom,\n    groupsCounterAtom,\n    dropdownZIndexAtom,\n    rootRef,\n  } = useFlatSelect<FlatSelectItemDefault, FlatSelectGroupDefault, false>({\n    propsAtom,\n  });\n\n  const renderItem = useRenderItem({\n    getItemLabel,\n    getItemDisabled,\n    multiple,\n    disabled,\n    size,\n    renderItem: renderItemProp,\n  });\n\n  const view = !input || anchorRef || borderedProp ? 'clear' : viewProp;\n  const bordered = anchorRef ? true : borderedProp;\n  const fieldInputRef = useForkRef([inputRef, inputRefProp]);\n\n  return (\n    // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n    <FlatSelectRoot\n      {...otherProps}\n      ref={useForkRef([ref, rootRef])}\n      className={cnFlatSelect(\n        {\n          view,\n          bordered: view === 'clear' ? bordered : undefined,\n          form: bordered ? form : undefined,\n          size,\n        },\n        [className],\n      )}\n      style={{\n        ...style,\n        ['--flat-select-control-height' as string]: `var(--control-height-${size})`,\n      }}\n      anchorRef={anchorRef}\n      openAtom={openAtom}\n      tabIndex={0}\n      direction={direction}\n      spareDirection={spareDirection}\n      possibleDirections={possibleDirections}\n      container={container}\n    >\n      {input && (\n        <div\n          className={cnFlatSelect(\n            'Input',\n            {\n              border: view === 'clear' ? bordered : undefined,\n              form: bordered ? form : undefined,\n            },\n            [view === 'clear' ? cnMixSpace({ pV: '2xs', pH: 's' }) : undefined],\n          )}\n        >\n          <FlatSelectControlLayout\n            form={form}\n            disabled={disabled}\n            separator\n            onClear={clearValue}\n            focusAtom={inputFocusAtom}\n            iconClear={iconClear}\n            leftSide={IconLeft && <IconLeft size=\"s\" />}\n            clearButtonAtom={clearButtonAtom}\n            size={size}\n            view={view}\n            valueAtom={inputValueAtom}\n          >\n            <FieldInput\n              onFocus={handleInputFocus}\n              onBlur={handleInputBlur}\n              ref={fieldInputRef}\n              onChange={handleInputChange}\n              value={inputValue}\n              defaultValue={inputDefaultValue}\n              disabled={disabled}\n              placeholder={placeholder}\n            />\n          </FlatSelectControlLayout>\n        </div>\n      )}\n      <FlatSelectList\n        className={cnFlatSelect(\n          'List',\n          {\n            borderTop: view === 'clear' && !input ? bordered : undefined,\n            borderHorizontal: view === 'clear' ? bordered : undefined,\n            borderBottom: view === 'clear' && !footer ? bordered : undefined,\n            formTop: bordered && !input ? form : undefined,\n            formBottom: bordered && !footer ? form : undefined,\n          },\n          [listClassName],\n        )}\n        view={view}\n        size={size}\n        form={form}\n        valueAtom={valueAtom}\n        getItemKeyAtom={getItemKeyAtom}\n        openAtom={openAtom}\n        getOptionActions={getOptionActions}\n        listRef={useForkRef([listRef, listRefProp])}\n        renderItem={renderItem}\n        getGroupLabel={getGroupLabel}\n        visibleItemsAtom={visibleItemsAtom}\n        labelForCreate={labelForCreate}\n        isLoading={isLoading}\n        labelForEmptyItems={labelForEmptyItems}\n        itemsRefs={optionsRefs}\n        virtualScroll={virtualScroll}\n        onScrollToBottom={onScrollToBottom}\n        highlightedIndexAtom={highlightedIndexAtom}\n        onChangeAll={onChangeAll}\n        onChange={onChange}\n        inputValueAtom={inputValueAtom}\n        hasItemsAtom={hasItemsAtom}\n        groupsCounterAtom={groupsCounterAtom}\n        dropdownZIndexAtom={dropdownZIndexAtom}\n        selectAllLabel={selectAllLabel}\n        disabledAtom={disabledAtom}\n      />\n      {footer && (\n        <FlatSelectFooter\n          view={view}\n          bordered={bordered}\n          form={form}\n          footer={footer}\n        />\n      )}\n    </FlatSelectRoot>\n  );\n};\n\nexport const FlatSelect = withCtx(\n  forwardRef(FlatSelectRender),\n) as FlatSelectComponent;\n"],"mappings":"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"}

package/__internal__/src/components/FlatSelect/FlatSelectList/FlatSelectList.d.ts

@@ -7,7 +7,7 @@ import { PropsWithJsxAttributes } from '../../../utils/types/PropsWithJsxAttribu
 import { CountedGroup } from '../types';
 import { GetOptionPropsResult, OptionForCreate, OptionProps } from '../useFlatSelect';
 export declare const FlatSelectListForm: readonly ["default", "brick", "round"];
-export type FlatSelectListPropForm = typeof FlatSelectListForm[number];
+export type FlatSelectListPropForm = (typeof FlatSelectListForm)[number];
 export declare const defaultFlatSelectListPropForm: "default";
 type RenderItemProps<ITEM> = {
     item: ITEM;

package/__internal__/src/components/FlatSelect/FlatSelectList/FlatSelectList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlatSelectList.js","names":["useAtom","React","Fragment","memo","useMemo","ListBox","ListItem","ListLoader","forkRef","useForkRef","useVirtualScroll","cn","fabricIndex","FlatSelectCreateButton","FlatSelectGroupLabel","FlatSelectItemAll","FlatSelectLoader","FlatSelectRenderItem","isNotOptionForCreate","isOptionForCreate","isOptionForSelectAll","FlatSelectListForm","defaultFlatSelectListPropForm","cnFlatSelectList","getLengthElements","elements","length","index","element","items","isVisible","slice","FlatSelectList","props","size","getOptionActions","listRef","labelForCreate","className","labelForNotFound","labelForEmptyItems","hasItemsAtom","form","openAtom","renderItem","visibleItemsAtom","isLoading","getGroupLabel","notFound","itemsRefs","virtualScroll","onScrollToBottom","highlightedIndexAtom","valueAtom","getItemKeyAtom","onChange","onChangeAll","inputValueAtom","groupsCounterAtom","dropdownZIndexAtom","selectAllLabel","view","disabledAtom","otherProps","visibleItems","hasItems","getItemKey","indent","isListShowed","filter","group","Array","isArray","lengthForVirtualScroll","isActive","spaceTop","sliceHookProp","listRefs","scrollElementRef","scrollContainerRef","getIndex","getVirtualIndex","marginTop","map","key","item","virtualIndex"],"sources":["../../../../../../src/components/FlatSelect/FlatSelectList/FlatSelectList.tsx"],"sourcesContent":["import './FlatSelectList.css';\n\nimport { AtomMut } from '@reatom/framework';\nimport { useAtom } from '@reatom/npm-react';\nimport React, { Fragment, memo, useMemo } from 'react';\n\nimport { FieldPropSize } from '##/components/FieldComponents';\nimport { ListBox, ListItem, ListLoader } from '##/components/ListCanary';\nimport { PopoverPropOffset } from '##/components/Popover';\nimport { forkRef, useForkRef } from '##/hooks/useForkRef';\nimport { useVirtualScroll } from '##/hooks/useVirtualScroll';\nimport { cn } from '##/utils/bem';\nimport { fabricIndex } from '##/utils/fabricIndex';\nimport { SelectAllItem } from '##/utils/getGroups';\nimport { PropsWithJsxAttributes } from '##/utils/types/PropsWithJsxAttributes';\n\nimport { FlatSelectCreateButton } from '../FlatSelectCreateButton';\nimport { FlatSelectGroupLabel } from '../FlatSelectGroupLabel/FlatSelectGroupLabel';\nimport { FlatSelectItemAll } from '../FlatSelectItemAll/FlatSelectItemAll';\nimport { FlatSelectLoader } from '../FlatSelectLoader/FlatSelectLoader';\n// import { SelectPopover } from '../SelectPopover';\nimport { FlatSelectRenderItem } from '../FlatSelectRenderItem';\nimport { CountedGroup } from '../types';\nimport {\n  GetOptionPropsResult,\n  isNotOptionForCreate,\n  isOptionForCreate,\n  isOptionForSelectAll,\n  OptionForCreate,\n  OptionProps,\n} from '../useFlatSelect';\n\nexport const FlatSelectListForm = ['default', 'brick', 'round'] as const;\nexport type FlatSelectListPropForm = typeof FlatSelectListForm[number];\nexport const defaultFlatSelectListPropForm = FlatSelectListForm[0];\n\ntype RenderItemProps<ITEM> = {\n  item: ITEM;\n  active: boolean;\n  hovered: boolean;\n  onClick: (e: React.MouseEvent) => void;\n  onMouseEnter: (e: React.MouseEvent) => void;\n  ref: React.Ref<HTMLDivElement>;\n};\n\ntype Props<ITEM, GROUP> = PropsWithJsxAttributes<{\n  size: FieldPropSize;\n  listRef: React.Ref<HTMLDivElement>;\n  getOptionActions(props: OptionProps<ITEM>): GetOptionPropsResult;\n  //   form: FlatSelectListPropForm;\n  openAtom: AtomMut<boolean>;\n  offset?: PopoverPropOffset | 'none';\n  isLoading?: boolean;\n  renderItem: (props: RenderItemProps<ITEM>) => React.ReactNode | null;\n  highlightedIndexAtom: AtomMut<number>;\n  visibleItemsAtom: AtomMut<(OptionForCreate | CountedGroup<ITEM, GROUP>)[]>;\n  getGroupLabel?: (group: GROUP) => string;\n  labelForCreate?:\n    | ((label: string | undefined) => React.ReactNode)\n    | React.ReactNode;\n  labelForNotFound?: string;\n  labelForEmptyItems?: string;\n  notFound?: boolean;\n  hasItemsAtom: AtomMut<boolean>;\n  itemsRefs: React.RefObject<HTMLDivElement>[];\n  virtualScroll?: boolean;\n  onScrollToBottom?: (length: number) => void;\n  valueAtom: AtomMut<ITEM[]>;\n  getItemKeyAtom: AtomMut<(item: ITEM) => string | number>;\n  onChangeAll: (e: React.SyntheticEvent, items: ITEM[]) => void;\n  onChange: (e: React.SyntheticEvent, item: ITEM) => void;\n  inputValueAtom: AtomMut<string>;\n  groupsCounterAtom: AtomMut<Record<string, [number, number]>>;\n  dropdownZIndexAtom: AtomMut<number | undefined>;\n  selectAllLabel: string;\n  view: 'default' | 'clear';\n  form: 'default' | 'brick' | 'round';\n  disabledAtom: AtomMut<boolean>;\n}>;\n\ntype FlatSelectListComponent = <ITEM, GROUP>(\n  props: Props<ITEM, GROUP>,\n) => React.ReactNode | null;\n\nconst cnFlatSelectList = cn('FlatSelectList');\n\nconst getLengthElements = <ITEM, GROUP>(\n  elements: (\n    | OptionForCreate\n    | {\n        items: Array<SelectAllItem | ITEM>;\n        key: string | number;\n        group?: GROUP;\n      }\n  )[],\n) => {\n  let length = elements.length <= 1 ? 0 : elements.length;\n\n  for (let index = 0; index < elements.length; index++) {\n    const element = elements[index];\n\n    if (isNotOptionForCreate(element) && element?.items?.length) {\n      length += element.items.length;\n    }\n  }\n\n  return length;\n};\n\nconst isVisible = (slice: [number, number], index: number) => {\n  return index >= slice[0] && index < slice[1];\n};\n\nexport const FlatSelectList: FlatSelectListComponent = memo((props) => {\n  const {\n    size,\n    getOptionActions,\n    listRef,\n    labelForCreate,\n    className,\n    labelForNotFound,\n    labelForEmptyItems,\n    hasItemsAtom,\n    form,\n    openAtom,\n    renderItem,\n    visibleItemsAtom,\n    isLoading,\n    getGroupLabel,\n    notFound,\n    itemsRefs,\n    virtualScroll,\n    onScrollToBottom,\n    highlightedIndexAtom,\n    valueAtom,\n    getItemKeyAtom,\n    onChange,\n    onChangeAll,\n    inputValueAtom,\n    groupsCounterAtom,\n    dropdownZIndexAtom,\n    selectAllLabel,\n    view,\n    disabledAtom,\n    ...otherProps\n  } = props;\n\n  const [visibleItems] = useAtom(visibleItemsAtom);\n\n  const [hasItems] = useAtom(hasItemsAtom);\n  //   const [isListMount, setIsListMount] = useAtom(false);\n  const [getItemKey] = useAtom(getItemKeyAtom);\n  const indent = form === 'round' ? 'increased' : 'normal';\n\n  const isListShowed = useMemo(() => {\n    return (\n      visibleItems.filter(\n        (group) =>\n          isOptionForCreate(group) ||\n          (Array.isArray(group.items) && group.items.length > 0),\n      ).length > 0\n    );\n  }, [visibleItems]);\n\n  //   const offset = offsetProp === 'none' ? undefined : offsetProp;\n\n  const lengthForVirtualScroll = useMemo(\n    () => getLengthElements(visibleItems),\n    [visibleItems],\n  );\n\n  const {\n    spaceTop,\n    slice: sliceHookProp,\n    listRefs,\n    scrollElementRef,\n  } = useVirtualScroll({\n    length: lengthForVirtualScroll,\n    isActive: virtualScroll,\n    onScrollToBottom,\n  });\n\n  const scrollContainerRef = useForkRef([scrollElementRef, listRef]);\n\n  const slice: [number, number] =\n    sliceHookProp[0] === 0 && virtualScroll ? [0, 50] : sliceHookProp;\n\n  const getIndex = fabricIndex();\n  const getVirtualIndex = fabricIndex();\n  //   const [zIndex] = useAtom(dropdownZIndexAtom);\n\n  return (\n    <ListBox\n      {...otherProps}\n      size={size}\n      ref={scrollContainerRef}\n      className={cnFlatSelectList({ view }, [className])}\n      tabIndex={-1}\n    >\n      {isLoading && !isListShowed && <FlatSelectLoader />}\n      <div\n        className={cnFlatSelectList('List')}\n        key={cnFlatSelectList('List')}\n        style={{ marginTop: spaceTop }}\n      >\n        {visibleItems.map((group) => {\n          if (isOptionForCreate(group)) {\n            const index = getIndex();\n            return (\n              <FlatSelectCreateButton\n                size={size}\n                key={cnFlatSelectList('List', { key: 'CreateButton' })}\n                labelForCreate={labelForCreate}\n                indent={indent}\n                ref={itemsRefs[index]}\n                highlightedIndexAtom={highlightedIndexAtom}\n                inputValueAtom={inputValueAtom}\n                disabledAtom={disabledAtom}\n                index={index}\n                {...getOptionActions({\n                  index,\n                  item: group,\n                })}\n              />\n            );\n          }\n\n          const virtualIndex = visibleItems.length > 1 ? getVirtualIndex() : 0;\n\n          return (\n            <Fragment key={group.key}>\n              {group.group &&\n                getGroupLabel &&\n                isVisible(slice, virtualIndex) && (\n                  <FlatSelectGroupLabel\n                    label={getGroupLabel(group.group)}\n                    size={size}\n                    indent={indent}\n                    ref={listRefs[virtualIndex]}\n                    key={`group-${group.key}-Label`}\n                  />\n                )}\n              {group.items.map((item) => {\n                if (isOptionForSelectAll(item)) {\n                  const virtualIndex = getVirtualIndex();\n                  const index = getIndex();\n\n                  if (isVisible(slice, virtualIndex)) {\n                    return (\n                      <FlatSelectItemAll\n                        label={selectAllLabel}\n                        groupId={group.key}\n                        highlightedIndexAtom={highlightedIndexAtom}\n                        groupsCounterAtom={groupsCounterAtom}\n                        key={cnFlatSelectList('SelectItemAll', {\n                          group: group.key,\n                        })}\n                        ref={forkRef([\n                          listRefs[virtualIndex],\n                          itemsRefs[index],\n                        ])}\n                        indent={indent}\n                        size={size}\n                        {...getOptionActions({\n                          index,\n                          item,\n                        })}\n                        index={index}\n                        disabledAtom={disabledAtom}\n                      />\n                    );\n                  }\n                } else {\n                  const virtualIndex = getVirtualIndex();\n                  const index = getIndex();\n                  if (isVisible(slice, virtualIndex)) {\n                    return (\n                      <FlatSelectRenderItem\n                        key={cnFlatSelectList('SelectRenderItem', {\n                          group: group.key,\n                          item: getItemKey(item),\n                        })}\n                        getItemKeyAtom={getItemKeyAtom}\n                        highlightedIndexAtom={highlightedIndexAtom}\n                        rootRef={forkRef([\n                          listRefs[virtualIndex],\n                          itemsRefs[index],\n                        ])}\n                        renderItem={renderItem}\n                        item={item}\n                        {...getOptionActions({\n                          index,\n                          item,\n                        })}\n                        index={index}\n                        valueAtom={valueAtom}\n                      />\n                    );\n                  }\n                }\n              })}\n            </Fragment>\n          );\n        })}\n        {isLoading && isListShowed && (\n          <ListLoader size={size} innerOffset={indent} />\n        )}\n      </div>\n      {!isLoading && !hasItems && labelForEmptyItems && (\n        <ListItem size={size} label={labelForEmptyItems} innerOffset={indent}>\n          {labelForEmptyItems}\n        </ListItem>\n      )}\n    </ListBox>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"file":"FlatSelectList.js","names":["useAtom","React","Fragment","memo","useMemo","ListBox","ListItem","ListLoader","forkRef","useForkRef","useVirtualScroll","cn","fabricIndex","FlatSelectCreateButton","FlatSelectGroupLabel","FlatSelectItemAll","FlatSelectLoader","FlatSelectRenderItem","isNotOptionForCreate","isOptionForCreate","isOptionForSelectAll","FlatSelectListForm","defaultFlatSelectListPropForm","cnFlatSelectList","getLengthElements","elements","length","index","element","items","isVisible","slice","FlatSelectList","props","size","getOptionActions","listRef","labelForCreate","className","labelForNotFound","labelForEmptyItems","hasItemsAtom","form","openAtom","renderItem","visibleItemsAtom","isLoading","getGroupLabel","notFound","itemsRefs","virtualScroll","onScrollToBottom","highlightedIndexAtom","valueAtom","getItemKeyAtom","onChange","onChangeAll","inputValueAtom","groupsCounterAtom","dropdownZIndexAtom","selectAllLabel","view","disabledAtom","otherProps","visibleItems","hasItems","getItemKey","indent","isListShowed","filter","group","Array","isArray","lengthForVirtualScroll","isActive","spaceTop","sliceHookProp","listRefs","scrollElementRef","scrollContainerRef","getIndex","getVirtualIndex","marginTop","map","key","item","virtualIndex"],"sources":["../../../../../../src/components/FlatSelect/FlatSelectList/FlatSelectList.tsx"],"sourcesContent":["import './FlatSelectList.css';\n\nimport { AtomMut } from '@reatom/framework';\nimport { useAtom } from '@reatom/npm-react';\nimport React, { Fragment, memo, useMemo } from 'react';\n\nimport { FieldPropSize } from '##/components/FieldComponents';\nimport { ListBox, ListItem, ListLoader } from '##/components/ListCanary';\nimport { PopoverPropOffset } from '##/components/Popover';\nimport { forkRef, useForkRef } from '##/hooks/useForkRef';\nimport { useVirtualScroll } from '##/hooks/useVirtualScroll';\nimport { cn } from '##/utils/bem';\nimport { fabricIndex } from '##/utils/fabricIndex';\nimport { SelectAllItem } from '##/utils/getGroups';\nimport { PropsWithJsxAttributes } from '##/utils/types/PropsWithJsxAttributes';\n\nimport { FlatSelectCreateButton } from '../FlatSelectCreateButton';\nimport { FlatSelectGroupLabel } from '../FlatSelectGroupLabel/FlatSelectGroupLabel';\nimport { FlatSelectItemAll } from '../FlatSelectItemAll/FlatSelectItemAll';\nimport { FlatSelectLoader } from '../FlatSelectLoader/FlatSelectLoader';\n// import { SelectPopover } from '../SelectPopover';\nimport { FlatSelectRenderItem } from '../FlatSelectRenderItem';\nimport { CountedGroup } from '../types';\nimport {\n  GetOptionPropsResult,\n  isNotOptionForCreate,\n  isOptionForCreate,\n  isOptionForSelectAll,\n  OptionForCreate,\n  OptionProps,\n} from '../useFlatSelect';\n\nexport const FlatSelectListForm = ['default', 'brick', 'round'] as const;\nexport type FlatSelectListPropForm = (typeof FlatSelectListForm)[number];\nexport const defaultFlatSelectListPropForm = FlatSelectListForm[0];\n\ntype RenderItemProps<ITEM> = {\n  item: ITEM;\n  active: boolean;\n  hovered: boolean;\n  onClick: (e: React.MouseEvent) => void;\n  onMouseEnter: (e: React.MouseEvent) => void;\n  ref: React.Ref<HTMLDivElement>;\n};\n\ntype Props<ITEM, GROUP> = PropsWithJsxAttributes<{\n  size: FieldPropSize;\n  listRef: React.Ref<HTMLDivElement>;\n  getOptionActions(props: OptionProps<ITEM>): GetOptionPropsResult;\n  //   form: FlatSelectListPropForm;\n  openAtom: AtomMut<boolean>;\n  offset?: PopoverPropOffset | 'none';\n  isLoading?: boolean;\n  renderItem: (props: RenderItemProps<ITEM>) => React.ReactNode | null;\n  highlightedIndexAtom: AtomMut<number>;\n  visibleItemsAtom: AtomMut<(OptionForCreate | CountedGroup<ITEM, GROUP>)[]>;\n  getGroupLabel?: (group: GROUP) => string;\n  labelForCreate?:\n    | ((label: string | undefined) => React.ReactNode)\n    | React.ReactNode;\n  labelForNotFound?: string;\n  labelForEmptyItems?: string;\n  notFound?: boolean;\n  hasItemsAtom: AtomMut<boolean>;\n  itemsRefs: React.RefObject<HTMLDivElement>[];\n  virtualScroll?: boolean;\n  onScrollToBottom?: (length: number) => void;\n  valueAtom: AtomMut<ITEM[]>;\n  getItemKeyAtom: AtomMut<(item: ITEM) => string | number>;\n  onChangeAll: (e: React.SyntheticEvent, items: ITEM[]) => void;\n  onChange: (e: React.SyntheticEvent, item: ITEM) => void;\n  inputValueAtom: AtomMut<string>;\n  groupsCounterAtom: AtomMut<Record<string, [number, number]>>;\n  dropdownZIndexAtom: AtomMut<number | undefined>;\n  selectAllLabel: string;\n  view: 'default' | 'clear';\n  form: 'default' | 'brick' | 'round';\n  disabledAtom: AtomMut<boolean>;\n}>;\n\ntype FlatSelectListComponent = <ITEM, GROUP>(\n  props: Props<ITEM, GROUP>,\n) => React.ReactNode | null;\n\nconst cnFlatSelectList = cn('FlatSelectList');\n\nconst getLengthElements = <ITEM, GROUP>(\n  elements: (\n    | OptionForCreate\n    | {\n        items: Array<SelectAllItem | ITEM>;\n        key: string | number;\n        group?: GROUP;\n      }\n  )[],\n) => {\n  let length = elements.length <= 1 ? 0 : elements.length;\n\n  for (let index = 0; index < elements.length; index++) {\n    const element = elements[index];\n\n    if (isNotOptionForCreate(element) && element?.items?.length) {\n      length += element.items.length;\n    }\n  }\n\n  return length;\n};\n\nconst isVisible = (slice: [number, number], index: number) => {\n  return index >= slice[0] && index < slice[1];\n};\n\nexport const FlatSelectList: FlatSelectListComponent = memo((props) => {\n  const {\n    size,\n    getOptionActions,\n    listRef,\n    labelForCreate,\n    className,\n    labelForNotFound,\n    labelForEmptyItems,\n    hasItemsAtom,\n    form,\n    openAtom,\n    renderItem,\n    visibleItemsAtom,\n    isLoading,\n    getGroupLabel,\n    notFound,\n    itemsRefs,\n    virtualScroll,\n    onScrollToBottom,\n    highlightedIndexAtom,\n    valueAtom,\n    getItemKeyAtom,\n    onChange,\n    onChangeAll,\n    inputValueAtom,\n    groupsCounterAtom,\n    dropdownZIndexAtom,\n    selectAllLabel,\n    view,\n    disabledAtom,\n    ...otherProps\n  } = props;\n\n  const [visibleItems] = useAtom(visibleItemsAtom);\n\n  const [hasItems] = useAtom(hasItemsAtom);\n  //   const [isListMount, setIsListMount] = useAtom(false);\n  const [getItemKey] = useAtom(getItemKeyAtom);\n  const indent = form === 'round' ? 'increased' : 'normal';\n\n  const isListShowed = useMemo(() => {\n    return (\n      visibleItems.filter(\n        (group) =>\n          isOptionForCreate(group) ||\n          (Array.isArray(group.items) && group.items.length > 0),\n      ).length > 0\n    );\n  }, [visibleItems]);\n\n  //   const offset = offsetProp === 'none' ? undefined : offsetProp;\n\n  const lengthForVirtualScroll = useMemo(\n    () => getLengthElements(visibleItems),\n    [visibleItems],\n  );\n\n  const {\n    spaceTop,\n    slice: sliceHookProp,\n    listRefs,\n    scrollElementRef,\n  } = useVirtualScroll({\n    length: lengthForVirtualScroll,\n    isActive: virtualScroll,\n    onScrollToBottom,\n  });\n\n  const scrollContainerRef = useForkRef([scrollElementRef, listRef]);\n\n  const slice: [number, number] =\n    sliceHookProp[0] === 0 && virtualScroll ? [0, 50] : sliceHookProp;\n\n  const getIndex = fabricIndex();\n  const getVirtualIndex = fabricIndex();\n  //   const [zIndex] = useAtom(dropdownZIndexAtom);\n\n  return (\n    <ListBox\n      {...otherProps}\n      size={size}\n      ref={scrollContainerRef}\n      className={cnFlatSelectList({ view }, [className])}\n      tabIndex={-1}\n    >\n      {isLoading && !isListShowed && <FlatSelectLoader />}\n      <div\n        className={cnFlatSelectList('List')}\n        key={cnFlatSelectList('List')}\n        style={{ marginTop: spaceTop }}\n      >\n        {visibleItems.map((group) => {\n          if (isOptionForCreate(group)) {\n            const index = getIndex();\n            return (\n              <FlatSelectCreateButton\n                size={size}\n                key={cnFlatSelectList('List', { key: 'CreateButton' })}\n                labelForCreate={labelForCreate}\n                indent={indent}\n                ref={itemsRefs[index]}\n                highlightedIndexAtom={highlightedIndexAtom}\n                inputValueAtom={inputValueAtom}\n                disabledAtom={disabledAtom}\n                index={index}\n                {...getOptionActions({\n                  index,\n                  item: group,\n                })}\n              />\n            );\n          }\n\n          const virtualIndex = visibleItems.length > 1 ? getVirtualIndex() : 0;\n\n          return (\n            <Fragment key={group.key}>\n              {group.group &&\n                getGroupLabel &&\n                isVisible(slice, virtualIndex) && (\n                  <FlatSelectGroupLabel\n                    label={getGroupLabel(group.group)}\n                    size={size}\n                    indent={indent}\n                    ref={listRefs[virtualIndex]}\n                    key={`group-${group.key}-Label`}\n                  />\n                )}\n              {group.items.map((item) => {\n                if (isOptionForSelectAll(item)) {\n                  const virtualIndex = getVirtualIndex();\n                  const index = getIndex();\n\n                  if (isVisible(slice, virtualIndex)) {\n                    return (\n                      <FlatSelectItemAll\n                        label={selectAllLabel}\n                        groupId={group.key}\n                        highlightedIndexAtom={highlightedIndexAtom}\n                        groupsCounterAtom={groupsCounterAtom}\n                        key={cnFlatSelectList('SelectItemAll', {\n                          group: group.key,\n                        })}\n                        ref={forkRef([\n                          listRefs[virtualIndex],\n                          itemsRefs[index],\n                        ])}\n                        indent={indent}\n                        size={size}\n                        {...getOptionActions({\n                          index,\n                          item,\n                        })}\n                        index={index}\n                        disabledAtom={disabledAtom}\n                      />\n                    );\n                  }\n                } else {\n                  const virtualIndex = getVirtualIndex();\n                  const index = getIndex();\n                  if (isVisible(slice, virtualIndex)) {\n                    return (\n                      <FlatSelectRenderItem\n                        key={cnFlatSelectList('SelectRenderItem', {\n                          group: group.key,\n                          item: getItemKey(item),\n                        })}\n                        getItemKeyAtom={getItemKeyAtom}\n                        highlightedIndexAtom={highlightedIndexAtom}\n                        rootRef={forkRef([\n                          listRefs[virtualIndex],\n                          itemsRefs[index],\n                        ])}\n                        renderItem={renderItem}\n                        item={item}\n                        {...getOptionActions({\n                          index,\n                          item,\n                        })}\n                        index={index}\n                        valueAtom={valueAtom}\n                      />\n                    );\n                  }\n                }\n              })}\n            </Fragment>\n          );\n        })}\n        {isLoading && isListShowed && (\n          <ListLoader size={size} innerOffset={indent} />\n        )}\n      </div>\n      {!isLoading && !hasItems && labelForEmptyItems && (\n        <ListItem size={size} label={labelForEmptyItems} innerOffset={indent}>\n          {labelForEmptyItems}\n        </ListItem>\n      )}\n    </ListBox>\n  );\n});\n"],"mappings":"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"}

package/__internal__/src/components/FlatSelect/FlatSelectRoot/FlatSelectRoot.d.ts

@@ -10,6 +10,7 @@ export type FlatSelectRootProps = PropsWithHTMLAttributesAndRef<{
     spareDirection?: Direction;
     possibleDirections?: Direction[];
     viewportRef?: React.RefObject<HTMLElement>;
+    container?: Element;
 }, HTMLDivElement>;
 export declare const cnFlatSelectRoot: import("@bem-react/classname").ClassNameFormatter;
 export declare const FlatSelectRoot: React.FC<FlatSelectRootProps>;

package/__internal__/src/components/FlatSelect/FlatSelectRoot/FlatSelectRoot.js

@@ -1,2 +1,2 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","anchorRef","openAtom","direction","spareDirection","possibleDirections","viewportRef"];import"./FlatSelectRoot.css";import{useAtom}from"@reatom/npm-react";import React,{forwardRef,useRef}from"react";import{Transition}from"react-transition-group";import{Popover}from"../../Popover";import{useForkRef}from"../../../hooks/useForkRef";import{animateTimeout,cnMixPopoverAnimate}from"../../../mixs/MixPopoverAnimate";import{cn}from"../../../utils/bem";export var cnFlatSelectRoot=cn("FlatSelectRoot");export var FlatSelectRoot=forwardRef(function(a,b){var c=a.className,d=a.anchorRef,e=a.openAtom,f=a.direction,g=void 0===f?"downStartLeft":f,h=a.spareDirection,i=void 0===h?"downStartLeft":h,j=a.possibleDirections,k=void 0===j?["downStartLeft","downStartRight","upStartLeft","upStartRight","leftStartDown","leftStartUp"]:j,l=a.viewportRef,m=_objectWithoutProperties(a,_excluded),n=useRef(null),o=useForkRef([n,b]),p=!!d,q=useAtom(e),r=_slicedToArray(q,1),s=r[0];return p?React.createElement(Transition,{in:s,unmountOnExit:!0,timeout:animateTimeout,nodeRef:n},function(a){return React.createElement(Popover,Object.assign({},m,{className:cnFlatSelectRoot({withAnchor:p},[c,cnMixPopoverAnimate({animate:a})]),ref:o,anchorRef:d,equalAnchorWidth:!0,offset:"2xs",direction:g,spareDirection:i,possibleDirections:k,viewportRef:l}))}):React.createElement("div",Object.assign({},m,{className:cnFlatSelectRoot(null,[c]),ref:b}))});
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","anchorRef","openAtom","direction","spareDirection","possibleDirections","viewportRef","container"];import"./FlatSelectRoot.css";import{useAtom}from"@reatom/npm-react";import React,{forwardRef,useRef}from"react";import{Transition}from"react-transition-group";import{Popover}from"../../Popover";import{useForkRef}from"../../../hooks/useForkRef";import{animateTimeout,cnMixPopoverAnimate}from"../../../mixs/MixPopoverAnimate";import{cn}from"../../../utils/bem";export var cnFlatSelectRoot=cn("FlatSelectRoot");export var FlatSelectRoot=forwardRef(function(a,b){var c=a.className,d=a.anchorRef,e=a.openAtom,f=a.direction,g=void 0===f?"downStartLeft":f,h=a.spareDirection,i=void 0===h?"downStartLeft":h,j=a.possibleDirections,k=void 0===j?["downStartLeft","downStartRight","upStartLeft","upStartRight","leftStartDown","leftStartUp"]:j,l=a.viewportRef,m=a.container,n=_objectWithoutProperties(a,_excluded),o=useRef(null),p=useForkRef([o,b]),q=!!d,r=useAtom(e),s=_slicedToArray(r,1),t=s[0];return q?React.createElement(Transition,{in:t,unmountOnExit:!0,timeout:animateTimeout,nodeRef:o},function(a){return React.createElement(Popover,Object.assign({},n,{className:cnFlatSelectRoot({withAnchor:q},[c,cnMixPopoverAnimate({animate:a})]),ref:p,anchorRef:d,equalAnchorWidth:!0,offset:"2xs",direction:g,spareDirection:i,possibleDirections:k,viewportRef:l,container:m,role:"listbox"}))}):React.createElement("div",Object.assign({},n,{className:cnFlatSelectRoot(null,[c]),ref:b,role:"listbox"}))});
 //# sourceMappingURL=FlatSelectRoot.js.map

package/__internal__/src/components/FlatSelect/FlatSelectRoot/FlatSelectRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlatSelectRoot.js","names":["useAtom","React","forwardRef","useRef","Transition","Popover","useForkRef","animateTimeout","cnMixPopoverAnimate","cn","cnFlatSelectRoot","FlatSelectRoot","props","ref","className","anchorRef","openAtom","direction","spareDirection","possibleDirections","viewportRef","otherProps","contentRef","contentForkedRef","withAnchor","open","animate"],"sources":["../../../../../../src/components/FlatSelect/FlatSelectRoot/FlatSelectRoot.tsx"],"sourcesContent":["import './FlatSelectRoot.css';\n\nimport { AtomMut } from '@reatom/framework';\nimport { useAtom } from '@reatom/npm-react';\nimport React, { forwardRef, useRef } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { Direction, Popover } from '##/components/Popover';\nimport { useForkRef } from '##/hooks/useForkRef';\nimport { animateTimeout, cnMixPopoverAnimate } from '##/mixs/MixPopoverAnimate';\nimport { cn } from '##/utils/bem';\nimport { PropsWithHTMLAttributesAndRef } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type FlatSelectRootProps = PropsWithHTMLAttributesAndRef<\n  {\n    anchorRef?: React.RefObject<HTMLElement>;\n    openAtom: AtomMut<boolean>;\n    direction?: Direction;\n    spareDirection?: Direction;\n    possibleDirections?: Direction[];\n    viewportRef?: React.RefObject<HTMLElement>;\n  },\n  HTMLDivElement\n>;\n\nexport const cnFlatSelectRoot = cn('FlatSelectRoot');\n\nexport const FlatSelectRoot: React.FC<FlatSelectRootProps> = forwardRef(\n  (props, ref) => {\n    const {\n      className,\n      anchorRef,\n      openAtom,\n      direction = 'downStartLeft',\n      spareDirection = 'downStartLeft',\n      possibleDirections = [\n        'downStartLeft',\n        'downStartRight',\n        'upStartLeft',\n        'upStartRight',\n        'leftStartDown',\n        'leftStartUp',\n      ],\n      viewportRef,\n      ...otherProps\n    } = props;\n\n    const contentRef = useRef(null);\n    const contentForkedRef = useForkRef([contentRef, ref]);\n    const withAnchor = !!anchorRef;\n    const [open] = useAtom(openAtom);\n\n    if (withAnchor) {\n      return (\n        <Transition\n          in={open}\n          unmountOnExit\n          timeout={animateTimeout}\n          nodeRef={contentRef}\n        >\n          {(animate) => (\n            <Popover\n              {...otherProps}\n              className={cnFlatSelectRoot({ withAnchor }, [\n                className,\n                cnMixPopoverAnimate({ animate }),\n              ])}\n              ref={contentForkedRef}\n              anchorRef={anchorRef}\n              equalAnchorWidth\n              offset=\"2xs\"\n              direction={direction}\n              spareDirection={spareDirection}\n              possibleDirections={possibleDirections}\n              viewportRef={viewportRef}\n            />\n          )}\n        </Transition>\n      );\n    }\n\n    return (\n      <div\n        {...otherProps}\n        className={cnFlatSelectRoot(null, [className])}\n        ref={ref}\n      />\n    );\n  },\n);\n"],"mappings":"yQAAA,6BAGA,OAASA,OAAT,KAAwB,mBAAxB,CACA,MAAOC,MAAP,EAAgBC,UAAhB,CAA4BC,MAA5B,KAA0C,OAA1C,CACA,OAASC,UAAT,KAA2B,wBAA3B,CAEA,OAAoBC,OAApB,qBACA,OAASC,UAAT,iCACA,OAASC,cAAT,CAAyBC,mBAAzB,uCACA,OAASC,EAAT,0BAeA,MAAO,IAAMC,iBAAgB,CAAGD,EAAE,CAAC,gBAAD,CAA3B,CAEP,MAAO,IAAME,eAA6C,CAAGT,UAAU,CACrE,SAACU,CAAD,CAAQC,CAAR,CAAgB,IAEZC,EAFY,CAiBVF,CAjBU,CAEZE,SAFY,CAGZC,CAHY,CAiBVH,CAjBU,CAGZG,SAHY,CAIZC,CAJY,CAiBVJ,CAjBU,CAIZI,QAJY,GAiBVJ,CAjBU,CAKZK,SALY,CAKZA,CALY,YAKA,eALA,KAiBVL,CAjBU,CAMZM,cANY,CAMZA,CANY,YAMK,eANL,KAiBVN,CAjBU,CAOZO,kBAPY,CAOZA,CAPY,YAOS,CACnB,eADmB,CAEnB,gBAFmB,CAGnB,aAHmB,CAInB,cAJmB,CAKnB,eALmB,CAMnB,aANmB,CAPT,GAeZC,CAfY,CAiBVR,CAjBU,CAeZQ,WAfY,CAgBTC,CAhBS,0BAiBVT,CAjBU,YAmBRU,CAAU,CAAGnB,MAAM,CAAC,IAAD,CAnBX,CAoBRoB,CAAgB,CAAGjB,UAAU,CAAC,CAACgB,CAAD,CAAaT,CAAb,CAAD,CApBrB,CAqBRW,CAAU,CAAG,CAAC,CAACT,CArBP,GAsBCf,OAAO,CAACgB,CAAD,CAtBR,uBAsBPS,CAtBO,YAwBVD,EAxBU,CA0BV,oBAAC,UAAD,EACE,GAAIC,CADN,CAEE,aAAa,GAFf,CAGE,OAAO,CAAElB,cAHX,CAIE,OAAO,CAAEe,CAJX,EAMG,SAACI,CAAD,QACC,qBAAC,OAAD,kBACML,CADN,EAEE,SAAS,CAAEX,gBAAgB,CAAC,CAAEc,UAAU,CAAVA,CAAF,CAAD,CAAiB,CAC1CV,CAD0C,CAE1CN,mBAAmB,CAAC,CAAEkB,OAAO,CAAPA,CAAF,CAAD,CAFuB,CAAjB,CAF7B,CAME,GAAG,CAAEH,CANP,CAOE,SAAS,CAAER,CAPb,CAQE,gBAAgB,GARlB,CASE,MAAM,CAAC,KATT,CAUE,SAAS,CAAEE,CAVb,CAWE,cAAc,CAAEC,CAXlB,CAYE,kBAAkB,CAAEC,CAZtB,CAaE,WAAW,CAAEC,CAbf,GADD,CANH,CA1BU,CAsDZ,2CACMC,CADN,EAEE,SAAS,CAAEX,gBAAgB,CAAC,IAAD,CAAO,CAACI,CAAD,CAAP,CAF7B,CAGE,GAAG,CAAED,CAHP,GAMH,CA7DoE,CAAhE"}
+{"version":3,"file":"FlatSelectRoot.js","names":["useAtom","React","forwardRef","useRef","Transition","Popover","useForkRef","animateTimeout","cnMixPopoverAnimate","cn","cnFlatSelectRoot","FlatSelectRoot","props","ref","className","anchorRef","openAtom","direction","spareDirection","possibleDirections","viewportRef","container","otherProps","contentRef","contentForkedRef","withAnchor","open","animate"],"sources":["../../../../../../src/components/FlatSelect/FlatSelectRoot/FlatSelectRoot.tsx"],"sourcesContent":["import './FlatSelectRoot.css';\n\nimport { AtomMut } from '@reatom/framework';\nimport { useAtom } from '@reatom/npm-react';\nimport React, { forwardRef, useRef } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { Direction, Popover } from '##/components/Popover';\nimport { useForkRef } from '##/hooks/useForkRef';\nimport { animateTimeout, cnMixPopoverAnimate } from '##/mixs/MixPopoverAnimate';\nimport { cn } from '##/utils/bem';\nimport { PropsWithHTMLAttributesAndRef } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type FlatSelectRootProps = PropsWithHTMLAttributesAndRef<\n  {\n    anchorRef?: React.RefObject<HTMLElement>;\n    openAtom: AtomMut<boolean>;\n    direction?: Direction;\n    spareDirection?: Direction;\n    possibleDirections?: Direction[];\n    viewportRef?: React.RefObject<HTMLElement>;\n    container?: Element;\n  },\n  HTMLDivElement\n>;\n\nexport const cnFlatSelectRoot = cn('FlatSelectRoot');\n\nexport const FlatSelectRoot: React.FC<FlatSelectRootProps> = forwardRef(\n  (props, ref) => {\n    const {\n      className,\n      anchorRef,\n      openAtom,\n      direction = 'downStartLeft',\n      spareDirection = 'downStartLeft',\n      possibleDirections = [\n        'downStartLeft',\n        'downStartRight',\n        'upStartLeft',\n        'upStartRight',\n        'leftStartDown',\n        'leftStartUp',\n      ],\n      viewportRef,\n      container,\n      ...otherProps\n    } = props;\n\n    const contentRef = useRef(null);\n    const contentForkedRef = useForkRef([contentRef, ref]);\n    const withAnchor = !!anchorRef;\n    const [open] = useAtom(openAtom);\n\n    if (withAnchor) {\n      return (\n        <Transition\n          in={open}\n          unmountOnExit\n          timeout={animateTimeout}\n          nodeRef={contentRef}\n        >\n          {(animate) => (\n            <Popover\n              {...otherProps}\n              className={cnFlatSelectRoot({ withAnchor }, [\n                className,\n                cnMixPopoverAnimate({ animate }),\n              ])}\n              ref={contentForkedRef}\n              anchorRef={anchorRef}\n              equalAnchorWidth\n              offset=\"2xs\"\n              direction={direction}\n              spareDirection={spareDirection}\n              possibleDirections={possibleDirections}\n              viewportRef={viewportRef}\n              container={container}\n              role=\"listbox\"\n            />\n          )}\n        </Transition>\n      );\n    }\n\n    return (\n      <div\n        {...otherProps}\n        className={cnFlatSelectRoot(null, [className])}\n        ref={ref}\n        role=\"listbox\"\n      />\n    );\n  },\n);\n"],"mappings":"qRAAA,6BAGA,OAASA,OAAT,KAAwB,mBAAxB,CACA,MAAOC,MAAP,EAAgBC,UAAhB,CAA4BC,MAA5B,KAA0C,OAA1C,CACA,OAASC,UAAT,KAA2B,wBAA3B,CAEA,OAAoBC,OAApB,qBACA,OAASC,UAAT,iCACA,OAASC,cAAT,CAAyBC,mBAAzB,uCACA,OAASC,EAAT,0BAgBA,MAAO,IAAMC,iBAAgB,CAAGD,EAAE,CAAC,gBAAD,CAA3B,CAEP,MAAO,IAAME,eAA6C,CAAGT,UAAU,CACrE,SAACU,CAAD,CAAQC,CAAR,CAAgB,IAEZC,EAFY,CAkBVF,CAlBU,CAEZE,SAFY,CAGZC,CAHY,CAkBVH,CAlBU,CAGZG,SAHY,CAIZC,CAJY,CAkBVJ,CAlBU,CAIZI,QAJY,GAkBVJ,CAlBU,CAKZK,SALY,CAKZA,CALY,YAKA,eALA,KAkBVL,CAlBU,CAMZM,cANY,CAMZA,CANY,YAMK,eANL,KAkBVN,CAlBU,CAOZO,kBAPY,CAOZA,CAPY,YAOS,CACnB,eADmB,CAEnB,gBAFmB,CAGnB,aAHmB,CAInB,cAJmB,CAKnB,eALmB,CAMnB,aANmB,CAPT,GAeZC,CAfY,CAkBVR,CAlBU,CAeZQ,WAfY,CAgBZC,CAhBY,CAkBVT,CAlBU,CAgBZS,SAhBY,CAiBTC,CAjBS,0BAkBVV,CAlBU,YAoBRW,CAAU,CAAGpB,MAAM,CAAC,IAAD,CApBX,CAqBRqB,CAAgB,CAAGlB,UAAU,CAAC,CAACiB,CAAD,CAAaV,CAAb,CAAD,CArBrB,CAsBRY,CAAU,CAAG,CAAC,CAACV,CAtBP,GAuBCf,OAAO,CAACgB,CAAD,CAvBR,uBAuBPU,CAvBO,YAyBVD,EAzBU,CA2BV,oBAAC,UAAD,EACE,GAAIC,CADN,CAEE,aAAa,GAFf,CAGE,OAAO,CAAEnB,cAHX,CAIE,OAAO,CAAEgB,CAJX,EAMG,SAACI,CAAD,QACC,qBAAC,OAAD,kBACML,CADN,EAEE,SAAS,CAAEZ,gBAAgB,CAAC,CAAEe,UAAU,CAAVA,CAAF,CAAD,CAAiB,CAC1CX,CAD0C,CAE1CN,mBAAmB,CAAC,CAAEmB,OAAO,CAAPA,CAAF,CAAD,CAFuB,CAAjB,CAF7B,CAME,GAAG,CAAEH,CANP,CAOE,SAAS,CAAET,CAPb,CAQE,gBAAgB,GARlB,CASE,MAAM,CAAC,KATT,CAUE,SAAS,CAAEE,CAVb,CAWE,cAAc,CAAEC,CAXlB,CAYE,kBAAkB,CAAEC,CAZtB,CAaE,WAAW,CAAEC,CAbf,CAcE,SAAS,CAAEC,CAdb,CAeE,IAAI,CAAC,SAfP,GADD,CANH,CA3BU,CAyDZ,2CACMC,CADN,EAEE,SAAS,CAAEZ,gBAAgB,CAAC,IAAD,CAAO,CAACI,CAAD,CAAP,CAF7B,CAGE,GAAG,CAAED,CAHP,CAIE,IAAI,CAAC,SAJP,GAOH,CAjEoE,CAAhE"}

package/__internal__/src/components/FlatSelect/types.d.ts

@@ -102,6 +102,7 @@ export type FlatSelectPropsInit<ITEM = FlatSelectItemDefault, GROUP = FlatSelect
     spareDirection?: Direction;
     possibleDirections?: Direction[];
     viewportRef?: React.RefObject<HTMLElement>;
+    container?: Element;
 }, HTMLDivElement>;
 /**
  * Props for the FlatSelect component.

package/__internal__/src/components/FlatSelect/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/components/FlatSelect/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { FieldPropSize, FieldPropView } from '##/components/FieldComponents';\nimport { Direction } from '##/components/Popover';\nimport { PropsWithHTMLAttributesAndRef } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type RenderItemProps<ITEM> = {\n  item: ITEM;\n  active: boolean;\n  hovered: boolean;\n  onClick: (e: React.MouseEvent) => void;\n  onMouseEnter: (e: React.MouseEvent) => void;\n  ref: React.Ref<HTMLDivElement>;\n};\n\nexport type FlatSelectItemDefault = {\n  label: string;\n  id: string | number;\n  groupId?: string | number;\n  disabled?: boolean;\n};\n\nexport type FlatSelectGroupDefault = {\n  label: string;\n  id: string | number;\n};\n\nexport type FlatSelectPropGetItemLabel<ITEM> = (item: ITEM) => string;\nexport type FlatSelectPropGetItemKey<ITEM> = (item: ITEM) => string | number;\nexport type FlatSelectPropGetItemGroupKey<ITEM> = (\n  item: ITEM,\n) => string | number | undefined;\nexport type FlatSelectPropGetItemDisabled<ITEM> = (\n  item: ITEM,\n) => boolean | undefined;\nexport type FlatSelectPropGetGroupKey<GROUP> = (\n  group: GROUP,\n) => string | number;\nexport type FlatSelectPropGetGroupLabel<GROUP> = (group: GROUP) => string;\n\nexport type FlatSelectPropOnChange<ITEM, MULTIPLE extends boolean> = (\n  value: (MULTIPLE extends true ? ITEM[] : ITEM) | null,\n  props: {\n    e: React.SyntheticEvent;\n  },\n) => void;\nexport type FlatSelectPropValue<ITEM, MULTIPLE extends boolean> =\n  | (MULTIPLE extends true ? ITEM[] : ITEM)\n  | null\n  | undefined;\n\nexport type FlatSelectPropRenderItem<ITEM> = (\n  props: RenderItemProps<ITEM>,\n) => React.ReactNode | null;\n\nexport type FlatSelectPropRenderValue<ITEM, MULTIPLE> = MULTIPLE extends true\n  ? (props: {\n      value: ITEM[];\n      getRemove: (\n        item: ITEM,\n      ) => (e: React.SyntheticEvent<Element, Event>) => void;\n    }) => React.ReactNode | null\n  : (props: { value: ITEM }) => React.ReactNode | null;\n\nexport type FlatSelectPropOnCreate = (\n  label: string,\n  props: { e: React.SyntheticEvent },\n) => void;\n\nexport type FlatSelectAllItem = {\n  groupKey: string | number;\n  __optionSelectAll: true;\n};\n\nexport type Group<ITEM, GROUP> = {\n  items: ITEM[];\n  key: string | number;\n  group?: GROUP;\n};\n\nexport type CountedGroup<ITEM, GROUP> = Omit<Group<ITEM, GROUP>, 'items'> & {\n  items: Array<FlatSelectAllItem | ITEM>;\n};\n\nexport type FlatSelectPropForm = 'default' | 'brick' | 'round';\n\nexport type FlatSelectPropsInit<\n  ITEM = FlatSelectItemDefault,\n  GROUP = FlatSelectGroupDefault,\n  MULTIPLE extends boolean = false,\n> = PropsWithHTMLAttributesAndRef<\n  {\n    items: ITEM[];\n    onChange: FlatSelectPropOnChange<ITEM, MULTIPLE>;\n    disabled?: boolean;\n    form?: 'default' | 'brick' | 'round';\n    placeholder?: string;\n    size?: FieldPropSize;\n    isLoading?: boolean;\n    listRef?: React.Ref<HTMLDivElement>;\n    renderItem?: FlatSelectPropRenderItem<ITEM>;\n    onInputFocus?: React.FocusEventHandler<HTMLInputElement>;\n    onInputBlur?: React.FocusEventHandler<HTMLInputElement>;\n    onCreate?: FlatSelectPropOnCreate;\n    inputRef?: React.Ref<HTMLInputElement>;\n    input?: boolean;\n    inputValue?: string;\n    inputDefaultValue?: string;\n    onInput?: (value: string) => void;\n    labelForCreate?:\n      | ((label: string | undefined) => React.ReactNode)\n      | React.ReactNode;\n    labelForEmptyItems?: string;\n    multiple?: MULTIPLE;\n    value?: FlatSelectPropValue<ITEM, MULTIPLE>;\n    groups?: GROUP[];\n    getItemLabel?: FlatSelectPropGetItemLabel<ITEM>;\n    getItemKey?: FlatSelectPropGetItemKey<ITEM>;\n    getItemGroupKey?: FlatSelectPropGetItemGroupKey<ITEM>;\n    getItemDisabled?: FlatSelectPropGetItemDisabled<ITEM>;\n    getGroupLabel?: FlatSelectPropGetGroupLabel<GROUP>;\n    getGroupKey?: FlatSelectPropGetGroupKey<GROUP>;\n    virtualScroll?: boolean;\n    onScrollToBottom?: (length: number) => void;\n    onOpen?: (isOpen: boolean) => void;\n    isOpen?: boolean;\n    listClassName?: string;\n    ignoreOutsideClicksRefs?: ReadonlyArray<React.RefObject<HTMLElement>>;\n    clearButton?: boolean;\n    iconClear?: IconComponent;\n    iconLeft?: IconComponent;\n    selectAll?: MULTIPLE extends true ? boolean : never;\n    selectAllLabel?: string;\n    footer?: React.ReactNode;\n    view?: FieldPropView;\n    bordered?: boolean;\n    anchorRef?: React.RefObject<HTMLElement>;\n    direction?: Direction;\n    spareDirection?: Direction;\n    possibleDirections?: Direction[];\n    viewportRef?: React.RefObject<HTMLElement>;\n  },\n  HTMLDivElement\n>;\n\n/**\n * Props for the FlatSelect component.\n *\n * This type defines the props for the FlatSelect component, which is a customizable select component.\n * It allows for single or multiple selection, and supports grouping of items.\n * The component can be customized by providing custom item and group types.\n *\n * @template ITEM The type of the items in the select. Defaults to FlatSelectItemDefault.\n * @template GROUP The type of the groups in the select. Defaults to FlatSelectGroupDefault.\n * @template MULTIPLE Whether the select allows multiple selection. Defaults to false.\n */\nexport type FlatSelectProps<\n  ITEM = FlatSelectItemDefault,\n  GROUP = FlatSelectGroupDefault,\n  MULTIPLE extends boolean = false,\n> = FlatSelectPropsInit<ITEM, GROUP, MULTIPLE> &\n  (ITEM extends { label: FlatSelectItemDefault['label'] }\n    ? {}\n    : { getItemLabel: FlatSelectPropGetItemLabel<ITEM> }) &\n  (ITEM extends { id: FlatSelectItemDefault['id'] }\n    ? {}\n    : { getItemKey: FlatSelectPropGetItemKey<ITEM> }) &\n  (GROUP extends { label: FlatSelectGroupDefault['label'] }\n    ? {}\n    : { getGroupLabel: FlatSelectPropGetGroupLabel<GROUP> }) &\n  (GROUP extends { id: FlatSelectGroupDefault['id'] }\n    ? {}\n    : { getGroupKey: FlatSelectPropGetGroupKey<GROUP> });\n\nexport type FlatSelectComponent = <\n  ITEM = FlatSelectItemDefault,\n  GROUP = FlatSelectGroupDefault,\n  MULTIPLE extends boolean = false,\n>(\n  props: FlatSelectProps<ITEM, GROUP, MULTIPLE>,\n) => React.ReactNode | null;\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/components/FlatSelect/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { FieldPropSize, FieldPropView } from '##/components/FieldComponents';\nimport { Direction } from '##/components/Popover';\nimport { PropsWithHTMLAttributesAndRef } from '##/utils/types/PropsWithHTMLAttributes';\n\nexport type RenderItemProps<ITEM> = {\n  item: ITEM;\n  active: boolean;\n  hovered: boolean;\n  onClick: (e: React.MouseEvent) => void;\n  onMouseEnter: (e: React.MouseEvent) => void;\n  ref: React.Ref<HTMLDivElement>;\n};\n\nexport type FlatSelectItemDefault = {\n  label: string;\n  id: string | number;\n  groupId?: string | number;\n  disabled?: boolean;\n};\n\nexport type FlatSelectGroupDefault = {\n  label: string;\n  id: string | number;\n};\n\nexport type FlatSelectPropGetItemLabel<ITEM> = (item: ITEM) => string;\nexport type FlatSelectPropGetItemKey<ITEM> = (item: ITEM) => string | number;\nexport type FlatSelectPropGetItemGroupKey<ITEM> = (\n  item: ITEM,\n) => string | number | undefined;\nexport type FlatSelectPropGetItemDisabled<ITEM> = (\n  item: ITEM,\n) => boolean | undefined;\nexport type FlatSelectPropGetGroupKey<GROUP> = (\n  group: GROUP,\n) => string | number;\nexport type FlatSelectPropGetGroupLabel<GROUP> = (group: GROUP) => string;\n\nexport type FlatSelectPropOnChange<ITEM, MULTIPLE extends boolean> = (\n  value: (MULTIPLE extends true ? ITEM[] : ITEM) | null,\n  props: {\n    e: React.SyntheticEvent;\n  },\n) => void;\nexport type FlatSelectPropValue<ITEM, MULTIPLE extends boolean> =\n  | (MULTIPLE extends true ? ITEM[] : ITEM)\n  | null\n  | undefined;\n\nexport type FlatSelectPropRenderItem<ITEM> = (\n  props: RenderItemProps<ITEM>,\n) => React.ReactNode | null;\n\nexport type FlatSelectPropRenderValue<ITEM, MULTIPLE> = MULTIPLE extends true\n  ? (props: {\n      value: ITEM[];\n      getRemove: (\n        item: ITEM,\n      ) => (e: React.SyntheticEvent<Element, Event>) => void;\n    }) => React.ReactNode | null\n  : (props: { value: ITEM }) => React.ReactNode | null;\n\nexport type FlatSelectPropOnCreate = (\n  label: string,\n  props: { e: React.SyntheticEvent },\n) => void;\n\nexport type FlatSelectAllItem = {\n  groupKey: string | number;\n  __optionSelectAll: true;\n};\n\nexport type Group<ITEM, GROUP> = {\n  items: ITEM[];\n  key: string | number;\n  group?: GROUP;\n};\n\nexport type CountedGroup<ITEM, GROUP> = Omit<Group<ITEM, GROUP>, 'items'> & {\n  items: Array<FlatSelectAllItem | ITEM>;\n};\n\nexport type FlatSelectPropForm = 'default' | 'brick' | 'round';\n\nexport type FlatSelectPropsInit<\n  ITEM = FlatSelectItemDefault,\n  GROUP = FlatSelectGroupDefault,\n  MULTIPLE extends boolean = false,\n> = PropsWithHTMLAttributesAndRef<\n  {\n    items: ITEM[];\n    onChange: FlatSelectPropOnChange<ITEM, MULTIPLE>;\n    disabled?: boolean;\n    form?: 'default' | 'brick' | 'round';\n    placeholder?: string;\n    size?: FieldPropSize;\n    isLoading?: boolean;\n    listRef?: React.Ref<HTMLDivElement>;\n    renderItem?: FlatSelectPropRenderItem<ITEM>;\n    onInputFocus?: React.FocusEventHandler<HTMLInputElement>;\n    onInputBlur?: React.FocusEventHandler<HTMLInputElement>;\n    onCreate?: FlatSelectPropOnCreate;\n    inputRef?: React.Ref<HTMLInputElement>;\n    input?: boolean;\n    inputValue?: string;\n    inputDefaultValue?: string;\n    onInput?: (value: string) => void;\n    labelForCreate?:\n      | ((label: string | undefined) => React.ReactNode)\n      | React.ReactNode;\n    labelForEmptyItems?: string;\n    multiple?: MULTIPLE;\n    value?: FlatSelectPropValue<ITEM, MULTIPLE>;\n    groups?: GROUP[];\n    getItemLabel?: FlatSelectPropGetItemLabel<ITEM>;\n    getItemKey?: FlatSelectPropGetItemKey<ITEM>;\n    getItemGroupKey?: FlatSelectPropGetItemGroupKey<ITEM>;\n    getItemDisabled?: FlatSelectPropGetItemDisabled<ITEM>;\n    getGroupLabel?: FlatSelectPropGetGroupLabel<GROUP>;\n    getGroupKey?: FlatSelectPropGetGroupKey<GROUP>;\n    virtualScroll?: boolean;\n    onScrollToBottom?: (length: number) => void;\n    onOpen?: (isOpen: boolean) => void;\n    isOpen?: boolean;\n    listClassName?: string;\n    ignoreOutsideClicksRefs?: ReadonlyArray<React.RefObject<HTMLElement>>;\n    clearButton?: boolean;\n    iconClear?: IconComponent;\n    iconLeft?: IconComponent;\n    selectAll?: MULTIPLE extends true ? boolean : never;\n    selectAllLabel?: string;\n    footer?: React.ReactNode;\n    view?: FieldPropView;\n    bordered?: boolean;\n    anchorRef?: React.RefObject<HTMLElement>;\n    direction?: Direction;\n    spareDirection?: Direction;\n    possibleDirections?: Direction[];\n    viewportRef?: React.RefObject<HTMLElement>;\n    container?: Element;\n  },\n  HTMLDivElement\n>;\n\n/**\n * Props for the FlatSelect component.\n *\n * This type defines the props for the FlatSelect component, which is a customizable select component.\n * It allows for single or multiple selection, and supports grouping of items.\n * The component can be customized by providing custom item and group types.\n *\n * @template ITEM The type of the items in the select. Defaults to FlatSelectItemDefault.\n * @template GROUP The type of the groups in the select. Defaults to FlatSelectGroupDefault.\n * @template MULTIPLE Whether the select allows multiple selection. Defaults to false.\n */\nexport type FlatSelectProps<\n  ITEM = FlatSelectItemDefault,\n  GROUP = FlatSelectGroupDefault,\n  MULTIPLE extends boolean = false,\n> = FlatSelectPropsInit<ITEM, GROUP, MULTIPLE> &\n  (ITEM extends { label: FlatSelectItemDefault['label'] }\n    ? {}\n    : { getItemLabel: FlatSelectPropGetItemLabel<ITEM> }) &\n  (ITEM extends { id: FlatSelectItemDefault['id'] }\n    ? {}\n    : { getItemKey: FlatSelectPropGetItemKey<ITEM> }) &\n  (GROUP extends { label: FlatSelectGroupDefault['label'] }\n    ? {}\n    : { getGroupLabel: FlatSelectPropGetGroupLabel<GROUP> }) &\n  (GROUP extends { id: FlatSelectGroupDefault['id'] }\n    ? {}\n    : { getGroupKey: FlatSelectPropGetGroupKey<GROUP> });\n\nexport type FlatSelectComponent = <\n  ITEM = FlatSelectItemDefault,\n  GROUP = FlatSelectGroupDefault,\n  MULTIPLE extends boolean = false,\n>(\n  props: FlatSelectProps<ITEM, GROUP, MULTIPLE>,\n) => React.ReactNode | null;\n"],"mappings":""}

package/__internal__/src/components/Grid/types.d.ts

@@ -1,11 +1,11 @@
 export declare const gridPropXAlign: readonly ["left", "center", "right"];
-export type GridPropXAlign = typeof gridPropXAlign[number];
+export type GridPropXAlign = (typeof gridPropXAlign)[number];
 export declare const gridPropYAlign: readonly ["top", "center", "bottom"];
-export type GridPropYAlign = typeof gridPropYAlign[number];
+export type GridPropYAlign = (typeof gridPropYAlign)[number];
 export declare const gridPropGap: readonly [0, "2xs", "xs", "s", "m", "l", "xl", "2xl", "3xl", "4xl", "5xl", "6xl"];
-export type GridPropGap = typeof gridPropGap[number];
+export type GridPropGap = (typeof gridPropGap)[number];
 export declare const breakpointSizes: readonly ["xs", "s", "m", "l", "xl", "2xl"];
-export type BreakpointSizes = typeof breakpointSizes[number];
+export type BreakpointSizes = (typeof breakpointSizes)[number];
 type GridBreakpoint = {
     cols?: number;
     gap?: GridPropGap;

package/__internal__/src/components/Grid/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["gridPropXAlign","gridPropYAlign","gridPropGap","breakpointSizes"],"sources":["../../../../../src/components/Grid/types.ts"],"sourcesContent":["export const gridPropXAlign = ['left', 'center', 'right'] as const;\nexport type GridPropXAlign = typeof gridPropXAlign[number];\n\nexport const gridPropYAlign = ['top', 'center', 'bottom'] as const;\nexport type GridPropYAlign = typeof gridPropYAlign[number];\n\nexport const gridPropGap = [\n  0,\n  '2xs',\n  'xs',\n  's',\n  'm',\n  'l',\n  'xl',\n  '2xl',\n  '3xl',\n  '4xl',\n  '5xl',\n  '6xl',\n] as const;\nexport type GridPropGap = typeof gridPropGap[number];\n\nexport const breakpointSizes = ['xs', 's', 'm', 'l', 'xl', '2xl'] as const;\nexport type BreakpointSizes = typeof breakpointSizes[number];\n\ntype GridBreakpoint = {\n  cols?: number;\n  gap?: GridPropGap;\n  colGap?: GridPropGap;\n  rowGap?: GridPropGap;\n  xAlign?: GridPropXAlign;\n  yAlign?: GridPropYAlign;\n};\n\nexport type GridPropBreakpoints = Record<number, GridBreakpoint>;\n\nexport type GridProps = GridBreakpoint & {\n  breakpoints?: GridPropBreakpoints;\n  breakpointsForRef?: React.RefObject<HTMLElement>;\n};\n\ntype GridItemBreakpoint = {\n  col?: number;\n  colStart?: number;\n  row?: number;\n  rowStart?: number;\n  order?: 0 | 1 | -1;\n};\n\nexport type GridItemPropBreakpoints = Record<number, GridItemBreakpoint>;\n\nexport type GridItemProps = GridItemBreakpoint & {\n  breakpoints?: GridItemPropBreakpoints;\n  breakpointsForRef?: React.RefObject<HTMLElement>;\n};\n"],"mappings":"AAAA,MAAO,IAAMA,eAAc,CAAG,CAAC,MAAD,CAAS,QAAT,CAAmB,OAAnB,CAAvB,CAGP,MAAO,IAAMC,eAAc,CAAG,CAAC,KAAD,CAAQ,QAAR,CAAkB,QAAlB,CAAvB,CAGP,MAAO,IAAMC,YAAW,CAAG,CACzB,CADyB,CAEzB,KAFyB,CAGzB,IAHyB,CAIzB,GAJyB,CAKzB,GALyB,CAMzB,GANyB,CAOzB,IAPyB,CAQzB,KARyB,CASzB,KATyB,CAUzB,KAVyB,CAWzB,KAXyB,CAYzB,KAZyB,CAApB,CAgBP,MAAO,IAAMC,gBAAe,CAAG,CAAC,IAAD,CAAO,GAAP,CAAY,GAAZ,CAAiB,GAAjB,CAAsB,IAAtB,CAA4B,KAA5B,CAAxB"}
+{"version":3,"file":"types.js","names":["gridPropXAlign","gridPropYAlign","gridPropGap","breakpointSizes"],"sources":["../../../../../src/components/Grid/types.ts"],"sourcesContent":["export const gridPropXAlign = ['left', 'center', 'right'] as const;\nexport type GridPropXAlign = (typeof gridPropXAlign)[number];\n\nexport const gridPropYAlign = ['top', 'center', 'bottom'] as const;\nexport type GridPropYAlign = (typeof gridPropYAlign)[number];\n\nexport const gridPropGap = [\n  0,\n  '2xs',\n  'xs',\n  's',\n  'm',\n  'l',\n  'xl',\n  '2xl',\n  '3xl',\n  '4xl',\n  '5xl',\n  '6xl',\n] as const;\nexport type GridPropGap = (typeof gridPropGap)[number];\n\nexport const breakpointSizes = ['xs', 's', 'm', 'l', 'xl', '2xl'] as const;\nexport type BreakpointSizes = (typeof breakpointSizes)[number];\n\ntype GridBreakpoint = {\n  cols?: number;\n  gap?: GridPropGap;\n  colGap?: GridPropGap;\n  rowGap?: GridPropGap;\n  xAlign?: GridPropXAlign;\n  yAlign?: GridPropYAlign;\n};\n\nexport type GridPropBreakpoints = Record<number, GridBreakpoint>;\n\nexport type GridProps = GridBreakpoint & {\n  breakpoints?: GridPropBreakpoints;\n  breakpointsForRef?: React.RefObject<HTMLElement>;\n};\n\ntype GridItemBreakpoint = {\n  col?: number;\n  colStart?: number;\n  row?: number;\n  rowStart?: number;\n  order?: 0 | 1 | -1;\n};\n\nexport type GridItemPropBreakpoints = Record<number, GridItemBreakpoint>;\n\nexport type GridItemProps = GridItemBreakpoint & {\n  breakpoints?: GridItemPropBreakpoints;\n  breakpointsForRef?: React.RefObject<HTMLElement>;\n};\n"],"mappings":"AAAA,MAAO,IAAMA,eAAc,CAAG,CAAC,MAAD,CAAS,QAAT,CAAmB,OAAnB,CAAvB,CAGP,MAAO,IAAMC,eAAc,CAAG,CAAC,KAAD,CAAQ,QAAR,CAAkB,QAAlB,CAAvB,CAGP,MAAO,IAAMC,YAAW,CAAG,CACzB,CADyB,CAEzB,KAFyB,CAGzB,IAHyB,CAIzB,GAJyB,CAKzB,GALyB,CAMzB,GANyB,CAOzB,IAPyB,CAQzB,KARyB,CASzB,KATyB,CAUzB,KAVyB,CAWzB,KAXyB,CAYzB,KAZyB,CAApB,CAgBP,MAAO,IAAMC,gBAAe,CAAG,CAAC,IAAD,CAAO,GAAP,CAAY,GAAZ,CAAiB,GAAjB,CAAsB,IAAtB,CAA4B,KAA5B,CAAxB"}

package/__internal__/src/components/GridDeprecated/Grid.css

@@ -1 +1 @@
-.deprecated--Grid{display:grid;grid-template-columns:repeat(var(--cols,1),minmax(0,1fr));width:100%}.deprecated--Grid_cols_1{--cols:1}.deprecated--Grid_cols_2{--cols:2}.deprecated--Grid_cols_3{--cols:3}.deprecated--Grid_cols_4{--cols:4}.deprecated--Grid_cols_5{--cols:5}.deprecated--Grid_cols_6{--cols:6}.deprecated--Grid_cols_7{--cols:7}.deprecated--Grid_cols_8{--cols:8}.deprecated--Grid_cols_9{--cols:9}.deprecated--Grid_cols_10{--cols:10}.deprecated--Grid_cols_11{--cols:11}.deprecated--Grid_cols_12{--cols:12}.deprecated--Grid_xAlign_left{justify-items:start}.deprecated--Grid_xAlign_center{justify-items:center}.deprecated--Grid_xAlign_right{justify-items:end}.deprecated--Grid_yAlign_top{align-items:start}.deprecated--Grid_yAlign_center{align-items:center}.deprecated--Grid_yAlign_bottom{align-items:end}.deprecated--Grid_gap_0{grid-gap:0}.deprecated--Grid_gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_gap_s{grid-gap:var(--space-s)}.deprecated--Grid_gap_m{grid-gap:var(--space-m)}.deprecated--Grid_gap_l{grid-gap:var(--space-l)}.deprecated--Grid_gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_colGap_0{grid-column-gap:0}.deprecated--Grid_colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_rowGap_0{grid-row-gap:0}.deprecated--Grid_rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_rowGap_6xl{grid-row-gap:var(--space-6xl)}@media screen and (min-width:360px){.deprecated--Grid_xs\:cols_1{--cols:1}.deprecated--Grid_xs\:cols_2{--cols:2}.deprecated--Grid_xs\:cols_3{--cols:3}.deprecated--Grid_xs\:cols_4{--cols:4}.deprecated--Grid_xs\:cols_5{--cols:5}.deprecated--Grid_xs\:cols_6{--cols:6}.deprecated--Grid_xs\:cols_7{--cols:7}.deprecated--Grid_xs\:cols_8{--cols:8}.deprecated--Grid_xs\:cols_9{--cols:9}.deprecated--Grid_xs\:cols_10{--cols:10}.deprecated--Grid_xs\:cols_11{--cols:11}.deprecated--Grid_xs\:cols_12{--cols:12}.deprecated--Grid_xs\:xAlign_left{justify-items:start}.deprecated--Grid_xs\:xAlign_center{justify-items:center}.deprecated--Grid_xs\:xAlign_right{justify-items:end}.deprecated--Grid_xs\:yAlign_top{align-items:start}.deprecated--Grid_xs\:yAlign_center{align-items:center}.deprecated--Grid_xs\:yAlign_bottom{align-items:end}.deprecated--Grid_xs\:gap_0{grid-gap:0}.deprecated--Grid_xs\:gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_xs\:gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_xs\:gap_s{grid-gap:var(--space-s)}.deprecated--Grid_xs\:gap_m{grid-gap:var(--space-m)}.deprecated--Grid_xs\:gap_l{grid-gap:var(--space-l)}.deprecated--Grid_xs\:gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_xs\:gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_xs\:gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_xs\:gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_xs\:gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_xs\:gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_xs\:colGap_0{grid-column-gap:0}.deprecated--Grid_xs\:colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_xs\:colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_xs\:colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_xs\:colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_xs\:colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_xs\:colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_xs\:colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_xs\:colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_xs\:colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_xs\:colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_xs\:colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_xs\:rowGap_0{grid-row-gap:0}.deprecated--Grid_xs\:rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_xs\:rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_xs\:rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_xs\:rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_xs\:rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_xs\:rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_xs\:rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_xs\:rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_xs\:rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_xs\:rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_xs\:rowGap_6xl{grid-row-gap:var(--space-6xl)}}@media screen and (min-width:640px){.deprecated--Grid_s\:cols_1{--cols:1}.deprecated--Grid_s\:cols_2{--cols:2}.deprecated--Grid_s\:cols_3{--cols:3}.deprecated--Grid_s\:cols_4{--cols:4}.deprecated--Grid_s\:cols_5{--cols:5}.deprecated--Grid_s\:cols_6{--cols:6}.deprecated--Grid_s\:cols_7{--cols:7}.deprecated--Grid_s\:cols_8{--cols:8}.deprecated--Grid_s\:cols_9{--cols:9}.deprecated--Grid_s\:cols_10{--cols:10}.deprecated--Grid_s\:cols_11{--cols:11}.deprecated--Grid_s\:cols_12{--cols:12}.deprecated--Grid_s\:xAlign_left{justify-items:start}.deprecated--Grid_s\:xAlign_center{justify-items:center}.deprecated--Grid_s\:xAlign_right{justify-items:end}.deprecated--Grid_s\:yAlign_top{align-items:start}.deprecated--Grid_s\:yAlign_center{align-items:center}.deprecated--Grid_s\:yAlign_bottom{align-items:end}.deprecated--Grid_s\:gap_0{grid-gap:0}.deprecated--Grid_s\:gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_s\:gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_s\:gap_s{grid-gap:var(--space-s)}.deprecated--Grid_s\:gap_m{grid-gap:var(--space-m)}.deprecated--Grid_s\:gap_l{grid-gap:var(--space-l)}.deprecated--Grid_s\:gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_s\:gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_s\:gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_s\:gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_s\:gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_s\:gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_s\:colGap_0{grid-column-gap:0}.deprecated--Grid_s\:colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_s\:colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_s\:colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_s\:colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_s\:colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_s\:colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_s\:colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_s\:colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_s\:colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_s\:colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_s\:colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_s\:rowGap_0{grid-row-gap:0}.deprecated--Grid_s\:rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_s\:rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_s\:rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_s\:rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_s\:rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_s\:rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_s\:rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_s\:rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_s\:rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_s\:rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_s\:rowGap_6xl{grid-row-gap:var(--space-6xl)}}@media screen and (min-width:1024px){.deprecated--Grid_m\:cols_1{--cols:1}.deprecated--Grid_m\:cols_2{--cols:2}.deprecated--Grid_m\:cols_3{--cols:3}.deprecated--Grid_m\:cols_4{--cols:4}.deprecated--Grid_m\:cols_5{--cols:5}.deprecated--Grid_m\:cols_6{--cols:6}.deprecated--Grid_m\:cols_7{--cols:7}.deprecated--Grid_m\:cols_8{--cols:8}.deprecated--Grid_m\:cols_9{--cols:9}.deprecated--Grid_m\:cols_10{--cols:10}.deprecated--Grid_m\:cols_11{--cols:11}.deprecated--Grid_m\:cols_12{--cols:12}.deprecated--Grid_m\:xAlign_left{justify-items:start}.deprecated--Grid_m\:xAlign_center{justify-items:center}.deprecated--Grid_m\:xAlign_right{justify-items:end}.deprecated--Grid_m\:yAlign_top{align-items:start}.deprecated--Grid_m\:yAlign_center{align-items:center}.deprecated--Grid_m\:yAlign_bottom{align-items:end}.deprecated--Grid_m\:gap_0{grid-gap:0}.deprecated--Grid_m\:gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_m\:gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_m\:gap_s{grid-gap:var(--space-s)}.deprecated--Grid_m\:gap_m{grid-gap:var(--space-m)}.deprecated--Grid_m\:gap_l{grid-gap:var(--space-l)}.deprecated--Grid_m\:gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_m\:gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_m\:gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_m\:gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_m\:gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_m\:gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_m\:colGap_0{grid-column-gap:0}.deprecated--Grid_m\:colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_m\:colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_m\:colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_m\:colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_m\:colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_m\:colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_m\:colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_m\:colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_m\:colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_m\:colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_m\:colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_m\:rowGap_0{grid-row-gap:0}.deprecated--Grid_m\:rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_m\:rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_m\:rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_m\:rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_m\:rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_m\:rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_m\:rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_m\:rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_m\:rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_m\:rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_m\:rowGap_6xl{grid-row-gap:var(--space-6xl)}}@media screen and (min-width:1280px){.deprecated--Grid_l\:cols_1{--cols:1}.deprecated--Grid_l\:cols_2{--cols:2}.deprecated--Grid_l\:cols_3{--cols:3}.deprecated--Grid_l\:cols_4{--cols:4}.deprecated--Grid_l\:cols_5{--cols:5}.deprecated--Grid_l\:cols_6{--cols:6}.deprecated--Grid_l\:cols_7{--cols:7}.deprecated--Grid_l\:cols_8{--cols:8}.deprecated--Grid_l\:cols_9{--cols:9}.deprecated--Grid_l\:cols_10{--cols:10}.deprecated--Grid_l\:cols_11{--cols:11}.deprecated--Grid_l\:cols_12{--cols:12}.deprecated--Grid_l\:xAlign_left{justify-items:start}.deprecated--Grid_l\:xAlign_center{justify-items:center}.deprecated--Grid_l\:xAlign_right{justify-items:end}.deprecated--Grid_l\:yAlign_top{align-items:start}.deprecated--Grid_l\:yAlign_center{align-items:center}.deprecated--Grid_l\:yAlign_bottom{align-items:end}.deprecated--Grid_l\:gap_0{grid-gap:0}.deprecated--Grid_l\:gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_l\:gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_l\:gap_s{grid-gap:var(--space-s)}.deprecated--Grid_l\:gap_m{grid-gap:var(--space-m)}.deprecated--Grid_l\:gap_l{grid-gap:var(--space-l)}.deprecated--Grid_l\:gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_l\:gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_l\:gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_l\:gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_l\:gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_l\:gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_l\:colGap_0{grid-column-gap:0}.deprecated--Grid_l\:colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_l\:colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_l\:colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_l\:colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_l\:colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_l\:colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_l\:colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_l\:colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_l\:colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_l\:colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_l\:colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_l\:rowGap_0{grid-row-gap:0}.deprecated--Grid_l\:rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_l\:rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_l\:rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_l\:rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_l\:rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_l\:rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_l\:rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_l\:rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_l\:rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_l\:rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_l\:rowGap_6xl{grid-row-gap:var(--space-6xl)}}@media screen and (min-width:1440px){.deprecated--Grid_xl\:cols_1{--cols:1}.deprecated--Grid_xl\:cols_2{--cols:2}.deprecated--Grid_xl\:cols_3{--cols:3}.deprecated--Grid_xl\:cols_4{--cols:4}.deprecated--Grid_xl\:cols_5{--cols:5}.deprecated--Grid_xl\:cols_6{--cols:6}.deprecated--Grid_xl\:cols_7{--cols:7}.deprecated--Grid_xl\:cols_8{--cols:8}.deprecated--Grid_xl\:cols_9{--cols:9}.deprecated--Grid_xl\:cols_10{--cols:10}.deprecated--Grid_xl\:cols_11{--cols:11}.deprecated--Grid_xl\:cols_12{--cols:12}.deprecated--Grid_xl\:xAlign_left{justify-items:start}.deprecated--Grid_xl\:xAlign_center{justify-items:center}.deprecated--Grid_xl\:xAlign_right{justify-items:end}.deprecated--Grid_xl\:yAlign_top{align-items:start}.deprecated--Grid_xl\:yAlign_center{align-items:center}.deprecated--Grid_xl\:yAlign_bottom{align-items:end}.deprecated--Grid_xl\:gap_0{grid-gap:0}.deprecated--Grid_xl\:gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_xl\:gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_xl\:gap_s{grid-gap:var(--space-s)}.deprecated--Grid_xl\:gap_m{grid-gap:var(--space-m)}.deprecated--Grid_xl\:gap_l{grid-gap:var(--space-l)}.deprecated--Grid_xl\:gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_xl\:gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_xl\:gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_xl\:gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_xl\:gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_xl\:gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_xl\:colGap_0{grid-column-gap:0}.deprecated--Grid_xl\:colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_xl\:colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_xl\:colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_xl\:colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_xl\:colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_xl\:colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_xl\:colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_xl\:colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_xl\:colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_xl\:colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_xl\:colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_xl\:rowGap_0{grid-row-gap:0}.deprecated--Grid_xl\:rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_xl\:rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_xl\:rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_xl\:rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_xl\:rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_xl\:rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_xl\:rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_xl\:rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_xl\:rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_xl\:rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_xl\:rowGap_6xl{grid-row-gap:var(--space-6xl)}}@media screen and (min-width:1920px){.deprecated--Grid_2xl\:cols_1{--cols:1}.deprecated--Grid_2xl\:cols_2{--cols:2}.deprecated--Grid_2xl\:cols_3{--cols:3}.deprecated--Grid_2xl\:cols_4{--cols:4}.deprecated--Grid_2xl\:cols_5{--cols:5}.deprecated--Grid_2xl\:cols_6{--cols:6}.deprecated--Grid_2xl\:cols_7{--cols:7}.deprecated--Grid_2xl\:cols_8{--cols:8}.deprecated--Grid_2xl\:cols_9{--cols:9}.deprecated--Grid_2xl\:cols_10{--cols:10}.deprecated--Grid_2xl\:cols_11{--cols:11}.deprecated--Grid_2xl\:cols_12{--cols:12}.deprecated--Grid_2xl\:xAlign_left{justify-items:start}.deprecated--Grid_2xl\:xAlign_center{justify-items:center}.deprecated--Grid_2xl\:xAlign_right{justify-items:end}.deprecated--Grid_2xl\:yAlign_top{align-items:start}.deprecated--Grid_2xl\:yAlign_center{align-items:center}.deprecated--Grid_2xl\:yAlign_bottom{align-items:end}.deprecated--Grid_2xl\:gap_0{grid-gap:0}.deprecated--Grid_2xl\:gap_2xs{grid-gap:var(--space-2xs)}.deprecated--Grid_2xl\:gap_xs{grid-gap:var(--space-xs)}.deprecated--Grid_2xl\:gap_s{grid-gap:var(--space-s)}.deprecated--Grid_2xl\:gap_m{grid-gap:var(--space-m)}.deprecated--Grid_2xl\:gap_l{grid-gap:var(--space-l)}.deprecated--Grid_2xl\:gap_xl{grid-gap:var(--space-xl)}.deprecated--Grid_2xl\:gap_2xl{grid-gap:var(--space-2xl)}.deprecated--Grid_2xl\:gap_3xl{grid-gap:var(--space-3xl)}.deprecated--Grid_2xl\:gap_4xl{grid-gap:var(--space-4xl)}.deprecated--Grid_2xl\:gap_5xl{grid-gap:var(--space-5xl)}.deprecated--Grid_2xl\:gap_6xl{grid-gap:var(--space-6xl)}.deprecated--Grid_2xl\:colGap_0{grid-column-gap:0}.deprecated--Grid_2xl\:colGap_2xs{grid-column-gap:var(--space-2xs)}.deprecated--Grid_2xl\:colGap_xs{grid-column-gap:var(--space-xs)}.deprecated--Grid_2xl\:colGap_s{grid-column-gap:var(--space-s)}.deprecated--Grid_2xl\:colGap_m{grid-column-gap:var(--space-m)}.deprecated--Grid_2xl\:colGap_l{grid-column-gap:var(--space-l)}.deprecated--Grid_2xl\:colGap_xl{grid-column-gap:var(--space-xl)}.deprecated--Grid_2xl\:colGap_2xl{grid-column-gap:var(--space-2xl)}.deprecated--Grid_2xl\:colGap_3xl{grid-column-gap:var(--space-3xl)}.deprecated--Grid_2xl\:colGap_4xl{grid-column-gap:var(--space-4xl)}.deprecated--Grid_2xl\:colGap_5xl{grid-column-gap:var(--space-5xl)}.deprecated--Grid_2xl\:colGap_6xl{grid-column-gap:var(--space-6xl)}.deprecated--Grid_2xl\:rowGap_0{grid-row-gap:0}.deprecated--Grid_2xl\:rowGap_2xs{grid-row-gap:var(--space-2xs)}.deprecated--Grid_2xl\:rowGap_xs{grid-row-gap:var(--space-xs)}.deprecated--Grid_2xl\:rowGap_s{grid-row-gap:var(--space-s)}.deprecated--Grid_2xl\:rowGap_m{grid-row-gap:var(--space-m)}.deprecated--Grid_2xl\:rowGap_l{grid-row-gap:var(--space-l)}.deprecated--Grid_2xl\:rowGap_xl{grid-row-gap:var(--space-xl)}.deprecated--Grid_2xl\:rowGap_2xl{grid-row-gap:var(--space-2xl)}.deprecated--Grid_2xl\:rowGap_3xl{grid-row-gap:var(--space-3xl)}.deprecated--Grid_2xl\:rowGap_4xl{grid-row-gap:var(--space-4xl)}.deprecated--Grid_2xl\:rowGap_5xl{grid-row-gap:var(--space-5xl)}.deprecated--Grid_2xl\:rowGap_6xl{grid-row-gap:var(--space-6xl)}}
+.deprecated--Grid{display:grid;grid-template-columns:repeat(var(--cols,1),minmax(0,1fr));width:100%}.deprecated--Grid_cols_1{--cols:1}.deprecated--Grid_cols_2{--cols:2}.deprecated--Grid_cols_3{--cols:3}.deprecated--Grid_cols_4{--cols:4}.deprecated--Grid_cols_5{--cols:5}.deprecated--Grid_cols_6{--cols:6}.deprecated--Grid_cols_7{--cols:7}.deprecated--Grid_cols_8{--cols:8}.deprecated--Grid_cols_9{--cols:9}.deprecated--Grid_cols_10{--cols:10}.deprecated--Grid_cols_11{--cols:11}.deprecated--Grid_cols_12{--cols:12}.deprecated--Grid_xAlign_left{justify-items:start}.deprecated--Grid_xAlign_center{justify-items:center}.deprecated--Grid_xAlign_right{justify-items:end}.deprecated--Grid_yAlign_top{align-items:start}.deprecated--Grid_yAlign_center{align-items:center}.deprecated--Grid_yAlign_bottom{align-items:end}.deprecated--Grid_gap_0{gap:0}.deprecated--Grid_gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_gap_xs{gap:var(--space-xs)}.deprecated--Grid_gap_s{gap:var(--space-s)}.deprecated--Grid_gap_m{gap:var(--space-m)}.deprecated--Grid_gap_l{gap:var(--space-l)}.deprecated--Grid_gap_xl{gap:var(--space-xl)}.deprecated--Grid_gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_rowGap_0{row-gap:0}.deprecated--Grid_rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_rowGap_6xl{row-gap:var(--space-6xl)}@media screen and (min-width:360px){.deprecated--Grid_xs\:cols_1{--cols:1}.deprecated--Grid_xs\:cols_2{--cols:2}.deprecated--Grid_xs\:cols_3{--cols:3}.deprecated--Grid_xs\:cols_4{--cols:4}.deprecated--Grid_xs\:cols_5{--cols:5}.deprecated--Grid_xs\:cols_6{--cols:6}.deprecated--Grid_xs\:cols_7{--cols:7}.deprecated--Grid_xs\:cols_8{--cols:8}.deprecated--Grid_xs\:cols_9{--cols:9}.deprecated--Grid_xs\:cols_10{--cols:10}.deprecated--Grid_xs\:cols_11{--cols:11}.deprecated--Grid_xs\:cols_12{--cols:12}.deprecated--Grid_xs\:xAlign_left{justify-items:start}.deprecated--Grid_xs\:xAlign_center{justify-items:center}.deprecated--Grid_xs\:xAlign_right{justify-items:end}.deprecated--Grid_xs\:yAlign_top{align-items:start}.deprecated--Grid_xs\:yAlign_center{align-items:center}.deprecated--Grid_xs\:yAlign_bottom{align-items:end}.deprecated--Grid_xs\:gap_0{gap:0}.deprecated--Grid_xs\:gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_xs\:gap_xs{gap:var(--space-xs)}.deprecated--Grid_xs\:gap_s{gap:var(--space-s)}.deprecated--Grid_xs\:gap_m{gap:var(--space-m)}.deprecated--Grid_xs\:gap_l{gap:var(--space-l)}.deprecated--Grid_xs\:gap_xl{gap:var(--space-xl)}.deprecated--Grid_xs\:gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_xs\:gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_xs\:gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_xs\:gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_xs\:gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_xs\:colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_xs\:colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_xs\:colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_xs\:colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_xs\:colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_xs\:colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_xs\:colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_xs\:colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_xs\:colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_xs\:colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_xs\:colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_xs\:colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_xs\:rowGap_0{row-gap:0}.deprecated--Grid_xs\:rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_xs\:rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_xs\:rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_xs\:rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_xs\:rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_xs\:rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_xs\:rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_xs\:rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_xs\:rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_xs\:rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_xs\:rowGap_6xl{row-gap:var(--space-6xl)}}@media screen and (min-width:640px){.deprecated--Grid_s\:cols_1{--cols:1}.deprecated--Grid_s\:cols_2{--cols:2}.deprecated--Grid_s\:cols_3{--cols:3}.deprecated--Grid_s\:cols_4{--cols:4}.deprecated--Grid_s\:cols_5{--cols:5}.deprecated--Grid_s\:cols_6{--cols:6}.deprecated--Grid_s\:cols_7{--cols:7}.deprecated--Grid_s\:cols_8{--cols:8}.deprecated--Grid_s\:cols_9{--cols:9}.deprecated--Grid_s\:cols_10{--cols:10}.deprecated--Grid_s\:cols_11{--cols:11}.deprecated--Grid_s\:cols_12{--cols:12}.deprecated--Grid_s\:xAlign_left{justify-items:start}.deprecated--Grid_s\:xAlign_center{justify-items:center}.deprecated--Grid_s\:xAlign_right{justify-items:end}.deprecated--Grid_s\:yAlign_top{align-items:start}.deprecated--Grid_s\:yAlign_center{align-items:center}.deprecated--Grid_s\:yAlign_bottom{align-items:end}.deprecated--Grid_s\:gap_0{gap:0}.deprecated--Grid_s\:gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_s\:gap_xs{gap:var(--space-xs)}.deprecated--Grid_s\:gap_s{gap:var(--space-s)}.deprecated--Grid_s\:gap_m{gap:var(--space-m)}.deprecated--Grid_s\:gap_l{gap:var(--space-l)}.deprecated--Grid_s\:gap_xl{gap:var(--space-xl)}.deprecated--Grid_s\:gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_s\:gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_s\:gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_s\:gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_s\:gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_s\:colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_s\:colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_s\:colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_s\:colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_s\:colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_s\:colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_s\:colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_s\:colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_s\:colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_s\:colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_s\:colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_s\:colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_s\:rowGap_0{row-gap:0}.deprecated--Grid_s\:rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_s\:rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_s\:rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_s\:rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_s\:rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_s\:rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_s\:rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_s\:rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_s\:rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_s\:rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_s\:rowGap_6xl{row-gap:var(--space-6xl)}}@media screen and (min-width:1024px){.deprecated--Grid_m\:cols_1{--cols:1}.deprecated--Grid_m\:cols_2{--cols:2}.deprecated--Grid_m\:cols_3{--cols:3}.deprecated--Grid_m\:cols_4{--cols:4}.deprecated--Grid_m\:cols_5{--cols:5}.deprecated--Grid_m\:cols_6{--cols:6}.deprecated--Grid_m\:cols_7{--cols:7}.deprecated--Grid_m\:cols_8{--cols:8}.deprecated--Grid_m\:cols_9{--cols:9}.deprecated--Grid_m\:cols_10{--cols:10}.deprecated--Grid_m\:cols_11{--cols:11}.deprecated--Grid_m\:cols_12{--cols:12}.deprecated--Grid_m\:xAlign_left{justify-items:start}.deprecated--Grid_m\:xAlign_center{justify-items:center}.deprecated--Grid_m\:xAlign_right{justify-items:end}.deprecated--Grid_m\:yAlign_top{align-items:start}.deprecated--Grid_m\:yAlign_center{align-items:center}.deprecated--Grid_m\:yAlign_bottom{align-items:end}.deprecated--Grid_m\:gap_0{gap:0}.deprecated--Grid_m\:gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_m\:gap_xs{gap:var(--space-xs)}.deprecated--Grid_m\:gap_s{gap:var(--space-s)}.deprecated--Grid_m\:gap_m{gap:var(--space-m)}.deprecated--Grid_m\:gap_l{gap:var(--space-l)}.deprecated--Grid_m\:gap_xl{gap:var(--space-xl)}.deprecated--Grid_m\:gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_m\:gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_m\:gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_m\:gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_m\:gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_m\:colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_m\:colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_m\:colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_m\:colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_m\:colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_m\:colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_m\:colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_m\:colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_m\:colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_m\:colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_m\:colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_m\:colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_m\:rowGap_0{row-gap:0}.deprecated--Grid_m\:rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_m\:rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_m\:rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_m\:rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_m\:rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_m\:rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_m\:rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_m\:rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_m\:rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_m\:rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_m\:rowGap_6xl{row-gap:var(--space-6xl)}}@media screen and (min-width:1280px){.deprecated--Grid_l\:cols_1{--cols:1}.deprecated--Grid_l\:cols_2{--cols:2}.deprecated--Grid_l\:cols_3{--cols:3}.deprecated--Grid_l\:cols_4{--cols:4}.deprecated--Grid_l\:cols_5{--cols:5}.deprecated--Grid_l\:cols_6{--cols:6}.deprecated--Grid_l\:cols_7{--cols:7}.deprecated--Grid_l\:cols_8{--cols:8}.deprecated--Grid_l\:cols_9{--cols:9}.deprecated--Grid_l\:cols_10{--cols:10}.deprecated--Grid_l\:cols_11{--cols:11}.deprecated--Grid_l\:cols_12{--cols:12}.deprecated--Grid_l\:xAlign_left{justify-items:start}.deprecated--Grid_l\:xAlign_center{justify-items:center}.deprecated--Grid_l\:xAlign_right{justify-items:end}.deprecated--Grid_l\:yAlign_top{align-items:start}.deprecated--Grid_l\:yAlign_center{align-items:center}.deprecated--Grid_l\:yAlign_bottom{align-items:end}.deprecated--Grid_l\:gap_0{gap:0}.deprecated--Grid_l\:gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_l\:gap_xs{gap:var(--space-xs)}.deprecated--Grid_l\:gap_s{gap:var(--space-s)}.deprecated--Grid_l\:gap_m{gap:var(--space-m)}.deprecated--Grid_l\:gap_l{gap:var(--space-l)}.deprecated--Grid_l\:gap_xl{gap:var(--space-xl)}.deprecated--Grid_l\:gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_l\:gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_l\:gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_l\:gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_l\:gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_l\:colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_l\:colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_l\:colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_l\:colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_l\:colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_l\:colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_l\:colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_l\:colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_l\:colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_l\:colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_l\:colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_l\:colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_l\:rowGap_0{row-gap:0}.deprecated--Grid_l\:rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_l\:rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_l\:rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_l\:rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_l\:rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_l\:rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_l\:rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_l\:rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_l\:rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_l\:rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_l\:rowGap_6xl{row-gap:var(--space-6xl)}}@media screen and (min-width:1440px){.deprecated--Grid_xl\:cols_1{--cols:1}.deprecated--Grid_xl\:cols_2{--cols:2}.deprecated--Grid_xl\:cols_3{--cols:3}.deprecated--Grid_xl\:cols_4{--cols:4}.deprecated--Grid_xl\:cols_5{--cols:5}.deprecated--Grid_xl\:cols_6{--cols:6}.deprecated--Grid_xl\:cols_7{--cols:7}.deprecated--Grid_xl\:cols_8{--cols:8}.deprecated--Grid_xl\:cols_9{--cols:9}.deprecated--Grid_xl\:cols_10{--cols:10}.deprecated--Grid_xl\:cols_11{--cols:11}.deprecated--Grid_xl\:cols_12{--cols:12}.deprecated--Grid_xl\:xAlign_left{justify-items:start}.deprecated--Grid_xl\:xAlign_center{justify-items:center}.deprecated--Grid_xl\:xAlign_right{justify-items:end}.deprecated--Grid_xl\:yAlign_top{align-items:start}.deprecated--Grid_xl\:yAlign_center{align-items:center}.deprecated--Grid_xl\:yAlign_bottom{align-items:end}.deprecated--Grid_xl\:gap_0{gap:0}.deprecated--Grid_xl\:gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_xl\:gap_xs{gap:var(--space-xs)}.deprecated--Grid_xl\:gap_s{gap:var(--space-s)}.deprecated--Grid_xl\:gap_m{gap:var(--space-m)}.deprecated--Grid_xl\:gap_l{gap:var(--space-l)}.deprecated--Grid_xl\:gap_xl{gap:var(--space-xl)}.deprecated--Grid_xl\:gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_xl\:gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_xl\:gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_xl\:gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_xl\:gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_xl\:colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_xl\:colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_xl\:colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_xl\:colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_xl\:colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_xl\:colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_xl\:colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_xl\:colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_xl\:colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_xl\:colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_xl\:colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_xl\:colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_xl\:rowGap_0{row-gap:0}.deprecated--Grid_xl\:rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_xl\:rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_xl\:rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_xl\:rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_xl\:rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_xl\:rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_xl\:rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_xl\:rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_xl\:rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_xl\:rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_xl\:rowGap_6xl{row-gap:var(--space-6xl)}}@media screen and (min-width:1920px){.deprecated--Grid_2xl\:cols_1{--cols:1}.deprecated--Grid_2xl\:cols_2{--cols:2}.deprecated--Grid_2xl\:cols_3{--cols:3}.deprecated--Grid_2xl\:cols_4{--cols:4}.deprecated--Grid_2xl\:cols_5{--cols:5}.deprecated--Grid_2xl\:cols_6{--cols:6}.deprecated--Grid_2xl\:cols_7{--cols:7}.deprecated--Grid_2xl\:cols_8{--cols:8}.deprecated--Grid_2xl\:cols_9{--cols:9}.deprecated--Grid_2xl\:cols_10{--cols:10}.deprecated--Grid_2xl\:cols_11{--cols:11}.deprecated--Grid_2xl\:cols_12{--cols:12}.deprecated--Grid_2xl\:xAlign_left{justify-items:start}.deprecated--Grid_2xl\:xAlign_center{justify-items:center}.deprecated--Grid_2xl\:xAlign_right{justify-items:end}.deprecated--Grid_2xl\:yAlign_top{align-items:start}.deprecated--Grid_2xl\:yAlign_center{align-items:center}.deprecated--Grid_2xl\:yAlign_bottom{align-items:end}.deprecated--Grid_2xl\:gap_0{gap:0}.deprecated--Grid_2xl\:gap_2xs{gap:var(--space-2xs)}.deprecated--Grid_2xl\:gap_xs{gap:var(--space-xs)}.deprecated--Grid_2xl\:gap_s{gap:var(--space-s)}.deprecated--Grid_2xl\:gap_m{gap:var(--space-m)}.deprecated--Grid_2xl\:gap_l{gap:var(--space-l)}.deprecated--Grid_2xl\:gap_xl{gap:var(--space-xl)}.deprecated--Grid_2xl\:gap_2xl{gap:var(--space-2xl)}.deprecated--Grid_2xl\:gap_3xl{gap:var(--space-3xl)}.deprecated--Grid_2xl\:gap_4xl{gap:var(--space-4xl)}.deprecated--Grid_2xl\:gap_5xl{gap:var(--space-5xl)}.deprecated--Grid_2xl\:gap_6xl{gap:var(--space-6xl)}.deprecated--Grid_2xl\:colGap_0{-moz-column-gap:0;column-gap:0}.deprecated--Grid_2xl\:colGap_2xs{-moz-column-gap:var(--space-2xs);column-gap:var(--space-2xs)}.deprecated--Grid_2xl\:colGap_xs{-moz-column-gap:var(--space-xs);column-gap:var(--space-xs)}.deprecated--Grid_2xl\:colGap_s{-moz-column-gap:var(--space-s);column-gap:var(--space-s)}.deprecated--Grid_2xl\:colGap_m{-moz-column-gap:var(--space-m);column-gap:var(--space-m)}.deprecated--Grid_2xl\:colGap_l{-moz-column-gap:var(--space-l);column-gap:var(--space-l)}.deprecated--Grid_2xl\:colGap_xl{-moz-column-gap:var(--space-xl);column-gap:var(--space-xl)}.deprecated--Grid_2xl\:colGap_2xl{-moz-column-gap:var(--space-2xl);column-gap:var(--space-2xl)}.deprecated--Grid_2xl\:colGap_3xl{-moz-column-gap:var(--space-3xl);column-gap:var(--space-3xl)}.deprecated--Grid_2xl\:colGap_4xl{-moz-column-gap:var(--space-4xl);column-gap:var(--space-4xl)}.deprecated--Grid_2xl\:colGap_5xl{-moz-column-gap:var(--space-5xl);column-gap:var(--space-5xl)}.deprecated--Grid_2xl\:colGap_6xl{-moz-column-gap:var(--space-6xl);column-gap:var(--space-6xl)}.deprecated--Grid_2xl\:rowGap_0{row-gap:0}.deprecated--Grid_2xl\:rowGap_2xs{row-gap:var(--space-2xs)}.deprecated--Grid_2xl\:rowGap_xs{row-gap:var(--space-xs)}.deprecated--Grid_2xl\:rowGap_s{row-gap:var(--space-s)}.deprecated--Grid_2xl\:rowGap_m{row-gap:var(--space-m)}.deprecated--Grid_2xl\:rowGap_l{row-gap:var(--space-l)}.deprecated--Grid_2xl\:rowGap_xl{row-gap:var(--space-xl)}.deprecated--Grid_2xl\:rowGap_2xl{row-gap:var(--space-2xl)}.deprecated--Grid_2xl\:rowGap_3xl{row-gap:var(--space-3xl)}.deprecated--Grid_2xl\:rowGap_4xl{row-gap:var(--space-4xl)}.deprecated--Grid_2xl\:rowGap_5xl{row-gap:var(--space-5xl)}.deprecated--Grid_2xl\:rowGap_6xl{row-gap:var(--space-6xl)}}

package/__internal__/src/components/GridDeprecated/GridDeprecated.d.ts

@@ -1,15 +1,15 @@
 import './Grid.css';
 export * from './GridItem/GridItem';
 export declare const gridPropXAlign: readonly ["left", "center", "right"];
-export type GridPropXAlign = typeof gridPropXAlign[number];
+export type GridPropXAlign = (typeof gridPropXAlign)[number];
 export declare const gridPropYAlign: readonly ["top", "center", "bottom"];
-export type GridPropYAlign = typeof gridPropYAlign[number];
+export type GridPropYAlign = (typeof gridPropYAlign)[number];
 export declare const gridPropGap: readonly [0, "2xs", "xs", "s", "m", "l", "xl", "2xl", "3xl", "4xl", "5xl", "6xl"];
-export type GridPropGap = typeof gridPropGap[number] | '0';
+export type GridPropGap = (typeof gridPropGap)[number] | '0';
 export type GridPropColGap = GridPropGap;
 export type GridPropRowGap = GridPropGap;
 export declare const breakpointSizes: readonly ["xs", "s", "m", "l", "xl", "2xl"];
-export type BreakpointSizes = typeof breakpointSizes[number];
+export type BreakpointSizes = (typeof breakpointSizes)[number];
 type Breakpoint = {
     cols?: number | string;
     gap?: GridPropGap;

package/__internal__/src/components/GridDeprecated/GridDeprecated.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridDeprecated.js","names":["classnames","React","cnDeprecated","forwardRefWithAs","useBreakpoints","gridPropXAlign","gridPropYAlign","gridPropGap","breakpointSizes","cnGrid","Grid","props","ref","as","cols","xAlign","yAlign","gap","colGap","rowGap","className","children","breakpoints","otherProps","breakpointsCn"],"sources":["../../../../../src/components/GridDeprecated/GridDeprecated.tsx"],"sourcesContent":["import './Grid.css';\n\nimport { classnames } from '@bem-react/classnames';\nimport React from 'react';\n\nimport { cnDeprecated } from '##/utils/bem';\nimport { forwardRefWithAs } from '##/utils/types/PropsWithAsAttributes';\n\nimport { useBreakpoints } from './useBreakpoints';\n\nexport * from './GridItem/GridItem';\n\nexport const gridPropXAlign = ['left', 'center', 'right'] as const;\nexport type GridPropXAlign = typeof gridPropXAlign[number];\n\nexport const gridPropYAlign = ['top', 'center', 'bottom'] as const;\nexport type GridPropYAlign = typeof gridPropYAlign[number];\n\nexport const gridPropGap = [\n  0,\n  '2xs',\n  'xs',\n  's',\n  'm',\n  'l',\n  'xl',\n  '2xl',\n  '3xl',\n  '4xl',\n  '5xl',\n  '6xl',\n] as const;\nexport type GridPropGap = typeof gridPropGap[number] | '0';\n\nexport type GridPropColGap = GridPropGap;\nexport type GridPropRowGap = GridPropGap;\n\nexport const breakpointSizes = ['xs', 's', 'm', 'l', 'xl', '2xl'] as const;\nexport type BreakpointSizes = typeof breakpointSizes[number];\n\ntype Breakpoint = {\n  cols?: number | string;\n  gap?: GridPropGap;\n  colGap?: GridPropColGap;\n  rowGap?: GridPropRowGap;\n  xAlign?: GridPropXAlign;\n  yAlign?: GridPropYAlign;\n};\n\ntype BreakpointsProps = {\n  'xs'?: Breakpoint;\n  's'?: Breakpoint;\n  'm'?: Breakpoint;\n  'l'?: Breakpoint;\n  'xl'?: Breakpoint;\n  '2xl'?: Breakpoint;\n};\n\nexport type GridProps = Breakpoint & {\n  breakpoints?: BreakpointsProps;\n};\n\nexport const cnGrid = cnDeprecated('Grid');\n\nexport const Grid = forwardRefWithAs<GridProps>((props, ref) => {\n  const {\n    as = 'div',\n    cols,\n    xAlign,\n    yAlign,\n    gap,\n    colGap,\n    rowGap,\n    className,\n    children,\n    breakpoints,\n    ...otherProps\n  } = props;\n\n  const Tag = as as string;\n\n  const breakpointsCn = useBreakpoints(cnGrid, breakpoints);\n\n  return (\n    <Tag\n      {...otherProps}\n      className={classnames(\n        cnGrid({\n          cols,\n          gap,\n          colGap,\n          rowGap,\n          xAlign,\n          yAlign,\n        }),\n        breakpointsCn,\n        className,\n      )}\n      ref={ref}\n    >\n      {children}\n    </Tag>\n  );\n});\n"],"mappings":"gMAAA,mBAEA,OAASA,UAAT,KAA2B,uBAA3B,CACA,MAAOC,MAAP,KAAkB,OAAlB,CAEA,OAASC,YAAT,uBACA,OAASC,gBAAT,+CAEA,OAASC,cAAT,wBAEA,iCAEA,MAAO,IAAMC,eAAc,CAAG,CAAC,MAAD,CAAS,QAAT,CAAmB,OAAnB,CAAvB,CAGP,MAAO,IAAMC,eAAc,CAAG,CAAC,KAAD,CAAQ,QAAR,CAAkB,QAAlB,CAAvB,CAGP,MAAO,IAAMC,YAAW,CAAG,CACzB,CADyB,CAEzB,KAFyB,CAGzB,IAHyB,CAIzB,GAJyB,CAKzB,GALyB,CAMzB,GANyB,CAOzB,IAPyB,CAQzB,KARyB,CASzB,KATyB,CAUzB,KAVyB,CAWzB,KAXyB,CAYzB,KAZyB,CAApB,CAmBP,MAAO,IAAMC,gBAAe,CAAG,CAAC,IAAD,CAAO,GAAP,CAAY,GAAZ,CAAiB,GAAjB,CAAsB,IAAtB,CAA4B,KAA5B,CAAxB,CAyBP,MAAO,IAAMC,OAAM,CAAGP,YAAY,CAAC,MAAD,CAA3B,CAEP,MAAO,IAAMQ,KAAI,CAAGP,gBAAgB,CAAY,SAACQ,CAAD,CAAQC,CAAR,CAAgB,OAa1DD,CAb0D,CAE5DE,EAF4D,CAE5DA,CAF4D,YAEvD,KAFuD,GAG5DC,CAH4D,CAa1DH,CAb0D,CAG5DG,IAH4D,CAI5DC,CAJ4D,CAa1DJ,CAb0D,CAI5DI,MAJ4D,CAK5DC,CAL4D,CAa1DL,CAb0D,CAK5DK,MAL4D,CAM5DC,CAN4D,CAa1DN,CAb0D,CAM5DM,GAN4D,CAO5DC,CAP4D,CAa1DP,CAb0D,CAO5DO,MAP4D,CAQ5DC,CAR4D,CAa1DR,CAb0D,CAQ5DQ,MAR4D,CAS5DC,CAT4D,CAa1DT,CAb0D,CAS5DS,SAT4D,CAU5DC,CAV4D,CAa1DV,CAb0D,CAU5DU,QAV4D,CAW5DC,CAX4D,CAa1DX,CAb0D,CAW5DW,WAX4D,CAYzDC,CAZyD,0BAa1DZ,CAb0D,YAiBxDa,CAAa,CAAGpB,cAAc,CAACK,MAAD,CAASa,CAAT,CAjB0B,CAmB9D,MACE,qBALUT,CAKV,kBACMU,CADN,EAEE,SAAS,CAAEvB,UAAU,CACnBS,MAAM,CAAC,CACLK,IAAI,CAAJA,CADK,CAELG,GAAG,CAAHA,CAFK,CAGLC,MAAM,CAANA,CAHK,CAILC,MAAM,CAANA,CAJK,CAKLJ,MAAM,CAANA,CALK,CAMLC,MAAM,CAANA,CANK,CAAD,CADa,CASnBQ,CATmB,CAUnBJ,CAVmB,CAFvB,CAcE,GAAG,CAAER,CAdP,GAgBGS,CAhBH,CAmBH,CAvCmC,CAA7B"}
+{"version":3,"file":"GridDeprecated.js","names":["classnames","React","cnDeprecated","forwardRefWithAs","useBreakpoints","gridPropXAlign","gridPropYAlign","gridPropGap","breakpointSizes","cnGrid","Grid","props","ref","as","cols","xAlign","yAlign","gap","colGap","rowGap","className","children","breakpoints","otherProps","breakpointsCn"],"sources":["../../../../../src/components/GridDeprecated/GridDeprecated.tsx"],"sourcesContent":["import './Grid.css';\n\nimport { classnames } from '@bem-react/classnames';\nimport React from 'react';\n\nimport { cnDeprecated } from '##/utils/bem';\nimport { forwardRefWithAs } from '##/utils/types/PropsWithAsAttributes';\n\nimport { useBreakpoints } from './useBreakpoints';\n\nexport * from './GridItem/GridItem';\n\nexport const gridPropXAlign = ['left', 'center', 'right'] as const;\nexport type GridPropXAlign = (typeof gridPropXAlign)[number];\n\nexport const gridPropYAlign = ['top', 'center', 'bottom'] as const;\nexport type GridPropYAlign = (typeof gridPropYAlign)[number];\n\nexport const gridPropGap = [\n  0,\n  '2xs',\n  'xs',\n  's',\n  'm',\n  'l',\n  'xl',\n  '2xl',\n  '3xl',\n  '4xl',\n  '5xl',\n  '6xl',\n] as const;\nexport type GridPropGap = (typeof gridPropGap)[number] | '0';\n\nexport type GridPropColGap = GridPropGap;\nexport type GridPropRowGap = GridPropGap;\n\nexport const breakpointSizes = ['xs', 's', 'm', 'l', 'xl', '2xl'] as const;\nexport type BreakpointSizes = (typeof breakpointSizes)[number];\n\ntype Breakpoint = {\n  cols?: number | string;\n  gap?: GridPropGap;\n  colGap?: GridPropColGap;\n  rowGap?: GridPropRowGap;\n  xAlign?: GridPropXAlign;\n  yAlign?: GridPropYAlign;\n};\n\ntype BreakpointsProps = {\n  'xs'?: Breakpoint;\n  's'?: Breakpoint;\n  'm'?: Breakpoint;\n  'l'?: Breakpoint;\n  'xl'?: Breakpoint;\n  '2xl'?: Breakpoint;\n};\n\nexport type GridProps = Breakpoint & {\n  breakpoints?: BreakpointsProps;\n};\n\nexport const cnGrid = cnDeprecated('Grid');\n\nexport const Grid = forwardRefWithAs<GridProps>((props, ref) => {\n  const {\n    as = 'div',\n    cols,\n    xAlign,\n    yAlign,\n    gap,\n    colGap,\n    rowGap,\n    className,\n    children,\n    breakpoints,\n    ...otherProps\n  } = props;\n\n  const Tag = as as string;\n\n  const breakpointsCn = useBreakpoints(cnGrid, breakpoints);\n\n  return (\n    <Tag\n      {...otherProps}\n      className={classnames(\n        cnGrid({\n          cols,\n          gap,\n          colGap,\n          rowGap,\n          xAlign,\n          yAlign,\n        }),\n        breakpointsCn,\n        className,\n      )}\n      ref={ref}\n    >\n      {children}\n    </Tag>\n  );\n});\n"],"mappings":"gMAAA,mBAEA,OAASA,UAAT,KAA2B,uBAA3B,CACA,MAAOC,MAAP,KAAkB,OAAlB,CAEA,OAASC,YAAT,uBACA,OAASC,gBAAT,+CAEA,OAASC,cAAT,wBAEA,iCAEA,MAAO,IAAMC,eAAc,CAAG,CAAC,MAAD,CAAS,QAAT,CAAmB,OAAnB,CAAvB,CAGP,MAAO,IAAMC,eAAc,CAAG,CAAC,KAAD,CAAQ,QAAR,CAAkB,QAAlB,CAAvB,CAGP,MAAO,IAAMC,YAAW,CAAG,CACzB,CADyB,CAEzB,KAFyB,CAGzB,IAHyB,CAIzB,GAJyB,CAKzB,GALyB,CAMzB,GANyB,CAOzB,IAPyB,CAQzB,KARyB,CASzB,KATyB,CAUzB,KAVyB,CAWzB,KAXyB,CAYzB,KAZyB,CAApB,CAmBP,MAAO,IAAMC,gBAAe,CAAG,CAAC,IAAD,CAAO,GAAP,CAAY,GAAZ,CAAiB,GAAjB,CAAsB,IAAtB,CAA4B,KAA5B,CAAxB,CAyBP,MAAO,IAAMC,OAAM,CAAGP,YAAY,CAAC,MAAD,CAA3B,CAEP,MAAO,IAAMQ,KAAI,CAAGP,gBAAgB,CAAY,SAACQ,CAAD,CAAQC,CAAR,CAAgB,OAa1DD,CAb0D,CAE5DE,EAF4D,CAE5DA,CAF4D,YAEvD,KAFuD,GAG5DC,CAH4D,CAa1DH,CAb0D,CAG5DG,IAH4D,CAI5DC,CAJ4D,CAa1DJ,CAb0D,CAI5DI,MAJ4D,CAK5DC,CAL4D,CAa1DL,CAb0D,CAK5DK,MAL4D,CAM5DC,CAN4D,CAa1DN,CAb0D,CAM5DM,GAN4D,CAO5DC,CAP4D,CAa1DP,CAb0D,CAO5DO,MAP4D,CAQ5DC,CAR4D,CAa1DR,CAb0D,CAQ5DQ,MAR4D,CAS5DC,CAT4D,CAa1DT,CAb0D,CAS5DS,SAT4D,CAU5DC,CAV4D,CAa1DV,CAb0D,CAU5DU,QAV4D,CAW5DC,CAX4D,CAa1DX,CAb0D,CAW5DW,WAX4D,CAYzDC,CAZyD,0BAa1DZ,CAb0D,YAiBxDa,CAAa,CAAGpB,cAAc,CAACK,MAAD,CAASa,CAAT,CAjB0B,CAmB9D,MACE,qBALUT,CAKV,kBACMU,CADN,EAEE,SAAS,CAAEvB,UAAU,CACnBS,MAAM,CAAC,CACLK,IAAI,CAAJA,CADK,CAELG,GAAG,CAAHA,CAFK,CAGLC,MAAM,CAANA,CAHK,CAILC,MAAM,CAANA,CAJK,CAKLJ,MAAM,CAANA,CALK,CAMLC,MAAM,CAANA,CANK,CAAD,CADa,CASnBQ,CATmB,CAUnBJ,CAVmB,CAFvB,CAcE,GAAG,CAAER,CAdP,GAgBGS,CAhBH,CAmBH,CAvCmC,CAA7B"}

package/__internal__/src/components/Informer/Informer.d.ts

@@ -3,13 +3,13 @@ import { IconComponent } from '@consta/icons/Icon';
 import React from 'react';
 import { PropsWithHTMLAttributes } from '../../utils/types/PropsWithHTMLAttributes';
 export declare const informerPropView: readonly ["filled", "bordered", "outline"];
-export type InformerPropView = typeof informerPropView[number];
+export type InformerPropView = (typeof informerPropView)[number];
 export declare const informerPropViewDefault: InformerPropView;
 export declare const informerPropStatus: readonly ["success", "system", "alert", "warning", "normal"];
-export type InformerPropStatus = typeof informerPropStatus[number];
+export type InformerPropStatus = (typeof informerPropStatus)[number];
 export declare const informerPropStatusDefault: InformerPropStatus;
 export declare const informerPropSize: readonly ["m", "s"];
-export type InformerPropSize = typeof informerPropSize[number];
+export type InformerPropSize = (typeof informerPropSize)[number];
 export declare const informerPropSizeDefault: InformerPropSize;
 type Props = {
     view?: InformerPropView;