@salutejs/plasma-new-hope 0.324.1-canary.1988.15209032570.0 → 0.325.0-canary.1715.15255555914.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.
Files changed (183) hide show
  1. package/cjs/components/Calendar/hooks/useMonths.js +3 -1
  2. package/cjs/components/Calendar/hooks/useMonths.js.map +1 -1
  3. package/cjs/components/Calendar/hooks/useQuarters.js +3 -1
  4. package/cjs/components/Calendar/hooks/useQuarters.js.map +1 -1
  5. package/cjs/components/Calendar/hooks/useYears.js +3 -1
  6. package/cjs/components/Calendar/hooks/useYears.js.map +1 -1
  7. package/cjs/components/Calendar/utils/getDateWithModification.js +28 -24
  8. package/cjs/components/Calendar/utils/getDateWithModification.js.map +1 -1
  9. package/cjs/components/Note/Note.css +35 -6
  10. package/cjs/components/Note/Note.js +17 -3
  11. package/cjs/components/Note/Note.js.map +1 -1
  12. package/cjs/components/Note/Note.styles.js +25 -2
  13. package/cjs/components/Note/Note.styles.js.map +1 -1
  14. package/cjs/components/Note/{Note.styles_178qpj9.css → Note.styles_thpfhk.css} +2 -1
  15. package/cjs/components/Note/Note.tokens.js +9 -1
  16. package/cjs/components/Note/Note.tokens.js.map +1 -1
  17. package/cjs/components/NumberFormat/NumberFormat.js +7 -2
  18. package/cjs/components/NumberFormat/NumberFormat.js.map +1 -1
  19. package/cjs/components/PaginationDots/PaginationDot.js +59 -0
  20. package/cjs/components/PaginationDots/PaginationDot.js.map +1 -0
  21. package/cjs/components/PaginationDots/PaginationDot_baul9c.css +2 -0
  22. package/cjs/components/PaginationDots/PaginationDots.js +34 -0
  23. package/cjs/components/PaginationDots/PaginationDots.js.map +1 -0
  24. package/cjs/components/PaginationDots/PaginationDots_fm2ha5.css +2 -0
  25. package/cjs/components/PaginationDots/SmartPaginationDots.css +5 -0
  26. package/cjs/components/PaginationDots/SmartPaginationDots.js +47 -0
  27. package/cjs/components/PaginationDots/SmartPaginationDots.js.map +1 -0
  28. package/cjs/components/PaginationDots/usePaginationDots.js +40 -0
  29. package/cjs/components/PaginationDots/usePaginationDots.js.map +1 -0
  30. package/cjs/index.css +14 -7
  31. package/cjs/index.js +6 -0
  32. package/cjs/index.js.map +1 -1
  33. package/emotion/cjs/components/Calendar/hooks/useMonths.js +3 -1
  34. package/emotion/cjs/components/Calendar/hooks/useQuarters.js +3 -1
  35. package/emotion/cjs/components/Calendar/hooks/useYears.js +3 -1
  36. package/emotion/cjs/components/Calendar/utils/getDateWithModification.js +28 -24
  37. package/emotion/cjs/components/Note/Note.js +17 -3
  38. package/emotion/cjs/components/Note/Note.styles.js +27 -15
  39. package/emotion/cjs/components/Note/Note.tokens.js +9 -1
  40. package/emotion/cjs/components/NumberFormat/NumberFormat.js +7 -2
  41. package/emotion/cjs/components/PaginationDots/PaginationDot.js +35 -0
  42. package/emotion/cjs/components/PaginationDots/PaginationDots.js +35 -0
  43. package/emotion/cjs/components/PaginationDots/SmartPaginationDots.js +43 -0
  44. package/emotion/cjs/components/PaginationDots/index.js +26 -0
  45. package/emotion/cjs/components/PaginationDots/usePaginationDots.js +38 -0
  46. package/emotion/cjs/examples/plasma_b2c/components/Note/Note.config.js +9 -9
  47. package/emotion/cjs/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  48. package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +23 -22
  49. package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +4 -3
  50. package/emotion/cjs/examples/plasma_web/components/Note/Note.config.js +9 -9
  51. package/emotion/cjs/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  52. package/emotion/cjs/examples/plasma_web/components/TextField/TextField.config.js +23 -22
  53. package/emotion/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +5 -4
  54. package/emotion/cjs/index.js +11 -0
  55. package/emotion/es/components/Calendar/hooks/useMonths.js +3 -1
  56. package/emotion/es/components/Calendar/hooks/useQuarters.js +3 -1
  57. package/emotion/es/components/Calendar/hooks/useYears.js +3 -1
  58. package/emotion/es/components/Calendar/utils/getDateWithModification.js +28 -24
  59. package/emotion/es/components/Note/Note.js +18 -4
  60. package/emotion/es/components/Note/Note.styles.js +26 -14
  61. package/emotion/es/components/Note/Note.tokens.js +9 -1
  62. package/emotion/es/components/NumberFormat/NumberFormat.js +7 -2
  63. package/emotion/es/components/PaginationDots/PaginationDot.js +28 -0
  64. package/emotion/es/components/PaginationDots/PaginationDots.js +28 -0
  65. package/emotion/es/components/PaginationDots/SmartPaginationDots.js +36 -0
  66. package/emotion/es/components/PaginationDots/index.js +3 -0
  67. package/emotion/es/components/PaginationDots/usePaginationDots.js +32 -0
  68. package/emotion/es/examples/plasma_b2c/components/Note/Note.config.js +9 -9
  69. package/emotion/es/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  70. package/emotion/es/examples/plasma_b2c/components/TextField/TextField.config.js +23 -22
  71. package/emotion/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +4 -3
  72. package/emotion/es/examples/plasma_web/components/Note/Note.config.js +9 -9
  73. package/emotion/es/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  74. package/emotion/es/examples/plasma_web/components/TextField/TextField.config.js +23 -22
  75. package/emotion/es/examples/plasma_web/components/TextField/TextField.stories.tsx +5 -4
  76. package/emotion/es/index.js +2 -1
  77. package/es/components/Calendar/hooks/useMonths.js +3 -1
  78. package/es/components/Calendar/hooks/useMonths.js.map +1 -1
  79. package/es/components/Calendar/hooks/useQuarters.js +3 -1
  80. package/es/components/Calendar/hooks/useQuarters.js.map +1 -1
  81. package/es/components/Calendar/hooks/useYears.js +3 -1
  82. package/es/components/Calendar/hooks/useYears.js.map +1 -1
  83. package/es/components/Calendar/utils/getDateWithModification.js +28 -24
  84. package/es/components/Calendar/utils/getDateWithModification.js.map +1 -1
  85. package/es/components/Note/Note.css +35 -6
  86. package/es/components/Note/Note.js +18 -4
  87. package/es/components/Note/Note.js.map +1 -1
  88. package/es/components/Note/Note.styles.js +25 -3
  89. package/es/components/Note/Note.styles.js.map +1 -1
  90. package/es/components/Note/{Note.styles_178qpj9.css → Note.styles_thpfhk.css} +2 -1
  91. package/es/components/Note/Note.tokens.js +9 -1
  92. package/es/components/Note/Note.tokens.js.map +1 -1
  93. package/es/components/NumberFormat/NumberFormat.js +7 -2
  94. package/es/components/NumberFormat/NumberFormat.js.map +1 -1
  95. package/es/components/PaginationDots/PaginationDot.js +54 -0
  96. package/es/components/PaginationDots/PaginationDot.js.map +1 -0
  97. package/es/components/PaginationDots/PaginationDot_baul9c.css +2 -0
  98. package/es/components/PaginationDots/PaginationDots.js +29 -0
  99. package/es/components/PaginationDots/PaginationDots.js.map +1 -0
  100. package/es/components/PaginationDots/PaginationDots_fm2ha5.css +2 -0
  101. package/es/components/PaginationDots/SmartPaginationDots.css +5 -0
  102. package/es/components/PaginationDots/SmartPaginationDots.js +39 -0
  103. package/es/components/PaginationDots/SmartPaginationDots.js.map +1 -0
  104. package/es/components/PaginationDots/usePaginationDots.js +36 -0
  105. package/es/components/PaginationDots/usePaginationDots.js.map +1 -0
  106. package/es/index.css +14 -7
  107. package/es/index.js +3 -0
  108. package/es/index.js.map +1 -1
  109. package/package.json +2 -2
  110. package/styled-components/cjs/components/Calendar/hooks/useMonths.js +3 -1
  111. package/styled-components/cjs/components/Calendar/hooks/useQuarters.js +3 -1
  112. package/styled-components/cjs/components/Calendar/hooks/useYears.js +3 -1
  113. package/styled-components/cjs/components/Calendar/utils/getDateWithModification.js +28 -24
  114. package/styled-components/cjs/components/Note/Note.js +17 -3
  115. package/styled-components/cjs/components/Note/Note.styles.js +14 -3
  116. package/styled-components/cjs/components/Note/Note.tokens.js +9 -1
  117. package/styled-components/cjs/components/NumberFormat/NumberFormat.js +7 -2
  118. package/styled-components/cjs/components/PaginationDots/PaginationDot.js +33 -0
  119. package/styled-components/cjs/components/PaginationDots/PaginationDots.js +24 -0
  120. package/styled-components/cjs/components/PaginationDots/SmartPaginationDots.js +43 -0
  121. package/styled-components/cjs/components/PaginationDots/index.js +26 -0
  122. package/styled-components/cjs/components/PaginationDots/usePaginationDots.js +38 -0
  123. package/styled-components/cjs/examples/plasma_b2c/components/Note/Note.config.js +4 -4
  124. package/styled-components/cjs/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  125. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +2 -1
  126. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +4 -3
  127. package/styled-components/cjs/examples/plasma_web/components/Note/Note.config.js +4 -4
  128. package/styled-components/cjs/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  129. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.config.js +7 -6
  130. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +5 -4
  131. package/styled-components/cjs/index.js +11 -0
  132. package/styled-components/es/components/Calendar/hooks/useMonths.js +3 -1
  133. package/styled-components/es/components/Calendar/hooks/useQuarters.js +3 -1
  134. package/styled-components/es/components/Calendar/hooks/useYears.js +3 -1
  135. package/styled-components/es/components/Calendar/utils/getDateWithModification.js +28 -24
  136. package/styled-components/es/components/Note/Note.js +18 -4
  137. package/styled-components/es/components/Note/Note.styles.js +13 -2
  138. package/styled-components/es/components/Note/Note.tokens.js +9 -1
  139. package/styled-components/es/components/NumberFormat/NumberFormat.js +7 -2
  140. package/styled-components/es/components/PaginationDots/PaginationDot.js +26 -0
  141. package/styled-components/es/components/PaginationDots/PaginationDots.js +18 -0
  142. package/styled-components/es/components/PaginationDots/SmartPaginationDots.js +36 -0
  143. package/styled-components/es/components/PaginationDots/index.js +3 -0
  144. package/styled-components/es/components/PaginationDots/usePaginationDots.js +32 -0
  145. package/styled-components/es/examples/plasma_b2c/components/Note/Note.config.js +4 -4
  146. package/styled-components/es/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  147. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.config.js +2 -1
  148. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +4 -3
  149. package/styled-components/es/examples/plasma_web/components/Note/Note.config.js +4 -4
  150. package/styled-components/es/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  151. package/styled-components/es/examples/plasma_web/components/TextField/TextField.config.js +7 -6
  152. package/styled-components/es/examples/plasma_web/components/TextField/TextField.stories.tsx +5 -4
  153. package/styled-components/es/index.js +2 -1
  154. package/types/components/Calendar/hooks/types.d.ts +7 -2
  155. package/types/components/Calendar/hooks/types.d.ts.map +1 -1
  156. package/types/components/Calendar/hooks/useMonths.d.ts +1 -1
  157. package/types/components/Calendar/hooks/useMonths.d.ts.map +1 -1
  158. package/types/components/Calendar/hooks/useQuarters.d.ts +1 -1
  159. package/types/components/Calendar/hooks/useQuarters.d.ts.map +1 -1
  160. package/types/components/Calendar/hooks/useYears.d.ts +1 -1
  161. package/types/components/Calendar/hooks/useYears.d.ts.map +1 -1
  162. package/types/components/Calendar/utils/getDateWithModification.d.ts.map +1 -1
  163. package/types/components/Note/Note.d.ts +4 -0
  164. package/types/components/Note/Note.d.ts.map +1 -1
  165. package/types/components/Note/Note.styles.d.ts +46 -1
  166. package/types/components/Note/Note.styles.d.ts.map +1 -1
  167. package/types/components/Note/Note.tokens.d.ts +8 -0
  168. package/types/components/Note/Note.tokens.d.ts.map +1 -1
  169. package/types/components/Note/Note.types.d.ts +8 -0
  170. package/types/components/Note/Note.types.d.ts.map +1 -1
  171. package/types/components/NumberFormat/NumberFormat.d.ts.map +1 -1
  172. package/types/components/PaginationDots/PaginationDot.d.ts +21 -0
  173. package/types/components/PaginationDots/PaginationDot.d.ts.map +1 -0
  174. package/types/components/PaginationDots/PaginationDots.d.ts +15 -0
  175. package/types/components/PaginationDots/PaginationDots.d.ts.map +1 -0
  176. package/types/components/PaginationDots/SmartPaginationDots.d.ts +15 -0
  177. package/types/components/PaginationDots/SmartPaginationDots.d.ts.map +1 -0
  178. package/types/components/PaginationDots/index.d.ts +6 -0
  179. package/types/components/PaginationDots/index.d.ts.map +1 -0
  180. package/types/components/PaginationDots/usePaginationDots.d.ts +14 -0
  181. package/types/components/PaginationDots/usePaginationDots.d.ts.map +1 -0
  182. package/types/index.d.ts +1 -0
  183. package/types/index.d.ts.map +1 -1
