@salutejs/plasma-new-hope 0.137.0-canary.1405.10662876535.0 → 0.137.0-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (199) hide show
  1. package/cjs/components/TextField/TextField.js +1 -1
  2. package/cjs/components/TextField/TextField.js.map +1 -1
  3. package/cjs/components/TextField/TextField.tokens.js +1 -2
  4. package/cjs/components/TextField/TextField.tokens.js.map +1 -1
  5. package/cjs/index.css +0 -12
  6. package/cjs/index.js +0 -7
  7. package/cjs/index.js.map +1 -1
  8. package/emotion/cjs/components/TextField/TextField.js +2 -2
  9. package/emotion/cjs/components/TextField/TextField.tokens.js +1 -2
  10. package/emotion/cjs/components/TextField/index.js +0 -6
  11. package/emotion/cjs/index.js +0 -11
  12. package/emotion/es/components/TextField/TextField.js +2 -2
  13. package/emotion/es/components/TextField/TextField.tokens.js +1 -2
  14. package/emotion/es/components/TextField/index.js +1 -1
  15. package/emotion/es/index.js +0 -1
  16. package/es/components/TextField/TextField.js +1 -1
  17. package/es/components/TextField/TextField.js.map +1 -1
  18. package/es/components/TextField/TextField.tokens.js +1 -2
  19. package/es/components/TextField/TextField.tokens.js.map +1 -1
  20. package/es/index.css +0 -12
  21. package/es/index.js +1 -3
  22. package/es/index.js.map +1 -1
  23. package/package.json +4 -4
  24. package/styled-components/cjs/components/TextField/TextField.js +1 -1
  25. package/styled-components/cjs/components/TextField/TextField.tokens.js +1 -2
  26. package/styled-components/cjs/components/TextField/index.js +0 -6
  27. package/styled-components/cjs/index.js +0 -11
  28. package/styled-components/es/components/TextField/TextField.js +1 -1
  29. package/styled-components/es/components/TextField/TextField.tokens.js +1 -2
  30. package/styled-components/es/components/TextField/index.js +1 -1
  31. package/styled-components/es/index.js +0 -1
  32. package/types/components/TextField/TextField.tokens.d.ts +0 -1
  33. package/types/components/TextField/TextField.tokens.d.ts.map +1 -1
  34. package/types/components/TextField/index.d.ts +1 -1
  35. package/types/components/TextField/index.d.ts.map +1 -1
  36. package/types/index.d.ts +0 -1
  37. package/types/index.d.ts.map +1 -1
  38. package/cjs/components/InputGroup/InputGroup.css +0 -11
  39. package/cjs/components/InputGroup/InputGroup.js +0 -81
  40. package/cjs/components/InputGroup/InputGroup.js.map +0 -1
  41. package/cjs/components/InputGroup/InputGroup.styles.js +0 -9
  42. package/cjs/components/InputGroup/InputGroup.styles.js.map +0 -1
  43. package/cjs/components/InputGroup/InputGroup.styles_1ivl67d.css +0 -1
  44. package/cjs/components/InputGroup/InputGroup.tokens.js +0 -94
  45. package/cjs/components/InputGroup/InputGroup.tokens.js.map +0 -1
  46. package/cjs/components/InputGroup/variations/_gap/base.js +0 -9
  47. package/cjs/components/InputGroup/variations/_gap/base.js.map +0 -1
  48. package/cjs/components/InputGroup/variations/_gap/base_1k4piyx.css +0 -1
  49. package/cjs/components/InputGroup/variations/_orientation/base.js +0 -9
  50. package/cjs/components/InputGroup/variations/_orientation/base.js.map +0 -1
  51. package/cjs/components/InputGroup/variations/_orientation/base_mgs8eg.css +0 -1
  52. package/cjs/components/InputGroup/variations/_shape/base.js +0 -9
  53. package/cjs/components/InputGroup/variations/_shape/base.js.map +0 -1
  54. package/cjs/components/InputGroup/variations/_shape/base_3k0aw7.css +0 -1
  55. package/cjs/components/InputGroup/variations/_size/base.js +0 -9
  56. package/cjs/components/InputGroup/variations/_size/base.js.map +0 -1
  57. package/cjs/components/InputGroup/variations/_size/base_1vk5vms.css +0 -1
  58. package/cjs/components/InputGroup/variations/_stretching/base.js +0 -9
  59. package/cjs/components/InputGroup/variations/_stretching/base.js.map +0 -1
  60. package/cjs/components/InputGroup/variations/_stretching/base_1cr1a83.css +0 -1
  61. package/emotion/cjs/components/InputGroup/InputGroup.js +0 -83
  62. package/emotion/cjs/components/InputGroup/InputGroup.styles.js +0 -17
  63. package/emotion/cjs/components/InputGroup/InputGroup.template-doc.mdx +0 -126
  64. package/emotion/cjs/components/InputGroup/InputGroup.tokens.js +0 -92
  65. package/emotion/cjs/components/InputGroup/InputGroup.types.js +0 -5
  66. package/emotion/cjs/components/InputGroup/index.js +0 -31
  67. package/emotion/cjs/components/InputGroup/variations/_gap/base.js +0 -9
  68. package/emotion/cjs/components/InputGroup/variations/_gap/tokens.json +0 -1
  69. package/emotion/cjs/components/InputGroup/variations/_orientation/base.js +0 -9
  70. package/emotion/cjs/components/InputGroup/variations/_orientation/tokens.json +0 -1
  71. package/emotion/cjs/components/InputGroup/variations/_shape/base.js +0 -11
  72. package/emotion/cjs/components/InputGroup/variations/_shape/tokens.json +0 -1
  73. package/emotion/cjs/components/InputGroup/variations/_size/base.js +0 -10
  74. package/emotion/cjs/components/InputGroup/variations/_size/tokens.json +0 -58
  75. package/emotion/cjs/components/InputGroup/variations/_stretching/base.js +0 -9
  76. package/emotion/cjs/components/InputGroup/variations/_stretching/tokens.json +0 -1
  77. package/emotion/cjs/examples/plasma_b2c/components/InputGroup/InputGroup.config.js +0 -38
  78. package/emotion/cjs/examples/plasma_b2c/components/InputGroup/InputGroup.js +0 -11
  79. package/emotion/cjs/examples/plasma_b2c/components/InputGroup/InputGroup.stories.tsx +0 -116
  80. package/emotion/cjs/examples/plasma_web/components/InputGroup/InputGroup.config.js +0 -38
  81. package/emotion/cjs/examples/plasma_web/components/InputGroup/InputGroup.js +0 -11
  82. package/emotion/cjs/examples/plasma_web/components/InputGroup/InputGroup.stories.tsx +0 -116
  83. package/emotion/es/components/InputGroup/InputGroup.js +0 -74
  84. package/emotion/es/components/InputGroup/InputGroup.styles.js +0 -11
  85. package/emotion/es/components/InputGroup/InputGroup.template-doc.mdx +0 -126
  86. package/emotion/es/components/InputGroup/InputGroup.tokens.js +0 -86
  87. package/emotion/es/components/InputGroup/InputGroup.types.js +0 -1
  88. package/emotion/es/components/InputGroup/index.js +0 -2
  89. package/emotion/es/components/InputGroup/variations/_gap/base.js +0 -3
  90. package/emotion/es/components/InputGroup/variations/_gap/tokens.json +0 -1
  91. package/emotion/es/components/InputGroup/variations/_orientation/base.js +0 -3
  92. package/emotion/es/components/InputGroup/variations/_orientation/tokens.json +0 -1
  93. package/emotion/es/components/InputGroup/variations/_shape/base.js +0 -5
  94. package/emotion/es/components/InputGroup/variations/_shape/tokens.json +0 -1
  95. package/emotion/es/components/InputGroup/variations/_size/base.js +0 -4
  96. package/emotion/es/components/InputGroup/variations/_size/tokens.json +0 -58
  97. package/emotion/es/components/InputGroup/variations/_stretching/base.js +0 -3
  98. package/emotion/es/components/InputGroup/variations/_stretching/tokens.json +0 -1
  99. package/emotion/es/examples/plasma_b2c/components/InputGroup/InputGroup.config.js +0 -32
  100. package/emotion/es/examples/plasma_b2c/components/InputGroup/InputGroup.js +0 -5
  101. package/emotion/es/examples/plasma_b2c/components/InputGroup/InputGroup.stories.tsx +0 -116
  102. package/emotion/es/examples/plasma_web/components/InputGroup/InputGroup.config.js +0 -32
  103. package/emotion/es/examples/plasma_web/components/InputGroup/InputGroup.js +0 -5
  104. package/emotion/es/examples/plasma_web/components/InputGroup/InputGroup.stories.tsx +0 -116
  105. package/es/components/InputGroup/InputGroup.css +0 -11
  106. package/es/components/InputGroup/InputGroup.js +0 -76
  107. package/es/components/InputGroup/InputGroup.js.map +0 -1
  108. package/es/components/InputGroup/InputGroup.styles.js +0 -5
  109. package/es/components/InputGroup/InputGroup.styles.js.map +0 -1
  110. package/es/components/InputGroup/InputGroup.styles_1ivl67d.css +0 -1
  111. package/es/components/InputGroup/InputGroup.tokens.js +0 -89
  112. package/es/components/InputGroup/InputGroup.tokens.js.map +0 -1
  113. package/es/components/InputGroup/variations/_gap/base.js +0 -5
  114. package/es/components/InputGroup/variations/_gap/base.js.map +0 -1
  115. package/es/components/InputGroup/variations/_gap/base_1k4piyx.css +0 -1
  116. package/es/components/InputGroup/variations/_orientation/base.js +0 -5
  117. package/es/components/InputGroup/variations/_orientation/base.js.map +0 -1
  118. package/es/components/InputGroup/variations/_orientation/base_mgs8eg.css +0 -1
  119. package/es/components/InputGroup/variations/_shape/base.js +0 -5
  120. package/es/components/InputGroup/variations/_shape/base.js.map +0 -1
  121. package/es/components/InputGroup/variations/_shape/base_3k0aw7.css +0 -1
  122. package/es/components/InputGroup/variations/_size/base.js +0 -5
  123. package/es/components/InputGroup/variations/_size/base.js.map +0 -1
  124. package/es/components/InputGroup/variations/_size/base_1vk5vms.css +0 -1
  125. package/es/components/InputGroup/variations/_stretching/base.js +0 -5
  126. package/es/components/InputGroup/variations/_stretching/base.js.map +0 -1
  127. package/es/components/InputGroup/variations/_stretching/base_1cr1a83.css +0 -1
  128. package/styled-components/cjs/components/InputGroup/InputGroup.js +0 -83
  129. package/styled-components/cjs/components/InputGroup/InputGroup.styles.js +0 -8
  130. package/styled-components/cjs/components/InputGroup/InputGroup.template-doc.mdx +0 -126
  131. package/styled-components/cjs/components/InputGroup/InputGroup.tokens.js +0 -92
  132. package/styled-components/cjs/components/InputGroup/InputGroup.types.js +0 -5
  133. package/styled-components/cjs/components/InputGroup/index.js +0 -31
  134. package/styled-components/cjs/components/InputGroup/variations/_gap/base.js +0 -9
  135. package/styled-components/cjs/components/InputGroup/variations/_gap/tokens.json +0 -1
  136. package/styled-components/cjs/components/InputGroup/variations/_orientation/base.js +0 -9
  137. package/styled-components/cjs/components/InputGroup/variations/_orientation/tokens.json +0 -1
  138. package/styled-components/cjs/components/InputGroup/variations/_shape/base.js +0 -11
  139. package/styled-components/cjs/components/InputGroup/variations/_shape/tokens.json +0 -1
  140. package/styled-components/cjs/components/InputGroup/variations/_size/base.js +0 -10
  141. package/styled-components/cjs/components/InputGroup/variations/_size/tokens.json +0 -58
  142. package/styled-components/cjs/components/InputGroup/variations/_stretching/base.js +0 -9
  143. package/styled-components/cjs/components/InputGroup/variations/_stretching/tokens.json +0 -1
  144. package/styled-components/cjs/examples/plasma_b2c/components/InputGroup/InputGroup.config.js +0 -38
  145. package/styled-components/cjs/examples/plasma_b2c/components/InputGroup/InputGroup.js +0 -11
  146. package/styled-components/cjs/examples/plasma_b2c/components/InputGroup/InputGroup.stories.tsx +0 -116
  147. package/styled-components/cjs/examples/plasma_web/components/InputGroup/InputGroup.config.js +0 -38
  148. package/styled-components/cjs/examples/plasma_web/components/InputGroup/InputGroup.js +0 -11
  149. package/styled-components/cjs/examples/plasma_web/components/InputGroup/InputGroup.stories.tsx +0 -116
  150. package/styled-components/es/components/InputGroup/InputGroup.js +0 -74
  151. package/styled-components/es/components/InputGroup/InputGroup.styles.js +0 -2
  152. package/styled-components/es/components/InputGroup/InputGroup.template-doc.mdx +0 -126
  153. package/styled-components/es/components/InputGroup/InputGroup.tokens.js +0 -86
  154. package/styled-components/es/components/InputGroup/InputGroup.types.js +0 -1
  155. package/styled-components/es/components/InputGroup/index.js +0 -2
  156. package/styled-components/es/components/InputGroup/variations/_gap/base.js +0 -3
  157. package/styled-components/es/components/InputGroup/variations/_gap/tokens.json +0 -1
  158. package/styled-components/es/components/InputGroup/variations/_orientation/base.js +0 -3
  159. package/styled-components/es/components/InputGroup/variations/_orientation/tokens.json +0 -1
  160. package/styled-components/es/components/InputGroup/variations/_shape/base.js +0 -5
  161. package/styled-components/es/components/InputGroup/variations/_shape/tokens.json +0 -1
  162. package/styled-components/es/components/InputGroup/variations/_size/base.js +0 -4
  163. package/styled-components/es/components/InputGroup/variations/_size/tokens.json +0 -58
  164. package/styled-components/es/components/InputGroup/variations/_stretching/base.js +0 -3
  165. package/styled-components/es/components/InputGroup/variations/_stretching/tokens.json +0 -1
  166. package/styled-components/es/examples/plasma_b2c/components/InputGroup/InputGroup.config.js +0 -32
  167. package/styled-components/es/examples/plasma_b2c/components/InputGroup/InputGroup.js +0 -5
  168. package/styled-components/es/examples/plasma_b2c/components/InputGroup/InputGroup.stories.tsx +0 -116
  169. package/styled-components/es/examples/plasma_web/components/InputGroup/InputGroup.config.js +0 -32
  170. package/styled-components/es/examples/plasma_web/components/InputGroup/InputGroup.js +0 -5
  171. package/styled-components/es/examples/plasma_web/components/InputGroup/InputGroup.stories.tsx +0 -116
  172. package/types/components/InputGroup/InputGroup.d.ts +0 -35
  173. package/types/components/InputGroup/InputGroup.d.ts.map +0 -1
  174. package/types/components/InputGroup/InputGroup.styles.d.ts +0 -2
  175. package/types/components/InputGroup/InputGroup.styles.d.ts.map +0 -1
  176. package/types/components/InputGroup/InputGroup.tokens.d.ts +0 -85
  177. package/types/components/InputGroup/InputGroup.tokens.d.ts.map +0 -1
  178. package/types/components/InputGroup/InputGroup.types.d.ts +0 -84
  179. package/types/components/InputGroup/InputGroup.types.d.ts.map +0 -1
  180. package/types/components/InputGroup/index.d.ts +0 -4
  181. package/types/components/InputGroup/index.d.ts.map +0 -1
  182. package/types/components/InputGroup/variations/_gap/base.d.ts +0 -2
  183. package/types/components/InputGroup/variations/_gap/base.d.ts.map +0 -1
  184. package/types/components/InputGroup/variations/_orientation/base.d.ts +0 -2
  185. package/types/components/InputGroup/variations/_orientation/base.d.ts.map +0 -1
  186. package/types/components/InputGroup/variations/_shape/base.d.ts +0 -2
  187. package/types/components/InputGroup/variations/_shape/base.d.ts.map +0 -1
  188. package/types/components/InputGroup/variations/_size/base.d.ts +0 -2
  189. package/types/components/InputGroup/variations/_size/base.d.ts.map +0 -1
  190. package/types/components/InputGroup/variations/_stretching/base.d.ts +0 -2
  191. package/types/components/InputGroup/variations/_stretching/base.d.ts.map +0 -1
  192. package/types/examples/plasma_b2c/components/InputGroup/InputGroup.config.d.ts +0 -31
  193. package/types/examples/plasma_b2c/components/InputGroup/InputGroup.config.d.ts.map +0 -1
  194. package/types/examples/plasma_b2c/components/InputGroup/InputGroup.d.ts +0 -43
  195. package/types/examples/plasma_b2c/components/InputGroup/InputGroup.d.ts.map +0 -1
  196. package/types/examples/plasma_web/components/InputGroup/InputGroup.config.d.ts +0 -31
  197. package/types/examples/plasma_web/components/InputGroup/InputGroup.config.d.ts.map +0 -1
  198. package/types/examples/plasma_web/components/InputGroup/InputGroup.d.ts +0 -43
  199. package/types/examples/plasma_web/components/InputGroup/InputGroup.d.ts.map +0 -1
