@salutejs/plasma-new-hope 0.69.0-canary.1155.8506197081.0 → 0.69.0-dev.0

package/styled-components/es/examples/plasma_web/components/Cell/Cell.js

@@ -0,0 +1,6 @@
+import { component, mergeConfig } from '../../../../engines';
+import { cellConfig, CellTextbox, CellTextboxLabel, CellTextboxSubtitle, CellTextboxTitle } from '../../../../components/Cell';
+import { config } from './Cell.config';
+var mergedConfig = /*#__PURE__*/mergeConfig(cellConfig, config);
+export var Cell = /*#__PURE__*/component(mergedConfig);
+export { CellTextbox, CellTextboxLabel, CellTextboxSubtitle, CellTextboxTitle };

package/styled-components/es/examples/plasma_web/components/Cell/Cell.stories.tsx

@@ -0,0 +1,128 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+import type { StoryObj, Meta } from '@storybook/react';
+import styled from 'styled-components';
+
+import { WithTheme } from '../../../_helpers';
+import { Avatar } from '../Avatar/Avatar';
+import { IconChevronLeft } from '../../../../components/_Icon';
+
+import { Cell, CellTextbox, CellTextboxTitle } from './Cell';
+
+type StoryProps = ComponentProps<typeof Cell> & {
+    itemsCount?: number;
+    disableLeftContent?: boolean;
+    disableRightContent?: boolean;
+};
+type Story = StoryObj<StoryProps>;
+
+const sizes = ['l', 'm', 's', 'xs'];
+const stretchingValues = ['fixed', 'filled', 'auto'];
+const alignLeft = ['top', 'center', 'bottom'];
+const alignRight = ['top', 'center', 'bottom'];
+
+type SizesCell = 'xs' | 'l' | 'm' | 's' | undefined;
+type SizesAvatar = 'l' | 'm' | 's';
+
+const getSize = (size: SizesCell): SizesAvatar => {
+    if (size === 'xs' || !size) {
+        return 's';
+    }
+
+    return size;
+};
+
+const meta: Meta<typeof Cell> = {
+    title: 'plasma_web/Cell',
+    decorators: [WithTheme],
+    argTypes: {
+        size: {
+            options: sizes,
+            control: {
+                type: 'select',
+            },
+        },
+        stretching: {
+            options: stretchingValues,
+            control: {
+                type: 'select',
+            },
+        },
+        alignContentLeft: {
+            options: alignLeft,
+            control: {
+                type: 'select',
+            },
+        },
+        alignContentRight: {
+            options: alignRight,
+            control: {
+                type: 'select',
+            },
+        },
+    },
+};
+
+export default meta;
+
+const ChevronRight = styled(IconChevronLeft)`
+    transform: rotate(180deg);
+    color: var(--text-secondary);
+`;
+
+export const Default: Story = {
+    args: {
+        size: 'm',
+        stretching: 'filled',
+        disableLeftContent: false,
+        disableRightContent: false,
+        alignContentLeft: 'center',
+        alignContentRight: 'center',
+        title: 'Title',
+        subtitle: 'Subtitle',
+        label: 'Label',
+    },
+    render: ({ ...args }: StoryProps) => {
+        return (
+            <Cell
+                contentLeft={
+                    !args.disableLeftContent && (
+                        <Avatar size={getSize(args.size)} url="https://avatars.githubusercontent.com/u/1813468?v=4" />
+                    )
+                }
+                contentRight={!args.disableRightContent && <ChevronRight color="inherit" size="xs" />}
+                {...args}
+            />
+        );
+    },
+};
+
+export const WithContentTextboxCustom: Story = {
+    args: {
+        size: 'm',
+        stretching: 'filled',
+    },
+    render: ({ ...args }: StoryProps) => {
+        const MyStyledText = styled.div`
+            font-size: 12px;
+            font-weight: 600;
+            opacity: 0.5;
+        `;
+        return (
+            <Cell
+                view="default"
+                size={args.size}
+                stretching={args.stretching}
+                contentLeft={
+                    <Avatar size={getSize(args.size)} url="https://avatars.githubusercontent.com/u/1813468?v=4" />
+                }
+                contentRight={<ChevronRight color="inherit" size="xs" />}
+            >
+                <CellTextbox>
+                    <CellTextboxTitle>Title</CellTextboxTitle>
+                    <MyStyledText>My styled Text</MyStyledText>
+                </CellTextbox>
+            </Cell>
+        );
+    },
+};