@@ -20,10 +20,10 @@ var config = exports.config = {
20
20
  info: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-transparent-info);", ":var(--text-primary);", ":var(--text-info);"], _Note.noteTokens.background, _Note.noteTokens.color, _Note.noteTokens.contentBeforeColor)
21
21
  },
22
22
  size: {
23
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.5rem 1.875rem;", ":1.5rem 1.75rem;", ":0.875rem;", ":0.75rem;", ":1rem;", ":0.25rem;", ":1.5rem;", ":2rem;", ":0.25rem 0;", ":var(--plasma-typo-text-l-font-family);", ":var(--plasma-typo-text-l-font-size);", ":var(--plasma-typo-text-l-font-style);", ":var(--plasma-typo-text-l-bold-font-weight);", ":var(--plasma-typo-text-l-letter-spacing);", ":var(--plasma-typo-text-l-line-height);", ":var(--plasma-typo-text-l-font-family);", ":var(--plasma-typo-text-l-font-size);", ":var(--plasma-typo-text-l-font-style);", ":var(--plasma-typo-text-l-font-weight);", ":var(--plasma-typo-text-l-letter-spacing);", ":var(--plasma-typo-text-l-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight),
24
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.25rem 1.5rem;", ":1.25rem;", ":0.75rem;", ":0.625rem;", ":0.75rem;", ":0.125rem;", ":1.5rem;", ":1.5rem;", ":0;", ":var(--plasma-typo-text-m-font-family);", ":var(--plasma-typo-text-m-font-size);", ":var(--plasma-typo-text-m-font-style);", ":var(--plasma-typo-text-m-bold-font-weight);", ":var(--plasma-typo-text-m-letter-spacing);", ":var(--plasma-typo-text-m-line-height);", ":var(--plasma-typo-text-m-font-family);", ":var(--plasma-typo-text-m-font-size);", ":var(--plasma-typo-text-m-font-style);", ":var(--plasma-typo-text-m-font-weight);", ":var(--plasma-typo-text-m-letter-spacing);", ":var(--plasma-typo-text-m-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight),
25
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":1rem 1.25rem;", ":1rem;", ":0.625rem;", ":0.5rem;", ":0.75rem;", ":0.125rem;", ":1rem;", ":1.125rem;", ":0.063rem 0;", ":var(--plasma-typo-text-s-font-family);", ":var(--plasma-typo-text-s-font-size);", ":var(--plasma-typo-text-s-font-style);", ":var(--plasma-typo-text-s-bold-font-weight);", ":var(--plasma-typo-text-s-letter-spacing);", ":var(--plasma-typo-text-s-line-height);", ":var(--plasma-typo-text-s-font-family);", ":var(--plasma-typo-text-s-font-size);", ":var(--plasma-typo-text-s-font-style);", ":var(--plasma-typo-text-s-font-weight);", ":var(--plasma-typo-text-s-letter-spacing);", ":var(--plasma-typo-text-s-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight),
26
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem 1rem;", ":0.75rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":0.125rem;", ":1rem;", ":1rem;", ":0;", ":var(--plasma-typo-text-xs-font-family);", ":var(--plasma-typo-text-xs-font-size);", ":var(--plasma-typo-text-xs-font-style);", ":var(--plasma-typo-text-xs-bold-font-weight);", ":var(--plasma-typo-text-xs-letter-spacing);", ":var(--plasma-typo-text-xs-line-height);", ":var(--plasma-typo-text-xs-font-family);", ":var(--plasma-typo-text-xs-font-size);", ":var(--plasma-typo-text-xs-font-style);", ":var(--plasma-typo-text-xs-font-weight);", ":var(--plasma-typo-text-xs-letter-spacing);", ":var(--plasma-typo-text-xs-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight)
23
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.5rem 1.875rem;", ":1.5rem 1.75rem;", ":0.875rem;", ":0.75rem;", ":1rem;", ":0.25rem;", ":1rem;", ":1rem;", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":1.5rem;", ":1.5rem;", ":1.5rem;", ":2rem;", ":0.25rem 0;", ":var(--plasma-typo-text-l-font-family);", ":var(--plasma-typo-text-l-font-size);", ":var(--plasma-typo-text-l-font-style);", ":var(--plasma-typo-text-l-bold-font-weight);", ":var(--plasma-typo-text-l-letter-spacing);", ":var(--plasma-typo-text-l-line-height);", ":1.875rem;", ":var(--plasma-typo-text-l-font-family);", ":var(--plasma-typo-text-l-font-size);", ":var(--plasma-typo-text-l-font-style);", ":var(--plasma-typo-text-l-font-weight);", ":var(--plasma-typo-text-l-letter-spacing);", ":var(--plasma-typo-text-l-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.closeIconTop, _Note.noteTokens.closeIconRight, _Note.noteTokens.closeIconColor, _Note.noteTokens.closeIconColorOnHover, _Note.noteTokens.closeIconSize, _Note.noteTokens.closeIconButtonSize, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.titlePaddingRight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight),
24
+ m: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.25rem 1.5rem;", ":1.25rem;", ":0.75rem;", ":0.625rem;", ":0.75rem;", ":0.125rem;", ":0.75rem;", ":0.75rem;", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":1.5rem;", ":1.5rem;", ":1.5rem;", ":1.5rem;", ":0;", ":var(--plasma-typo-text-m-font-family);", ":var(--plasma-typo-text-m-font-size);", ":var(--plasma-typo-text-m-font-style);", ":var(--plasma-typo-text-m-bold-font-weight);", ":var(--plasma-typo-text-m-letter-spacing);", ":var(--plasma-typo-text-m-line-height);", ":1.75rem;", ":var(--plasma-typo-text-m-font-family);", ":var(--plasma-typo-text-m-font-size);", ":var(--plasma-typo-text-m-font-style);", ":var(--plasma-typo-text-m-font-weight);", ":var(--plasma-typo-text-m-letter-spacing);", ":var(--plasma-typo-text-m-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.closeIconTop, _Note.noteTokens.closeIconRight, _Note.noteTokens.closeIconColor, _Note.noteTokens.closeIconColorOnHover, _Note.noteTokens.closeIconSize, _Note.noteTokens.closeIconButtonSize, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.titlePaddingRight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight),
25
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":1rem 1.25rem;", ":1rem;", ":0.625rem;", ":0.5rem;", ":0.75rem;", ":0.125rem;", ":0.625rem;", ":0.625rem;", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":1.5rem;", ":1.5rem;", ":1rem;", ":1.125rem;", ":0.063rem 0;", ":var(--plasma-typo-text-s-font-family);", ":var(--plasma-typo-text-s-font-size);", ":var(--plasma-typo-text-s-font-style);", ":var(--plasma-typo-text-s-bold-font-weight);", ":var(--plasma-typo-text-s-letter-spacing);", ":var(--plasma-typo-text-s-line-height);", ":1.625rem;", ":var(--plasma-typo-text-s-font-family);", ":var(--plasma-typo-text-s-font-size);", ":var(--plasma-typo-text-s-font-style);", ":var(--plasma-typo-text-s-font-weight);", ":var(--plasma-typo-text-s-letter-spacing);", ":var(--plasma-typo-text-s-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.closeIconTop, _Note.noteTokens.closeIconRight, _Note.noteTokens.closeIconColor, _Note.noteTokens.closeIconColorOnHover, _Note.noteTokens.closeIconSize, _Note.noteTokens.closeIconButtonSize, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.titlePaddingRight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight),
26
+ xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem 1rem;", ":0.75rem;", ":0.5rem;", ":0.375rem;", ":0.5rem;", ":0.125rem;", ":0.625rem;", ":0.625rem;", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":0;", ":var(--plasma-typo-text-xs-font-family);", ":var(--plasma-typo-text-xs-font-size);", ":var(--plasma-typo-text-xs-font-style);", ":var(--plasma-typo-text-xs-bold-font-weight);", ":var(--plasma-typo-text-xs-letter-spacing);", ":var(--plasma-typo-text-xs-line-height);", ":1.5rem;", ":var(--plasma-typo-text-xs-font-family);", ":var(--plasma-typo-text-xs-font-size);", ":var(--plasma-typo-text-xs-font-style);", ":var(--plasma-typo-text-xs-font-weight);", ":var(--plasma-typo-text-xs-letter-spacing);", ":var(--plasma-typo-text-xs-line-height);"], _Note.noteTokens.padding, _Note.noteTokens.paddingScalable, _Note.noteTokens.borderRadius, _Note.noteTokens.gap, _Note.noteTokens.gapScalable, _Note.noteTokens.contentGap, _Note.noteTokens.closeIconTop, _Note.noteTokens.closeIconRight, _Note.noteTokens.closeIconColor, _Note.noteTokens.closeIconColorOnHover, _Note.noteTokens.closeIconSize, _Note.noteTokens.closeIconButtonSize, _Note.noteTokens.fixedContentBeforeWidth, _Note.noteTokens.fixedContentBeforeHeight, _Note.noteTokens.fixedContentBeforePadding, _Note.noteTokens.titleFontFamily, _Note.noteTokens.titleFontSize, _Note.noteTokens.titleFontStyle, _Note.noteTokens.titleFontWeight, _Note.noteTokens.titleLetterSpacing, _Note.noteTokens.titleLineHeight, _Note.noteTokens.titlePaddingRight, _Note.noteTokens.textFontFamily, _Note.noteTokens.textFontSize, _Note.noteTokens.textFontStyle, _Note.noteTokens.textFontWeight, _Note.noteTokens.textLetterSpacing, _Note.noteTokens.textLineHeight)
27
27
  }
