@salutejs/plasma-new-hope 0.325.0-canary.1993.15271190997.0 → 0.325.0-dev.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/List/List.css +7 -0
- package/cjs/components/List/List.js +59 -0
- package/cjs/components/List/List.js.map +1 -0
- package/cjs/components/List/List.styles.js +9 -0
- package/cjs/components/List/List.styles.js.map +1 -0
- package/cjs/components/List/List.styles_97b8jq.css +1 -0
- package/cjs/components/List/List.tokens.js +44 -0
- package/cjs/components/List/List.tokens.js.map +1 -0
- package/cjs/components/List/ui/ListItem.css +18 -0
- package/cjs/components/List/ui/ListItem.js +28 -0
- package/cjs/components/List/ui/ListItem.js.map +1 -0
- package/cjs/components/List/ui/ListItem.styles.js +28 -0
- package/cjs/components/List/ui/ListItem.styles.js.map +1 -0
- package/cjs/components/List/ui/ListItem.styles_106alid.css +2 -0
- package/cjs/components/List/variations/_disabled/base.js +9 -0
- package/cjs/components/List/variations/_disabled/base.js.map +1 -0
- package/cjs/components/List/variations/_disabled/base_1p96e1z.css +1 -0
- package/cjs/components/List/variations/_size/base.js +9 -0
- package/cjs/components/List/variations/_size/base.js.map +1 -0
- package/cjs/components/List/variations/_size/base_jq4nc8.css +1 -0
- package/cjs/components/List/variations/_view/base.js +9 -0
- package/cjs/components/List/variations/_view/base.js.map +1 -0
- package/cjs/components/List/variations/_view/base_1fsqflm.css +1 -0
- package/cjs/components/Notification/Notification.css +12 -12
- package/cjs/components/Notification/Notification.js +5 -1
- package/cjs/components/Notification/Notification.js.map +1 -1
- package/cjs/components/Notification/Notification.styles.js +63 -48
- package/cjs/components/Notification/Notification.styles.js.map +1 -1
- package/cjs/components/Notification/{Notification.styles_1yt699o.css → Notification.styles_1uyb7ob.css} +1 -1
- package/cjs/components/Notification/Notification.types.js.map +1 -1
- package/cjs/components/Notification/NotificationsProvider.css +11 -11
- package/cjs/components/Notification/variations/_layout/base.js +1 -1
- package/cjs/components/Notification/variations/_layout/base.js.map +1 -1
- package/cjs/components/Notification/variations/_layout/base_1g9g70c.css +1 -0
- package/cjs/components/NumberFormat/NumberFormat.js +2 -7
- package/cjs/components/NumberFormat/NumberFormat.js.map +1 -1
- package/cjs/index.css +23 -12
- package/cjs/index.js +8 -0
- package/cjs/index.js.map +1 -1
- package/emotion/cjs/components/List/List.js +55 -0
- package/emotion/cjs/components/List/List.styles.js +17 -0
- package/emotion/cjs/components/List/List.template-doc.mdx +42 -0
- package/emotion/cjs/components/List/List.tokens.js +42 -0
- package/emotion/cjs/components/List/List.types.js +5 -0
- package/emotion/cjs/components/List/index.js +38 -0
- package/emotion/cjs/components/List/ui/ListItem.js +25 -0
- package/emotion/cjs/components/List/ui/ListItem.styles.js +21 -0
- package/emotion/cjs/components/List/ui/ListItem.types.js +5 -0
- package/emotion/cjs/components/List/variations/_disabled/base.js +10 -0
- package/emotion/cjs/components/List/variations/_disabled/tokens.json +1 -0
- package/emotion/cjs/components/List/variations/_size/base.js +9 -0
- package/emotion/cjs/components/List/variations/_size/tokens.json +1 -0
- package/emotion/cjs/components/List/variations/_view/base.js +10 -0
- package/emotion/cjs/components/List/variations/_view/tokens.json +1 -0
- package/emotion/cjs/components/Notification/Notification.js +5 -1
- package/emotion/cjs/components/Notification/Notification.styles.js +43 -36
- package/emotion/cjs/components/Notification/Notification.template-doc.mdx +44 -0
- package/emotion/cjs/components/Notification/variations/_layout/base.js +1 -1
- package/emotion/cjs/components/NumberFormat/NumberFormat.js +2 -7
- package/emotion/cjs/components/TextField/TextField.template-doc.mdx +16 -1
- package/emotion/cjs/examples/fixtures/Notification.js +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/List/List.config.js +29 -0
- package/emotion/cjs/examples/plasma_b2c/components/List/List.js +12 -0
- package/emotion/cjs/examples/plasma_b2c/components/List/List.stories.tsx +61 -0
- package/emotion/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +5 -1
- package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +23 -22
- package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +9 -4
- package/emotion/cjs/examples/plasma_web/components/List/List.config.js +29 -0
- package/emotion/cjs/examples/plasma_web/components/List/List.js +12 -0
- package/emotion/cjs/examples/plasma_web/components/List/List.stories.tsx +61 -0
- package/emotion/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +5 -1
- package/emotion/cjs/examples/plasma_web/components/TextField/TextField.config.js +23 -22
- package/emotion/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +10 -5
- package/emotion/cjs/index.js +11 -0
- package/emotion/es/components/List/List.js +45 -0
- package/emotion/es/components/List/List.styles.js +11 -0
- package/emotion/es/components/List/List.template-doc.mdx +42 -0
- package/emotion/es/components/List/List.tokens.js +36 -0
- package/emotion/es/components/List/List.types.js +1 -0
- package/emotion/es/components/List/index.js +3 -0
- package/emotion/es/components/List/ui/ListItem.js +18 -0
- package/emotion/es/components/List/ui/ListItem.styles.js +14 -0
- package/emotion/es/components/List/ui/ListItem.types.js +1 -0
- package/emotion/es/components/List/variations/_disabled/base.js +4 -0
- package/emotion/es/components/List/variations/_disabled/tokens.json +1 -0
- package/emotion/es/components/List/variations/_size/base.js +3 -0
- package/emotion/es/components/List/variations/_size/tokens.json +1 -0
- package/emotion/es/components/List/variations/_view/base.js +4 -0
- package/emotion/es/components/List/variations/_view/tokens.json +1 -0
- package/emotion/es/components/Notification/Notification.js +5 -1
- package/emotion/es/components/Notification/Notification.styles.js +43 -36
- package/emotion/es/components/Notification/Notification.template-doc.mdx +44 -0
- package/emotion/es/components/Notification/variations/_layout/base.js +1 -1
- package/emotion/es/components/NumberFormat/NumberFormat.js +2 -7
- package/emotion/es/components/TextField/TextField.template-doc.mdx +16 -1
- package/emotion/es/examples/fixtures/Notification.js +1 -1
- package/emotion/es/examples/plasma_b2c/components/List/List.config.js +23 -0
- package/emotion/es/examples/plasma_b2c/components/List/List.js +6 -0
- package/emotion/es/examples/plasma_b2c/components/List/List.stories.tsx +61 -0
- package/emotion/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +5 -1
- package/emotion/es/examples/plasma_b2c/components/TextField/TextField.config.js +23 -22
- package/emotion/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +9 -4
- package/emotion/es/examples/plasma_web/components/List/List.config.js +23 -0
- package/emotion/es/examples/plasma_web/components/List/List.js +6 -0
- package/emotion/es/examples/plasma_web/components/List/List.stories.tsx +61 -0
- package/emotion/es/examples/plasma_web/components/Notification/Notification.stories.tsx +5 -1
- package/emotion/es/examples/plasma_web/components/TextField/TextField.config.js +23 -22
- package/emotion/es/examples/plasma_web/components/TextField/TextField.stories.tsx +10 -5
- package/emotion/es/index.js +3 -1
- package/es/components/List/List.css +7 -0
- package/es/components/List/List.js +49 -0
- package/es/components/List/List.js.map +1 -0
- package/es/components/List/List.styles.js +5 -0
- package/es/components/List/List.styles.js.map +1 -0
- package/es/components/List/List.styles_97b8jq.css +1 -0
- package/es/components/List/List.tokens.js +39 -0
- package/es/components/List/List.tokens.js.map +1 -0
- package/es/components/List/ui/ListItem.css +18 -0
- package/es/components/List/ui/ListItem.js +20 -0
- package/es/components/List/ui/ListItem.js.map +1 -0
- package/es/components/List/ui/ListItem.styles.js +23 -0
- package/es/components/List/ui/ListItem.styles.js.map +1 -0
- package/es/components/List/ui/ListItem.styles_106alid.css +2 -0
- package/es/components/List/variations/_disabled/base.js +5 -0
- package/es/components/List/variations/_disabled/base.js.map +1 -0
- package/es/components/List/variations/_disabled/base_1p96e1z.css +1 -0
- package/es/components/List/variations/_size/base.js +5 -0
- package/es/components/List/variations/_size/base.js.map +1 -0
- package/es/components/List/variations/_size/base_jq4nc8.css +1 -0
- package/es/components/List/variations/_view/base.js +5 -0
- package/es/components/List/variations/_view/base.js.map +1 -0
- package/es/components/List/variations/_view/base_1fsqflm.css +1 -0
- package/es/components/Notification/Notification.css +12 -12
- package/es/components/Notification/Notification.js +5 -1
- package/es/components/Notification/Notification.js.map +1 -1
- package/es/components/Notification/Notification.styles.js +63 -48
- package/es/components/Notification/Notification.styles.js.map +1 -1
- package/es/components/Notification/{Notification.styles_1yt699o.css → Notification.styles_1uyb7ob.css} +1 -1
- package/es/components/Notification/Notification.types.js.map +1 -1
- package/es/components/Notification/NotificationsProvider.css +11 -11
- package/es/components/Notification/variations/_layout/base.js +1 -1
- package/es/components/Notification/variations/_layout/base.js.map +1 -1
- package/es/components/Notification/variations/_layout/base_1g9g70c.css +1 -0
- package/es/components/NumberFormat/NumberFormat.js +2 -7
- package/es/components/NumberFormat/NumberFormat.js.map +1 -1
- package/es/index.css +23 -12
- package/es/index.js +3 -0
- package/es/index.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/List/List.js +55 -0
- package/styled-components/cjs/components/List/List.styles.js +8 -0
- package/styled-components/cjs/components/List/List.template-doc.mdx +42 -0
- package/styled-components/cjs/components/List/List.tokens.js +42 -0
- package/styled-components/cjs/components/List/List.types.js +5 -0
- package/styled-components/cjs/components/List/index.js +38 -0
- package/styled-components/cjs/components/List/ui/ListItem.js +25 -0
- package/styled-components/cjs/components/List/ui/ListItem.styles.js +19 -0
- package/styled-components/cjs/components/List/ui/ListItem.types.js +5 -0
- package/styled-components/cjs/components/List/variations/_disabled/base.js +10 -0
- package/styled-components/cjs/components/List/variations/_disabled/tokens.json +1 -0
- package/styled-components/cjs/components/List/variations/_size/base.js +9 -0
- package/styled-components/cjs/components/List/variations/_size/tokens.json +1 -0
- package/styled-components/cjs/components/List/variations/_view/base.js +10 -0
- package/styled-components/cjs/components/List/variations/_view/tokens.json +1 -0
- package/styled-components/cjs/components/Notification/Notification.js +5 -1
- package/styled-components/cjs/components/Notification/Notification.styles.js +33 -26
- package/styled-components/cjs/components/Notification/Notification.template-doc.mdx +44 -0
- package/styled-components/cjs/components/Notification/variations/_layout/base.js +1 -1
- package/styled-components/cjs/components/NumberFormat/NumberFormat.js +2 -7
- package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +16 -1
- package/styled-components/cjs/examples/fixtures/Notification.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/List/List.config.js +29 -0
- package/styled-components/cjs/examples/plasma_b2c/components/List/List.js +12 -0
- package/styled-components/cjs/examples/plasma_b2c/components/List/List.stories.tsx +61 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +5 -1
- package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +2 -1
- package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +9 -4
- package/styled-components/cjs/examples/plasma_web/components/List/List.config.js +29 -0
- package/styled-components/cjs/examples/plasma_web/components/List/List.js +12 -0
- package/styled-components/cjs/examples/plasma_web/components/List/List.stories.tsx +61 -0
- package/styled-components/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +5 -1
- package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.config.js +7 -6
- package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +10 -5
- package/styled-components/cjs/index.js +11 -0
- package/styled-components/es/components/List/List.js +45 -0
- package/styled-components/es/components/List/List.styles.js +2 -0
- package/styled-components/es/components/List/List.template-doc.mdx +42 -0
- package/styled-components/es/components/List/List.tokens.js +36 -0
- package/styled-components/es/components/List/List.types.js +1 -0
- package/styled-components/es/components/List/index.js +3 -0
- package/styled-components/es/components/List/ui/ListItem.js +18 -0
- package/styled-components/es/components/List/ui/ListItem.styles.js +12 -0
- package/styled-components/es/components/List/ui/ListItem.types.js +1 -0
- package/styled-components/es/components/List/variations/_disabled/base.js +4 -0
- package/styled-components/es/components/List/variations/_disabled/tokens.json +1 -0
- package/styled-components/es/components/List/variations/_size/base.js +3 -0
- package/styled-components/es/components/List/variations/_size/tokens.json +1 -0
- package/styled-components/es/components/List/variations/_view/base.js +4 -0
- package/styled-components/es/components/List/variations/_view/tokens.json +1 -0
- package/styled-components/es/components/Notification/Notification.js +5 -1
- package/styled-components/es/components/Notification/Notification.styles.js +33 -26
- package/styled-components/es/components/Notification/Notification.template-doc.mdx +44 -0
- package/styled-components/es/components/Notification/variations/_layout/base.js +1 -1
- package/styled-components/es/components/NumberFormat/NumberFormat.js +2 -7
- package/styled-components/es/components/TextField/TextField.template-doc.mdx +16 -1
- package/styled-components/es/examples/fixtures/Notification.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/List/List.config.js +23 -0
- package/styled-components/es/examples/plasma_b2c/components/List/List.js +6 -0
- package/styled-components/es/examples/plasma_b2c/components/List/List.stories.tsx +61 -0
- package/styled-components/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +5 -1
- package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.config.js +2 -1
- package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +9 -4
- package/styled-components/es/examples/plasma_web/components/List/List.config.js +23 -0
- package/styled-components/es/examples/plasma_web/components/List/List.js +6 -0
- package/styled-components/es/examples/plasma_web/components/List/List.stories.tsx +61 -0
- package/styled-components/es/examples/plasma_web/components/Notification/Notification.stories.tsx +5 -1
- package/styled-components/es/examples/plasma_web/components/TextField/TextField.config.js +7 -6
- package/styled-components/es/examples/plasma_web/components/TextField/TextField.stories.tsx +10 -5
- package/styled-components/es/index.js +3 -1
- package/types/components/List/List.d.ts +36 -0
- package/types/components/List/List.d.ts.map +1 -0
- package/types/components/List/List.styles.d.ts +2 -0
- package/types/components/List/List.styles.d.ts.map +1 -0
- package/types/components/List/List.tokens.d.ts +37 -0
- package/types/components/List/List.tokens.d.ts.map +1 -0
- package/types/components/List/List.types.d.ts +22 -0
- package/types/components/List/List.types.d.ts.map +1 -0
- package/types/components/List/index.d.ts +5 -0
- package/types/components/List/index.d.ts.map +1 -0
- package/types/components/List/ui/ListItem.d.ts +4 -0
- package/types/components/List/ui/ListItem.d.ts.map +1 -0
- package/types/components/List/ui/ListItem.styles.d.ts +34 -0
- package/types/components/List/ui/ListItem.styles.d.ts.map +1 -0
- package/types/components/List/ui/ListItem.types.d.ts +14 -0
- package/types/components/List/ui/ListItem.types.d.ts.map +1 -0
- package/types/components/List/variations/_disabled/base.d.ts +2 -0
- package/types/components/List/variations/_disabled/base.d.ts.map +1 -0
- package/types/components/List/variations/_size/base.d.ts +2 -0
- package/types/components/List/variations/_size/base.d.ts.map +1 -0
- package/types/components/List/variations/_view/base.d.ts +2 -0
- package/types/components/List/variations/_view/base.d.ts.map +1 -0
- package/types/components/Notification/Notification.d.ts.map +1 -1
- package/types/components/Notification/Notification.styles.d.ts +3 -1
- package/types/components/Notification/Notification.styles.d.ts.map +1 -1
- package/types/components/Notification/Notification.types.d.ts +9 -0
- package/types/components/Notification/Notification.types.d.ts.map +1 -1
- package/types/components/NumberFormat/NumberFormat.d.ts.map +1 -1
- package/types/index.d.ts +2 -0
- package/types/index.d.ts.map +1 -1
- package/cjs/components/Notification/variations/_layout/base_qkc3i4.css +0 -1
- package/es/components/Notification/variations/_layout/base_qkc3i4.css +0 -1
@@ -1,13 +1,14 @@
|
|
1
1
|
import React, { ComponentProps, useState } from 'react';
|
2
2
|
import type { StoryObj, Meta } from '@storybook/react';
|
3
3
|
import { action } from '@storybook/addon-actions';
|
4
|
-
import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
|
4
|
+
import { IconPlaceholder, getConfigVariations } from '@salutejs/plasma-sb-utils';
|
5
5
|
|
6
6
|
import { WithTheme } from '../../../_helpers';
|
7
7
|
import { IconCross, IconLock } from '../../../../components/_Icon';
|
8
8
|
import type { PopoverPlacement } from '../Popover/Popover';
|
9
9
|
|
10
10
|
import { TextField } from './TextField';
|
11
|
+
import { config } from './TextField.config';
|
11
12
|
|
12
13
|
const onChange = action('onChange');
|
13
14
|
const onFocus = action('onFocus');
|
@@ -15,14 +16,14 @@ const onBlur = action('onBlur');
|
|
15
16
|
const onSearch = action('onSearch');
|
16
17
|
const onChipsChange = action('onChipsChange');
|
17
18
|
|
18
|
-
const
|
19
|
-
|
19
|
+
const { views, sizes } = getConfigVariations(config);
|
20
|
+
|
20
21
|
const chipViews = ['default', 'secondary', 'accent', 'positive', 'warning', 'negative'];
|
21
22
|
const hintViews = ['default'];
|
22
23
|
const hintSizes = ['m', 's'];
|
23
24
|
const hintTriggers = ['hover', 'click'];
|
24
|
-
const hintTargetPlacements = ['outer', 'inner'];
|
25
25
|
const labelPlacements = ['outer', 'inner'];
|
26
|
+
const hintTargetPlacements = ['outer', 'inner'];
|
26
27
|
const placements: Array<PopoverPlacement> = [
|
27
28
|
'top',
|
28
29
|
'top-start',
|
@@ -63,6 +64,10 @@ const meta: Meta<typeof TextField> = {
|
|
63
64
|
control: {
|
64
65
|
type: 'select',
|
65
66
|
},
|
67
|
+
if: {
|
68
|
+
arg: 'optional',
|
69
|
+
truthy: false,
|
70
|
+
},
|
66
71
|
},
|
67
72
|
required: {
|
68
73
|
control: {
|
@@ -322,7 +327,7 @@ export const Default: StoryObj<StoryPropsDefault> = {
|
|
322
327
|
},
|
323
328
|
parameters: {
|
324
329
|
controls: {
|
325
|
-
exclude: ['chipType'],
|
330
|
+
exclude: ['chipType', 'chipView'],
|
326
331
|
},
|
327
332
|
},
|
328
333
|
render: (args) => <StoryDemo {...args} />,
|
package/emotion/es/index.js
CHANGED
@@ -72,9 +72,11 @@ export * from "./components/Tree";
|
|
72
72
|
export * from "./components/Rating";
|
73
73
|
export * from "./components/Note";
|
74
74
|
export * from "./components/Table";
|
75
|
+
export * from "./components/List";
|
75
76
|
export * from "./components/LinkButton";
|
76
77
|
export * from "./components/NumberFormat";
|
77
78
|
export * from "./components/Toast/ToastNew";
|
78
79
|
export * from "./components/Carousel";
|
79
80
|
export * from "./components/PaginationDots";
|
80
|
-
export * from "./components/CodeField";
|
81
|
+
export * from "./components/CodeField";
|
82
|
+
export * from "./components/List";
|
@@ -0,0 +1,7 @@
|
|
1
|
+
.List_styles_97b8jq_bmg9h6q__1b4a3381{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;height:auto;width:100%;list-style-type:none;padding:0;margin:0;}
|
2
|
+
|
3
|
+
.base_1fsqflm_bpv2gh8__25e8bd39.base_1fsqflm_listItemTight__25e8bd39 .base_1fsqflm_s17e6by7__25e8bd39{padding:calc(var(--plasma-list-item-padding-top) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-right) calc(var(--plasma-list-item-padding-bottom) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-left);}
|
4
|
+
|
5
|
+
.base_jq4nc8_b1vinxbx__214ad998{gap:var(--plasma-list-gap);}
|
6
|
+
|
7
|
+
.base_1p96e1z_b1ybuwod__f4bddc06.base_1p96e1z_listItemDisabled__f4bddc06 .base_1p96e1z_s17e6by7__f4bddc06{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}
|
@@ -0,0 +1,49 @@
|
|
1
|
+
import React, { forwardRef } from 'react';
|
2
|
+
import cls from 'classnames';
|
3
|
+
import { base } from './List.styles.js';
|
4
|
+
import { classes } from './List.tokens.js';
|
5
|
+
import { base as base$1 } from './variations/_view/base.js';
|
6
|
+
import { base as base$2 } from './variations/_size/base.js';
|
7
|
+
import { base as base$3 } from './variations/_disabled/base.js';
|
8
|
+
|
9
|
+
var listRoot = function listRoot(Root) {
|
10
|
+
return /*#__PURE__*/forwardRef(function (_ref, outerRootRef) {
|
11
|
+
var size = _ref.size,
|
12
|
+
view = _ref.view,
|
13
|
+
disabled = _ref.disabled,
|
14
|
+
variant = _ref.variant,
|
15
|
+
className = _ref.className,
|
16
|
+
children = _ref.children;
|
17
|
+
return /*#__PURE__*/React.createElement(Root, {
|
18
|
+
ref: outerRootRef,
|
19
|
+
size: size,
|
20
|
+
view: view,
|
21
|
+
disabled: disabled,
|
22
|
+
className: cls(classes.listRoot, className, variant === 'tight' ? classes.tightListItem : '', disabled ? classes.disabledList : '')
|
23
|
+
}, children);
|
24
|
+
});
|
25
|
+
};
|
26
|
+
var listConfig = {
|
27
|
+
name: 'List',
|
28
|
+
tag: 'ul',
|
29
|
+
layout: listRoot,
|
30
|
+
base: base,
|
31
|
+
variations: {
|
32
|
+
view: {
|
33
|
+
css: base$1
|
34
|
+
},
|
35
|
+
size: {
|
36
|
+
css: base$2
|
37
|
+
},
|
38
|
+
disabled: {
|
39
|
+
css: base$3
|
40
|
+
}
|
41
|
+
},
|
42
|
+
defaults: {
|
43
|
+
view: 'default',
|
44
|
+
size: 'm'
|
45
|
+
}
|
46
|
+
};
|
47
|
+
|
48
|
+
export { listConfig, listRoot };
|
49
|
+
//# sourceMappingURL=List.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"List.js","sources":["../../../src/components/List/List.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport cls from 'classnames';\n\nimport { RootProps } from '../../engines';\n\nimport type { ListProps } from './List.types';\nimport { base } from './List.styles';\nimport { classes } from './List.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as disabledCSS } from './variations/_disabled/base';\n\nexport const listRoot = (Root: RootProps<HTMLUListElement, ListProps>) =>\n forwardRef<HTMLUListElement, ListProps>(({ size, view, disabled, variant, className, children }, outerRootRef) => {\n return (\n <Root\n ref={outerRootRef}\n size={size}\n view={view}\n disabled={disabled}\n className={cls(\n classes.listRoot,\n className,\n variant === 'tight' ? classes.tightListItem : '',\n disabled ? classes.disabledList : '',\n )}\n >\n {children}\n </Root>\n );\n });\n\nexport const listConfig = {\n name: 'List',\n tag: 'ul',\n layout: listRoot,\n base,\n variations: {\n view: {\n css: viewCSS,\n },\n size: {\n css: sizeCSS,\n },\n disabled: {\n css: disabledCSS,\n },\n },\n defaults: {\n view: 'default',\n size: 'm',\n },\n};\n"],"names":["listRoot","Root","forwardRef","_ref","outerRootRef","size","view","disabled","variant","className","children","React","createElement","ref","cls","classes","tightListItem","disabledList","listConfig","name","tag","layout","base","variations","css","viewCSS","sizeCSS","disabledCSS","defaults"],"mappings":";;;;;;;;IAYaA,QAAQ,GAAG,SAAXA,QAAQA,CAAIC,IAA4C,EAAA;AAAA,EAAA,oBACjEC,UAAU,CAA8B,UAAAC,IAAA,EAAyDC,YAAY,EAAK;AAAA,IAAA,IAAvEC,IAAI,GAAAF,IAAA,CAAJE,IAAI;MAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;MAAEC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;MAAEC,OAAO,GAAAL,IAAA,CAAPK,OAAO;MAAEC,SAAS,GAAAN,IAAA,CAATM,SAAS;MAAEC,QAAQ,GAAAP,IAAA,CAARO,QAAQ,CAAA;AACzF,IAAA,oBACIC,KAAA,CAAAC,aAAA,CAACX,IAAI,EAAA;AACDY,MAAAA,GAAG,EAAET,YAAa;AAClBC,MAAAA,IAAI,EAAEA,IAAK;AACXC,MAAAA,IAAI,EAAEA,IAAK;AACXC,MAAAA,QAAQ,EAAEA,QAAS;MACnBE,SAAS,EAAEK,GAAG,CACVC,OAAO,CAACf,QAAQ,EAChBS,SAAS,EACTD,OAAO,KAAK,OAAO,GAAGO,OAAO,CAACC,aAAa,GAAG,EAAE,EAChDT,QAAQ,GAAGQ,OAAO,CAACE,YAAY,GAAG,EACtC,CAAA;AAAE,KAAA,EAEDP,QACC,CAAC,CAAA;AAEf,GAAC,CAAC,CAAA;AAAA,EAAA;AAEC,IAAMQ,UAAU,GAAG;AACtBC,EAAAA,IAAI,EAAE,MAAM;AACZC,EAAAA,GAAG,EAAE,IAAI;AACTC,EAAAA,MAAM,EAAErB,QAAQ;AAChBsB,EAAAA,IAAI,EAAJA,IAAI;AACJC,EAAAA,UAAU,EAAE;AACRjB,IAAAA,IAAI,EAAE;AACFkB,MAAAA,GAAG,EAAEC,MAAAA;KACR;AACDpB,IAAAA,IAAI,EAAE;AACFmB,MAAAA,GAAG,EAAEE,MAAAA;KACR;AACDnB,IAAAA,QAAQ,EAAE;AACNiB,MAAAA,GAAG,EAAEG,MAAAA;AACT,KAAA;GACH;AACDC,EAAAA,QAAQ,EAAE;AACNtB,IAAAA,IAAI,EAAE,SAAS;AACfD,IAAAA,IAAI,EAAE,GAAA;AACV,GAAA;AACJ;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"List.styles.js","sources":["../../../src/components/List/List.styles.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nexport const base = css`\n display: flex;\n flex-direction: column;\n align-items: stretch;\n height: auto;\n width: 100%;\n list-style-type: none;\n padding: 0;\n margin: 0;\n`;\n"],"names":["base"],"mappings":"AAEO,IAAMA,IAAI,GAShB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.bmg9h6q{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;height:auto;width:100%;list-style-type:none;padding:0;margin:0;}
|
@@ -0,0 +1,39 @@
|
|
1
|
+
var classes = {
|
2
|
+
listRoot: 'list-root',
|
3
|
+
listItem: 'list-item',
|
4
|
+
filledStretching: 'list-stretching-filled',
|
5
|
+
fixedStretching: 'list-stretching-fixed',
|
6
|
+
tightListItem: 'list-item-tight',
|
7
|
+
disabledList: 'list-item-disabled',
|
8
|
+
disabledListItem: 'list-item-disabled-item'
|
9
|
+
};
|
10
|
+
var tokens = {
|
11
|
+
listGap: '--plasma-list-gap',
|
12
|
+
listWidth: '--plasma-list-width',
|
13
|
+
listItemBackground: '--plasma-list-item-background',
|
14
|
+
listItemBackgroundHover: '--plasma-list-item-background-hover',
|
15
|
+
listItemBorderRadius: '--plasma-list-item-border-radius',
|
16
|
+
listItemPaddingLeft: '--plasma-list-item-padding-left',
|
17
|
+
listItemPaddingRight: '--plasma-list-item-padding-right',
|
18
|
+
listItemPaddingTop: '--plasma-list-item-padding-top',
|
19
|
+
listItemPaddingBottom: '--plasma-list-item-padding-bottom',
|
20
|
+
listItemBorderColor: '--plasma-list-item-border-color',
|
21
|
+
listItemBorderColorHover: '--plasma-list-item-border-color-hover',
|
22
|
+
listItemBorderWidth: '--plasma-list-item-border-width',
|
23
|
+
listItemIconLeftColor: '--plasma-list-item-color-icon-left',
|
24
|
+
listItemIconRightColor: '--plasma-list-item-color-icon-right',
|
25
|
+
listItemGap: '--plasma-list-item-gap',
|
26
|
+
listItemTightDifference: '--plasma-list-item-tight-difference',
|
27
|
+
listItemColor: '--plasma-list-item-color',
|
28
|
+
listItemColorHover: '--plasma-list-item-color-hover',
|
29
|
+
listItemFontFamily: '--plasma-list-item-font-family',
|
30
|
+
listItemFontSize: '--plasma-list-item-font-size',
|
31
|
+
listItemFontStyle: '--plasma-list-item-font-style',
|
32
|
+
listItemFontWeight: '--plasma-list-item-font-weight',
|
33
|
+
listItemLetterSpacing: '--plasma-list-item-letter-spacing',
|
34
|
+
listItemLineHeight: '--plasma-list-item-line-height',
|
35
|
+
listDisabledOpacity: '--plasma-list-disabled-opacity'
|
36
|
+
};
|
37
|
+
|
38
|
+
export { classes, tokens };
|
39
|
+
//# sourceMappingURL=List.tokens.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"List.tokens.js","sources":["../../../src/components/List/List.tokens.ts"],"sourcesContent":["export const classes = {\n listRoot: 'list-root',\n listItem: 'list-item',\n filledStretching: 'list-stretching-filled',\n fixedStretching: 'list-stretching-fixed',\n tightListItem: 'list-item-tight',\n disabledList: 'list-item-disabled',\n disabledListItem: 'list-item-disabled-item',\n};\n\nexport const tokens = {\n listGap: '--plasma-list-gap',\n listWidth: '--plasma-list-width',\n\n listItemBackground: '--plasma-list-item-background',\n listItemBackgroundHover: '--plasma-list-item-background-hover',\n listItemBorderRadius: '--plasma-list-item-border-radius',\n listItemPaddingLeft: '--plasma-list-item-padding-left',\n listItemPaddingRight: '--plasma-list-item-padding-right',\n listItemPaddingTop: '--plasma-list-item-padding-top',\n listItemPaddingBottom: '--plasma-list-item-padding-bottom',\n listItemBorderColor: '--plasma-list-item-border-color',\n listItemBorderColorHover: '--plasma-list-item-border-color-hover',\n listItemBorderWidth: '--plasma-list-item-border-width',\n listItemIconLeftColor: '--plasma-list-item-color-icon-left',\n listItemIconRightColor: '--plasma-list-item-color-icon-right',\n listItemGap: '--plasma-list-item-gap',\n listItemTightDifference: '--plasma-list-item-tight-difference',\n\n listItemColor: '--plasma-list-item-color',\n listItemColorHover: '--plasma-list-item-color-hover',\n listItemFontFamily: '--plasma-list-item-font-family',\n listItemFontSize: '--plasma-list-item-font-size',\n listItemFontStyle: '--plasma-list-item-font-style',\n listItemFontWeight: '--plasma-list-item-font-weight',\n listItemLetterSpacing: '--plasma-list-item-letter-spacing',\n listItemLineHeight: '--plasma-list-item-line-height',\n\n listDisabledOpacity: '--plasma-list-disabled-opacity',\n};\n"],"names":["classes","listRoot","listItem","filledStretching","fixedStretching","tightListItem","disabledList","disabledListItem","tokens","listGap","listWidth","listItemBackground","listItemBackgroundHover","listItemBorderRadius","listItemPaddingLeft","listItemPaddingRight","listItemPaddingTop","listItemPaddingBottom","listItemBorderColor","listItemBorderColorHover","listItemBorderWidth","listItemIconLeftColor","listItemIconRightColor","listItemGap","listItemTightDifference","listItemColor","listItemColorHover","listItemFontFamily","listItemFontSize","listItemFontStyle","listItemFontWeight","listItemLetterSpacing","listItemLineHeight","listDisabledOpacity"],"mappings":"AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,QAAQ,EAAE,WAAW;AACrBC,EAAAA,QAAQ,EAAE,WAAW;AACrBC,EAAAA,gBAAgB,EAAE,wBAAwB;AAC1CC,EAAAA,eAAe,EAAE,uBAAuB;AACxCC,EAAAA,aAAa,EAAE,iBAAiB;AAChCC,EAAAA,YAAY,EAAE,oBAAoB;AAClCC,EAAAA,gBAAgB,EAAE,yBAAA;AACtB,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,OAAO,EAAE,mBAAmB;AAC5BC,EAAAA,SAAS,EAAE,qBAAqB;AAEhCC,EAAAA,kBAAkB,EAAE,+BAA+B;AACnDC,EAAAA,uBAAuB,EAAE,qCAAqC;AAC9DC,EAAAA,oBAAoB,EAAE,kCAAkC;AACxDC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,oBAAoB,EAAE,kCAAkC;AACxDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,qBAAqB,EAAE,mCAAmC;AAC1DC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,wBAAwB,EAAE,uCAAuC;AACjEC,EAAAA,mBAAmB,EAAE,iCAAiC;AACtDC,EAAAA,qBAAqB,EAAE,oCAAoC;AAC3DC,EAAAA,sBAAsB,EAAE,qCAAqC;AAC7DC,EAAAA,WAAW,EAAE,wBAAwB;AACrCC,EAAAA,uBAAuB,EAAE,qCAAqC;AAE9DC,EAAAA,aAAa,EAAE,0BAA0B;AACzCC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,gBAAgB,EAAE,8BAA8B;AAChDC,EAAAA,iBAAiB,EAAE,+BAA+B;AAClDC,EAAAA,kBAAkB,EAAE,gCAAgC;AACpDC,EAAAA,qBAAqB,EAAE,mCAAmC;AAC1DC,EAAAA,kBAAkB,EAAE,gCAAgC;AAEpDC,EAAAA,mBAAmB,EAAE,gCAAA;AACzB;;;;"}
|
@@ -0,0 +1,18 @@
|
|
1
|
+
.CellTextboxLabel_styles_1x97zqi_supiagz__b05150dd{color:var(--plasma-cell-label-color);font-size:var(--plasma-cell-label-font-size);font-weight:var(--plasma-cell-label-font-weight);font-family:var(--plasma-cell-label-font-family);font-style:var(--plasma-cell-label-font-style);line-height:var(--plasma-cell-label-line-height);-webkit-letter-spacing:var(--plasma-cell-label-letter-spacing);-moz-letter-spacing:var(--plasma-cell-label-letter-spacing);-ms-letter-spacing:var(--plasma-cell-label-letter-spacing);letter-spacing:var(--plasma-cell-label-letter-spacing);}
|
2
|
+
|
3
|
+
.CellTextboxTitle_styles_jogov7_s16psy9b__edbbb199{color:var(--plasma-cell-title-color);font-size:var(--plasma-cell-title-font-size);font-weight:var(--plasma-cell-title-font-weight);font-family:var(--plasma-cell-title-font-family);font-style:var(--plasma-cell-title-font-style);line-height:var(--plasma-cell-title-line-height);-webkit-letter-spacing:var(--plasma-cell-title-letter-spacing);-moz-letter-spacing:var(--plasma-cell-title-letter-spacing);-ms-letter-spacing:var(--plasma-cell-title-letter-spacing);letter-spacing:var(--plasma-cell-title-letter-spacing);}
|
4
|
+
|
5
|
+
.CellTextboxSubtitle_styles_n7i06q_s1bdz4u4__8e9f9a5a{color:var(--plasma-cell-subtitle-color);font-size:var(--plasma-cell-subtitle-font-size);font-weight:var(--plasma-cell-subtitle-font-weight);font-family:var(--plasma-cell-subtitle-font-family);font-style:var(--plasma-cell-subtitle-font-style);line-height:var(--plasma-cell-subtitle-line-height);-webkit-letter-spacing:var(--plasma-cell-subtitle-letter-spacing);-moz-letter-spacing:var(--plasma-cell-subtitle-letter-spacing);-ms-letter-spacing:var(--plasma-cell-subtitle-letter-spacing);letter-spacing:var(--plasma-cell-subtitle-letter-spacing);}
|
6
|
+
|
7
|
+
.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_cellStretchingFixed__a35afa10{width:var(--plasma-cell-width);}.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_cellStretchingFilled__a35afa10{width:100%;}.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_b1wikybr__a35afa10.Cell_styles_1lali49_cellStretchingAuto__a35afa10{width:auto;}
|
8
|
+
.Cell_styles_1lali49_c1e5qbb3__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:auto;-ms-flex:auto;flex:auto;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;gap:var(--plasma-cell-gap);height:auto;}
|
9
|
+
.Cell_styles_1lali49_cdgokyj__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:auto;}
|
10
|
+
.Cell_styles_1lali49_c1k87ec1__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:var(--c1k87ec1-0);-webkit-box-align:var(--c1k87ec1-0);-ms-flex-align:var(--c1k87ec1-0);align-items:var(--c1k87ec1-0);}
|
11
|
+
.Cell_styles_1lali49_c1spqh22__a35afa10{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:var(--c1spqh22-0);-webkit-box-align:var(--c1spqh22-0);-ms-flex-align:var(--c1spqh22-0);align-items:var(--c1spqh22-0);text-align:right;}
|
12
|
+
|
13
|
+
.base_pir0qf_b1sr9i7l__baa3f156{color:var(--plasma-cell-color);background-color:var(--plasma-cell-background-color);width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;gap:var(--plasma-cell-gap);}.base_pir0qf_b1sr9i7l__baa3f156:focus{outline:0 none;}
|
14
|
+
|
15
|
+
.CellTextbox_styles_rgpies_cz0uqdu__c842929b{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--plasma-cell-textbox-gap);}
|
16
|
+
|
17
|
+
.ListItem_styles_106alid_c15dpad4__4805eda5{--plasma-cell-width:100%;--plasma-cell-padding:0rem;--plasma-cell-padding-left-content:0rem;--plasma-cell-padding-content:0rem;--plasma-cell-padding-right-content:0rem;--plasma-cell-textbox-gap:0rem;--plasma-cell-gap:var(--plasma-list-item-gap);--plasma-cell-color:var(--plasma-list-item-color);--plasma-cell-background-color:transparent;}
|
18
|
+
.ListItem_styles_106alid_s17e6by7__4805eda5{padding:var(--plasma-list-item-padding-top) var(--plasma-list-item-padding-right) var(--plasma-list-item-padding-bottom) var(--plasma-list-item-padding-left);border-radius:var(--plasma-list-item-border-radius);background:var(--plasma-list-item-background);border:var(--plasma-list-item-border-width) solid var(--plasma-list-item-border-color);box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--plasma-list-item-color);font-size:var(--plasma-list-item-font-size);font-weight:var(--plasma-list-item-font-weight);font-family:var(--plasma-list-item-font-family);font-style:var(--plasma-list-item-font-style);line-height:var(--plasma-list-item-line-height);-webkit-letter-spacing:var(--plasma-list-item-letter-spacing);-moz-letter-spacing:var(--plasma-list-item-letter-spacing);-ms-letter-spacing:var(--plasma-list-item-letter-spacing);letter-spacing:var(--plasma-list-item-letter-spacing);}.ListItem_styles_106alid_s17e6by7__4805eda5:hover{background:var(--plasma-list-item-background-hover);border-color:var(--plasma-list-item-border-color-hover);color:var(--plasma-list-item-color-hover);}.ListItem_styles_106alid_s17e6by7__4805eda5.ListItem_styles_106alid_listItemDisabledItem__4805eda5{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
|
2
|
+
import React from 'react';
|
3
|
+
import { classes } from '../List.tokens.js';
|
4
|
+
import { StyledListItem, CellItem } from './ListItem.styles.js';
|
5
|
+
|
6
|
+
var _excluded = ["children", "contentRight", "disabled"];
|
7
|
+
var ListItem = function ListItem(_ref) {
|
8
|
+
var children = _ref.children,
|
9
|
+
contentRight = _ref.contentRight,
|
10
|
+
disabled = _ref.disabled,
|
11
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
12
|
+
return /*#__PURE__*/React.createElement(StyledListItem, _extends({
|
13
|
+
className: disabled ? classes.disabledListItem : ''
|
14
|
+
}, rest), /*#__PURE__*/React.createElement(CellItem, {
|
15
|
+
contentRight: contentRight
|
16
|
+
}, children));
|
17
|
+
};
|
18
|
+
|
19
|
+
export { ListItem };
|
20
|
+
//# sourceMappingURL=ListItem.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ListItem.js","sources":["../../../../src/components/List/ui/ListItem.tsx"],"sourcesContent":["import React, { HTMLAttributes } from 'react';\n\nimport { classes } from '../List.tokens';\n\nimport { StyledListItem, CellItem } from './ListItem.styles';\nimport { ListItemProps } from './ListItem.types';\n\nexport const ListItem: React.FC<HTMLAttributes<HTMLLIElement> & ListItemProps> = ({\n children,\n contentRight,\n disabled,\n ...rest\n}) => {\n return (\n <StyledListItem className={disabled ? classes.disabledListItem : ''} {...rest}>\n <CellItem contentRight={contentRight}>{children}</CellItem>\n </StyledListItem>\n );\n};\n"],"names":["ListItem","_ref","children","contentRight","disabled","rest","_objectWithoutProperties","_excluded","React","createElement","StyledListItem","_extends","className","classes","disabledListItem","CellItem"],"mappings":";;;;;;IAOaA,QAAiE,GAAG,SAApEA,QAAiEA,CAAAC,IAAA,EAKxE;AAAA,EAAA,IAJFC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,YAAY,GAAAF,IAAA,CAAZE,YAAY;IACZC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;AACLC,IAAAA,IAAI,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAEP,EAAA,oBACIC,KAAA,CAAAC,aAAA,CAACC,cAAc,EAAAC,QAAA,CAAA;AAACC,IAAAA,SAAS,EAAER,QAAQ,GAAGS,OAAO,CAACC,gBAAgB,GAAG,EAAA;AAAG,GAAA,EAAKT,IAAI,CACzEG,eAAAA,KAAA,CAAAC,aAAA,CAACM,QAAQ,EAAA;AAACZ,IAAAA,YAAY,EAAEA,YAAAA;GAAeD,EAAAA,QAAmB,CAC9C,CAAC,CAAA;AAEzB;;;;"}
|
@@ -0,0 +1,23 @@
|
|
1
|
+
import './ListItem.styles_106alid.css';
|
2
|
+
import { styled } from '@linaria/react';
|
3
|
+
import { component, mergeConfig } from '../../../engines/common.js';
|
4
|
+
import { cellConfig } from '../../Cell/Cell.js';
|
5
|
+
|
6
|
+
var mergedCellConfig = /*#__PURE__*/mergeConfig(cellConfig);
|
7
|
+
var Cell = /*#__PURE__*/component(mergedCellConfig);
|
8
|
+
var _exp = function _exp() {
|
9
|
+
return Cell;
|
10
|
+
};
|
11
|
+
var CellItem = /*#__PURE__*/styled(_exp())({
|
12
|
+
name: "CellItem",
|
13
|
+
"class": "c15dpad4",
|
14
|
+
propsAsIs: true
|
15
|
+
});
|
16
|
+
var StyledListItem = /*#__PURE__*/styled('li')({
|
17
|
+
name: "StyledListItem",
|
18
|
+
"class": "s17e6by7",
|
19
|
+
propsAsIs: false
|
20
|
+
});
|
21
|
+
|
22
|
+
export { CellItem, StyledListItem };
|
23
|
+
//# sourceMappingURL=ListItem.styles.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"ListItem.styles.js","sources":["../../../../src/components/List/ui/ListItem.styles.tsx"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { tokens, classes } from '../List.tokens';\nimport { cellConfig, cellTokens } from '../../Cell';\nimport { component, mergeConfig } from '../../../engines';\n\nconst mergedCellConfig = mergeConfig(cellConfig);\nconst Cell = component(mergedCellConfig);\n\nexport const CellItem = styled(Cell)`\n ${cellTokens.cellWidth}: 100%;\n\n ${cellTokens.cellPadding}: 0rem;\n ${cellTokens.cellPaddingLeftContent}: 0rem;\n ${cellTokens.cellPaddingContent}: 0rem;\n ${cellTokens.cellPaddingRightContent}: 0rem;\n\n ${cellTokens.cellTextboxGap}: 0rem;\n ${cellTokens.cellGap}: var(${tokens.listItemGap});\n ${cellTokens.cellColor}: var(${tokens.listItemColor});\n ${cellTokens.cellBackgroundColor}: transparent;\n`;\n\nexport const StyledListItem = styled.li`\n padding: var(${tokens.listItemPaddingTop}) var(${tokens.listItemPaddingRight}) var(${tokens.listItemPaddingBottom})\n var(${tokens.listItemPaddingLeft});\n border-radius: var(${tokens.listItemBorderRadius});\n background: var(${tokens.listItemBackground});\n border: var(${tokens.listItemBorderWidth}) solid var(${tokens.listItemBorderColor});\n\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n color: var(${tokens.listItemColor});\n font-size: var(${tokens.listItemFontSize});\n font-weight: var(${tokens.listItemFontWeight});\n font-family: var(${tokens.listItemFontFamily});\n font-style: var(${tokens.listItemFontStyle});\n line-height: var(${tokens.listItemLineHeight});\n letter-spacing: var(${tokens.listItemLetterSpacing});\n\n &:hover {\n background: var(${tokens.listItemBackgroundHover});\n border-color: var(${tokens.listItemBorderColorHover});\n color: var(${tokens.listItemColorHover});\n }\n\n &.${classes.disabledListItem} {\n cursor: not-allowed;\n opacity: var(${tokens.listDisabledOpacity});\n }\n`;\n"],"names":["mergedCellConfig","mergeConfig","cellConfig","Cell","component","_exp","CellItem","styled","name","class","propsAsIs","StyledListItem"],"mappings":";;;;AAMA,IAAMA,gBAAgB,gBAAGC,WAAW,CAACC,UAAU,CAAC,CAAA;AAChD,IAAMC,IAAI,gBAAGC,SAAS,CAACJ,gBAAgB,CAAC,CAAA;AAAC,IAAAK,IAAA,GANvBA,SAMuBA,IAAAA,GAAA;AAAA,EAAA,OAEVF,IAAI,CAAA;AAAA,CAAA,CAAA;AAA5B,IAAMG,QAAQ,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,UAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAY7B,EAAA;AAEM,IAAMC,cAAc,gBAAGJ,MAAM,CAAA,IAAA,CAAA,CAAA;AAAAC,EAAAA,IAAA,EAAA,gBAAA;AAAAC,EAAAA,OAAAA,EAAA,UAAA;AAAAC,EAAAA,SAAA,EAAA,KAAA;AAAA,CA8BnC;;;;"}
|
@@ -0,0 +1,2 @@
|
|
1
|
+
.c15dpad4{--plasma-cell-width:100%;--plasma-cell-padding:0rem;--plasma-cell-padding-left-content:0rem;--plasma-cell-padding-content:0rem;--plasma-cell-padding-right-content:0rem;--plasma-cell-textbox-gap:0rem;--plasma-cell-gap:var(--plasma-list-item-gap);--plasma-cell-color:var(--plasma-list-item-color);--plasma-cell-background-color:transparent;}
|
2
|
+
.s17e6by7{padding:var(--plasma-list-item-padding-top) var(--plasma-list-item-padding-right) var(--plasma-list-item-padding-bottom) var(--plasma-list-item-padding-left);border-radius:var(--plasma-list-item-border-radius);background:var(--plasma-list-item-background);border:var(--plasma-list-item-border-width) solid var(--plasma-list-item-border-color);box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--plasma-list-item-color);font-size:var(--plasma-list-item-font-size);font-weight:var(--plasma-list-item-font-weight);font-family:var(--plasma-list-item-font-family);font-style:var(--plasma-list-item-font-style);line-height:var(--plasma-list-item-line-height);-webkit-letter-spacing:var(--plasma-list-item-letter-spacing);-moz-letter-spacing:var(--plasma-list-item-letter-spacing);-ms-letter-spacing:var(--plasma-list-item-letter-spacing);letter-spacing:var(--plasma-list-item-letter-spacing);}.s17e6by7:hover{background:var(--plasma-list-item-background-hover);border-color:var(--plasma-list-item-border-color-hover);color:var(--plasma-list-item-color-hover);}.s17e6by7.list-item-disabled-item{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_disabled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../List.tokens';\nimport { StyledListItem } from '../../ui/ListItem.styles';\n\nexport const base = css`\n &.${classes.disabledList} {\n ${StyledListItem} {\n cursor: not-allowed;\n opacity: var(${tokens.listDisabledOpacity});\n }\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAOhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1ybuwod.list-item-disabled .s17e6by7{cursor:not-allowed;opacity:var(--plasma-list-disabled-opacity);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_size/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../List.tokens';\n\nexport const base = css`\n gap: var(${tokens.listGap});\n`;\n"],"names":["base"],"mappings":"AAIO,IAAMA,IAAI,GAEhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1vinxbx{gap:var(--plasma-list-gap);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/List/variations/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../List.tokens';\nimport { StyledListItem } from '../../ui/ListItem.styles';\n\nexport const base = css`\n &.${classes.tightListItem} {\n ${StyledListItem} {\n padding: calc(var(${tokens.listItemPaddingTop}) - var(${tokens.listItemTightDifference}))\n var(${tokens.listItemPaddingRight})\n calc(var(${tokens.listItemPaddingBottom}) - var(${tokens.listItemTightDifference}))\n var(${tokens.listItemPaddingLeft});\n }\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAShB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.bpv2gh8.list-item-tight .s17e6by7{padding:calc(var(--plasma-list-item-padding-top) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-right) calc(var(--plasma-list-item-padding-bottom) - var(--plasma-list-item-tight-difference)) var(--plasma-list-item-padding-left);}
|
@@ -1,6 +1,6 @@
|
|
1
1
|
.IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
|
2
2
|
|
3
|
-
.
|
3
|
+
.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea{padding:var(--plasma-notification-padding);}.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea.base_1g9g70c_notificationLayoutHorizontal__c76a6dea{padding:var(--plasma-notification-horizontal-layout-padding);}.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea.base_1g9g70c_notificationLayoutHorizontal__c76a6dea.base_1g9g70c_notificationWithoutCloseIcon__c76a6dea{padding-right:var(--plasma-notification-horizontal-layout-right-padding-without-close-icon);}.base_1g9g70c_bg3tssa__c76a6dea .base_1g9g70c_notificationWrapper__c76a6dea.base_1g9g70c_notificationLayoutHorizontal__c76a6dea.base_1g9g70c_notificationOneLineTextbox__c76a6dea{padding:var(--plasma-notification-padding-one-line-textbox);}
|
4
4
|
|
5
5
|
.base_1insfd_bmb6i7f__cb9a5237 .base_1insfd_notificationContentBox__cb9a5237.base_1insfd_notificationLayoutVertical__cb9a5237{padding:var(--plasma-notification-content-padding-top) var(--plasma-notification-content-padding-right) var(--plasma-notification-content-padding-bottom) var(--plasma-notification-content-padding-left);}.base_1insfd_bmb6i7f__cb9a5237 .base_1insfd_notificationContentBox__cb9a5237.base_1insfd_notificationLayoutVertical__cb9a5237.base_1insfd_notificationWithoutIcon__cb9a5237{padding-top:var(--plasma-notification-content-padding-top-without-icon);}.base_1insfd_bmb6i7f__cb9a5237 .base_1insfd_notificationCloseIcon__cb9a5237.base_1insfd_notificationLayoutVertical__cb9a5237{top:var(--plasma-notification-close-icon-top);right:var(--plasma-notification-close-icon-right);}
|
6
6
|
|
@@ -30,14 +30,14 @@
|
|
30
30
|
.Button_styles_8cvmld_s1rjh7ra__4694a0fa{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-self:var(--plasma-button-right-content-align-self);-ms-flex-item-align:var(--plasma-button-right-content-align);align-self:var(--plasma-button-right-content-align-self);margin:var(--s1rjh7ra-0);}
|
31
31
|
.Button_styles_8cvmld_b9ga1dj__4694a0fa{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);--plasma_private-btn-br:var(--plasma_computed-btn-br);border-radius:var(--plasma_private-btn-br);}a.Button_styles_8cvmld_b9ga1dj__4694a0fa{-webkit-text-decoration:none;text-decoration:none;}.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_b9ga1dj__4694a0fa.Button_styles_8cvmld_buttonSquare__4694a0fa{width:var(--plasma-button-height);padding:0;}
|
32
32
|
|
33
|
-
.
|
34
|
-
.
|
35
|
-
.
|
36
|
-
.
|
37
|
-
.
|
38
|
-
.
|
39
|
-
.
|
40
|
-
.
|
41
|
-
.
|
42
|
-
.
|
43
|
-
.
|
33
|
+
.Notification_styles_1uyb7ob_sb12p__65d2ebe5{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
|
34
|
+
.Notification_styles_1uyb7ob_crvd7hm__65d2ebe5{position:absolute;width:var(--plasma-notification-close-icon-button-size);height:var(--plasma-notification-close-icon-button-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-close-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-close-align);align-self:var(--plasma-notification-horizontal-icon-close-align-self);color:var(--plasma-notification-close-icon-color);}.Notification_styles_1uyb7ob_crvd7hm__65d2ebe5:hover{color:var(--plasma-notification-close-icon-color-on-hover);}.Notification_styles_1uyb7ob_crvd7hm__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{position:relative;}
|
35
|
+
.Notification_styles_1uyb7ob_wg1ga5v__65d2ebe5{position:relative;width:var(--wg1ga5v-0);max-width:var(--wg1ga5v-1);border-radius:var(--plasma-notification-border-radius);border:var(--plasma-notification-border-width) solid var(--plasma-notification-border-color);background:var(--wg1ga5v-2);box-sizing:border-box;}.Notification_styles_1uyb7ob_wg1ga5v__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-notification-horizontal-layout-gap);}
|
36
|
+
.Notification_styles_1uyb7ob_b1amsn8a__65d2ebe5{margin-top:var(--plasma-notification-buttons-margin-top);margin-left:var(--b1amsn8a-0);-webkit-align-self:var(--plasma-notification-horizontal-actions-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-actions-align);align-self:var(--plasma-notification-horizontal-actions-align-self);}.Notification_styles_1uyb7ob_b1amsn8a__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{margin-top:unset;margin-left:unset;}
|
37
|
+
.Notification_styles_1uyb7ob_i14raqr9__65d2ebe5{width:var(--plasma-notification-content-left-icon-size);height:var(--plasma-notification-content-left-icon-size);-webkit-align-self:var(--plasma-notification-horizontal-icon-left-align-self);-ms-flex-item-align:var(--plasma-notification-horizontal-icon-left-align);align-self:var(--plasma-notification-horizontal-icon-left-align-self);color:var(--i14raqr9-0);margin-right:var(--i14raqr9-1);margin-bottom:var(--i14raqr9-2);}.Notification_styles_1uyb7ob_i14raqr9__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{margin-right:var(--plasma-notification-horizontal-layout-left-icon-margin);margin-bottom:unset;}
|
38
|
+
.Notification_styles_1uyb7ob_c157peez__65d2ebe5{display:var(--c157peez-0);padding-top:var(--c157peez-1);}.Notification_styles_1uyb7ob_c157peez__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{padding:unset;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
|
39
|
+
.Notification_styles_1uyb7ob_t1vmb0f2__65d2ebe5{padding:var(--plasma-notification-textbox-padding-top) var(--plasma-notification-textbox-padding-right) var(--plasma-notification-textbox-padding-bottom) var(--plasma-notification-textbox-padding-left);padding-top:var(--t1vmb0f2-0);padding-right:var(--t1vmb0f2-1);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:var(--plasma-notification-textbox-gap);word-break:break-word;}.Notification_styles_1uyb7ob_t1vmb0f2__65d2ebe5.Notification_styles_1uyb7ob_notificationLayoutHorizontal__65d2ebe5{padding:unset;}
|
40
|
+
.Notification_styles_1uyb7ob_s1k4e58v__65d2ebe5{font-family:var(--plasma-notification-title-font-family);font-size:var(--plasma-notification-title-font-size);font-style:var(--plasma-notification-title-font-style);font-weight:var(--plasma-notification-title-font-weight);-webkit-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-title-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-title-font-letter-spacing);letter-spacing:var(--plasma-notification-title-font-letter-spacing);line-height:var(--plasma-notification-title-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s1k4e58v-0);}
|
41
|
+
.Notification_styles_1uyb7ob_s92kmpm__65d2ebe5{font-family:var(--plasma-notification-content-font-family);font-size:var(--plasma-notification-content-font-size);font-style:var(--plasma-notification-content-font-style);font-weight:var(--plasma-notification-content-font-weight);-webkit-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-moz-letter-spacing:var(--plasma-notification-content-font-letter-spacing);-ms-letter-spacing:var(--plasma-notification-content-font-letter-spacing);letter-spacing:var(--plasma-notification-content-font-letter-spacing);line-height:var(--plasma-notification-content-font-line-height);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;color:var(--s92kmpm-0);}
|
42
|
+
.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5{margin-top:1rem;opacity:1;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5.Notification_styles_1uyb7ob_notificationLeftToRightAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5.Notification_styles_1uyb7ob_notificationTopToCenterAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemOpened__65d2ebe5.Notification_styles_1uyb7ob_notificationBottomToCenterAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemHidden__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5 ease-out;}.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_s18m0x6v__65d2ebe5.Notification_styles_1uyb7ob_notificationItemHidden__65d2ebe5.Notification_styles_1uyb7ob_notificationLeftToRightAnimation__65d2ebe5{-webkit-animation:0.4s Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;animation:0.4s Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5 ease-out;}@-webkit-keyframes Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showTopToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showBottomToCenterAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);opacity:0;}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}}@keyframes Notification_styles_1uyb7ob_hideLeftToRightAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);opacity:0;}}@-webkit-keyframes Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@keyframes Notification_styles_1uyb7ob_showAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}}@-webkit-keyframes Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}@keyframes Notification_styles_1uyb7ob_hideAnimationS18m0x6v__65d2ebe5{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1;}100%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);opacity:0;}}
|
43
|
+
.Notification_styles_1uyb7ob_sfe5ql2__65d2ebe5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;box-sizing:border-box;padding:0 1.5rem 1.5rem;max-height:100%;-webkit-align-items:var(--sfe5ql2-0);-webkit-box-align:var(--sfe5ql2-0);-ms-flex-align:var(--sfe5ql2-0);align-items:var(--sfe5ql2-0);}
|
@@ -12,7 +12,7 @@ import { layouts } from './Notification.types.js';
|
|
12
12
|
import { Wrapper, ContentBox, IconWrapper, TextBox, StyledTitle, StyledContent, ButtonsWrapper, CloseIconWrapper, StyledNotification } from './Notification.styles.js';
|
13
13
|
import { getLayoutClass } from './utils/index.js';
|
14
14
|
|
15
|
-
var _excluded = ["role", "title", "children", "actions", "view", "size", "iconPlacement", "showCloseIcon", "layout", "icon", "closeIconType", "textColor", "titleColor", "backgroundColor", "onCloseButtonClick"];
|
15
|
+
var _excluded = ["role", "title", "children", "actions", "view", "size", "iconPlacement", "showCloseIcon", "layout", "icon", "closeIconType", "textColor", "titleColor", "backgroundColor", "width", "maxWidth", "onCloseButtonClick"];
|
16
16
|
|
17
17
|
/**
|
18
18
|
* Компонент для небольших уведомлений пользователя
|
@@ -36,6 +36,8 @@ var notificationRoot = function notificationRoot(Root) {
|
|
36
36
|
textColor = props.textColor,
|
37
37
|
titleColor = props.titleColor,
|
38
38
|
backgroundColor = props.backgroundColor,
|
39
|
+
width = props.width,
|
40
|
+
maxWidth = props.maxWidth,
|
39
41
|
onCloseButtonClick = props.onCloseButtonClick,
|
40
42
|
rest = _objectWithoutProperties(props, _excluded);
|
41
43
|
var ariaLive = 'polite';
|
@@ -63,6 +65,8 @@ var notificationRoot = function notificationRoot(Root) {
|
|
63
65
|
"aria-atomic": ariaAtomic
|
64
66
|
}, rest), /*#__PURE__*/React.createElement(Wrapper, {
|
65
67
|
backgroundColor: backgroundColor,
|
68
|
+
width: width,
|
69
|
+
maxWidth: maxWidth,
|
66
70
|
className: cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)
|
67
71
|
}, /*#__PURE__*/React.createElement(ContentBox, {
|
68
72
|
iconPlacement: IconPlacementInternal,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Notification.js","sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { RootProps } from '../../engines';\nimport { cx } from '../../utils';\nimport { IconCross } from '../_Icon/Icons/IconCross';\nimport { IconCrossThin } from '../_Icon/Icons/IconCrossThin';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as layoutCSS } from './variations/_layout/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as closeIconTypeCSS } from './variations/_closeIconType/base';\nimport { NotificationLayout, NotificationProps, layouts } from './Notification.types';\nimport {\n ButtonsWrapper,\n CloseIconWrapper,\n ContentBox,\n IconWrapper,\n StyledContent,\n StyledNotification,\n StyledTitle,\n TextBox,\n Wrapper,\n} from './Notification.styles';\nimport { getLayoutClass } from './utils';\n\n/**\n * Компонент для небольших уведомлений пользователя\n */\nexport const notificationRoot = (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) =>\n forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {\n const {\n role = 'status',\n title,\n children: content,\n actions,\n view,\n size,\n iconPlacement,\n showCloseIcon = true,\n layout = layouts.vertical as NotificationLayout,\n icon,\n closeIconType,\n textColor,\n titleColor,\n backgroundColor,\n onCloseButtonClick,\n ...rest\n } = props;\n\n let ariaLive: 'assertive' | 'polite' = 'polite';\n let ariaAtomic = false;\n\n if (role === 'alert') {\n ariaLive = 'assertive';\n } else if (role === 'status') {\n ariaAtomic = true;\n }\n\n const isOneLine = !content || !title;\n const oneLineClass = isOneLine ? classes.oneLine : undefined;\n const withoutIconClass = icon ? undefined : classes.withoutIcon;\n const withoutCloseIconClass = showCloseIcon ? undefined : classes.withoutCloseIcon;\n\n const IconPlacementInternal = useMemo(() => (icon ? iconPlacement : undefined), [icon, iconPlacement]);\n\n return (\n <Root\n view={view}\n size={size}\n layout={layout}\n closeIconType={closeIconType}\n ref={ref}\n role={role}\n aria-live={ariaLive}\n aria-atomic={ariaAtomic}\n {...rest}\n >\n <Wrapper\n backgroundColor={backgroundColor}\n className={cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)}\n >\n <ContentBox\n iconPlacement={IconPlacementInternal}\n className={cx(classes.contentBox, getLayoutClass(layout), withoutIconClass)}\n >\n {icon && (\n <IconWrapper\n iconPlacement={IconPlacementInternal}\n className={cx(classes.icon, getLayoutClass(layout))}\n >\n {icon}\n </IconWrapper>\n )}\n <TextBox\n iconPlacement={IconPlacementInternal}\n showCloseIcon={showCloseIcon}\n className={cx(classes.textbox, getLayoutClass(layout))}\n >\n {title && (\n <StyledTitle className={classes.title} textColor={titleColor}>\n {title}\n </StyledTitle>\n )}\n {content && (\n <StyledContent className={classes.text} textColor={textColor}>\n {content}\n </StyledContent>\n )}\n </TextBox>\n </ContentBox>\n {actions && (\n <ButtonsWrapper\n iconPlacement={IconPlacementInternal}\n className={cx(classes.buttonsWrapper, getLayoutClass(layout))}\n >\n {actions}\n </ButtonsWrapper>\n )}\n\n {showCloseIcon && (\n <CloseIconWrapper\n view=\"clear\"\n size=\"s\"\n onClick={onCloseButtonClick}\n className={cx(classes.closeIcon, getLayoutClass(layout))}\n >\n {closeIconType === 'default' ? (\n <IconCross size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n ) : (\n <IconCrossThin size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n )}\n </CloseIconWrapper>\n )}\n </Wrapper>\n </Root>\n );\n });\n\nexport const notificationConfig = {\n name: 'Notification',\n tag: 'div',\n layout: notificationRoot,\n base: StyledNotification,\n variations: {\n layout: {\n css: layoutCSS,\n },\n view: {\n css: viewCSS,\n },\n size: {\n css: sizeCSS,\n },\n closeIconType: {\n css: closeIconTypeCSS,\n },\n },\n defaults: {\n view: 'default',\n layout: layouts.vertical,\n size: 'xs',\n closeIconType: 'default',\n },\n};\n"],"names":["notificationRoot","Root","forwardRef","props","ref","_props$role","role","title","content","children","actions","view","size","iconPlacement","_props$showCloseIcon","showCloseIcon","_props$layout","layout","layouts","vertical","icon","closeIconType","textColor","titleColor","backgroundColor","onCloseButtonClick","rest","_objectWithoutProperties","_excluded","ariaLive","ariaAtomic","isOneLine","oneLineClass","classes","oneLine","undefined","withoutIconClass","withoutIcon","withoutCloseIconClass","withoutCloseIcon","IconPlacementInternal","useMemo","React","createElement","_extends","Wrapper","className","cx","wrapper","getLayoutClass","ContentBox","contentBox","IconWrapper","TextBox","textbox","StyledTitle","StyledContent","text","ButtonsWrapper","buttonsWrapper","CloseIconWrapper","onClick","closeIcon","IconCross","sizeCustomProperty","tokens","closeIconSize","color","IconCrossThin","notificationConfig","name","tag","base","StyledNotification","variations","css","layoutCSS","viewCSS","sizeCSS","closeIconTypeCSS","defaults"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Notification.js","sources":["../../../src/components/Notification/Notification.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { RootProps } from '../../engines';\nimport { cx } from '../../utils';\nimport { IconCross } from '../_Icon/Icons/IconCross';\nimport { IconCrossThin } from '../_Icon/Icons/IconCrossThin';\n\nimport { classes, tokens } from './Notification.tokens';\nimport { base as viewCSS } from './variations/_view/base';\nimport { base as layoutCSS } from './variations/_layout/base';\nimport { base as sizeCSS } from './variations/_size/base';\nimport { base as closeIconTypeCSS } from './variations/_closeIconType/base';\nimport { NotificationLayout, NotificationProps, layouts } from './Notification.types';\nimport {\n ButtonsWrapper,\n CloseIconWrapper,\n ContentBox,\n IconWrapper,\n StyledContent,\n StyledNotification,\n StyledTitle,\n TextBox,\n Wrapper,\n} from './Notification.styles';\nimport { getLayoutClass } from './utils';\n\n/**\n * Компонент для небольших уведомлений пользователя\n */\nexport const notificationRoot = (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) =>\n forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {\n const {\n role = 'status',\n title,\n children: content,\n actions,\n view,\n size,\n iconPlacement,\n showCloseIcon = true,\n layout = layouts.vertical as NotificationLayout,\n icon,\n closeIconType,\n textColor,\n titleColor,\n backgroundColor,\n width,\n maxWidth,\n onCloseButtonClick,\n ...rest\n } = props;\n\n let ariaLive: 'assertive' | 'polite' = 'polite';\n let ariaAtomic = false;\n\n if (role === 'alert') {\n ariaLive = 'assertive';\n } else if (role === 'status') {\n ariaAtomic = true;\n }\n\n const isOneLine = !content || !title;\n const oneLineClass = isOneLine ? classes.oneLine : undefined;\n const withoutIconClass = icon ? undefined : classes.withoutIcon;\n const withoutCloseIconClass = showCloseIcon ? undefined : classes.withoutCloseIcon;\n\n const IconPlacementInternal = useMemo(() => (icon ? iconPlacement : undefined), [icon, iconPlacement]);\n\n return (\n <Root\n view={view}\n size={size}\n layout={layout}\n closeIconType={closeIconType}\n ref={ref}\n role={role}\n aria-live={ariaLive}\n aria-atomic={ariaAtomic}\n {...rest}\n >\n <Wrapper\n backgroundColor={backgroundColor}\n width={width}\n maxWidth={maxWidth}\n className={cx(classes.wrapper, getLayoutClass(layout), oneLineClass, withoutCloseIconClass)}\n >\n <ContentBox\n iconPlacement={IconPlacementInternal}\n className={cx(classes.contentBox, getLayoutClass(layout), withoutIconClass)}\n >\n {icon && (\n <IconWrapper\n iconPlacement={IconPlacementInternal}\n className={cx(classes.icon, getLayoutClass(layout))}\n >\n {icon}\n </IconWrapper>\n )}\n <TextBox\n iconPlacement={IconPlacementInternal}\n showCloseIcon={showCloseIcon}\n className={cx(classes.textbox, getLayoutClass(layout))}\n >\n {title && (\n <StyledTitle className={classes.title} textColor={titleColor}>\n {title}\n </StyledTitle>\n )}\n {content && (\n <StyledContent className={classes.text} textColor={textColor}>\n {content}\n </StyledContent>\n )}\n </TextBox>\n </ContentBox>\n {actions && (\n <ButtonsWrapper\n iconPlacement={IconPlacementInternal}\n className={cx(classes.buttonsWrapper, getLayoutClass(layout))}\n >\n {actions}\n </ButtonsWrapper>\n )}\n\n {showCloseIcon && (\n <CloseIconWrapper\n view=\"clear\"\n size=\"s\"\n onClick={onCloseButtonClick}\n className={cx(classes.closeIcon, getLayoutClass(layout))}\n >\n {closeIconType === 'default' ? (\n <IconCross size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n ) : (\n <IconCrossThin size=\"s\" sizeCustomProperty={tokens.closeIconSize} color=\"inherit\" />\n )}\n </CloseIconWrapper>\n )}\n </Wrapper>\n </Root>\n );\n });\n\nexport const notificationConfig = {\n name: 'Notification',\n tag: 'div',\n layout: notificationRoot,\n base: StyledNotification,\n variations: {\n layout: {\n css: layoutCSS,\n },\n view: {\n css: viewCSS,\n },\n size: {\n css: sizeCSS,\n },\n closeIconType: {\n css: closeIconTypeCSS,\n },\n },\n defaults: {\n view: 'default',\n layout: layouts.vertical,\n size: 'xs',\n closeIconType: 'default',\n },\n};\n"],"names":["notificationRoot","Root","forwardRef","props","ref","_props$role","role","title","content","children","actions","view","size","iconPlacement","_props$showCloseIcon","showCloseIcon","_props$layout","layout","layouts","vertical","icon","closeIconType","textColor","titleColor","backgroundColor","width","maxWidth","onCloseButtonClick","rest","_objectWithoutProperties","_excluded","ariaLive","ariaAtomic","isOneLine","oneLineClass","classes","oneLine","undefined","withoutIconClass","withoutIcon","withoutCloseIconClass","withoutCloseIcon","IconPlacementInternal","useMemo","React","createElement","_extends","Wrapper","className","cx","wrapper","getLayoutClass","ContentBox","contentBox","IconWrapper","TextBox","textbox","StyledTitle","StyledContent","text","ButtonsWrapper","buttonsWrapper","CloseIconWrapper","onClick","closeIcon","IconCross","sizeCustomProperty","tokens","closeIconSize","color","IconCrossThin","notificationConfig","name","tag","base","StyledNotification","variations","css","layoutCSS","viewCSS","sizeCSS","closeIconTypeCSS","defaults"],"mappings":"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"}
|