@salutejs/plasma-new-hope 0.176.1-canary.1517.11571952534.0 → 0.177.0-canary.1503.11571511639.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (149) hide show
  1. package/cjs/components/Notification/Notification.css +11 -11
  2. package/cjs/components/Notification/Notification.js +2 -2
  3. package/cjs/components/Notification/Notification.js.map +1 -1
  4. package/cjs/components/Notification/Notification.styles.js +11 -2
  5. package/cjs/components/Notification/Notification.styles.js.map +1 -1
  6. package/cjs/components/Notification/{Notification.styles_7h8hp0.css → Notification.styles_e6274r.css} +2 -2
  7. package/cjs/components/Notification/Notification.tokens.js +2 -1
  8. package/cjs/components/Notification/Notification.tokens.js.map +1 -1
  9. package/cjs/components/Notification/Notification.types.js.map +1 -1
  10. package/cjs/components/Notification/NotificationsPortal.js +8 -4
  11. package/cjs/components/Notification/NotificationsPortal.js.map +1 -1
  12. package/cjs/components/Notification/NotificationsProvider.css +11 -11
  13. package/cjs/components/Notification/NotificationsProvider.js +3 -1
  14. package/cjs/components/Notification/NotificationsProvider.js.map +1 -1
  15. package/cjs/components/Steps/Steps.css +9 -9
  16. package/cjs/components/Steps/Steps.tokens.js +0 -1
  17. package/cjs/components/Steps/Steps.tokens.js.map +1 -1
  18. package/cjs/components/Steps/ui/StepItem/StepItem.css +9 -9
  19. package/cjs/components/Steps/ui/StepItem/StepItem.js +7 -29
  20. package/cjs/components/Steps/ui/StepItem/StepItem.js.map +1 -1
  21. package/cjs/components/Steps/ui/StepItem/StepItem.styles.js +6 -6
  22. package/cjs/components/Steps/ui/StepItem/StepItem.styles.js.map +1 -1
  23. package/cjs/components/Steps/ui/StepItem/StepItem.styles_sp9rcd.css +9 -0
  24. package/cjs/index.css +20 -20
  25. package/cjs/index.js +1 -1
  26. package/emotion/cjs/components/Notification/Notification.js +2 -2
  27. package/emotion/cjs/components/Notification/Notification.styles.js +14 -19
  28. package/emotion/cjs/components/Notification/Notification.template-doc.mdx +17 -8
  29. package/emotion/cjs/components/Notification/Notification.tokens.js +2 -1
  30. package/emotion/cjs/components/Notification/NotificationsPortal.js +9 -5
  31. package/emotion/cjs/components/Notification/NotificationsProvider.js +3 -1
  32. package/emotion/cjs/components/Notification/index.js +4 -4
  33. package/emotion/cjs/components/Steps/Steps.tokens.js +0 -1
  34. package/emotion/cjs/components/Steps/ui/StepItem/StepItem.js +7 -29
  35. package/emotion/cjs/components/Steps/ui/StepItem/StepItem.styles.js +11 -17
  36. package/emotion/cjs/examples/plasma_b2c/components/Notification/Notification.js +5 -3
  37. package/emotion/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  38. package/emotion/cjs/examples/plasma_b2c/components/Steps/Steps.config.js +5 -5
  39. package/emotion/cjs/examples/plasma_b2c/components/Steps/Steps.stories.tsx +1 -1
  40. package/emotion/cjs/examples/plasma_web/components/Notification/Notification.js +5 -3
  41. package/emotion/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  42. package/emotion/cjs/examples/plasma_web/components/Steps/Steps.config.js +5 -5
  43. package/emotion/cjs/examples/plasma_web/components/Steps/Steps.stories.tsx +1 -1
  44. package/emotion/es/components/Notification/Notification.js +1 -1
  45. package/emotion/es/components/Notification/Notification.styles.js +14 -19
  46. package/emotion/es/components/Notification/Notification.template-doc.mdx +17 -8
  47. package/emotion/es/components/Notification/Notification.tokens.js +2 -1
  48. package/emotion/es/components/Notification/NotificationsPortal.js +9 -5
  49. package/emotion/es/components/Notification/NotificationsProvider.js +3 -1
  50. package/emotion/es/components/Notification/index.js +1 -1
  51. package/emotion/es/components/Steps/Steps.tokens.js +0 -1
  52. package/emotion/es/components/Steps/ui/StepItem/StepItem.js +7 -29
  53. package/emotion/es/components/Steps/ui/StepItem/StepItem.styles.js +11 -17
  54. package/emotion/es/examples/plasma_b2c/components/Notification/Notification.js +6 -4
  55. package/emotion/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  56. package/emotion/es/examples/plasma_b2c/components/Steps/Steps.config.js +5 -5
  57. package/emotion/es/examples/plasma_b2c/components/Steps/Steps.stories.tsx +1 -1
  58. package/emotion/es/examples/plasma_web/components/Notification/Notification.js +6 -4
  59. package/emotion/es/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  60. package/emotion/es/examples/plasma_web/components/Steps/Steps.config.js +5 -5
  61. package/emotion/es/examples/plasma_web/components/Steps/Steps.stories.tsx +1 -1
  62. package/es/components/Notification/Notification.css +11 -11
  63. package/es/components/Notification/Notification.js +2 -2
  64. package/es/components/Notification/Notification.js.map +1 -1
  65. package/es/components/Notification/Notification.styles.js +11 -2
  66. package/es/components/Notification/Notification.styles.js.map +1 -1
  67. package/es/components/Notification/{Notification.styles_7h8hp0.css → Notification.styles_e6274r.css} +2 -2
  68. package/es/components/Notification/Notification.tokens.js +2 -1
  69. package/es/components/Notification/Notification.tokens.js.map +1 -1
  70. package/es/components/Notification/Notification.types.js.map +1 -1
  71. package/es/components/Notification/NotificationsPortal.js +8 -4
  72. package/es/components/Notification/NotificationsPortal.js.map +1 -1
  73. package/es/components/Notification/NotificationsProvider.css +11 -11
  74. package/es/components/Notification/NotificationsProvider.js +3 -1
  75. package/es/components/Notification/NotificationsProvider.js.map +1 -1
  76. package/es/components/Steps/Steps.css +9 -9
  77. package/es/components/Steps/Steps.tokens.js +0 -1
  78. package/es/components/Steps/Steps.tokens.js.map +1 -1
  79. package/es/components/Steps/ui/StepItem/StepItem.css +9 -9
  80. package/es/components/Steps/ui/StepItem/StepItem.js +8 -30
  81. package/es/components/Steps/ui/StepItem/StepItem.js.map +1 -1
  82. package/es/components/Steps/ui/StepItem/StepItem.styles.js +6 -6
  83. package/es/components/Steps/ui/StepItem/StepItem.styles.js.map +1 -1
  84. package/es/components/Steps/ui/StepItem/StepItem.styles_sp9rcd.css +9 -0
  85. package/es/index.css +20 -20
  86. package/es/index.js +1 -1
  87. package/package.json +2 -2
  88. package/styled-components/cjs/components/Notification/Notification.js +2 -2
  89. package/styled-components/cjs/components/Notification/Notification.styles.js +5 -2
  90. package/styled-components/cjs/components/Notification/Notification.template-doc.mdx +17 -8
  91. package/styled-components/cjs/components/Notification/Notification.tokens.js +2 -1
  92. package/styled-components/cjs/components/Notification/NotificationsPortal.js +8 -4
  93. package/styled-components/cjs/components/Notification/NotificationsProvider.js +3 -1
  94. package/styled-components/cjs/components/Notification/index.js +4 -4
  95. package/styled-components/cjs/components/Steps/Steps.tokens.js +0 -1
  96. package/styled-components/cjs/components/Steps/ui/StepItem/StepItem.js +7 -29
  97. package/styled-components/cjs/components/Steps/ui/StepItem/StepItem.styles.js +6 -12
  98. package/styled-components/cjs/examples/plasma_b2c/components/Notification/Notification.js +5 -3
  99. package/styled-components/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  100. package/styled-components/cjs/examples/plasma_b2c/components/Steps/Steps.config.js +1 -1
  101. package/styled-components/cjs/examples/plasma_b2c/components/Steps/Steps.stories.tsx +1 -1
  102. package/styled-components/cjs/examples/plasma_web/components/Notification/Notification.js +5 -3
  103. package/styled-components/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  104. package/styled-components/cjs/examples/plasma_web/components/Steps/Steps.config.js +1 -1
  105. package/styled-components/cjs/examples/plasma_web/components/Steps/Steps.stories.tsx +1 -1
  106. package/styled-components/es/components/Notification/Notification.js +1 -1
  107. package/styled-components/es/components/Notification/Notification.styles.js +5 -2
  108. package/styled-components/es/components/Notification/Notification.template-doc.mdx +17 -8
  109. package/styled-components/es/components/Notification/Notification.tokens.js +2 -1
  110. package/styled-components/es/components/Notification/NotificationsPortal.js +8 -4
  111. package/styled-components/es/components/Notification/NotificationsProvider.js +3 -1
  112. package/styled-components/es/components/Notification/index.js +1 -1
  113. package/styled-components/es/components/Steps/Steps.tokens.js +0 -1
  114. package/styled-components/es/components/Steps/ui/StepItem/StepItem.js +7 -29
  115. package/styled-components/es/components/Steps/ui/StepItem/StepItem.styles.js +6 -12
  116. package/styled-components/es/examples/plasma_b2c/components/Notification/Notification.js +6 -4
  117. package/styled-components/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +25 -4
  118. package/styled-components/es/examples/plasma_b2c/components/Steps/Steps.config.js +1 -1
  119. package/styled-components/es/examples/plasma_b2c/components/Steps/Steps.stories.tsx +1 -1
  120. package/styled-components/es/examples/plasma_web/components/Notification/Notification.js +6 -4
  121. package/styled-components/es/examples/plasma_web/components/Notification/Notification.stories.tsx +25 -4
  122. package/styled-components/es/examples/plasma_web/components/Steps/Steps.config.js +1 -1
  123. package/styled-components/es/examples/plasma_web/components/Steps/Steps.stories.tsx +1 -1
  124. package/types/components/Notification/Notification.d.ts +3 -3
  125. package/types/components/Notification/Notification.d.ts.map +1 -1
  126. package/types/components/Notification/Notification.styles.d.ts +4 -2
  127. package/types/components/Notification/Notification.styles.d.ts.map +1 -1
  128. package/types/components/Notification/Notification.tokens.d.ts +1 -0
  129. package/types/components/Notification/Notification.tokens.d.ts.map +1 -1
  130. package/types/components/Notification/Notification.types.d.ts +11 -5
  131. package/types/components/Notification/Notification.types.d.ts.map +1 -1
  132. package/types/components/Notification/NotificationsPortal.d.ts.map +1 -1
  133. package/types/components/Notification/NotificationsProvider.d.ts +4 -3
  134. package/types/components/Notification/NotificationsProvider.d.ts.map +1 -1
  135. package/types/components/Notification/index.d.ts +2 -2
  136. package/types/components/Notification/index.d.ts.map +1 -1
  137. package/types/components/Steps/Steps.tokens.d.ts +0 -1
  138. package/types/components/Steps/Steps.tokens.d.ts.map +1 -1
  139. package/types/components/Steps/ui/StepItem/StepItem.d.ts.map +1 -1
  140. package/types/components/Steps/ui/StepItem/StepItem.styles.d.ts +2 -2
  141. package/types/components/Steps/ui/StepItem/StepItem.styles.d.ts.map +1 -1
  142. package/types/examples/plasma_b2c/components/Notification/Notification.d.ts +4 -2
  143. package/types/examples/plasma_b2c/components/Notification/Notification.d.ts.map +1 -1
  144. package/types/examples/plasma_b2c/components/Steps/Steps.config.d.ts.map +1 -1
  145. package/types/examples/plasma_web/components/Notification/Notification.d.ts +4 -13
  146. package/types/examples/plasma_web/components/Notification/Notification.d.ts.map +1 -1
  147. package/types/examples/plasma_web/components/Steps/Steps.config.d.ts.map +1 -1
  148. package/cjs/components/Steps/ui/StepItem/StepItem.styles_1oh5gqm.css +0 -9
  149. package/es/components/Steps/ui/StepItem/StepItem.styles_1oh5gqm.css +0 -9