28
28
  }
29
29
  };
@@ -67,6 +67,7 @@ export const Default: StoryObj<StoryPropsDefault> = {
67
67
  text: 'Text',
68
68
  enableContentBefore: true,
69
69
  contentBeforeSizing: 'fixed',
70
+ hasClose: true,
70
71
  },
71
72
  render: ({ enableContentBefore, ...args }) => (
72
73
  <div style={{ height: '100vh' }}>
@@ -14,12 +14,13 @@ var config = exports.config = {
14
14
  },
15
15
  variations: {
16
16
  view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-primary);", ":var(--surface-clear);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--outline-transparent-primary);", ":var(--outline-transparent-primary-hover);", ":var(--surface-accent);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.borderColor, _TextField.textFieldTokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor),
18
- positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-positive);", ":var(--surface-clear);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-positive);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--surface-positive);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.borderColor, _TextField.textFieldTokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor),
19
- warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-warning);", ":var(--surface-clear);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-warning);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-warning);", ":var(--surface-warning);", ":var(--surface-accent);", ":var(--surface-warning);", ":var(--surface-warning);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.borderColor, _TextField.textFieldTokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor),
20
- negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-negative);", ":var(--surface-clear);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-negative);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--surface-negative);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.borderColor, _TextField.textFieldTokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor)
17
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-primary-hover);", ":var(--surface-transparent-secondary);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--outline-transparent-primary);", ":var(--outline-transparent-primary-hover);", ":var(--surface-accent);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--surface-accent);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorHover, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.borderColor, _TextField.textFieldTokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor),
18
+ positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-positive);", ":var(--text-positive);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-hover);", ":var(--surface-transparent-positive-active);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-positive);", ":var(--surface-positive);", ":var(--surface-accent);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorHover, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor),
19
+ warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-warning);", ":var(--text-warning);", ":var(--surface-transparent-warning);", ":var(--surface-transparent-warning-hover);", ":var(--surface-transparent-warning-active);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-warning);", ":var(--surface-warning);", ":var(--surface-accent);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorHover, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor),
20
+ negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-negative);", ":var(--text-negative);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-hover);", ":var(--surface-transparent-negative-active);", ":var(--text-accent);", ":var(--text-tertiary);", ":var(--text-tertiary);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary-hover);", ":var(--text-secondary-active);", ":var(--surface-negative);", ":var(--surface-negative);", ":var(--surface-accent);", ":var(--text-accent);", ":var(--surface-negative);", ":var(--text-tertiary);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.clearColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.placeholderColorFocus, _TextField.textFieldTokens.clearPlaceholderColor, _TextField.textFieldTokens.clearPlaceholderColorFocus, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorHover, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.textBeforeColor, _TextField.textFieldTokens.textAfterColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.titleCaptionColor, _TextField.textFieldTokens.hintIconColor, _TextField.textFieldTokens.contentSlotColor, _TextField.textFieldTokens.contentSlotColorHover, _TextField.textFieldTokens.contentSlotColorActive, _TextField.textFieldTokens.dividerColor, _TextField.textFieldTokens.dividerColorHover, _TextField.textFieldTokens.dividerColorFocus, _TextField.textFieldTokens.focusColor, _TextField.textFieldTokens.indicatorColor, _TextField.textFieldTokens.optionalColor)
21
21
  },