@@ -1,32 +0,0 @@
1
- import { css } from 'styled-components';
2
- import { inputGroupTokens as tokens } from '../../../../components/InputGroup';
3
- export var config = {
4
- defaults: {
5
- size: 'm'
6
- },
7
- variations: {
8
- size: {
9
- l: /*#__PURE__*/css(["", ":0.875rem;", ":0.375rem;", ":0.875rem;", ":3.5rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":0.375rem;", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.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.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.75rem;", ":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);"], tokens.inputDefaultRadius, tokens.inputSegmentedRadius, tokens.inputSideRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight),
10
- m: /*#__PURE__*/css(["", ":0.75rem;", ":0.25rem;", ":0.75rem;", ":3rem;", ":0.875rem 1rem 0.875rem 1rem;", ":0.375rem;", ":-0.125rem 0.375rem -0.125rem -0.125rem;", ":-0.125rem -0.125rem -0.125rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.625rem;", ":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.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.625rem;", ":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);"], tokens.inputDefaultRadius, tokens.inputSegmentedRadius, tokens.inputSideRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight),
11
- s: /*#__PURE__*/css(["", ":0.25rem;", ":0.625rem;", ":0.625rem;", ":2.5rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":0.375rem;", ":-0.1875rem 0.25rem -0.1875rem -0.125rem;", ":-0.1875rem -0.125rem -0.1875rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.5rem;", ":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.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.5rem;", ":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);"], tokens.inputSegmentedRadius, tokens.inputSideRadius, tokens.inputDefaultRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight),
12
- xs: /*#__PURE__*/css(["", ":0.125rem;", ":0.5rem;", ":0.5rem;", ":2rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":0.375rem;", ":-0.0625rem 0.25rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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;", ":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.125rem;", ":auto;", ":1.25rem;", ":0.375rem;", ":0.625rem;", ":0.25rem;", ":0rem;", ":0.75rem;", ":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);"], tokens.inputSegmentedRadius, tokens.inputDefaultRadius, tokens.inputSideRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight)
13
- },
14
- orientation: {
15
- horizontal: /*#__PURE__*/css(["", ":row;"], tokens.inputGroupOrientation),
16
- vertical: /*#__PURE__*/css(["", ":column;"], tokens.inputGroupOrientation)
17
- },
18
- gap: {
19
- none: /*#__PURE__*/css(["", ":0.063rem;"], tokens.inputGroupItemsGap),
20
- dense: /*#__PURE__*/css(["", ":0.125rem;"], tokens.inputGroupItemsGap),
21
- wide: /*#__PURE__*/css(["", ":0.5rem;"], tokens.inputGroupItemsGap)
22
- },
23
- shape: {
24
- segmented: /*#__PURE__*/css([""]),
25
- "default": /*#__PURE__*/css([""])
26
- },
27
- stretching: {
28
- auto: /*#__PURE__*/css([""]),
29
- filled: /*#__PURE__*/css([""])
30
- }
31
- }
32
- };
@@ -1,5 +0,0 @@
1
- import { inputGroupConfig } from '../../../../components/InputGroup';
2
- import { component, mergeConfig } from '../../../../engines';
3
- import { config } from './InputGroup.config';
4
- var mergedConfig = /*#__PURE__*/mergeConfig(inputGroupConfig, config);
5
- export var InputGroup = /*#__PURE__*/component(mergedConfig);
@@ -1,116 +0,0 @@
1
- import React from 'react';
2
- import type { ComponentProps } from 'react';
3
- import type { StoryObj, Meta } from '@storybook/react';
4
- import { disableProps } from '@salutejs/plasma-sb-utils';
5
-
6
- import { WithTheme } from '../../../_helpers';
7
- import { TextField } from '../TextField/TextField';
8
-
9
- import { InputGroup } from './InputGroup';
10
-
11
- type StoryProps = Omit<ComponentProps<typeof InputGroup>, 'gap'> & {
12
- itemsCount?: number;
13
- gapDefaultShape?: string;
14
- gapSegmentedShape?: string;
15
- };
16
- type Story = StoryObj<StoryProps>;
17
-
18
- const sizes = ['l', 'm', 's', 'xs'];
19
- const orientationValues = ['horizontal', 'vertical'];
20
- const gapDefaultValues = ['dense', 'wide'];
21
- const gapSegmentedValues = ['none', 'dense'];
22
- const shapeValues = ['segmented', 'default'];
23
- const stretchingValues = ['auto', 'filled'];
24
-
25
- const meta: Meta<typeof InputGroup> = {
26
- title: 'plasma_b2c/InputGroup',
27
- decorators: [WithTheme],
28
- argTypes: {
29
- size: {
30
- options: sizes,
31
- control: {
32
- type: 'select',
33
- },
34
- },
35
- orientation: {
36
- options: orientationValues,
37
- control: {
38
- type: 'inline-radio',
39
- },
40
- },
41
- shape: {
42
- options: shapeValues,
43
- control: {
44
- type: 'select',
45
- },
46
- },
47
- stretching: {
48
- options: stretchingValues,
49
- control: {
50
- type: 'select',
51
- },
52
- },
53
- ...disableProps(['gap']),
54
- },
55
- };
56
-
57
- export default meta;
58
-
59
- export const Default: Story = {
60
- argTypes: {
61
- gapDefaultShape: {
62
- options: gapDefaultValues,
63
- control: { type: 'select' },
64
- if: { arg: 'shape', eq: 'default' },
65
- },
66
- gapSegmentedShape: {
67
- options: gapSegmentedValues,
68
- control: { type: 'select' },
69
- if: { arg: 'shape', eq: 'segmented' },
70
- },
71
- },
72
- args: {
73
- size: 'm',
74
- shape: 'default',
75
- gapDefaultShape: 'dense',
76
- gapSegmentedShape: 'dense',
77
- orientation: 'horizontal',
78
- itemsCount: 5,
79
- stretching: 'auto',
80
- },
81
- render: ({ itemsCount, gapDefaultShape, gapSegmentedShape, ...args }: StoryProps) => {
82
- return (
83
- <InputGroup {...args} gap={(gapDefaultShape || gapSegmentedShape) as any}>
84
- {Array(itemsCount)
85
- .fill(true)
86
- .map((_, i) => (
87
- <TextField placeholder={`input #${i}`} />
88
- ))}
89
- </InputGroup>
90
- );
91
- },
92
- };
93
-
94
- export const CustomInputs: Story = {
95
- args: {
96
- ...Default.args,
97
- isCommonInputStyles: false,
98
- },
99
- argTypes: {
100
- ...Default.argTypes,
101
- ...disableProps(['itemsCount']),
102
- },
103
- render: ({ gapDefaultShape, gapSegmentedShape, ...args }: StoryProps) => {
104
- return (
105
- <>
106
- <h3>Группа Input с разными размерами</h3>
107
- <InputGroup {...args} gap={(gapDefaultShape || gapSegmentedShape) as any}>
108
- <TextField placeholder="Размер l" size="l" />
109
- <TextField placeholder="Размер m" size="m" />
110
- <TextField placeholder="Размер s" size="s" />
111
- <TextField placeholder="Размер xs" size="xs" />
112
- </InputGroup>
113
- </>
114
- );
115
- },
116
- };
@@ -1,32 +0,0 @@
1
- import { css } from 'styled-components';
2
- import { inputGroupTokens as tokens } from '../../../../components/InputGroup';
3
- export var config = {
4
- defaults: {
5
- size: 'm'
6
- },
7
- variations: {
8
- size: {
9
- l: /*#__PURE__*/css(["", ":0.875rem;", ":0.375rem;", ":0.875rem;", ":3.5rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":0.375rem;", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.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.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.75rem;", ":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);"], tokens.inputDefaultRadius, tokens.inputSegmentedRadius, tokens.inputSideRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight),
10
- m: /*#__PURE__*/css(["", ":0.75rem;", ":0.25rem;", ":0.75rem;", ":3rem;", ":0.875rem 1rem 0.875rem 1rem;", ":0.375rem;", ":-0.125rem 0.375rem -0.125rem -0.125rem;", ":-0.125rem -0.125rem -0.125rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.625rem;", ":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.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.625rem;", ":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);"], tokens.inputDefaultRadius, tokens.inputSegmentedRadius, tokens.inputSideRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight),
11
- s: /*#__PURE__*/css(["", ":0.25rem;", ":0.625rem;", ":0.625rem;", ":2.5rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":0.375rem;", ":-0.1875rem 0.25rem -0.1875rem -0.125rem;", ":-0.1875rem -0.125rem -0.1875rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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.5rem;", ":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.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.5rem;", ":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);"], tokens.inputSegmentedRadius, tokens.inputSideRadius, tokens.inputDefaultRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight),
12
- xs: /*#__PURE__*/css(["", ":0.125rem;", ":0.5rem;", ":0.5rem;", ":2rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":0.375rem;", ":-0.0625rem 0.25rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":0 0.25rem 0 0;", ":0 0 0 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;", ":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.125rem;", ":auto;", ":1.25rem;", ":0.375rem;", ":0.625rem;", ":0.25rem;", ":0rem;", ":0.75rem;", ":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);"], tokens.inputSegmentedRadius, tokens.inputDefaultRadius, tokens.inputSideRadius, tokens.height, tokens.padding, tokens.paddingWithChips, tokens.leftContentMargin, tokens.rightContentMargin, tokens.textBeforeMargin, tokens.textAfterMargin, tokens.fontFamily, tokens.fontSize, tokens.fontStyle, tokens.fontWeight, tokens.letterSpacing, tokens.lineHeight, tokens.labelOffset, tokens.labelFontFamily, tokens.labelFontSize, tokens.labelFontStyle, tokens.labelFontWeight, tokens.labelLetterSpacing, tokens.labelLineHeight, tokens.leftHelperOffset, tokens.leftHelperFontFamily, tokens.leftHelperFontSize, tokens.leftHelperFontStyle, tokens.leftHelperFontWeight, tokens.leftHelperLetterSpacing, tokens.leftHelperLineHeight, tokens.labelInnerPadding, tokens.contentLabelInnerPadding, tokens.chipGap, tokens.chipBorderRadius, tokens.chipWidth, tokens.chipHeight, tokens.chipPaddingRight, tokens.chipPaddingLeft, tokens.chipClearContentMarginLeft, tokens.chipClearContentMarginRight, tokens.chipCloseIconSize, tokens.chipFontFamily, tokens.chipFontSize, tokens.chipFontStyle, tokens.chipFontWeight, tokens.chipLetterSpacing, tokens.chipLineHeight)
13
- },
14
- orientation: {
15
- horizontal: /*#__PURE__*/css(["", ":row;"], tokens.inputGroupOrientation),
16
- vertical: /*#__PURE__*/css(["", ":column;"], tokens.inputGroupOrientation)
17
- },
18
- gap: {
19
- none: /*#__PURE__*/css(["", ":0;", ":-0.063rem;", ":inset(0 0.063rem 0 0);", ":-0.063rem;", ":inset(0.063rem 0 0 0);"], tokens.inputGroupItemsGap, tokens.inputGroupWebMarginLeft, tokens.inputGroupWebClipPath, tokens.inputGroupWebMarginTop, tokens.inputGroupWebVerticalClipPath),
20
- dense: /*#__PURE__*/css(["", ":0.125rem;"], tokens.inputGroupItemsGap),
21
- wide: /*#__PURE__*/css(["", ":0.5rem;"], tokens.inputGroupItemsGap)
22
- },
23
- shape: {
24
- segmented: /*#__PURE__*/css([""]),
25
- "default": /*#__PURE__*/css([""])
26
- },
27
- stretching: {
28
- auto: /*#__PURE__*/css([""]),
29
- filled: /*#__PURE__*/css([""])
30
- }
31
- }
32
- };
@@ -1,5 +0,0 @@
1
- import { inputGroupConfig } from '../../../../components/InputGroup';
2
- import { component, mergeConfig } from '../../../../engines';
3
- import { config } from './InputGroup.config';
4
- var mergedConfig = /*#__PURE__*/mergeConfig(inputGroupConfig, config);
5
- export var InputGroup = /*#__PURE__*/component(mergedConfig);
@@ -1,116 +0,0 @@
1
- import React from 'react';
2
- import type { ComponentProps } from 'react';
3
- import type { StoryObj, Meta } from '@storybook/react';
4
- import { disableProps } from '@salutejs/plasma-sb-utils';
5
-
6
- import { WithTheme } from '../../../_helpers';
7
- import { TextField } from '../TextField/TextField';
8
-
9
- import { InputGroup } from './InputGroup';
10
-
11
- type StoryProps = Omit<ComponentProps<typeof InputGroup>, 'gap'> & {
12
- itemsCount?: number;
13
- gapDefaultShape?: string;
14
- gapSegmentedShape?: string;
15
- };
16
- type Story = StoryObj<StoryProps>;
17
-
18
- const sizes = ['l', 'm', 's', 'xs'];
19
- const orientationValues = ['horizontal', 'vertical'];
20
- const gapDefaultValues = ['dense', 'wide'];
21
- const gapSegmentedValues = ['none', 'dense'];
22
- const shapeValues = ['segmented', 'default'];
23
- const stretchingValues = ['auto', 'filled'];
24
-
25
- const meta: Meta<typeof InputGroup> = {
26
- title: 'plasma_web/InputGroup',
27
- decorators: [WithTheme],
28
- argTypes: {
29
- size: {
30
- options: sizes,
31
- control: {
32
- type: 'select',
33
- },
34
- },
35
- orientation: {
36
- options: orientationValues,
37
- control: {
38
- type: 'inline-radio',
39
- },
40
- },
41
- shape: {
42
- options: shapeValues,
43
- control: {
44
- type: 'select',
45
- },
46
- },
47
- stretching: {
48
- options: stretchingValues,
49
- control: {
50
- type: 'select',
51
- },
52
- },
53
- ...disableProps(['gap']),
54
- },
55
- };
56
-
57
- export default meta;
58
-
59
- export const Default: Story = {
60
- argTypes: {
61
- gapDefaultShape: {
62
- options: gapDefaultValues,
63
- control: { type: 'select' },
64
- if: { arg: 'shape', eq: 'default' },
65
- },
66
- gapSegmentedShape: {
67
- options: gapSegmentedValues,
68
- control: { type: 'select' },
69
- if: { arg: 'shape', eq: 'segmented' },
70
- },
71
- },
72
- args: {
73
- size: 'm',
74
- shape: 'default',
75
- gapDefaultShape: 'dense',
76
- gapSegmentedShape: 'dense',
77
- orientation: 'horizontal',
78
- itemsCount: 5,
79
- stretching: 'auto',
80
- },
81
- render: ({ itemsCount, gapDefaultShape, gapSegmentedShape, ...args }: StoryProps) => {
82
- return (
83
- <InputGroup {...args} gap={(gapDefaultShape || gapSegmentedShape) as any}>
84
- {Array(itemsCount)
85
- .fill(true)
86
- .map((_, i) => (
87
- <TextField placeholder={`input #${i}`} />
88
- ))}
89
- </InputGroup>
90
- );
91
- },
92
- };
93
-
94
- export const CustomInputs: Story = {
95
- args: {
96
- ...Default.args,
97
- isCommonInputStyles: false,
98
- },
99
- argTypes: {
100
- ...Default.argTypes,
101
- ...disableProps(['itemsCount']),
102
- },
103
- render: ({ gapDefaultShape, gapSegmentedShape, ...args }: StoryProps) => {
104
- return (
105
- <>
106
- <h3>Группа Input с разными размерами</h3>
107
- <InputGroup {...args} gap={(gapDefaultShape || gapSegmentedShape) as any}>
108
- <TextField placeholder="Размер l" size="l" />
109
- <TextField placeholder="Размер m" size="m" />
110
- <TextField placeholder="Размер s" size="s" />
111
- <TextField placeholder="Размер xs" size="xs" />
112
- </InputGroup>
113
- </>
114
- );
115
- },
116
- };
@@ -1,35 +0,0 @@
1
- import React from 'react';
2
- import type { RootProps } from '../../engines';
3
- import type { InputGroupProps, InputGroupRootProps } from './InputGroup.types';
4
- export declare const inputGroupRoot: (Root: RootProps<HTMLDivElement, InputGroupRootProps>) => React.ForwardRefExoticComponent<InputGroupProps & React.RefAttributes<HTMLDivElement>>;
5
- export declare const inputGroupConfig: {
6
- name: string;
7
- tag: string;
8
- layout: (Root: RootProps<HTMLDivElement, InputGroupRootProps>) => React.ForwardRefExoticComponent<InputGroupProps & React.RefAttributes<HTMLDivElement>>;
9
- base: import("@linaria/core").LinariaClassName;
10
- variations: {
11
- size: {
12
- css: import("@linaria/core").LinariaClassName;
13
- };
14
- gap: {
15
- css: import("@linaria/core").LinariaClassName;
16
- };
17
- orientation: {
18
- css: import("@linaria/core").LinariaClassName;
19
- };
20
- shape: {
21
- css: import("@linaria/core").LinariaClassName;
22
- };
23
- stretching: {
24
- css: import("@linaria/core").LinariaClassName;
25
- };
26
- };
27
- defaults: {
28
- size: string;
29
- gap: string;
30
- orientation: string;
31
- shape: string;
32
- stretching: string;
33
- };
34
- };
35
- //# sourceMappingURL=InputGroup.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.d.ts","sourceRoot":"","sources":["../../../src/components/InputGroup/InputGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAU/C,OAAO,KAAK,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAE/E,eAAO,MAAM,cAAc,SAAU,UAAU,cAAc,EAAE,mBAAmB,CAAC,2FAiC7E,CAAC;AAEP,eAAO,MAAM,gBAAgB;;;mBAnCQ,UAAU,cAAc,EAAE,mBAAmB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;CAgElF,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare const base: import("@linaria/core").LinariaClassName;
2
- //# sourceMappingURL=InputGroup.styles.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.styles.d.ts","sourceRoot":"","sources":["../../../src/components/InputGroup/InputGroup.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI,0CAEhB,CAAC"}
@@ -1,85 +0,0 @@
1
- export declare const classes: {
2
- autoStretching: string;
3
- filledStretching: string;
4
- inputGroupOverrideStyles: string;
5
- inputGroupItem: string;
6
- horizontal: string;
7
- vertical: string;
8
- none: string;
9
- dense: string;
10
- wide: string;
11
- segmented: string;
12
- default: string;
13
- };
14
- export declare const tokens: {
15
- inputGroupOrientation: string;
16
- inputGroupWebMarginLeft: string;
17
- inputGroupWebClipPath: string;
18
- inputGroupWebMarginTop: string;
19
- inputGroupWebVerticalClipPath: string;
20
- inputSegmentedRadius: string;
21
- inputDefaultRadius: string;
22
- inputSideRadius: string;
23
- inputGroupItemsGap: string;
24
- height: string;
25
- borderWidth: string;
26
- /** Отступ от границы ТextField */
27
- padding: string;
28
- paddingWithChips: string;
29
- leftContentMargin: string;
30
- rightContentMargin: string;
31
- fontFamily: string;
32
- fontStyle: string;
33
- fontSize: string;
34
- fontWeight: string;
35
- letterSpacing: string;
36
- lineHeight: string;
37
- /** Токены лейбла */
38
- labelOffset: string;
39
- labelFontFamily: string;
40
- labelFontStyle: string;
41
- labelFontSize: string;
42
- labelFontWeight: string;
43
- labelLetterSpacing: string;
44
- labelLineHeight: string;
45
- labelInnerFontFamily: string;
46
- labelInnerFontStyle: string;
47
- labelInnerFontSize: string;
48
- labelInnerFontWeight: string;
49
- labelInnerLetterSpacing: string;
50
- labelInnerLineHeight: string;
51
- labelInnerPadding: string;
52
- contentLabelInnerPadding: string;
53
- leftHelperOffset: string;
54
- leftHelperFontFamily: string;
55
- leftHelperFontStyle: string;
56
- leftHelperFontSize: string;
57
- leftHelperFontWeight: string;
58
- leftHelperLetterSpacing: string;
59
- leftHelperLineHeight: string;
60
- /** Токены вспомогательного текста */
61
- textBeforeMargin: string;
62
- textAfterMargin: string;
63
- /** Токены чипа */
64
- chipHeight: string;
65
- chipBorderRadius: string;
66
- chipGap: string;
67
- chipScaleHover: string;
68
- chipScaleActive: string;
69
- chipOutlineSize: string;
70
- chipWidth: string;
71
- chipPaddingTop: string;
72
- chipPaddingRight: string;
73
- chipPaddingBottom: string;
74
- chipPaddingLeft: string;
75
- chipCloseIconSize: string;
76
- chipFontFamily: string;
77
- chipFontSize: string;
78
- chipFontStyle: string;
79
- chipFontWeight: string;
80
- chipLetterSpacing: string;
81
- chipLineHeight: string;
82
- chipClearContentMarginLeft: string;
83
- chipClearContentMarginRight: string;
84
- };
85
- //# sourceMappingURL=InputGroup.tokens.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.tokens.d.ts","sourceRoot":"","sources":["../../../src/components/InputGroup/InputGroup.tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;CAgBnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;IAgBf,kCAAkC;;;;;;;;;;;IAelC,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;IA8BpB,qCAAqC;;;IAIrC,kBAAkB;;;;;;;;;;;;;;;;;;;;;CAqBrB,CAAC"}
@@ -1,84 +0,0 @@
1
- import type { HTMLAttributes } from 'react';
2
- export declare type Gap = 'none' | 'dense' | 'wide';
3
- export declare type Orientation = 'vertical' | 'horizontal';
4
- export declare type Shape = 'default' | 'segmented';
5
- declare type Stretching = 'filled' | 'auto';
6
- declare type GapShapeVariants = {
7
- /**
8
- * Отступы между controls внутри группы
9
- * @default
10
- * dense
11
- * @description
12
- * Доступные значения: 'none' | 'dense'.
13
- */
14
- gap?: 'none' | 'dense';
15
- /**
16
- * Скругления для controls внутри группы
17
- * @default
18
- * default
19
- * @description
20
- * Доступные значения: 'segmented'.
21
- */
22
- shape?: 'segmented';
23
- } | {
24
- /**
25
- * Отступы между controls внутри группы
26
- * @default
27
- * dense
28
- * @description
29
- * Доступные значения: 'dense' | 'wide'.
30
- */
31
- gap?: 'dense' | 'wide';
32
- /**
33
- * Скругления для controls внутри группы
34
- * @default
35
- * default
36
- * @description
37
- * Доступные значения: 'default'.
38
- */
39
- shape?: 'default';
40
- };
41
- declare type InputGroupPropsCommon = {
42
- /**
43
- * Направление группы
44
- * @default
45
- * horizontal
46
- * @description
47
- * Можно воспринимать как свойство flex-direction.
48
- * vertical - вертикально, horizontal - горизонтальное.
49
- */
50
- orientation?: Orientation;
51
- /**
52
- * Ширина группы controls
53
- * @default
54
- * auto
55
- * @description
56
- * Может принимать три значения:
57
- * filled - группа controls занимает всю доступную ширину
58
- * auto - группа controls растягивается в зависимости от контента
59
- */
60
- stretching?: Stretching;
61
- /**
62
- * Размер группы input
63
- * @description
64
- * Применяется если isCommonInputStyles передан как true.
65
- */
66
- size?: string;
67
- /**
68
- * Группа будет переопределять size для всех input
69
- * @default
70
- * true
71
- * @description
72
- * Если значение передано как true, для каждго input внутри группы
73
- * size берется из значений группы.
74
- * Если значение не задано, каждый input может иметь свое значение size.
75
- */
76
- isCommonInputStyles?: boolean;
77
- };
78
- export declare type InputGroupProps = HTMLAttributes<HTMLDivElement> & InputGroupPropsCommon & GapShapeVariants;
79
- export declare type InputGroupRootProps = HTMLAttributes<HTMLDivElement> & InputGroupPropsCommon & {
80
- gap?: Gap;
81
- shape?: Shape;
82
- };
83
- export {};
84
- //# sourceMappingURL=InputGroup.types.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InputGroup.types.d.ts","sourceRoot":"","sources":["../../../src/components/InputGroup/InputGroup.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,oBAAY,GAAG,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;AAC5C,oBAAY,WAAW,GAAG,UAAU,GAAG,YAAY,CAAC;AACpD,oBAAY,KAAK,GAAG,SAAS,GAAG,WAAW,CAAC;AAE5C,aAAK,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;AAEpC,aAAK,gBAAgB,GACf;IACI;;;;;;OAMG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;CACvB,GACD;IACI;;;;;;OAMG;IACH,GAAG,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAER,aAAK,qBAAqB,GAAG;IACzB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;;OAQG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF,oBAAY,eAAe,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG,qBAAqB,GAAG,gBAAgB,CAAC;AACxG,oBAAY,mBAAmB,GAAG,cAAc,CAAC,cAAc,CAAC,GAC5D,qBAAqB,GAAG;IACpB,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,KAAK,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC"}
@@ -1,4 +0,0 @@
1
- export { inputGroupRoot, inputGroupConfig } from './InputGroup';
2
- export { tokens as inputGroupTokens, classes as inputGroupClasses } from './InputGroup.tokens';
3
- export type { InputGroupProps } from './InputGroup.types';
4
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InputGroup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,MAAM,IAAI,gBAAgB,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE/F,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare const base: import("@linaria/core").LinariaClassName;
2
- //# sourceMappingURL=base.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/InputGroup/variations/_gap/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAEhB,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare const base: import("@linaria/core").LinariaClassName;
2
- //# sourceMappingURL=base.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/InputGroup/variations/_orientation/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAMhB,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare const base: import("@linaria/core").LinariaClassName;
2
- //# sourceMappingURL=base.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/InputGroup/variations/_shape/base.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,IAAI,0CAyFhB,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare const base: import("@linaria/core").LinariaClassName;
2
- //# sourceMappingURL=base.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/InputGroup/variations/_size/base.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,0CAsDhB,CAAC"}
@@ -1,2 +0,0 @@
1
- export declare const base: import("@linaria/core").LinariaClassName;
2
- //# sourceMappingURL=base.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.d.ts","sourceRoot":"","sources":["../../../../../src/components/InputGroup/variations/_stretching/base.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,0CAQhB,CAAC"}