@@ -5,6 +5,7 @@ import type { StoryObj, Meta } from '@storybook/react';
5
5
  import { Button } from '../Button/Button';
6
6
  import { Modal } from '../Modal/Modal';
7
7
  import {
8
+ NotificationPlacement,
8
9
  NotificationIconPlacement,
9
10
  NotificationLayout,
10
11
  addNotification,
@@ -20,6 +21,7 @@ const titles = ['Выполнено', 'Внимание', 'Ошибка'];
20
21
  const texts = ['SSH ключ успешно скопирован', 'Нельзя скопировать SSH ключ', 'Не удалось скопировать SSH ключ'];
21
22
  const size = ['xs', 'xxs'];
22
23
  const iconPlacement = ['top', 'left'];
24
+ const notificationsPlacements = ['bottom-right', 'bottom-left'];
23
25
 
24
26
  const longText = `JavaScript frameworks are an essential part of modern front-end web development,
25
27
  providing developers with proven tools for building scalable, interactive web applications.
@@ -49,6 +51,7 @@ interface StoryDefaultProps {
49
51
  layout: NotificationLayout;
50
52
  size: 'xs' | 'xxs';
51
53
  iconPlacement: NotificationIconPlacement;
54
+ placement?: NotificationPlacement;
52
55
  }
53
56
 
54
57
  const StoryDefault = ({ title, children, iconPlacement, size, layout, showLeftIcon, ...rest }: StoryDefaultProps) => {
@@ -111,9 +114,10 @@ type StoryLiveDemoProps = ComponentProps<typeof Notification> & {
111
114
  layout: NotificationLayout;
112
115
  size: 'xs' | 'xxs';
113
116
  iconPlacement: NotificationIconPlacement;
117
+ placement?: NotificationPlacement;
114
118
  };
115
119
 
116
- const StoryLiveDemo = ({ timeout, ...rest }: StoryLiveDemoProps) => {
120
+ const StoryLiveDemo = ({ timeout, placement, ...rest }: StoryLiveDemoProps) => {
117
121
  const count = useRef(0);
118
122
  const handleClick = useCallback(() => {
119
123
  addNotification({ icon: <IconDisclosureRight />, ...rest, ...getNotificationProps(count.current) }, timeout);
@@ -121,7 +125,7 @@ const StoryLiveDemo = ({ timeout, ...rest }: StoryLiveDemoProps) => {
121
125
  }, [count, rest]);
122
126
 
123
127
  return (
124
- <NotificationsProvider>
128
+ <NotificationsProvider placement={placement}>
125
129
  <Button text="Добавить уведомление" onClick={handleClick} />
126
130
  </NotificationsProvider>
127
131
  );
@@ -135,20 +139,28 @@ export const LiveDemo: StoryObj<StoryLiveDemoProps> = {
135
139
  type: 'select',
136
140
  },
137
141
  },
142
+ placement: {
143
+ options: notificationsPlacements,
144
+ control: {
145
+ type: 'select',
146
+ },
147
+ },
138
148
  },
139
149
  args: {
140
150
  timeout: 3000,
141
151
  role: 'alert',
142
152
  layout: 'vertical',
153
+ placement: 'bottom-right',
143
154
  },
144
155
  render: (args) => <StoryLiveDemo {...args} />,
145
156
  };
146
157
 
147
158
  type StoryWithModalProps = ComponentProps<typeof Notification> & {
148
159
  timeout: number;
160
+ placement?: NotificationPlacement;
149
161
  };
150
162
 
151
- const StoryWithModal = ({ timeout }: StoryWithModalProps) => {
163
+ const StoryWithModal = ({ timeout, placement }: StoryWithModalProps) => {
152
164
  const [isModalOpen, setIsModalOpen] = useState(false);
153
165
  const count = useRef(0);
154
166
  const handleClick = useCallback(() => {
@@ -157,7 +169,7 @@ const StoryWithModal = ({ timeout }: StoryWithModalProps) => {
157
169
  }, [count]);
158
170
 
159
171
  return (
160
- <NotificationsProvider>
172
+ <NotificationsProvider placement={placement}>
161
173
  <PopupProvider>
162
174
  <Button text="Open modal" onClick={() => setIsModalOpen(true)} />
163
175
  <Modal frame="theme-root" opened={isModalOpen} onClose={() => setIsModalOpen(false)}>
@@ -172,6 +184,15 @@ const StoryWithModal = ({ timeout }: StoryWithModalProps) => {
172
184
  export const WithModal: StoryObj<StoryLiveDemoProps> = {
173
185
  args: {
174
186
  timeout: 3500,
187
+ placement: 'bottom-right',
188
+ },
189
+ argTypes: {
190
+ placement: {
191
+ options: notificationsPlacements,
192
+ control: {
193
+ type: 'select',
194
+ },
195
+ },
175
196
  },
176
197
  render: (args) => <StoryWithModal {...args} />,
177
198
  };
@@ -7,7 +7,7 @@ export var config = {
7
7
  },
8
8
  variations: {
9
9
  view: {
10
- "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":solid var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-secondary);", ":var(--surface-accent);", ":0.4;"], tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.focusColor, tokens.disabledOpacity)
10
+ "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":solid var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-secondary);", ":0.4;"], tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.disabledOpacity)
11
11
  },
12
12
  size: {
13
13
  l: /*#__PURE__*/css(["", ":1.5rem;", ":2.25rem;", ":0.5rem;", ":1rem;", ":0.75rem;", ":0.375rem;", ":2rem;", ":1.0625rem;", ":0.75rem;", ":1rem;", ":0.625rem;", ":1.5rem;", ":1.25rem;", ":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-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),
@@ -118,7 +118,7 @@ const DefaultStory = (args) => {
118
118
  };
119
119
 
120
120
  return (
121
- <div style={{ maxWidth, height: '600px' }}>
121
+ <div style={{ maxWidth, height: '400px' }}>
122
122
  <Steps
123
123
  size={size}
124
124
  items={items}
@@ -1,16 +1,18 @@
1
1
  import React from 'react';
2
- import { noticationConfig, NotificationsProvider as Provider } from '../../../../components/Notification';
2
+ import { notificationConfig, NotificationsProvider as Provider } from '../../../../components/Notification';
3
3
  import { component, mergeConfig } from '../../../../engines';
4
4
  import { config } from './Notification.config';
5
5
  export { modalClasses } from '../../../../components/Modal';
6
- var mergedConfig = /*#__PURE__*/mergeConfig(noticationConfig, config);
6
+ var mergedConfig = /*#__PURE__*/mergeConfig(notificationConfig, config);
7
7
  export var Notification = /*#__PURE__*/component(mergedConfig);
8
8
  export var NotificationsProvider = function NotificationsProvider(_ref) {
9
9
  var children = _ref.children,
10
10
  _ref$frame = _ref.frame,
11
- frame = _ref$frame === void 0 ? 'theme-root' : _ref$frame;
11
+ frame = _ref$frame === void 0 ? 'theme-root' : _ref$frame,
12
+ placement = _ref.placement;
12
13
  return /*#__PURE__*/React.createElement(Provider, {
13
14
  config: mergedConfig,
14
- frame: frame
15
+ frame: frame,
16
+ placement: placement
15
17
  }, children);
16
18
  };
@@ -5,6 +5,7 @@ import type { StoryObj, Meta } from '@storybook/react';
5
5
  import { Button } from '../Button/Button';
6
6
  import { Modal } from '../Modal/Modal';
7
7
  import {
8
+ NotificationPlacement,
8
9
  NotificationIconPlacement,
9
10
  NotificationLayout,
10
11
  addNotification,
@@ -20,6 +21,7 @@ const titles = ['Выполнено', 'Внимание', 'Ошибка'];
20
21
  const texts = ['SSH ключ успешно скопирован', 'Нельзя скопировать SSH ключ', 'Не удалось скопировать SSH ключ'];
21
22
  const size = ['xs', 'xxs'];
22
23
  const iconPlacement = ['top', 'left'];
24
+ const notificationsPlacements = ['bottom-right', 'bottom-left'];
23
25
 
24
26
  const longText = `JavaScript frameworks are an essential part of modern front-end web development,
25
27
  providing developers with proven tools for building scalable, interactive web applications.
@@ -49,6 +51,7 @@ interface StoryDefaultProps {
49
51
  layout: NotificationLayout;
50
52
  size: 'xs' | 'xxs';
51
53
  iconPlacement: NotificationIconPlacement;
54
+ placement?: NotificationPlacement;
52
55
  }
53
56
 
54
57
  const StoryDefault = ({ title, children, iconPlacement, size, layout, showLeftIcon, ...rest }: StoryDefaultProps) => {
@@ -111,9 +114,10 @@ type StoryLiveDemoProps = ComponentProps<typeof Notification> & {
111
114
  layout: NotificationLayout;
112
115
  size: 'xs' | 'xxs';
113
116
  iconPlacement: NotificationIconPlacement;
117
+ placement?: NotificationPlacement;
114
118
  };
115
119
 
116
- const StoryLiveDemo = ({ timeout, ...rest }: StoryLiveDemoProps) => {
120
+ const StoryLiveDemo = ({ timeout, placement, ...rest }: StoryLiveDemoProps) => {
117
121
  const count = useRef(0);
118
122
  const handleClick = useCallback(() => {
119
123
  addNotification({ icon: <IconDisclosureRight />, ...rest, ...getNotificationProps(count.current) }, timeout);
@@ -121,7 +125,7 @@ const StoryLiveDemo = ({ timeout, ...rest }: StoryLiveDemoProps) => {
121
125
  }, [count, rest]);
122
126
 
123
127
  return (
124
- <NotificationsProvider>
128
+ <NotificationsProvider placement={placement}>
125
129
  <Button text="Добавить уведомление" onClick={handleClick} />
126
130
  </NotificationsProvider>
127
131
  );
@@ -135,20 +139,28 @@ export const LiveDemo: StoryObj<StoryLiveDemoProps> = {
135
139
  type: 'select',
136
140
  },
137
141
  },
142
+ placement: {
143
+ options: notificationsPlacements,
144
+ control: {
145
+ type: 'select',
146
+ },
147
+ },
138
148
  },
139
149
  args: {
140
150
  timeout: 3000,
141
151
  role: 'alert',
142
152
  layout: 'vertical',
153
+ placement: 'bottom-right',
143
154
  },
144
155
  render: (args) => <StoryLiveDemo {...args} />,
145
156
  };
146
157
 
147
158
  type StoryWithModalProps = ComponentProps<typeof Notification> & {
148
159
  timeout: number;
160
+ placement?: NotificationPlacement;
149
161
  };
150
162
 
151
- const StoryWithModal = ({ timeout }: StoryWithModalProps) => {
163
+ const StoryWithModal = ({ timeout, placement }: StoryWithModalProps) => {
152
164
  const [isModalOpen, setIsModalOpen] = useState(false);
153
165
  const count = useRef(0);
154
166
  const handleClick = useCallback(() => {
@@ -157,7 +169,7 @@ const StoryWithModal = ({ timeout }: StoryWithModalProps) => {
157
169
  }, [count]);
158
170
 
159
171
  return (
160
- <NotificationsProvider>
172
+ <NotificationsProvider placement={placement}>
161
173
  <PopupProvider>
162
174
  <Button text="Open modal" onClick={() => setIsModalOpen(true)} />
163
175
  <Modal frame="theme-root" opened={isModalOpen} onClose={() => setIsModalOpen(false)}>
@@ -172,6 +184,15 @@ const StoryWithModal = ({ timeout }: StoryWithModalProps) => {
172
184
  export const WithModal: StoryObj<StoryLiveDemoProps> = {
173
185
  args: {
174
186
  timeout: 3500,
187
+ placement: 'bottom-right',
188
+ },
189
+ argTypes: {
190
+ placement: {
191
+ options: notificationsPlacements,
192
+ control: {
193
+ type: 'select',
194
+ },
195
+ },
175
196
  },
176
197
  render: (args) => <StoryWithModal {...args} />,
177
198
  };
@@ -7,7 +7,7 @@ export var config = {
7
7
  },
8
8
  variations: {
9
9
  view: {
10
- "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":solid var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-secondary);", ":var(--surface-accent);", ":0.4;"], tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.focusColor, tokens.disabledOpacity)
10
+ "default": /*#__PURE__*/css(["", ":var(--text-primary);", ":var(--text-primary-hover);", ":solid var(--surface-solid-default);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--inverse-text-primary);", ":var(--inverse-text-primary);", ":var(--surface-solid-default);", ":var(--surface-solid-default-hover);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-secondary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-secondary);", ":0.4;"], tokens.activeTitleColor, tokens.activeTitleColorHover, tokens.activeIndicatorBorder, tokens.activeIndicatorColor, tokens.activeIndicatorBackground, tokens.completedIndicatorColor, tokens.completedIndicatorColorHover, tokens.completedIndicatorBackground, tokens.completedIndicatorBackgroundHover, tokens.inactiveTitleColor, tokens.inactiveTitleColorHover, tokens.inactiveIndicatorColor, tokens.inactiveIndicatorColorHover, tokens.inactiveIndicatorBackground, tokens.inactiveIndicatorBackgroundHover, tokens.contentColor, tokens.disabledOpacity)
11
11
  },
12
12
  size: {
13
13
  l: /*#__PURE__*/css(["", ":1.5rem;", ":2.25rem;", ":0.5rem;", ":1rem;", ":0.75rem;", ":0.375rem;", ":2rem;", ":1.0625rem;", ":0.75rem;", ":1rem;", ":0.625rem;", ":1.5rem;", ":1.25rem;", ":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-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);", ":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-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);", ":0.125rem;"], tokens.indicatorSize, tokens.activeIndicatorSize, tokens.bulletSize, tokens.activeBulletSize, tokens.titlePaddingTop, tokens.contentPaddingTop, tokens.contentSidePadding, tokens.contentVerticalPadding, tokens.verticalContentPaddingLeft, tokens.smallIndicatorIndentHeight, tokens.largeIndicatorIndentHeight, tokens.smallBulletIndentHeight, tokens.largeBulletIndentHeight, tokens.indicatorFontFamily, tokens.indicatorFontSize, tokens.indicatorFontStyle, tokens.indicatorFontWeight, tokens.indicatorLetterSpacing, tokens.indicatorLineHeight, tokens.activeIndicatorFontFamily, tokens.activeIndicatorFontSize, tokens.activeIndicatorFontStyle, tokens.activeIndicatorFontWeight, tokens.activeIndicatorLetterSpacing, tokens.activeIndicatorLineHeight, tokens.titleFontFamily, tokens.titleFontSize, tokens.titleFontStyle, tokens.titleFontWeight, tokens.titleLetterSpacing, tokens.titleLineHeight, tokens.contentFontFamily, tokens.contentFontSize, tokens.contentFontStyle, tokens.contentFontWeight, tokens.contentLetterSpacing, tokens.contentLineHeight, tokens.dividerThickness),
@@ -118,7 +118,7 @@ const DefaultStory = (args) => {
118
118
  };
119
119
 
120
120
  return (
121
- <div style={{ maxWidth, height: '600px' }}>
121
+ <div style={{ maxWidth, height: '400px' }}>
122
122
  <Steps
123
123
  size={size}
124
124
  items={items}
@@ -4,11 +4,11 @@ import { NotificationProps } from './Notification.types';
4
4
  /**
5
5
  * Компонент для небольших уведомлений пользователя
6
6
  */
7
- export declare const notificationRoot: (Root: RootProps<HTMLDivElement, NotificationProps>) => React.ForwardRefExoticComponent<NotificationProps & React.RefAttributes<HTMLDivElement>>;
8
- export declare const noticationConfig: {
7
+ export declare const notificationRoot: (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) => React.ForwardRefExoticComponent<NotificationProps & React.RefAttributes<HTMLDivElement>>;
8
+ export declare const notificationConfig: {
9
9
  name: string;
10
10
  tag: string;
11
- layout: (Root: RootProps<HTMLDivElement, NotificationProps>) => React.ForwardRefExoticComponent<NotificationProps & React.RefAttributes<HTMLDivElement>>;
11
+ layout: (Root: RootProps<HTMLDivElement, Omit<NotificationProps, 'title'>>) => React.ForwardRefExoticComponent<NotificationProps & React.RefAttributes<HTMLDivElement>>;
12
12
  base: import("@linaria/core").LinariaClassName;
13
13
  variations: {
14
14
  layout: {
@@ -1 +1 @@
1
- {"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAQ1C,OAAO,EAAsB,iBAAiB,EAAW,MAAM,sBAAsB,CAAC;AActF;;GAEG;AACH,eAAO,MAAM,gBAAgB,SAAU,UAAU,cAAc,EAAE,iBAAiB,CAAC,6FAwF7E,CAAC;AAEP,eAAO,MAAM,gBAAgB;;;mBA1FU,UAAU,cAAc,EAAE,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;CA+GlF,CAAC"}
1
+ {"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAQ1C,OAAO,EAAsB,iBAAiB,EAAW,MAAM,sBAAsB,CAAC;AActF;;GAEG;AACH,eAAO,MAAM,gBAAgB,SAAU,UAAU,cAAc,EAAE,KAAK,iBAAiB,EAAE,OAAO,CAAC,CAAC,6FAwF5F,CAAC;AAEP,eAAO,MAAM,kBAAkB;;;mBA1FQ,UAAU,cAAc,EAAE,KAAK,iBAAiB,EAAE,OAAO,CAAC,CAAC;;;;;;;;;;;;;;;;;;CA+GjG,CAAC"}
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
- import { CloseIconType, IconPlacementType } from './Notification.types';
2
+ import { CloseIconType, IconPlacementType, NotificationPlacement } from './Notification.types';
3
3
  export declare const StyledNotification: import("@linaria/core").LinariaClassName;
4
4
  export declare const CloseIconWrapper: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("../../engines/types").PropsType<import("../../engines/types").Variants> & ((Omit<import("react").ButtonHTMLAttributes<HTMLElement>, "value"> & Omit<import("react").AnchorHTMLAttributes<HTMLElement>, "type"> & import("../../types").AsProps<any> & {
5
5
  text?: string | undefined;
@@ -54,5 +54,7 @@ export declare const StyledContent: import("@linaria/react").StyledComponent<imp
54
54
  export declare const StyledItemWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
55
55
  isHidden: boolean;
56
56
  }>;
57
- export declare const StyledRoot: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
57
+ export declare const StyledRoot: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
58
+ placement?: NotificationPlacement | undefined;
59
+ }>;
58
60
  //# sourceMappingURL=Notification.styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Notification.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.styles.ts"],"names":[],"mappings":";AAQA,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAc,MAAM,sBAAsB,CAAC;AAEpF,eAAO,MAAM,kBAAkB,0CAE9B,CAAC;AAKF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uDAc5B,CAAC;AAEF,eAAO,MAAM,OAAO,qKAYnB,CAAC;AAEF,eAAO,MAAM,cAAc,gKAS1B,CAAC;AAEF,eAAO,MAAM,WAAW,gKAavB,CAAC;AAEF,eAAO,MAAM,UAAU,gKActB,CAAC;AAEF,eAAO,MAAM,OAAO,gLAqBnB,CAAC;AAEF,eAAO,MAAM,WAAW,qKAQvB,CAAC;AAEF,eAAO,MAAM,aAAa,qKAUzB,CAAC;AAEF,eAAO,MAAM,iBAAiB;cAA0B,OAAO;EAmC9D,CAAC;AAEF,eAAO,MAAM,UAAU,qKAOtB,CAAC"}
1
+ {"version":3,"file":"Notification.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.styles.ts"],"names":[],"mappings":";AAQA,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,qBAAqB,EAAc,MAAM,sBAAsB,CAAC;AAE3G,eAAO,MAAM,kBAAkB,0CAE9B,CAAC;AAKF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uDAc5B,CAAC;AAEF,eAAO,MAAM,OAAO,qKAYnB,CAAC;AAEF,eAAO,MAAM,cAAc,gKAS1B,CAAC;AAEF,eAAO,MAAM,WAAW,gKAavB,CAAC;AAEF,eAAO,MAAM,UAAU,gKActB,CAAC;AAEF,eAAO,MAAM,OAAO,gLAqBnB,CAAC;AAEF,eAAO,MAAM,WAAW,qKAQvB,CAAC;AAEF,eAAO,MAAM,aAAa,qKAUzB,CAAC;AAEF,eAAO,MAAM,iBAAiB;cAA0B,OAAO;EAmE9D,CAAC;AAEF,eAAO,MAAM,UAAU;;EAOtB,CAAC"}
@@ -14,6 +14,7 @@ export declare const classes: {
14
14
  withoutCloseIcon: string;
15
15
  notificationItemOpened: string;
16
16
  notificationItemHidden: string;
17
+ notificationLeftToRightAnimation: string;
17
18
  };
18
19
  export declare const tokens: {
19
20
  background: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Notification.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;CAkBnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0DlB,CAAC"}
1
+ {"version":3,"file":"Notification.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;CAmBnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0DlB,CAAC"}
@@ -1,5 +1,5 @@
1
1
  import type { AsProps } from '@salutejs/plasma-core';
2
- import { HTMLAttributes, ReactNode, RefAttributes } from 'react';
2
+ import { HTMLAttributes, ReactNode } from 'react';
3
3
  import { ComponentConfig, PropsType, Variants } from '../../engines/types';
4
4
  export declare const layouts: {
5
5
  horizontal: string;
@@ -11,6 +11,7 @@ export declare const placements: {
11
11
  left: string;
12
12
  };
13
13
  export declare type NotificationIconPlacement = keyof typeof placements;
14
+ export declare type NotificationPlacement = 'bottom-right' | 'bottom-left';
14
15
  export declare type LayoutType = {
15
16
  layout?: NotificationLayout;
16
17
  };
@@ -20,11 +21,11 @@ export declare type IconPlacementType = {
20
21
  export declare type CloseIconType = {
21
22
  showCloseIcon?: boolean;
22
23
  };
23
- export interface NotificationProps extends AsProps, HTMLAttributes<HTMLDivElement> {
24
+ export interface NotificationProps extends AsProps, Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
24
25
  /**
25
26
  * Заголовок.
26
27
  */
27
- title?: string;
28
+ title?: ReactNode;
28
29
  /**
29
30
  * Контент под заголовком.
30
31
  */
@@ -70,14 +71,19 @@ export interface NotificationProps extends AsProps, HTMLAttributes<HTMLDivElemen
70
71
  */
71
72
  size?: string;
72
73
  }
73
- export interface NotificationPortalProps extends HTMLAttributes<HTMLDivElement> {
74
+ export interface NotificationPortalProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
74
75
  /**
75
76
  * Конфиг компонента Notification.
76
77
  */
77
- config: ComponentConfig<string, Variants, PropsType<Variants>, NotificationProps & RefAttributes<HTMLDivElement>>;
78
+ config: ComponentConfig<string, Variants, PropsType<Variants>, NotificationProps & HTMLAttributes<HTMLDivElement>>;
78
79
  /**
79
80
  * В каком контейнере позиционируется(по умолчанию document), можно также указать id элемента или ref для него.
80
81
  */
81
82
  frame?: string;
83
+ /**
84
+ * Расположение компонента Notification во frame
85
+ * @default bottom-right
86
+ */
87
+ placement?: NotificationPlacement;
82
88
  }
83
89
  //# sourceMappingURL=Notification.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Notification.types.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE3E,eAAO,MAAM,OAAO;;;CAGnB,CAAC;AAEF,oBAAY,kBAAkB,GAAG,MAAM,OAAO,OAAO,CAAC;AAEtD,eAAO,MAAM,UAAU;;;CAGtB,CAAC;AAEF,oBAAY,yBAAyB,GAAG,MAAM,OAAO,UAAU,CAAC;AAEhE,oBAAY,UAAU,GAAG;IACrB,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC/B,CAAC;AAEF,oBAAY,iBAAiB,GAAG;IAC5B,aAAa,CAAC,EAAE,yBAAyB,CAAC;CAC7C,CAAC;AAEF,oBAAY,aAAa,GAAG;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,iBAAkB,SAAQ,OAAO,EAAE,cAAc,CAAC,cAAc,CAAC;IAC9E;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,yBAAyB,CAAC;IAC1C;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,uBAAwB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E;;OAEG;IACH,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC,EAAE,iBAAiB,GAAG,aAAa,CAAC,cAAc,CAAC,CAAC,CAAC;IAClH;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB"}
1
+ {"version":3,"file":"Notification.types.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAE3E,eAAO,MAAM,OAAO;;;CAGnB,CAAC;AAEF,oBAAY,kBAAkB,GAAG,MAAM,OAAO,OAAO,CAAC;AAEtD,eAAO,MAAM,UAAU;;;CAGtB,CAAC;AAEF,oBAAY,yBAAyB,GAAG,MAAM,OAAO,UAAU,CAAC;AAChE,oBAAY,qBAAqB,GAAG,cAAc,GAAG,aAAa,CAAC;AAEnE,oBAAY,UAAU,GAAG;IACrB,MAAM,CAAC,EAAE,kBAAkB,CAAC;CAC/B,CAAC;AAEF,oBAAY,iBAAiB,GAAG;IAC5B,aAAa,CAAC,EAAE,yBAAyB,CAAC;CAC7C,CAAC;AAEF,oBAAY,aAAa,GAAG;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,MAAM,WAAW,iBAAkB,SAAQ,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC7F;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,yBAAyB,CAAC;IAC1C;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC1F;;OAEG;IACH,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC,EAAE,iBAAiB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC;IACnH;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,SAAS,CAAC,EAAE,qBAAqB,CAAC;CACrC"}
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationsPortal.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AAUrF,OAAO,EAAE,uBAAuB,EAAqB,MAAM,sBAAsB,CAAC;AAalF;;GAEG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,uBAAuB,CAkC3D,CAAC"}
1
+ {"version":3,"file":"NotificationsPortal.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationsPortal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AAUrF,OAAO,EAAE,uBAAuB,EAAqB,MAAM,sBAAsB,CAAC;AAalF;;GAEG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,uBAAuB,CAmC3D,CAAC"}
@@ -1,10 +1,11 @@
1
- import { FC, ReactNode, RefAttributes } from 'react';
1
+ import { FC, HTMLAttributes, ReactNode } from 'react';
2
2
  import { ComponentConfig } from '../../engines';
3
3
  import { PropsType, Variants } from '../../engines/types';
4
- import { NotificationProps } from './Notification.types';
4
+ import { NotificationPlacement, NotificationProps } from './Notification.types';
5
5
  export declare const NotificationsProvider: FC<{
6
6
  children: ReactNode;
7
- config: ComponentConfig<string, Variants, PropsType<Variants>, NotificationProps & RefAttributes<HTMLDivElement>>;
7
+ config: ComponentConfig<string, Variants, PropsType<Variants>, NotificationProps & HTMLAttributes<HTMLDivElement>>;
8
8
  frame?: string;
9
+ placement?: NotificationPlacement;
9
10
  }>;
10
11
  //# sourceMappingURL=NotificationsProvider.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationsProvider.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationsProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG5D,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAI1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC,EAAE,iBAAiB,GAAG,aAAa,CAAC,cAAc,CAAC,CAAC,CAAC;IAClH,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAOA,CAAC"}
1
+ {"version":3,"file":"NotificationsProvider.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/NotificationsProvider.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAI1D,OAAO,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEhF,eAAO,MAAM,qBAAqB,EAAE,EAAE,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,eAAe,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,QAAQ,CAAC,EAAE,iBAAiB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC;IACnH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,qBAAqB,CAAC;CACrC,CAOA,CAAC"}
@@ -1,6 +1,6 @@
1
1
  export { NotificationsProvider } from './NotificationsProvider';
2
- export { notificationRoot, noticationConfig } from './Notification';
2
+ export { notificationRoot, notificationConfig } from './Notification';
3
3
  export { addNotification, closeNotification } from './NotificationsStore';
4
4
  export { classes as notificationClasses, tokens as notificationTokens } from './Notification.tokens';
5
- export type { NotificationProps, NotificationPortalProps, NotificationLayout, NotificationIconPlacement, } from './Notification.types';
5
+ export type { NotificationProps, NotificationPortalProps, NotificationLayout, NotificationIconPlacement, NotificationPlacement, } from './Notification.types';
6
6
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACpE,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAC1E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,IAAI,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AACrG,YAAY,EACR,iBAAiB,EACjB,uBAAuB,EACvB,kBAAkB,EAClB,yBAAyB,GAC5B,MAAM,sBAAsB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAC1E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,IAAI,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AACrG,YAAY,EACR,iBAAiB,EACjB,uBAAuB,EACvB,kBAAkB,EAClB,yBAAyB,EACzB,qBAAqB,GACxB,MAAM,sBAAsB,CAAC"}
@@ -56,7 +56,6 @@ export declare const tokens: {
56
56
  inactiveTitleColor: string;
57
57
  inactiveTitleColorHover: string;
58
58
  contentColor: string;
59
- focusColor: string;
60
59
  activeIndicatorBorder: string;
61
60
  activeIndicatorBorderHover: string;
62
61
  activeIndicatorColor: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Steps.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/Steps.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;CAanB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ElB,CAAC"}
1
+ {"version":3,"file":"Steps.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/Steps/Steps.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;CAanB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyElB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"StepItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Steps/ui/StepItem/StepItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAInD,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAEtF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAqBtD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAC3B,aAAa,GAAG;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvD,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAClC,CAyPJ,CAAC"}
1
+ {"version":3,"file":"StepItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Steps/ui/StepItem/StepItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAInD,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAEtF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAqBtD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAC3B,aAAa,GAAG;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvD,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,WAAW,CAAC,EAAE,gBAAgB,CAAC;CAClC,CA2LJ,CAAC"}
@@ -20,8 +20,8 @@ export declare const SpinnerStyled: import("@linaria/react").StyledComponent<{
20
20
  export declare const StepItemTitle: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
21
21
  export declare const StepItemContent: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
22
22
  export declare const BulletIndicatorWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
23
- export declare const BulletIndicator: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Record<never, unknown>>;
24
- export declare const Bullet: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Record<never, unknown> & {
23
+ export declare const BulletIndicator: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
24
+ export declare const Bullet: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Record<never, unknown> & {
25
25
  as?: import("react").ElementType<any> | undefined;
26
26
  }>;
27
27
  export declare const StepItemDivider: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
@@ -1 +1 @@
1
- {"version":3,"file":"StepItem.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Steps/ui/StepItem/StepItem.styles.ts"],"names":[],"mappings":";AAUA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;qDAIzB,CAAC;AAEF,eAAO,MAAM,aAAa,qKAYzB,CAAC;AAEF,eAAO,MAAM,eAAe,qKAc3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,qKAqDlC,CAAC;AAEF,eAAO,MAAM,eAAe,iLA6D3B,CAAC;AAEF,eAAO,MAAM,MAAM;;EAYlB,CAAC;AAEF,eAAO,MAAM,eAAe;;EA8B3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,qKAalC,CAAC;AAEF,eAAO,MAAM,cAAc,qKA6L1B,CAAC"}
1
+ {"version":3,"file":"StepItem.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Steps/ui/StepItem/StepItem.styles.ts"],"names":[],"mappings":";AASA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;qDAIzB,CAAC;AAEF,eAAO,MAAM,aAAa,qKAYzB,CAAC;AAEF,eAAO,MAAM,eAAe,qKAc3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,qKAsClC,CAAC;AAEF,eAAO,MAAM,eAAe,qKA+C3B,CAAC;AAEF,eAAO,MAAM,MAAM;;EAYlB,CAAC;AAEF,eAAO,MAAM,eAAe;;EA8B3B,CAAC;AAEF,eAAO,MAAM,sBAAsB,qKAalC,CAAC;AAEF,eAAO,MAAM,cAAc,qKAoF1B,CAAC"}
@@ -1,9 +1,11 @@
1
1
  import React, { ReactNode } from 'react';
2
- import { NotificationProps } from '../../../../components/Notification';
2
+ import { NotificationProps, NotificationPlacement } from '../../../../components/Notification';
3
3
  export { modalClasses } from '../../../../components/Modal';
4
- export declare const Notification: React.ForwardRefExoticComponent<NotificationProps & React.RefAttributes<HTMLDivElement>>;
4
+ export declare const Notification: React.ForwardRefExoticComponent<NotificationProps & React.HTMLAttributes<HTMLDivElement>>;
5
+ export type { NotificationPlacement };
5
6
  export declare const NotificationsProvider: React.FC<{
6
7
  children: ReactNode;
7
8
  frame?: string;
9
+ placement?: NotificationPlacement;
8
10
  }>;
9
11
  //# sourceMappingURL=Notification.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6B,SAAS,EAAiB,MAAM,OAAO,CAAC;AAEnF,OAAO,EAEH,iBAAiB,EAEpB,MAAM,qCAAqC,CAAC;AAK7C,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAI5D,eAAO,MAAM,YAAY,0FAExB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CASnF,CAAC"}
1
+ {"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6C,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpF,OAAO,EAEH,iBAAiB,EAEjB,qBAAqB,EACxB,MAAM,qCAAqC,CAAC;AAK7C,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAI5D,eAAO,MAAM,YAAY,2FAExB,CAAC;AAEF,YAAY,EAAE,qBAAqB,EAAE,CAAC;AAEtC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IACzC,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,qBAAqB,CAAC;CACrC,CAMA,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Steps.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Steps/Steps.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;CA+NlB,CAAC"}
1
+ {"version":3,"file":"Steps.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_b2c/components/Steps/Steps.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;CA8NlB,CAAC"}
@@ -1,20 +1,11 @@
1
1
  import React, { ReactNode } from 'react';
2
+ import { NotificationProps, NotificationPlacement } from '../../../../components/Notification';
2
3
  export { modalClasses } from '../../../../components/Modal';
3
- export declare const Notification: React.FunctionComponent<import("../../../../engines/types").PropsType<{
4
- view: {
5
- default: import("@linaria/core").LinariaClassName;
6
- };
7
- layout: {
8
- horizontal: import("@linaria/core").LinariaClassName;
9
- vertical: import("@linaria/core").LinariaClassName;
10
- };
11
- size: {
12
- xs: import("@linaria/core").LinariaClassName;
13
- xxs: import("@linaria/core").LinariaClassName;
14
- };
15
- }> & import("../../../../components/Notification").NotificationProps & React.RefAttributes<HTMLDivElement>>;
4
+ export declare const Notification: React.ForwardRefExoticComponent<NotificationProps & React.HTMLAttributes<HTMLDivElement>>;
5
+ export type { NotificationPlacement };
16
6
  export declare const NotificationsProvider: React.FC<{
17
7
  children: ReactNode;
18
8
  frame?: string;
9
+ placement?: NotificationPlacement;
19
10
  }>;
20
11
  //# sourceMappingURL=Notification.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOzC,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAI5D,eAAO,MAAM,YAAY;;;;;;;;;;;;2GAA0B,CAAC;AAEpD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CASnF,CAAC"}
1
+ {"version":3,"file":"Notification.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Notification/Notification.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6C,SAAS,EAAE,MAAM,OAAO,CAAC;AAEpF,OAAO,EAEH,iBAAiB,EAEjB,qBAAqB,EACxB,MAAM,qCAAqC,CAAC;AAK7C,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAI5D,eAAO,MAAM,YAAY,2FAExB,CAAC;AAEF,YAAY,EAAE,qBAAqB,EAAE,CAAC;AAEtC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC;IACzC,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,qBAAqB,CAAC;CACrC,CAMA,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Steps.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Steps/Steps.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;CA+NlB,CAAC"}
1
+ {"version":3,"file":"Steps.config.d.ts","sourceRoot":"","sources":["../../../../../src/examples/plasma_web/components/Steps/Steps.config.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;CA8NlB,CAAC"}
@@ -1,9 +0,0 @@
1
- .snf9dn9{--plasma-spinner-size:var(--snf9dn9-0);--plasma-spinner-color:var(--plasma-step-item-active-indicator-color);}
2
- .sv5tpso{padding-top:var(--plasma-step-item-title-padding-top);padding-right:var(--plasma-step-item-content-side-padding);font-family:var(--plasma-step-item-title-font-family);font-size:var(--plasma-step-item-title-font-size);font-style:var(--plasma-step-item-title-font-style);font-weight:var(--plasma-step-item-title-font-weight);-webkit-letter-spacing:var(--plasma-step-item-title-letter-spacing);-moz-letter-spacing:var(--plasma-step-item-title-letter-spacing);-ms-letter-spacing:var(--plasma-step-item-title-letter-spacing);letter-spacing:var(--plasma-step-item-title-letter-spacing);line-height:var(--plasma-step-item-title-line-height);word-break:break-word;}
3
- .s529fhk{padding-top:var(--plasma-step-item-content-padding-top);padding-right:var(--plasma-step-item-content-side-padding);font-family:var(--plasma-step-item-content-font-family);font-size:var(--plasma-step-item-content-font-size);font-style:var(--plasma-step-item-content-font-style);font-weight:var(--plasma-step-item-content-font-weight);-webkit-letter-spacing:var(--plasma-step-item-content-letter-spacing);-moz-letter-spacing:var(--plasma-step-item-content-letter-spacing);-ms-letter-spacing:var(--plasma-step-item-content-letter-spacing);letter-spacing:var(--plasma-step-item-content-letter-spacing);line-height:var(--plasma-step-item-content-line-height);word-break:break-word;color:var(--plasma-step-item-content-color);}
4
- .b1kcj14{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;}.b1kcj14:not(.simple){-webkit-flex:0;-ms-flex:0;flex:0;}.b1kcj14:not(.simple).item-has-indicator{width:100%;min-height:var(--plasma-step-item-active-indicator-size);}.b1kcj14:not(.simple):not(.item-has-indicator){width:100%;min-height:var(--plasma-step-item-active-bullet-size);}.b1kcj14:not(.simple).vertical-orientation{padding-right:var(--plasma-step-item-vertical-content-padding-left);}.b1kcj14.simple{-webkit-flex:0;-ms-flex:0;flex:0;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}.b1kcj14.simple.item-has-indicator{width:var(--plasma-step-item-active-indicator-size);min-height:var(--plasma-step-item-active-indicator-size);}.b1kcj14.simple:not(.item-has-indicator){width:var(--plasma-step-item-active-bullet-size);min-height:var(--plasma-step-item-active-bullet-size);}.b1kcj14.vertical-orientation{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;min-height:100%;}.b1kcj14.vertical-orientation.item-has-indicator{min-width:var(--plasma-step-item-active-indicator-size);}.b1kcj14.vertical-orientation:not(.item-has-indicator){min-width:var(--plasma-step-item-active-bullet-size);}.b1kcj14.item-centered{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
5
- .b9hdug{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-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:var(--plasma-step-item-indicator-size);height:var(--plasma-step-item-indicator-size);border-radius:50%;box-sizing:border-box;position:relative;outline:none;padding:0;margin:0;border:none;color:var(--plasma-step-item-completed-indicator-color);background-color:var(--plasma-step-item-completed-indicator-background);font-family:var(--plasma-step-item-indicator-font-family);font-size:var(--plasma-step-item-indicator-font-size);font-style:var(--plasma-step-item-indicator-font-style);font-weight:var(--plasma-step-item-indicator-font-weight);-webkit-letter-spacing:var(--plasma-step-item-indicator-letter-spacing);-moz-letter-spacing:var(--plasma-step-item-indicator-letter-spacing);-ms-letter-spacing:var(--plasma-step-item-indicator-letter-spacing);letter-spacing:var(--plasma-step-item-indicator-letter-spacing);line-height:var(--plasma-step-item-indicator-line-height);position:relative;}.b9hdug::before{content:'';position:absolute;top:-0.1875rem;left:-0.1875rem;right:-0.1875rem;bottom:-0.1875rem;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:50%;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.b9hdug.focus-visible:focus::before,.b9hdug[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-step-item-focus-color);}.b9hdug.item-active{width:var(--plasma-step-item-active-indicator-size);height:var(--plasma-step-item-active-indicator-size);border:var(--plasma-step-item-divider-thickness) var(--plasma-step-item-active-indicator-border);font-family:var(--plasma-step-item-active-indicator-font-family);font-size:var(--plasma-step-item-active-indicator-font-size);font-style:var(--plasma-step-item-active-indicator-font-style);font-weight:var(--plasma-step-item-active-indicator-font-weight);-webkit-letter-spacing:var(--plasma-step-item-active-indicator-letter-spacing);-moz-letter-spacing:var(--plasma-step-item-active-indicator-letter-spacing);-ms-letter-spacing:var(--plasma-step-item-active-indicator-letter-spacing);letter-spacing:var(--plasma-step-item-active-indicator-letter-spacing);line-height:var(--plasma-step-item-active-indicator-line-height);color:var(--plasma-step-item-active-indicator-color);background:var(--plasma-step-item-active-indicator-background);}.b9hdug.item-inactive{color:var(--plasma-step-item-inactive-indicator-color);background:var(--plasma-step-item-inactive-indicator-background);}.b9hdug.item-inactive.simple:before,.b9hdug.item-inactive.simple:after{background:var(--plasma-step-item-inactive-indicator-background);}
6
- .b1eo1o32.b9hdug{width:var(--plasma-step-item-bullet-size);height:var(--plasma-step-item-bullet-size);}.b1eo1o32.b9hdug.item-active{width:var(--plasma-step-item-active-bullet-size);height:var(--plasma-step-item-active-bullet-size);border:var(--plasma-step-item-divider-thickness) var(--plasma-step-item-active-indicator-border);background:var(--plasma-step-item-active-indicator-background);}
7
- .sxskc3q{width:100%;height:var(--plasma-step-item-divider-thickness);-webkit-flex:1;-ms-flex:1;flex:1;background:var(--plasma-step-item-active-indicator-color);}.sxskc3q.item-inactive{background:var(--plasma-step-item-inactive-indicator-background);}.sxskc3q.transparent-divider{background:transparent;}.sxskc3q.vertical-orientation{width:var(--plasma-step-item-divider-thickness);height:100%;}.sxskc3q.indent-divider{height:var(--sxskc3q-0);min-height:var(--sxskc3q-0);max-height:var(--sxskc3q-0);}.sxskc3q.indent-divider.simple{height:auto;max-height:none;}
8
- .s4zgmmr.vertical-orientation .sv5tpso{padding-top:var(--plasma-step-item-content-vertical-padding);padding-right:0;}.s4zgmmr.vertical-orientation .s529fhk{padding-top:var(--plasma-step-item-content-vertical-padding);padding-bottom:var(--plasma-step-item-content-vertical-padding);padding-right:0;}
9
- .s12pqpa3{position:relative;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:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;-webkit-flex:1;-ms-flex:1;flex:1;color:var(--plasma-step-item-active-indicator-color);}.s12pqpa3.vertical-orientation{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;}.s12pqpa3.vertical-orientation .sxskc3q{width:var(--plasma-step-item-divider-thickness);height:100%;}.s12pqpa3.item-active .sv5tpso{color:var(--plasma-step-item-active-title-color);}.s12pqpa3.item-inactive{color:var(--plasma-step-item-inactive-indicator-color);}.s12pqpa3.item-inactive .sv5tpso{color:var(--plasma-step-item-inactive-title-color);}.s12pqpa3.simple{-webkit-flex:0;-ms-flex:0;flex:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}.s12pqpa3.simple.item-has-indicator{min-width:var(--plasma-step-item-active-indicator-size);}.s12pqpa3.simple:not(.item-has-indicator){min-width:var(--plasma-step-item-active-bullet-size);}.s12pqpa3.simple.item-inactive:before,.s12pqpa3.simple:not(.item-active):before,.s12pqpa3.simple.item-inactive:after,.s12pqpa3.simple:not(.item-active):after{position:absolute;top:0;bottom:0;left:0;content:'';display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;width:calc((var(--plasma-step-item-active-indicator-size) - var(--plasma-step-item-indicator-size)) / 2);height:var(--plasma-step-item-divider-thickness);background:var(--plasma-step-item-active-indicator-color);}.s12pqpa3.simple.item-inactive:after,.s12pqpa3.simple:not(.item-active):after{left:auto;right:0;}.s12pqpa3.simple.item-inactive.vertical-orientation:before,.s12pqpa3.simple:not(.item-active).vertical-orientation:before,.s12pqpa3.simple.item-inactive.vertical-orientation:after,.s12pqpa3.simple:not(.item-active).vertical-orientation:after{width:var(--plasma-step-item-divider-thickness);height:calc((var(--plasma-step-item-active-indicator-size) - var(--plasma-step-item-indicator-size)) / 2);margin:0 auto;-webkit-align-self:auto;-ms-flex-item-align:auto;align-self:auto;}.s12pqpa3.simple.item-inactive.vertical-orientation:before,.s12pqpa3.simple:not(.item-active).vertical-orientation:before{top:0;left:0;right:0;}.s12pqpa3.simple.item-inactive.vertical-orientation:after,.s12pqpa3.simple:not(.item-active).vertical-orientation:after{top:auto;left:0;right:0;bottom:0;margin:0 auto;}.s12pqpa3.simple.item-inactive.isFirst:before,.s12pqpa3.simple:not(.item-active).isFirst:before{display:none;}.s12pqpa3.simple.item-inactive.isLast:after,.s12pqpa3.simple:not(.item-active).isLast:after{display:none;}.s12pqpa3.simple.item-inactive:after,.s12pqpa3.simple.item-inactive:before{background:var(--plasma-step-item-inactive-indicator-background);}.s12pqpa3.simple.isPrevInactive:before{background:var(--plasma-step-item-inactive-indicator-background);}.s12pqpa3.simple.isNextInactive:after{background:var(--plasma-step-item-inactive-indicator-background);}.s12pqpa3:not(.simple):not(.vertical-orientation).isNextActive .b1kcj14{width:calc(100% - (var(--plasma-step-item-active-indicator-size) - var(--plasma-step-item-indicator-size)) / 2);}.s12pqpa3:not(.simple):not(.vertical-orientation).item-active .b1kcj14{margin-left:calc((var(--plasma-step-item-active-indicator-size) - var(--plasma-step-item-indicator-size)) / -2);width:calc(100% + (var(--plasma-step-item-active-indicator-size) - var(--plasma-step-item-indicator-size)) / 2);}.s12pqpa3.item-hovered:not(.item-active) .sv5tpso{cursor:pointer;color:var(--plasma-step-item-active-title-color-hover);}.s12pqpa3.item-hovered:not(.item-active) .b9hdug,.s12pqpa3.item-hovered:not(.item-active) .b1eo1o32{color:var(--plasma-step-item-completed-indicator-color-hover);background:var(--plasma-step-item-completed-indicator-background-hover);}.s12pqpa3.item-hovered.item-inactive .sv5tpso{color:var(--plasma-step-item-inactive-title-color-hover);}.s12pqpa3.item-hovered.item-inactive .b9hdug,.s12pqpa3.item-hovered.item-inactive .b1eo1o32{color:var(--plasma-step-item-inactive-indicator-color-hover);background:var(--plasma-step-item-inactive-indicator-background-hover);}.s12pqpa3.item-hovered .b1kcj14{cursor:pointer;}.s12pqpa3.item-centered{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.s12pqpa3.item-centered .s4zgmmr{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:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:calc(var(--plasma-step-item-content-side-padding) / 2);padding-right:calc(var(--plasma-step-item-content-side-padding) / 2);}.s12pqpa3.item-centered .s4zgmmr .sv5tpso{width:100%;}.s12pqpa3.item-centered .s4zgmmr .sv5tpso,.s12pqpa3.item-centered .s4zgmmr .s529fhk{padding-right:0;text-align:center;}.s12pqpa3.item-disabled{opacity:var(--plasma-step-item-disabled-opacity);}