22
22
  size: {
23
+ xl: /*#__PURE__*/(0, _styledComponents.css)(["", ":4rem;", ":1.3125rem 1.125rem;", ":0.375rem;", ":1rem;", ":0.0625rem;", ":-0.0625rem 0.5rem -0.0625rem 0rem;", ":-0.0625rem 0rem -0.0625rem 0.75rem;", ":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);", ":0.75rem;", ":0.25rem;", ":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);", ":-0.688rem -0.5rem;", ":2.375rem;", ":0.82rem -2.938rem auto auto;", ":0.82rem -2.063rem auto auto;", ":0.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);", ":0.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);", ":0.8125rem 0 0.125rem 0;", ":1.813rem 0 0.813rem 0;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;", ":0.125rem;", ":1rem;", ":0.625rem;", ":auto;", ":3.25rem;", ":0 0.75rem 0 1rem;", ":0.625rem;", ":0rem;", ":1.5rem;", ":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-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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":-0.25rem;", ":1.75rem auto auto -0.875rem;", ":1.75rem -0.875rem auto auto;", ":1.75rem -2.488rem auto auto;"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.borderWidth, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.clearLabelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.hintMargin, _TextField.textFieldTokens.hintTargetSize, _TextField.textFieldTokens.hintInnerLabelPlacementOffset, _TextField.textFieldTokens.clearHintInnerLabelPlacementOffset, _TextField.textFieldTokens.titleCaptionInnerLabelOffset, _TextField.textFieldTokens.titleCaptionFontFamily, _TextField.textFieldTokens.titleCaptionFontSize, _TextField.textFieldTokens.titleCaptionFontStyle, _TextField.textFieldTokens.titleCaptionFontWeight, _TextField.textFieldTokens.titleCaptionLetterSpacing, _TextField.textFieldTokens.titleCaptionLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.textBeforeMargin, _TextField.textFieldTokens.textAfterMargin, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipMarginRight, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPadding, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight, _TextField.textFieldTokens.labelInnerFontFamily, _TextField.textFieldTokens.labelInnerFontSize, _TextField.textFieldTokens.labelInnerFontStyle, _TextField.textFieldTokens.labelInnerFontWeight, _TextField.textFieldTokens.labelInnerLetterSpacing, _TextField.textFieldTokens.labelInnerLineHeight, _TextField.textFieldTokens.indicatorSizeInner, _TextField.textFieldTokens.indicatorSizeOuter, _TextField.textFieldTokens.indicatorLabelPlacementInner, _TextField.textFieldTokens.indicatorLabelPlacementOuter, _TextField.textFieldTokens.indicatorLabelPlacementInnerRight, _TextField.textFieldTokens.indicatorLabelPlacementOuterRight, _TextField.textFieldTokens.indicatorLabelPlacementHintOuterRight, _TextField.textFieldTokens.clearIndicatorLabelPlacementInner, _TextField.textFieldTokens.clearIndicatorLabelPlacementInnerRight, _TextField.textFieldTokens.clearIndicatorHintInnerRight),
23
24
  l: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":0.375rem;", ":0.875rem;", ":0.0625rem;", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":-0.0625rem -0.438rem -0.0625rem 0.75rem;", ":0.25rem;", ":-0.438rem -0.438rem -0.438rem 0;", ":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);", ":0.75rem;", ":0.25rem;", ":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);", ":-0.688rem -0.5rem;", ":2.375rem;", ":0.563rem -2.938rem auto auto;", ":0.563rem -2.188rem auto auto;", ":0.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);", ":0.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);", ":0.5625rem 0 0.125rem 0;", ":1.5625rem 0 0.5625rem 0;", ":0.25rem;", ":0.5rem;", ":auto;", ":2.75rem;", ":0 0.75rem 0 1rem;", ":0.625rem;", ":0rem;", ":1.5rem;", ":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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":1.5rem auto auto -0.875rem;", ":1.5rem -0.875rem auto auto;", ":1.5rem -2.488rem auto auto;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.borderWidth, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.rightContentWithHintMargin, _TextField.textFieldTokens.contentRightWrapperGap, _TextField.textFieldTokens.contentRightWrapperMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.clearLabelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.hintMargin, _TextField.textFieldTokens.hintTargetSize, _TextField.textFieldTokens.hintInnerLabelPlacementOffset, _TextField.textFieldTokens.clearHintInnerLabelPlacementOffset, _TextField.textFieldTokens.titleCaptionInnerLabelOffset, _TextField.textFieldTokens.titleCaptionFontFamily, _TextField.textFieldTokens.titleCaptionFontSize, _TextField.textFieldTokens.titleCaptionFontStyle, _TextField.textFieldTokens.titleCaptionFontWeight, _TextField.textFieldTokens.titleCaptionLetterSpacing, _TextField.textFieldTokens.titleCaptionLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPadding, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight, _TextField.textFieldTokens.indicatorSizeInner, _TextField.textFieldTokens.indicatorSizeOuter, _TextField.textFieldTokens.indicatorLabelPlacementInner, _TextField.textFieldTokens.indicatorLabelPlacementOuter, _TextField.textFieldTokens.indicatorLabelPlacementInnerRight, _TextField.textFieldTokens.indicatorLabelPlacementOuterRight, _TextField.textFieldTokens.clearIndicatorLabelPlacementInner, _TextField.textFieldTokens.clearIndicatorLabelPlacementInnerRight, _TextField.textFieldTokens.clearIndicatorHintInnerRight, _TextField.textFieldTokens.textBeforeMargin, _TextField.textFieldTokens.textAfterMargin),
24
25
  m: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":0.875rem 1rem 0.875rem 1rem;", ":0.375rem;", ":0.75rem;", ":0.0625rem;", ":-0.125rem 0.375rem -0.125rem -0.125rem;", ":-0.125rem -0.125rem -0.125rem 0.75rem;", ":-0.125rem -0.438rem -0.125rem 0.75rem;", ":0.25rem;", ":-0.438rem -0.438rem -0.438rem 0;", ":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.625rem;", ":0.25rem;", ":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.688rem -0.5rem;", ":2.375rem;", ":0.312rem -2.813rem auto auto;", ":0.312rem -2.188rem auto auto;", ":0.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);", ":0.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);", ":0.375rem 0 0.125rem 0;", ":1.375rem 0 0.375rem 0;", ":0.25rem;", ":0.375rem;", ":auto;", ":2.25rem;", ":0 0.625rem 0 0.875rem;", ":0.5rem;", ":0rem;", ":1.25rem;", ":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.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.375rem auto auto -0.75rem;", ":0 0 auto auto;", ":0.25rem -0.6875rem auto auto;", ":1.25rem auto auto -0.875rem;", ":1.25rem -0.875rem auto auto;", ":1.25rem -2.488rem auto auto;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.borderWidth, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.rightContentWithHintMargin, _TextField.textFieldTokens.contentRightWrapperGap, _TextField.textFieldTokens.contentRightWrapperMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.clearLabelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.hintMargin, _TextField.textFieldTokens.hintTargetSize, _TextField.textFieldTokens.hintInnerLabelPlacementOffset, _TextField.textFieldTokens.clearHintInnerLabelPlacementOffset, _TextField.textFieldTokens.titleCaptionInnerLabelOffset, _TextField.textFieldTokens.titleCaptionFontFamily, _TextField.textFieldTokens.titleCaptionFontSize, _TextField.textFieldTokens.titleCaptionFontStyle, _TextField.textFieldTokens.titleCaptionFontWeight, _TextField.textFieldTokens.titleCaptionLetterSpacing, _TextField.textFieldTokens.titleCaptionLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPadding, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight, _TextField.textFieldTokens.indicatorSizeInner, _TextField.textFieldTokens.indicatorSizeOuter, _TextField.textFieldTokens.indicatorLabelPlacementInner, _TextField.textFieldTokens.indicatorLabelPlacementOuter, _TextField.textFieldTokens.indicatorLabelPlacementInnerRight, _TextField.textFieldTokens.indicatorLabelPlacementOuterRight, _TextField.textFieldTokens.clearIndicatorLabelPlacementInner, _TextField.textFieldTokens.clearIndicatorLabelPlacementInnerRight, _TextField.textFieldTokens.clearIndicatorHintInnerRight, _TextField.textFieldTokens.textBeforeMargin, _TextField.textFieldTokens.textAfterMargin),
25
26
  s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":0.375rem;", ":0.625rem;", ":0.0625rem;", ":-0.1875rem 0.25rem -0.1875rem -0.125rem;", ":-0.1875rem -0.125rem -0.1875rem 0.75rem;", ":-0.1875rem -0.438rem -0.1875rem 0.75rem;", ":0.25rem;", ":-0.438rem -0.438rem -0.438rem 0;", ":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);", ":0.5rem;", ":0.25rem;", ":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);", ":-0.688rem -0.5rem;", ":2.375rem;", ":0.062rem -2.688rem auto auto;", ":0.062rem -2.188rem auto auto;", ":0.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);", ":0.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);", ":0.3125rem 0 0 0;", ":1.0625rem 0 0.3125rem 0;", ":0.25rem;", ":0.25rem;", ":auto;", ":1.75rem;", ":0 0.5rem 0 0.75rem;", ":0.375rem;", ":0rem;", ":1rem;", ":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);", ":0.375rem;", ":0.375rem;", ":0 0 0 0;", ":0.3125rem auto auto -0.6875rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":1.063rem auto auto -0.75rem;", ":1.063rem -0.75rem auto auto;", ":1.063rem -2.238rem auto auto;", ":0 0.25rem 0 0;", ":0 0 0 0.25rem;"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.borderWidth, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.rightContentWithHintMargin, _TextField.textFieldTokens.contentRightWrapperGap, _TextField.textFieldTokens.contentRightWrapperMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.clearLabelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.hintMargin, _TextField.textFieldTokens.hintTargetSize, _TextField.textFieldTokens.hintInnerLabelPlacementOffset, _TextField.textFieldTokens.clearHintInnerLabelPlacementOffset, _TextField.textFieldTokens.titleCaptionInnerLabelOffset, _TextField.textFieldTokens.titleCaptionFontFamily, _TextField.textFieldTokens.titleCaptionFontSize, _TextField.textFieldTokens.titleCaptionFontStyle, _TextField.textFieldTokens.titleCaptionFontWeight, _TextField.textFieldTokens.titleCaptionLetterSpacing, _TextField.textFieldTokens.titleCaptionLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPadding, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight, _TextField.textFieldTokens.indicatorSizeInner, _TextField.textFieldTokens.indicatorSizeOuter, _TextField.textFieldTokens.indicatorLabelPlacementInner, _TextField.textFieldTokens.indicatorLabelPlacementOuter, _TextField.textFieldTokens.indicatorLabelPlacementInnerRight, _TextField.textFieldTokens.indicatorLabelPlacementOuterRight, _TextField.textFieldTokens.clearIndicatorLabelPlacementInner, _TextField.textFieldTokens.clearIndicatorLabelPlacementInnerRight, _TextField.textFieldTokens.clearIndicatorHintInnerRight, _TextField.textFieldTokens.textBeforeMargin, _TextField.textFieldTokens.textAfterMargin),
@@ -41,7 +42,7 @@ var config = exports.config = {
41
42
  negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative-hover);", ":var(--on-dark-text-primary);", ":var(--surface-negative-active);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--surface-negative);", ":var(--on-dark-text-primary);", ":var(--on-dark-text-secondary);", ":1;"], _TextField.textFieldTokens.chipColor, _TextField.textFieldTokens.chipBackground, _TextField.textFieldTokens.chipColorHover, _TextField.textFieldTokens.chipBackgroundHover, _TextField.textFieldTokens.chipColorActive, _TextField.textFieldTokens.chipBackgroundActive, _TextField.textFieldTokens.chipBackgroundReadOnly, _TextField.textFieldTokens.chipColorReadOnly, _TextField.textFieldTokens.chipBackgroundReadOnlyHover, _TextField.textFieldTokens.chipColorReadOnlyHover, _TextField.textFieldTokens.chipCloseIconColor, _TextField.textFieldTokens.chipOpacityReadonly)
42
43
  },