package/styled-components/es/examples/plasma_web/components/Chip/Chip.config.js

@@ -2,13 +2,12 @@ import { css } from 'styled-components';
 import { chipTokens } from '../../../../components/Chip';
 export var config = {
   defaults: {
-    view: 'default',
+    view: 'primary',
     focused: 'true',
     size: 'm'
   },
   variations: {
     view: {
-      "default": /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 80% );", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);"], chipTokens.color, chipTokens.background, chipTokens.colorHover, chipTokens.backgroundHover, chipTokens.colorActive, chipTokens.backgroundActive, chipTokens.backgroundReadOnly, chipTokens.colorReadOnly, chipTokens.backgroundReadOnlyHover, chipTokens.colorReadOnlyHover),
       primary: /*#__PURE__*/css(["", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 85% );", ":var(--inverse-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-solid-default) 80% );", ":var(--surface-solid-default);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--inverse-text-primary);"], chipTokens.color, chipTokens.background, chipTokens.colorHover, chipTokens.backgroundHover, chipTokens.colorActive, chipTokens.backgroundActive, chipTokens.backgroundReadOnly, chipTokens.colorReadOnly, chipTokens.backgroundReadOnlyHover, chipTokens.colorReadOnlyHover),
       secondary: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-transparent-secondary) 85% );", ":var(--text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-transparent-secondary) 80% );", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);"], chipTokens.color, chipTokens.background, chipTokens.colorHover, chipTokens.backgroundHover, chipTokens.colorActive, chipTokens.backgroundActive, chipTokens.backgroundReadOnly, chipTokens.colorReadOnly, chipTokens.backgroundReadOnlyHover, chipTokens.colorReadOnlyHover),
       positive: /*#__PURE__*/css(["", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":color-mix( in srgb,var(--inverse-text-primary),var(--surface-positive) 85% );", ":var(--on-dark-text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-positive) 85%);", ":var(--surface-positive);", ":var(--on-dark-text-primary);", ":var(--surface-positive);", ":var(--on-dark-text-primary);"], chipTokens.color, chipTokens.background, chipTokens.colorHover, chipTokens.backgroundHover, chipTokens.colorActive, chipTokens.backgroundActive, chipTokens.backgroundReadOnly, chipTokens.colorReadOnly, chipTokens.backgroundReadOnlyHover, chipTokens.colorReadOnlyHover)

package/styled-components/es/examples/plasma_web/components/Pagination/Pagination.config.js