43
44
  hintView: {
44
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-solid-card-brightness);", ":var(--shadow-down-hard-m,0px 4px 12px 0px rgba(0,0,0,0.16),0px 1px 4px 0px rgba(0,0,0,0.08));", ":var(--text-primary);", ":var(--surface-solid-card);"], _TextField.textFieldTokens.tooltipBackgroundColor, _TextField.textFieldTokens.tooltipBoxShadow, _TextField.textFieldTokens.tooltipColor, _TextField.textFieldTokens.tooltipArrowBackground)
45
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--surface-solid-card-brightness);", ":var(--shadow-down-hard-m,0px 4px 12px 0px rgba(0,0,0,0.16),0px 1px 4px 0px rgba(0,0,0,0.08));", ":var(--text-primary);", ":var(--surface-solid-card-brightness);"], _TextField.textFieldTokens.tooltipBackgroundColor, _TextField.textFieldTokens.tooltipBoxShadow, _TextField.textFieldTokens.tooltipColor, _TextField.textFieldTokens.tooltipArrowBackground)
45
46
  },
46
47
  hintSize: {
47
48
  m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.6875rem;", ":0.875rem;", ":0.6875rem;", ":0.875rem;", ":2.5rem;", ":0.625rem;", ":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);", ":0.375rem;", ":1.25rem;", ":1.25rem;", ":url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggY2xpcC1ydWxlPSJldmVub2RkIiBkPSJtMC4xNywxMS44M2wyMCwwYy01LjUyLDAgLTEwLDMuNTkgLTEwLDhjMCwtNC40MSAtNC40OCwtOCAtMTAsLTh6IiBmaWxsPSIjMTcxNzE3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGlkPSJUYWlsIi8+Cjwvc3ZnPg==\");", ":0.5rem;", ":0.625rem;"], _TextField.textFieldTokens.tooltipPaddingTop, _TextField.textFieldTokens.tooltipPaddingRight, _TextField.textFieldTokens.tooltipPaddingBottom, _TextField.textFieldTokens.tooltipPaddingLeft, _TextField.textFieldTokens.tooltipMinHeight, _TextField.textFieldTokens.tooltipBorderRadius, _TextField.textFieldTokens.tooltipTextFontFamily, _TextField.textFieldTokens.tooltipTextFontSize, _TextField.textFieldTokens.tooltipTextFontStyle, _TextField.textFieldTokens.tooltipTextFontWeight, _TextField.textFieldTokens.tooltipTextFontLetterSpacing, _TextField.textFieldTokens.tooltipTextFontLineHeight, _TextField.textFieldTokens.tooltipContentLeftMargin, _TextField.textFieldTokens.tooltipArrowMaskWidth, _TextField.textFieldTokens.tooltipArrowMaskHeight, _TextField.textFieldTokens.tooltipArrowMaskImage, _TextField.textFieldTokens.tooltipArrowHeight, _TextField.textFieldTokens.tooltipArrowEdgeMargin),
@@ -51,7 +52,7 @@ var config = exports.config = {
51
52
  "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _TextField.textFieldTokens.disabledOpacity)
52
53
  },
53
54
  readOnly: {
54
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;", ":var(--text-primary);", ":var(--surface-clear);", ":var(--outline-transparent-primary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-transparent-primary);"], _TextField.textFieldTokens.readOnlyOpacity, _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.borderColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.leftHelperColorReadOnly, _TextField.textFieldTokens.titleCaptionColorReadOnly, _TextField.textFieldTokens.labelColorReadOnly, _TextField.textFieldTokens.dividerColorReadOnly)
55
+ "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--surface-transparent-primary);", ":0.4;", ":var(--text-primary);", ":var(--surface-clear);", ":var(--outline-transparent-primary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-transparent-primary);", ":var(--text-primary);", ":var(--surface-transparent-primary);"], _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.readOnlyOpacity, _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.borderColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.leftHelperColorReadOnly, _TextField.textFieldTokens.titleCaptionColorReadOnly, _TextField.textFieldTokens.labelColorReadOnly, _TextField.textFieldTokens.dividerColorReadOnly, _TextField.textFieldTokens.labelColorReadOnly, _TextField.textFieldTokens.dividerColorReadOnly)
55
56
  }
56
57
  }
57
58
  };
@@ -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 sizes = ['l', 'm', 's', 'xs'];
19
- const views = ['default', 'positive', 'warning', 'negative'];
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',
@@ -827,4 +827,15 @@ Object.keys(_Carousel).forEach(function (key) {
827
827
  return _Carousel[key];
828
828
  }
829
829
  });
830
+ });
831
+ var _PaginationDots = /*#__PURE__*/require("./components/PaginationDots");
832
+ Object.keys(_PaginationDots).forEach(function (key) {
833
+ if (key === "default" || key === "__esModule") return;
834
+ if (key in exports && exports[key] === _PaginationDots[key]) return;
835
+ Object.defineProperty(exports, key, {
836
+ enumerable: true,
837
+ get: function get() {
838
+ return _PaginationDots[key];
839
+ }
840
+ });
830
841
  });