@@ -18,10 +18,10 @@ export var config = {
       clear: /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 95%);", ":var(--text-primary);", ":color-mix(in srgb,var(--text-primary),var(--surface-clear) 90%);"], paginationTokens.paginationCurrentButtonColor, paginationTokens.paginationCurrentButtonBackgroundColor, paginationTokens.paginationCurrentButtonHoverColor, paginationTokens.paginationCurrentButtonHoverBackgroundColor, paginationTokens.paginationCurrentButtonActiveColor, paginationTokens.paginationCurrentButtonActiveBackgroundColor)
     },
     size: {
-      l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":3rem;", ":2.25rem;", ":0.875rem;", ":1.2rem;", ":1.45rem;", ":6.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":6.375rem;", ":1.5rem;", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":1.875rem;", ":transparent;", ":1rem;", ":6.375rem;", ":0 3.5rem 0 1.5rem;", ":0 3.625rem 0 0.375rem;", ":0 3.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.875rem;", ":4rem;", ":3.5rem;", ":0 0.625rem;", ":0.125rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
-      m: /*#__PURE__*/css(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":3rem;", ":2rem;", ":0.75rem;", ":1.05rem;", ":1.3rem;", ":5.875rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":5.875rem;", ":1.5rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.875rem;", ":5.875rem;", ":0 3.25rem 0 1.25rem;", ":0 3.375rem 0 0.375rem;", ":0 3.375rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":0 0.625rem;", ":0.125rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
-      s: /*#__PURE__*/css(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":2.5rem;", ":1.75rem;", ":3rem;", ":0.625rem;", ":0.9rem;", ":1.15rem;", ":5.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":5.375rem;", ":1.5rem;", ":0.5rem;", ":0.75rem;", ":0.5rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.75rem;", ":5.375rem;", ":0 3rem 0 1rem;", ":0 3.125rem 0 0.375rem;", ":0 3.125rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.625rem;", ":3rem;", ":2.5rem;", ":0 0.625rem;", ":0.125rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
-      xs: /*#__PURE__*/css(["", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":2.5rem;", ":0.5rem;", ":2rem;", ":1.5rem;", ":0.75rem;", ":1rem;", ":4.625rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":4.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":1.25rem;", ":transparent;", ":0.5rem;", ":4.625rem;", ":0 2.5rem 0 0.75rem;", ":0 2.625rem 0 0.375rem;", ":0 2.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":2.5rem;", ":2rem;", ":0 0.625rem;", ":0.125rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth)
+      l: /*#__PURE__*/css(["", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-bold-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":3.5rem;", ":3rem;", ":2.25rem;", ":0.875rem;", ":1.2rem;", ":1.45rem;", ":6.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":6.375rem;", ":1.5rem;", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":1.875rem;", ":transparent;", ":1rem;", ":6.375rem;", ":0 3.5rem 0 1.5rem;", ":0 3.625rem 0 0.375rem;", ":0 3.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.875rem;", ":4rem;", ":3.5rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
+      m: /*#__PURE__*/css(["", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-bold-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":3rem;", ":3rem;", ":2rem;", ":0.75rem;", ":1.05rem;", ":1.3rem;", ":5.875rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":5.875rem;", ":1.5rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.875rem;", ":5.875rem;", ":0 3.25rem 0 1.25rem;", ":0 3.375rem 0 0.375rem;", ":0 3.375rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.75rem;", ":3.5rem;", ":3rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
+      s: /*#__PURE__*/css(["", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-bold-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":2.5rem;", ":2.5rem;", ":1.75rem;", ":3rem;", ":0.625rem;", ":0.9rem;", ":1.15rem;", ":5.375rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":5.375rem;", ":1.5rem;", ":0.5rem;", ":0.75rem;", ":0.5rem;", ":0.75rem;", ":1.75rem;", ":transparent;", ":0.75rem;", ":5.375rem;", ":0 3rem 0 1rem;", ":0 3.125rem 0 0.375rem;", ":0 3.125rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.625rem;", ":3rem;", ":2.5rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth),
+      xs: /*#__PURE__*/css(["", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-bold-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":2rem;", ":2.5rem;", ":0.5rem;", ":2rem;", ":1.5rem;", ":0.75rem;", ":1rem;", ":4.625rem;", ":auto;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":0.125rem;", ":4.625rem;", ":1rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":1.25rem;", ":transparent;", ":0.5rem;", ":4.625rem;", ":0 2.5rem 0 0.75rem;", ":0 2.625rem 0 0.375rem;", ":0 2.625rem 0 0.625rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":2.5rem;", ":2rem;", ":0 0.625rem;", ":0.0625rem;"], paginationTokens.paginationFontFamily, paginationTokens.paginationFontSize, paginationTokens.paginationFontStyle, paginationTokens.paginationFontWeight, paginationTokens.paginationLetterSpacing, paginationTokens.paginationLineHeight, paginationTokens.buttonHeight, paginationTokens.paginationInputWidth, paginationTokens.buttonRadius, paginationTokens.buttonWidth, paginationTokens.buttonWidthShorter, paginationTokens.paginationIconSize, paginationTokens.paginationIconDoubleSize, paginationTokens.selectWidth, paginationTokens.selectHeight, paginationTokens.selectPaddingTop, paginationTokens.selectPaddingRight, paginationTokens.selectPaddingBottom, paginationTokens.selectPaddingLeft, paginationTokens.selectItemWidth, paginationTokens.selectItemHeight, paginationTokens.selectItemPaddingTop, paginationTokens.selectItemPaddingRight, paginationTokens.selectItemPaddingBottom, paginationTokens.selectItemPaddingLeft, paginationTokens.selectItemContentLeftWidth, paginationTokens.selectItemBackground, paginationTokens.selectTargetArrowRight, paginationTokens.selectTargetWidth, paginationTokens.selectTargetPadding, paginationTokens.selectTargetPaddingHasChips, paginationTokens.selectTargetPaddingWithInput, paginationTokens.selectTargetInnerTop, paginationTokens.selectTargetLabelInnerTop, paginationTokens.inputBorderRadius, paginationTokens.inputWidth, paginationTokens.inputHeight, paginationTokens.inputPadding, paginationTokens.inputBorderWidth)
     },
     type: {
       compact: /*#__PURE__*/css([""]),

package/styled-components/es/examples/plasma_web/components/Pagination/Pagination.stories.tsx

@@ -53,7 +53,7 @@ type Story = StoryObj<typeof Pagination>;
 
 export const Default: Story = {
     args: {
-        count: 20,
+        count: 2000,
         value: 1,
         slots: 9,
         type: 'default',
@@ -72,12 +72,18 @@ const PaginationContent = (agrs) => {
     const [pageValue, setPageValue] = useState(agrs.value);
     const [perPageValue, setPerPageValue] = useState(agrs.perPage);
 
-    const handleChange = useCallback(
-        (page: number, perPage: number) => {
-            setPerPageValue(perPage);
+    const handleChangePage = useCallback(
+        (page: number) => {
             setPageValue(page);
         },
-        [pageValue, perPageValue, setPageValue, setPerPageValue],
+        [pageValue, setPageValue],
+    );
+
+    const handleChangePerpage = useCallback(
+        (perPage: number) => {
+            setPerPageValue(perPage);
+        },
+        [perPageValue, setPerPageValue],
     );
 
     return (
@@ -104,7 +110,8 @@ const PaginationContent = (agrs) => {
                         Next
                     </Button>
                 }
-                onChangeValue={handleChange}
+                onChangePageValue={handleChangePage}
+                onChangePerPageValue={handleChangePerpage}
             />
         </>
     );
@@ -112,7 +119,7 @@ const PaginationContent = (agrs) => {
 
 export const Content: Story = {
     args: {
-        count: 20,
+        count: 2000,
         value: 1,
         slots: 9,
         type: 'default',

package/styled-components/es/index.js

@@ -6,6 +6,7 @@ export * from './hooks';
 export * from './components/Button';
 export * from './components/ButtonGroup';
 export * from './components/Chip';
+export * from './components/Cell';
 export * from './components/Link';
 export * from './components/Spinner';
 export * from './components/Checkbox';

package/types/components/Cell/Cell.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { RootProps } from '../../engines';
+import type { CellProps } from './Cell.types';
+export declare const cellRoot: (Root: RootProps<HTMLDivElement, CellProps>) => React.ForwardRefExoticComponent<CellProps & React.RefAttributes<HTMLDivElement>>;
+export declare const cellConfig: {
+    name: string;
+    tag: string;
+    layout: (Root: RootProps<HTMLDivElement, CellProps>) => React.ForwardRefExoticComponent<CellProps & React.RefAttributes<HTMLDivElement>>;
+    base: import("@linaria/core").LinariaClassName;
+    variations: {
+        view: {
+            css: import("@linaria/core").LinariaClassName;
+        };
+        size: {
+            css: import("@linaria/core").LinariaClassName;
+        };
+    };
+    defaults: {
+        view: string;
+        size: string;
+    };
+};
+//# sourceMappingURL=Cell.d.ts.map

package/types/components/Cell/Cell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAO9C,eAAO,MAAM,QAAQ,SAAU,UAAU,cAAc,EAAE,SAAS,CAAC,qFAwC9D,CAAC;AAEN,eAAO,MAAM,UAAU;;;mBA1CQ,UAAU,cAAc,EAAE,SAAS,CAAC;;;;;;;;;;;;;;CA2DlE,CAAC"}

package/types/components/Cell/Cell.styles.d.ts

@@ -0,0 +1,11 @@
+import type { AlignProp } from './Cell.types';
+export declare const base: import("@linaria/core").LinariaClassName;
+export declare const CellContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CellContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CellLeft: import("styled-components").StyledComponent<"div", any, {
+    align: AlignProp;
+}, never>;
+export declare const CellRight: import("styled-components").StyledComponent<"div", any, {
+    align: AlignProp;
+}, never>;
+//# sourceMappingURL=Cell.styles.d.ts.map

package/types/components/Cell/Cell.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.styles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAS9C,eAAO,MAAM,IAAI,0CAUhB,CAAC;AAEF,eAAO,MAAM,kBAAkB,oEAO9B,CAAC;AAEF,eAAO,MAAM,WAAW,oEAIvB,CAAC;AAEF,eAAO,MAAM,QAAQ;WAAuB,SAAS;SAGpD,CAAC;AAEF,eAAO,MAAM,SAAS;WAAuB,SAAS;SAIrD,CAAC"}

package/types/components/Cell/Cell.tokens.d.ts

@@ -0,0 +1,43 @@
+export declare const tokens: {
+    cellColor: string;
+    cellBackgroundColor: string;
+    cellPadding: string;
+    cellPaddingLeftContent: string;
+    cellPaddingContent: string;
+    cellPaddingRightContent: string;
+    cellTextboxGap: string;
+    cellGap: string;
+    cellWidth: string;
+    cellLabelColor: string;
+    cellLabelFontFamily: string;
+    cellLabelFontSize: string;
+    cellLabelFontStyle: string;
+    cellLabelFontWeight: string;
+    cellLabelLetterSpacing: string;
+    cellLabelLineHeight: string;
+    cellTitleColor: string;
+    cellTitleFontFamily: string;
+    cellTitleFontSize: string;
+    cellTitleFontStyle: string;
+    cellTitleFontWeight: string;
+    cellTitleLetterSpacing: string;
+    cellTitleLineHeight: string;
+    cellSubtitleColor: string;
+    cellSubtitleFontFamily: string;
+    cellSubtitleFontSize: string;
+    cellSubtitleFontStyle: string;
+    cellSubtitleFontWeight: string;
+    cellSubtitleLetterSpacing: string;
+    cellSubtitleLineHeight: string;
+};
+export declare const classes: {
+    autoStretching: string;
+    filledStretching: string;
+    fixedStretching: string;
+    cellWrapper: string;
+    cellRoot: string;
+    cellContent: string;
+    cellLeftContent: string;
+    cellRightContent: string;
+};
+//# sourceMappingURL=Cell.tokens.d.ts.map

package/types/components/Cell/Cell.tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqClB,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;;;CAUnB,CAAC"}

package/types/components/Cell/Cell.types.d.ts

@@ -0,0 +1,51 @@
+import type { ReactNode } from 'react';
+import type { CellTextboxProps } from './ui/CellTextbox/CellTextbox.types';
+export declare type AlignProp = 'center' | 'top' | 'bottom';
+declare type CustomCellProps = {
+    /**
+     * Размер
+     */
+    size?: string;
+    /**
+     * Размер
+     */
+    view: string;
+    /**
+     * Слот для контента слева, например `Icon`
+     */
+    contentLeft?: ReactNode;
+    /**
+     * Слот для контента спарва, например `Icon`
+     */
+    contentRight?: ReactNode;
+    /**
+     * Вертикальное выравнивание контента слева.
+     */
+    alignContentLeft?: AlignProp;
+    /**
+     * Вертикальное выравнивание контента справа.
+     */
+    alignContentRight?: AlignProp;
+    /**
+     * Ширина cell
+     * @description
+     * Может принимать три значения:
+     * fixed - кнопка фиксированной ширины;
+     * filled - кнопка занимает всю доступную ширину
+     * auto - кнопка растягивается в зависимости от контента
+     */
+    stretching?: 'fixed' | 'filled' | 'auto';
+    /**
+     * Свойство устарело, вместо этого нужно использовать contentLeft
+     * @deprecated
+     */
+    content?: ReactNode;
+    /**
+     * Свойство устарело, вместо этого нужно использовать title
+     * @deprecated
+     */
+    description?: string;
+};
+export declare type CellProps = CustomCellProps & CellTextboxProps;
+export {};
+//# sourceMappingURL=Cell.types.d.ts.map

package/types/components/Cell/Cell.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cell.types.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/Cell.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AAE3E,oBAAY,SAAS,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,CAAC;AAEpD,aAAK,eAAe,GAAG;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;OAEG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAE7B;;OAEG;IACH,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAE9B;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAEzC;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,oBAAY,SAAS,GAAG,eAAe,GAAG,gBAAgB,CAAC"}

package/types/components/Cell/index.d.ts

@@ -0,0 +1,9 @@
+export { CellTextboxLabel } from './ui/CellTextboxLabel/CellTextboxLabel';
+export { CellTextboxTitle } from './ui/CellTextboxTitle/CellTextboxTitle';
+export { CellTextboxSubtitle } from './ui/CellTextboxSubtitle/CellTextboxSubtitle';
+export { cellRoot, cellConfig } from './Cell';
+export type { CellProps } from './Cell.types';
+export { tokens as cellTokens, classes as cellClasses } from './Cell.tokens';
+export { CellTextbox } from './ui/CellTextbox/CellTextbox';
+export type { CellTextboxProps } from './ui/CellTextbox/CellTextbox.types';
+//# sourceMappingURL=index.d.ts.map

package/types/components/Cell/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Cell/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA8C,CAAC;AAEnF,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AAE7E,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,YAAY,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC"}

package/types/components/Cell/ui/CellTextbox/CellTextbox.d.ts

@@ -0,0 +1,4 @@
+import React, { HTMLAttributes } from 'react';
+import type { CellTextboxProps } from './CellTextbox.types';
+export declare const CellTextbox: React.FC<HTMLAttributes<HTMLDivElement> & CellTextboxProps>;
+//# sourceMappingURL=CellTextbox.d.ts.map

package/types/components/Cell/ui/CellTextbox/CellTextbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextbox.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextbox/CellTextbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAO9C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5D,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG,gBAAgB,CAmBnF,CAAC"}

package/types/components/Cell/ui/CellTextbox/CellTextbox.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const CellTextboxStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=CellTextbox.styles.d.ts.map

package/types/components/Cell/ui/CellTextbox/CellTextbox.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextbox.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextbox/CellTextbox.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,oEAI7B,CAAC"}

package/types/components/Cell/ui/CellTextbox/CellTextbox.types.d.ts

@@ -0,0 +1,33 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+declare type CustomTextboxProps = {
+    /**
+     * Слот для Title
+     */
+    title?: string;
+    /**
+     * Слот для Subtitle
+     */
+    subtitle?: string;
+    /**
+     * Слот для Label
+     */
+    label?: string;
+    children?: never;
+} | {
+    /**
+     * Слот для Title
+     */
+    title?: never;
+    /**
+     * Слот для Subtitle
+     */
+    subtitle?: never;
+    /**
+     * Слот для Label
+     */
+    label?: never;
+    children?: ReactNode;
+};
+export declare type CellTextboxProps = CustomTextboxProps & HTMLAttributes<HTMLDivElement>;
+export {};
+//# sourceMappingURL=CellTextbox.types.d.ts.map

package/types/components/Cell/ui/CellTextbox/CellTextbox.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextbox.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextbox/CellTextbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,aAAK,kBAAkB,GACjB;IACI;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,QAAQ,CAAC,EAAE,KAAK,CAAC;CACpB,GACD;IACI;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IAEjB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC;AAER,oBAAY,gBAAgB,GAAG,kBAAkB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC"}

package/types/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.d.ts

@@ -0,0 +1,3 @@
+import React, { HTMLAttributes } from 'react';
+export declare const CellTextboxLabel: React.FC<HTMLAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CellTextboxLabel.d.ts.map

package/types/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextboxLabel.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI9C,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,cAAc,CAAC,CAErE,CAAC"}

package/types/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledTextboxLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=CellTextboxLabel.styles.d.ts.map

package/types/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextboxLabel.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextboxLabel/CellTextboxLabel.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kBAAkB,oEAQ9B,CAAC"}

package/types/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.d.ts

@@ -0,0 +1,3 @@
+import React, { HTMLAttributes } from 'react';
+export declare const CellTextboxSubtitle: React.FC<HTMLAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CellTextboxSubtitle.d.ts.map

package/types/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextboxSubtitle.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI9C,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,cAAc,CAAC,CAExE,CAAC"}

package/types/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledTextboxSubtitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=CellTextboxSubtitle.styles.d.ts.map

package/types/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextboxSubtitle.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextboxSubtitle/CellTextboxSubtitle.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB,oEAQjC,CAAC"}

package/types/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.d.ts

@@ -0,0 +1,3 @@
+import React, { HTMLAttributes } from 'react';
+export declare const CellTextboxTitle: React.FC<HTMLAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CellTextboxTitle.d.ts.map

package/types/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextboxTitle.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI9C,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,cAAc,CAAC,CAErE,CAAC"}

package/types/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledTextboxTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=CellTextboxTitle.styles.d.ts.map

package/types/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellTextboxTitle.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/ui/CellTextboxTitle/CellTextboxTitle.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kBAAkB,oEAQ9B,CAAC"}

package/types/components/Cell/variations/_size/base.d.ts

@@ -0,0 +1,2 @@
+export declare const base: import("@linaria/core").LinariaClassName;
+//# sourceMappingURL=base.d.ts.map

package/types/components/Cell/variations/_size/base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/variations/_size/base.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,0CAAQ,CAAC"}

package/types/components/Cell/variations/_stretching/base.d.ts

@@ -0,0 +1,2 @@
+export declare const base: import("@linaria/core").LinariaClassName;
+//# sourceMappingURL=base.d.ts.map

package/types/components/Cell/variations/_stretching/base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/variations/_stretching/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAUhB,CAAC"}

package/types/components/Cell/variations/_view/base.d.ts

@@ -0,0 +1,2 @@
+export declare const base: import("@linaria/core").LinariaClassName;
+//# sourceMappingURL=base.d.ts.map

package/types/components/Cell/variations/_view/base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/Cell/variations/_view/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAYhB,CAAC"}

package/types/components/Chip/Chip.d.ts

@@ -1,11 +1,35 @@
 import React from 'react';
 import type { RootProps } from '../../engines';
 import type { ChipProps } from './Chip.types';
-export declare const chipRoot: (Root: RootProps<HTMLButtonElement, ChipProps>) => React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const chipRoot: (Root: RootProps<HTMLButtonElement, ChipProps>) => React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    text?: string | undefined;
+    contentLeft?: React.ReactNode;
+    contentRight?: React.ReactNode;
+    contentClearButton?: React.ReactNode;
+    disabled?: boolean | undefined;
+    readOnly?: boolean | undefined;
+    size?: ("m" | "s" | "xs" | "l") | undefined;
+    view?: ("secondary" | "default" | "positive") | undefined;
+    onClear?: (() => void) | undefined;
+} & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLButtonElement>>;
 export declare const chipConfig: {
     name: string;
     tag: string;
-    layout: (Root: RootProps<HTMLButtonElement, ChipProps>) => React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLButtonElement>>;
+    layout: (Root: RootProps<HTMLButtonElement, ChipProps>) => React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
+        text?: string | undefined;
+        contentLeft?: React.ReactNode;
+        contentRight?: React.ReactNode;
+        contentClearButton?: React.ReactNode;
+        disabled?: boolean | undefined;
+        readOnly?: boolean | undefined;
+        size?: ("m" | "s" | "xs" | "l") | undefined;
+        view?: ("secondary" | "default" | "positive") | undefined;
+        onClear?: (() => void) | undefined;
+    } & {
+        children?: React.ReactNode;
+    } & React.RefAttributes<HTMLButtonElement>>;
     base: import("@linaria/core").LinariaClassName;
     variations: {
         view: {

package/types/components/Chip/Chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAQ/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,eAAO,MAAM,QAAQ,SAAU,UAAU,iBAAiB,EAAE,SAAS,CAAC,wFAsDhE,CAAC;AAEP,eAAO,MAAM,UAAU;;;mBAxDQ,UAAU,iBAAiB,EAAE,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CAoFrE,CAAC"}
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAQ/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI9C,eAAO,MAAM,QAAQ,SAAU,UAAU,iBAAiB,EAAE,SAAS,CAAC;;;;;;;;;;;;2CAsDhE,CAAC;AAEP,eAAO,MAAM,UAAU;;;mBAxDQ,UAAU,iBAAiB,EAAE,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoFrE,CAAC"}