@@ -12,7 +12,8 @@ export var useMonths = function useMonths(_ref) {
12
12
  min = _ref.min,
13
13
  max = _ref.max,
14
14
  _ref$locale = _ref.locale,
15
- locale = _ref$locale === void 0 ? 'ru' : _ref$locale;
15
+ locale = _ref$locale === void 0 ? 'ru' : _ref$locale,
16
+ includeEdgeDates = _ref.includeEdgeDates;
16
17
  return useMemo(function () {
17
18
  var months = SHORT_MONTH_NAME[locale].map(function (monthName, monthIndex) {
18
19
  return {
@@ -37,6 +38,7 @@ export var useMonths = function useMonths(_ref) {
37
38
  type: CalendarState.Months,
38
39
  min: min,
39
40
  max: max,
41
+ includeEdgeDates: includeEdgeDates,
40
42
  eventList: eventList,
41
43
  disabledList: disabledList
42
44
  });
@@ -10,7 +10,8 @@ export var useQuarters = function useQuarters(_ref) {
10
10
  eventList = _ref.eventList,
11
11
  disabledList = _ref.disabledList,
12
12
  min = _ref.min,
13
- max = _ref.max;
13
+ max = _ref.max,
14
+ includeEdgeDates = _ref.includeEdgeDates;
14
15
  return useMemo(function () {
15
16
  var quarters = QUARTER_NAMES.map(function (quarterName) {
16
17
  var _quarterDates$quarter = quarterDates[quarterName],
@@ -36,6 +37,7 @@ export var useQuarters = function useQuarters(_ref) {
36
37
  type: CalendarState.Quarters,
37
38
  min: min,
38
39
  max: max,
40
+ includeEdgeDates: includeEdgeDates,
39
41
  eventList: eventList,
40
42
  disabledList: disabledList
41
43
  });
@@ -11,7 +11,8 @@ export var useYears = function useYears(_ref) {
11
11
  eventList = _ref.eventList,
12
12
  disabledList = _ref.disabledList,
13
13
  min = _ref.min,
14
- max = _ref.max;
14
+ max = _ref.max,
15
+ includeEdgeDates = _ref.includeEdgeDates;
15
16
  return useMemo(function () {
16
17
  // type-coverage:ignore-next-line
17
18
  var years = Array.from(Array(YEAR_RENDER_COUNT), function (_, i) {
@@ -36,6 +37,7 @@ export var useYears = function useYears(_ref) {
36
37
  type: CalendarState.Years,
37
38
  min: min,
38
39
  max: max,
40
+ includeEdgeDates: includeEdgeDates,
39
41
  eventList: eventList,
40
42
  disabledList: disabledList
41
43
  });
@@ -42,7 +42,7 @@ var normalizeDate = function normalizeDate(date, type) {
42
42
  date.setMonth(0);
43
43
  }
44
44
  };
45
- var isDisabledNextDate = function isDisabledNextDate(_ref, type, max) {
45
+ var isDisabledNextDate = function isDisabledNextDate(_ref, type, max, includeEdgeDates) {
46
46
  var year = _ref.year,
47
47
  monthIndex = _ref.monthIndex,
48
48
  day = _ref.day;
@@ -54,13 +54,13 @@ var isDisabledNextDate = function isDisabledNextDate(_ref, type, max) {
54
54
  var currentDate = new Date(year, monthIndex, day);
55
55
  dateOperationHandler[type].add(currentDate);
56
56
  var isOut = true;
57
- while (isOut && currentDate <= maxDate) {
58
- isOut = maxDate <= currentDate;
57
+ while (isOut && includeEdgeDates ? currentDate < maxDate : currentDate <= maxDate) {
58
+ isOut = includeEdgeDates ? maxDate < currentDate : maxDate <= currentDate;
59
59
  dateOperationHandler[type].add(currentDate);
60
60
  }
61
61
  return isOut;
62
62
  };
63
- var isDisabledPreviousDate = function isDisabledPreviousDate(_ref2, type, min) {
63
+ var isDisabledPreviousDate = function isDisabledPreviousDate(_ref2, type, min, includeEdgeDates) {
64
64
  var year = _ref2.year,
65
65
  monthIndex = _ref2.monthIndex,
66
66
  day = _ref2.day;
@@ -72,54 +72,58 @@ var isDisabledPreviousDate = function isDisabledPreviousDate(_ref2, type, min) {
72
72
  var currentDate = new Date(year, monthIndex, day);
73
73
  dateOperationHandler[type].subtract(currentDate);
74
74
  var isOut = true;
75
- while (isOut && currentDate >= minDate) {
76
- isOut = minDate >= currentDate;
75
+ while (isOut && includeEdgeDates ? currentDate > minDate : currentDate >= minDate) {
76
+ isOut = includeEdgeDates ? minDate > currentDate : minDate >= currentDate;
77
77
  dateOperationHandler[type].subtract(currentDate);
78
78
  }
79
79
  return isOut;
80
80
  };
81
- var getDisabledDates = function getDisabledDates(list, type, min, max) {
81
+ var getDisabledDates = function getDisabledDates(list, type, min, max, includeEdgeDates) {
82
82
  var disabledDate = [];
83
- if (isDisabledPreviousDate(list[0], type, min)) {
83
+ if (isDisabledPreviousDate(list[0], type, min, includeEdgeDates)) {
84
84
  disabledDate.push('previous');
85
85
  }
86
- if (isDisabledNextDate(list[list.length - 1], type, max)) {
86
+ if (isDisabledNextDate(list[list.length - 1], type, max, includeEdgeDates)) {
87
87
  disabledDate.push('next');
88
88
  }
89
89
  return disabledDate.join(',');
90
90
  };
91
- var isDisabledArrowLeft = function isDisabledArrowLeft(date, min) {
91
+ var isDisabledArrowLeft = function isDisabledArrowLeft(date, min, includeEdgeDates) {
92
92
  var currentDate = new Date(date);
93
93
  currentDate.setDate(currentDate.getDate() - 1);
94
- return min && min >= currentDate || min && min >= date;
94
+ var disableCondition = min && (includeEdgeDates ? min > currentDate : min >= currentDate);
95
+ return disableCondition;
95
96
  };
96
- var isDisabledArrowRight = function isDisabledArrowRight(date, max) {
97
+ var isDisabledArrowRight = function isDisabledArrowRight(date, max, includeEdgeDates) {
97
98
  var currentDate = new Date(date);
98
99
  currentDate.setDate(currentDate.getDate() + 1);
99
- return max && max <= currentDate || max && max <= date;
100
+ var disableCondition = max && (includeEdgeDates ? max < currentDate : max <= currentDate);
101
+ return disableCondition;
100
102
  };
101
- var isDisabledArrowUp = function isDisabledArrowUp(date, min) {
103
+ var isDisabledArrowUp = function isDisabledArrowUp(date, min, includeEdgeDates) {
102
104
  var currentDate = new Date(date);
103
105
  currentDate.setDate(date.getDate() - 7);
104
- return min && min >= currentDate;
106
+ var disableCondition = min && (includeEdgeDates ? min > currentDate : min >= currentDate);
107
+ return disableCondition;
105
108
  };
106
- var isDisabledArrowDown = function isDisabledArrowDown(date, max) {
109
+ var isDisabledArrowDown = function isDisabledArrowDown(date, max, includeEdgeDates) {
107
110
  var currentDate = new Date(date);
108
111
  currentDate.setDate(date.getDate() + 7);
109
- return max && max <= currentDate;
112
+ var disableCondition = max && (includeEdgeDates ? max < currentDate : max <= currentDate);
113
+ return disableCondition;
110
114
  };
111
- var getDisabledArrowKey = function getDisabledArrowKey(currentDate, min, max) {
115
+ var getDisabledArrowKey = function getDisabledArrowKey(currentDate, min, max, includeEdgeDates) {
112
116
  var disabledArrowKey = [];
113
- if (isDisabledArrowLeft(currentDate, min)) {
117
+ if (isDisabledArrowLeft(currentDate, min, includeEdgeDates)) {
114
118
  disabledArrowKey.push('left');
115
119
  }
116
- if (isDisabledArrowRight(currentDate, max)) {
120
+ if (isDisabledArrowRight(currentDate, max, includeEdgeDates)) {
117
121
  disabledArrowKey.push('right');
118
122
  }
119
- if (isDisabledArrowDown(currentDate, max)) {
123
+ if (isDisabledArrowDown(currentDate, max, includeEdgeDates)) {
120
124
  disabledArrowKey.push('down');
121
125
  }
122
- if (isDisabledArrowUp(currentDate, min)) {
126
+ if (isDisabledArrowUp(currentDate, min, includeEdgeDates)) {
123
127
  disabledArrowKey.push('up');
124
128
  }
125
129
  return disabledArrowKey.join(',');
@@ -148,7 +152,7 @@ export var getDatesWithModifications = function getDatesWithModifications(_ref3)
148
152
  var date = _ref5.date;
149
153
  return date;
150
154
  });
151
- var disabledDates = getDisabledDates(datesList, type, min, max);
155
+ var disabledDates = getDisabledDates(datesList, type, min, max, includeEdgeDates);
152
156
  return dates.map(function (dateItem) {
153
157
  var date = dateItem.date;
154
158
  var year = date.year,
@@ -173,7 +177,7 @@ export var getDatesWithModifications = function getDatesWithModifications(_ref3)
173
177
  dateItem.events = eventsMap.get(keyDate);
174
178
  dateItem.disabled = disabledDatesMap.has(keyDate) || isOutOfMinMaxRange;
175
179
  dateItem.isOutOfMinMaxRange = isOutOfMinMaxRange;
176
- dateItem.disabledArrowKey = getDisabledArrowKey(currentDate, min, max);
180
+ dateItem.disabledArrowKey = getDisabledArrowKey(currentDate, min, max, includeEdgeDates);
177
181
  dateItem.disabledDates = disabledDates;
178
182
  return dateItem;
179
183
  });
@@ -1,5 +1,5 @@
1
1
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
- var _excluded = ["className", "style", "title", "text", "contentBefore", "contentBeforeSizing", "size", "view", "stretch", "width", "height"];
2
+ var _excluded = ["className", "style", "title", "text", "contentBefore", "contentBeforeSizing", "size", "view", "stretch", "width", "height", "hasClose", "onCloseButtonClick"];
3
3
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
4
4
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
5
5
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -17,9 +17,10 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
17
17
  import React, { forwardRef, useEffect, useLayoutEffect, useRef, useState } from 'react';
18
18
  import { useResizeObserver } from '@salutejs/plasma-core';
19
19
  import { canUseDOM, cx, getSizeValueFromProp } from "../../utils";
20
+ import { IconCrossThin } from "../_Icon/Icons/IconCrossThin";
20
21
  import { base as viewCSS } from "./variations/_view/base";
21
22
  import { base as sizeCSS } from "./variations/_size/base";
22
- import { base, ContentBefore, ContentWrapper, Text, TextHelper, Title, TitleHelper } from "./Note.styles";
23
+ import { base, CloseIconWrapper, ContentBefore, ContentWrapper, Text, TextHelper, Title, TitleHelper } from "./Note.styles";
23
24
  import { classes, privateTokens, tokens } from "./Note.tokens";
24
25
  export var noteRoot = function noteRoot(Root) {
25
26
  return /*#__PURE__*/forwardRef(function (_ref, outerRef) {
@@ -35,6 +36,8 @@ export var noteRoot = function noteRoot(Root) {
35
36
  stretch = _ref.stretch,
36
37
  width = _ref.width,
37
38
  height = _ref.height,
39
+ hasClose = _ref.hasClose,
40
+ onCloseButtonClick = _ref.onCloseButtonClick,
38
41
  rest = _objectWithoutProperties(_ref, _excluded);
39
42
  var _useState = useState(text),
40
43
  _useState2 = _slicedToArray(_useState, 2),
@@ -100,11 +103,22 @@ export var noteRoot = function noteRoot(Root) {
100
103
  ref: contentBeforeRef
101
104
  }, contentBefore), /*#__PURE__*/React.createElement(ContentWrapper, {
102
105
  ref: contentWrapperRef
103
- }, title && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Title, null, title), /*#__PURE__*/React.createElement(TitleHelper, {
106
+ }, title && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Title, {
107
+ hasClose: hasClose
108
+ }, title), /*#__PURE__*/React.createElement(TitleHelper, {
104
109
  ref: titleHelperRef
105
110
  }, "C")), innerText && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, null, innerText, /*#__PURE__*/React.createElement(TextHelper, {
106
111
  ref: textRenderHelperRef
107
- }, "C")))));
112
+ }, "C")))), hasClose && /*#__PURE__*/React.createElement(CloseIconWrapper, {
113
+ view: "clear",
114
+ size: "s",
115
+ onClick: onCloseButtonClick,
116
+ className: classes.closeIcon
117
+ }, /*#__PURE__*/React.createElement(IconCrossThin, {
118
+ size: "s",
119
+ sizeCustomProperty: tokens.closeIconSize,
120
+ color: "inherit"
121
+ })));
108
122
  });
109
123
  };
110
124
  export var noteConfig = {
@@ -1,5 +1,10 @@
1
1
  import styled from 'styled-components';
2
2
  import { css } from 'styled-components';
3
+ import { component, mergeConfig } from "../../engines";
4
+ import { buttonConfig } from "../Button";
5
+ import { tokens } from "./Note.tokens";
6
+ var mergedButtonConfig = /*#__PURE__*/mergeConfig(buttonConfig);
7
+ var Button = /*#__PURE__*/component(mergedButtonConfig);
3
8
  export var base = /*#__PURE__*/css(["position:relative;display:flex;box-sizing:border-box;"]);
4
9
  export var ContentBefore = /*#__PURE__*/styled.div.withConfig({
5
10
  componentId: "plasma-new-hope__sc-2xk8rv-0"
@@ -9,7 +14,10 @@ export var ContentWrapper = /*#__PURE__*/styled.div.withConfig({
9
14
  })(["display:flex;flex-direction:column;box-sizing:border-box;"]);
10
15
  export var Title = /*#__PURE__*/styled.div.withConfig({
11
16
  componentId: "plasma-new-hope__sc-2xk8rv-2"
12
- })([""]);
17
+ })(["padding-right:", ";box-sizing:border-box;"], function (_ref) {
18
+ var hasClose = _ref.hasClose;
19
+ return hasClose ? "var(".concat(tokens.titlePaddingRight, ")") : 0;
20
+ });
13
21
  export var TitleHelper = /*#__PURE__*/styled.div.withConfig({
14
22
  componentId: "plasma-new-hope__sc-2xk8rv-3"
15
23
  })(["visibility:hidden;position:absolute;z-index:-9999;opacity:0;"]);
@@ -18,4 +26,7 @@ export var Text = /*#__PURE__*/styled.span.withConfig({
18
26
  })(["display:block;position:relative;"]);
19
27
  export var TextHelper = /*#__PURE__*/styled.span.withConfig({
20
28
  componentId: "plasma-new-hope__sc-2xk8rv-5"
21
- })(["visibility:hidden;position:absolute;z-index:-9999;opacity:0;top:0;left:0;"]);
29
+ })(["visibility:hidden;position:absolute;z-index:-9999;opacity:0;top:0;left:0;"]);
30
+ export var CloseIconWrapper = /*#__PURE__*/styled(Button).withConfig({
31
+ componentId: "plasma-new-hope__sc-2xk8rv-6"
32
+ })(["position:absolute;right:var(", ");top:var(", ");width:var(", ");height:var(", ");color:var(", ");:hover{color:var(", ");}"], tokens.closeIconRight, tokens.closeIconTop, tokens.closeIconButtonSize, tokens.closeIconButtonSize, tokens.closeIconColor, tokens.closeIconColorOnHover);
@@ -1,5 +1,6 @@
1
1
  export var classes = {
2
2
  stretch: 'note-stretch',
3
+ closeIcon: 'note-close-icon',
3
4
  contentAlignCenter: 'note-content-align-center'
4
5
  };
5
6
  export var privateTokens = {
@@ -26,10 +27,17 @@ export var tokens = {
26
27
  titleFontWeight: '--plasma-note-title-font-weight',
27
28
  titleLetterSpacing: '--plasma-note-title-letter-spacing',
28
29
  titleLineHeight: '--plasma-note-title-line-height',
30
+ titlePaddingRight: '--plasma-note-title-padding-right',
29
31
  textFontFamily: '--plasma-note-text-font-family',
30
32
  textFontSize: '--plasma-note-text-font-size',
31
33
  textFontStyle: '--plasma-note-text-font-style',
32
34
  textFontWeight: '--plasma-note-text-font-weight',
33
35
  textLetterSpacing: '--plasma-note-text-letter-spacing',
34
- textLineHeight: '--plasma-note-text-line-height'
36
+ textLineHeight: '--plasma-note-text-line-height',
37
+ closeIconTop: '--plasma-note-close-icon-top',
38
+ closeIconRight: '--plasma-note-close-icon-right',
39
+ closeIconColor: '--plasma-note-close-icon-color',
40
+ closeIconColorOnHover: '--plasma-note-close-icon-color-on-hover',
41
+ closeIconSize: '--plasma-note-close-icon-size',
42
+ closeIconButtonSize: '--plasma-note-close-icon-button-size'
35
43
  };
@@ -20,13 +20,18 @@ export var composeNumberFormat = function composeNumberFormat(InputComponent) {
20
20
  onChange(changeEvent, values);
21
21
  }
22
22
  };
23
+ var InputComponentWithoutEllipsis = /*#__PURE__*/forwardRef(function (props, ref) {
24
+ return /*#__PURE__*/React.createElement(InputComponent, _extends({
25
+ ref: ref,
26
+ _textEllipsisDisable: true
27
+ }, props));
28
+ });
23
29
  return /*#__PURE__*/React.createElement(NumericFormat, _extends({
24
30
  thousandSeparator: thousandSeparator,
25
31
  decimalScale: decimalScale,
26
32
  decimalSeparator: decimalSeparator,
27
- customInput: InputComponent,
33
+ customInput: InputComponentWithoutEllipsis,
28
34
  getInputRef: outerRef,
29
- _textEllipsisDisable: true,
30
35
  onValueChange: handleChangeValue
31
36
  }, rest));
32
37
  });
@@ -0,0 +1,26 @@
1
+ import styled from 'styled-components';
2
+ /**
3
+ * Элемент пагинации точками.
4
+ * Стилизованный компонент, обладающий всеми свойствами ``div``.
5
+ */
6
+ export var DotBase = /*#__PURE__*/styled.li.withConfig({
7
+ componentId: "plasma-new-hope__sc-1lu8gfj-0"
8
+ })(["width:", ";height:0.375rem;border-radius:1rem;background:", ";transition:width 0.1s ease-in-out,background 0.3s ease-in-out;font-size:0.5rem;& + &{margin-left:0.375rem;}&:focus{outline:0 none;}"], function (_ref) {
9
+ var isActive = _ref.isActive;
10
+ return isActive ? '1.75rem' : '0.375rem';
11
+ }, function (_ref2) {
12
+ var isActive = _ref2.isActive;
13
+ return isActive ? 'var(--text-primary)' : 'var(--surface-transparent-tertiary)';
14
+ });
15
+
16
+ /**
17
+ * Элемент пагинации точками.
18
+ * Стилизованный компонент, обладающий всеми свойствами ``div``.
19
+ * @deprecated
20
+ */
21
+ export var PaginationDot = /*#__PURE__*/styled(DotBase).withConfig({
22
+ componentId: "plasma-new-hope__sc-1lu8gfj-1"
23
+ })(["cursor:pointer;background:", ";&:hover{background:var(--text-accent);}"], function (_ref3) {
24
+ var isActive = _ref3.isActive;
25
+ return isActive ? 'var(--text-accent)' : 'var(--surface-transparent-tertiary)';
26
+ });
@@ -0,0 +1,18 @@
1
+ import styled from 'styled-components';
2
+
3
+ /**
4
+ * Оборачивающий компонент для пагинации точками.
5
+ * Стилизованный компонент, обладающий всеми свойствами ``div``.
6
+ */
7
+ export var DotsBase = /*#__PURE__*/styled.ul.withConfig({
8
+ componentId: "plasma-new-hope__sc-1ritf0l-0"
9
+ })(["display:flex;flex-wrap:wrap;align-self:center;align-items:center;margin:0;padding:0;list-style:none;"]);
10
+
11
+ /**
12
+ * Оборачивающий компонент для пагинации точками.
13
+ * Стилизованный компонент, обладающий всеми свойствами ``div``.
14
+ * @deprecated
15
+ */
16
+ export var PaginationDots = /*#__PURE__*/styled(DotsBase).withConfig({
17
+ componentId: "plasma-new-hope__sc-1ritf0l-1"
18
+ })([""]);