@salutejs/plasma-new-hope 0.111.0-canary.1308.10073134400.0 → 0.112.0-canary.1310.10078865814.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (156) hide show
  1. package/cjs/components/Breadcrumbs/Breadcrumbs.css +13 -0
  2. package/cjs/components/Breadcrumbs/Breadcrumbs.js +94 -0
  3. package/cjs/components/Breadcrumbs/Breadcrumbs.js.map +1 -0
  4. package/cjs/components/Breadcrumbs/Breadcrumbs.styles.js +46 -0
  5. package/cjs/components/Breadcrumbs/Breadcrumbs.styles.js.map +1 -0
  6. package/cjs/components/Breadcrumbs/Breadcrumbs.styles_1troyzr.css +3 -0
  7. package/cjs/components/Breadcrumbs/Breadcrumbs.tokens.js +23 -0
  8. package/cjs/components/Breadcrumbs/Breadcrumbs.tokens.js.map +1 -0
  9. package/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js +37 -0
  10. package/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js.map +1 -0
  11. package/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js +27 -0
  12. package/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js.map +1 -0
  13. package/cjs/components/Breadcrumbs/variations/_size/base.js +9 -0
  14. package/cjs/components/Breadcrumbs/variations/_size/base.js.map +1 -0
  15. package/cjs/components/Breadcrumbs/variations/_size/base_x642ct.css +1 -0
  16. package/cjs/components/Breadcrumbs/variations/_view/base.js +9 -0
  17. package/cjs/components/Breadcrumbs/variations/_view/base.js.map +1 -0
  18. package/cjs/components/Breadcrumbs/variations/_view/base_x642ct.css +1 -0
  19. package/cjs/index.css +4 -0
  20. package/cjs/index.js +6 -0
  21. package/cjs/index.js.map +1 -1
  22. package/emotion/cjs/components/Breadcrumbs/Breadcrumbs.js +94 -0
  23. package/emotion/cjs/components/Breadcrumbs/Breadcrumbs.styles.js +33 -0
  24. package/emotion/cjs/components/Breadcrumbs/Breadcrumbs.tokens.js +21 -0
  25. package/emotion/cjs/components/Breadcrumbs/Breadcrumbs.types.js +5 -0
  26. package/emotion/cjs/components/Breadcrumbs/README.md +78 -0
  27. package/emotion/cjs/components/Breadcrumbs/index.js +31 -0
  28. package/emotion/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js +43 -0
  29. package/emotion/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js +20 -0
  30. package/emotion/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.types.js +5 -0
  31. package/emotion/cjs/components/Breadcrumbs/variations/_size/base.js +8 -0
  32. package/emotion/cjs/components/Breadcrumbs/variations/_size/tokens.json +0 -0
  33. package/emotion/cjs/components/Breadcrumbs/variations/_view/base.js +8 -0
  34. package/emotion/cjs/components/Breadcrumbs/variations/_view/tokens.json +0 -0
  35. package/emotion/cjs/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.config.js +25 -0
  36. package/emotion/cjs/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.js +11 -0
  37. package/emotion/cjs/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  38. package/emotion/cjs/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.config.js +25 -0
  39. package/emotion/cjs/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.js +11 -0
  40. package/emotion/cjs/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  41. package/emotion/cjs/index.js +11 -0
  42. package/emotion/es/components/Breadcrumbs/Breadcrumbs.js +85 -0
  43. package/emotion/es/components/Breadcrumbs/Breadcrumbs.styles.js +26 -0
  44. package/emotion/es/components/Breadcrumbs/Breadcrumbs.tokens.js +15 -0
  45. package/emotion/es/components/Breadcrumbs/Breadcrumbs.types.js +1 -0
  46. package/emotion/es/components/Breadcrumbs/README.md +78 -0
  47. package/emotion/es/components/Breadcrumbs/index.js +2 -0
  48. package/emotion/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js +34 -0
  49. package/emotion/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js +13 -0
  50. package/emotion/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.types.js +1 -0
  51. package/emotion/es/components/Breadcrumbs/variations/_size/base.js +2 -0
  52. package/emotion/es/components/Breadcrumbs/variations/_size/tokens.json +0 -0
  53. package/emotion/es/components/Breadcrumbs/variations/_view/base.js +2 -0
  54. package/emotion/es/components/Breadcrumbs/variations/_view/tokens.json +0 -0
  55. package/emotion/es/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.config.js +19 -0
  56. package/emotion/es/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.js +5 -0
  57. package/emotion/es/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  58. package/emotion/es/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.config.js +19 -0
  59. package/emotion/es/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.js +5 -0
  60. package/emotion/es/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  61. package/emotion/es/index.js +1 -0
  62. package/es/components/Breadcrumbs/Breadcrumbs.css +13 -0
  63. package/es/components/Breadcrumbs/Breadcrumbs.js +89 -0
  64. package/es/components/Breadcrumbs/Breadcrumbs.js.map +1 -0
  65. package/es/components/Breadcrumbs/Breadcrumbs.styles.js +40 -0
  66. package/es/components/Breadcrumbs/Breadcrumbs.styles.js.map +1 -0
  67. package/es/components/Breadcrumbs/Breadcrumbs.styles_1troyzr.css +3 -0
  68. package/es/components/Breadcrumbs/Breadcrumbs.tokens.js +18 -0
  69. package/es/components/Breadcrumbs/Breadcrumbs.tokens.js.map +1 -0
  70. package/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js +33 -0
  71. package/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js.map +1 -0
  72. package/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js +21 -0
  73. package/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js.map +1 -0
  74. package/es/components/Breadcrumbs/variations/_size/base.js +5 -0
  75. package/es/components/Breadcrumbs/variations/_size/base.js.map +1 -0
  76. package/es/components/Breadcrumbs/variations/_size/base_x642ct.css +1 -0
  77. package/es/components/Breadcrumbs/variations/_view/base.js +5 -0
  78. package/es/components/Breadcrumbs/variations/_view/base.js.map +1 -0
  79. package/es/components/Breadcrumbs/variations/_view/base_x642ct.css +1 -0
  80. package/es/index.css +4 -0
  81. package/es/index.js +2 -0
  82. package/es/index.js.map +1 -1
  83. package/package.json +2 -2
  84. package/styled-components/cjs/components/Breadcrumbs/Breadcrumbs.js +94 -0
  85. package/styled-components/cjs/components/Breadcrumbs/Breadcrumbs.styles.js +32 -0
  86. package/styled-components/cjs/components/Breadcrumbs/Breadcrumbs.tokens.js +21 -0
  87. package/styled-components/cjs/components/Breadcrumbs/Breadcrumbs.types.js +5 -0
  88. package/styled-components/cjs/components/Breadcrumbs/README.md +78 -0
  89. package/styled-components/cjs/components/Breadcrumbs/index.js +31 -0
  90. package/styled-components/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js +43 -0
  91. package/styled-components/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js +24 -0
  92. package/styled-components/cjs/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.types.js +5 -0
  93. package/styled-components/cjs/components/Breadcrumbs/variations/_size/base.js +8 -0
  94. package/styled-components/cjs/components/Breadcrumbs/variations/_size/tokens.json +0 -0
  95. package/styled-components/cjs/components/Breadcrumbs/variations/_view/base.js +8 -0
  96. package/styled-components/cjs/components/Breadcrumbs/variations/_view/tokens.json +0 -0
  97. package/styled-components/cjs/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.config.js +25 -0
  98. package/styled-components/cjs/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.js +11 -0
  99. package/styled-components/cjs/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  100. package/styled-components/cjs/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.config.js +25 -0
  101. package/styled-components/cjs/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.js +11 -0
  102. package/styled-components/cjs/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  103. package/styled-components/cjs/index.js +11 -0
  104. package/styled-components/es/components/Breadcrumbs/Breadcrumbs.js +85 -0
  105. package/styled-components/es/components/Breadcrumbs/Breadcrumbs.styles.js +24 -0
  106. package/styled-components/es/components/Breadcrumbs/Breadcrumbs.tokens.js +15 -0
  107. package/styled-components/es/components/Breadcrumbs/Breadcrumbs.types.js +1 -0
  108. package/styled-components/es/components/Breadcrumbs/README.md +78 -0
  109. package/styled-components/es/components/Breadcrumbs/index.js +2 -0
  110. package/styled-components/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.js +34 -0
  111. package/styled-components/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.js +17 -0
  112. package/styled-components/es/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.types.js +1 -0
  113. package/styled-components/es/components/Breadcrumbs/variations/_size/base.js +2 -0
  114. package/styled-components/es/components/Breadcrumbs/variations/_size/tokens.json +0 -0
  115. package/styled-components/es/components/Breadcrumbs/variations/_view/base.js +2 -0
  116. package/styled-components/es/components/Breadcrumbs/variations/_view/tokens.json +0 -0
  117. package/styled-components/es/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.config.js +19 -0
  118. package/styled-components/es/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.js +5 -0
  119. package/styled-components/es/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  120. package/styled-components/es/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.config.js +19 -0
  121. package/styled-components/es/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.js +5 -0
  122. package/styled-components/es/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.stories.tsx +42 -0
  123. package/styled-components/es/index.js +1 -0
  124. package/types/components/Breadcrumbs/Breadcrumbs.d.ts +35 -0
  125. package/types/components/Breadcrumbs/Breadcrumbs.d.ts.map +1 -0
  126. package/types/components/Breadcrumbs/Breadcrumbs.styles.d.ts +7 -0
  127. package/types/components/Breadcrumbs/Breadcrumbs.styles.d.ts.map +1 -0
  128. package/types/components/Breadcrumbs/Breadcrumbs.tokens.d.ts +16 -0
  129. package/types/components/Breadcrumbs/Breadcrumbs.tokens.d.ts.map +1 -0
  130. package/types/components/Breadcrumbs/Breadcrumbs.types.d.ts +38 -0
  131. package/types/components/Breadcrumbs/Breadcrumbs.types.d.ts.map +1 -0
  132. package/types/components/Breadcrumbs/index.d.ts +4 -0
  133. package/types/components/Breadcrumbs/index.d.ts.map +1 -0
  134. package/types/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.d.ts +4 -0
  135. package/types/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.d.ts.map +1 -0
  136. package/types/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.d.ts +4 -0
  137. package/types/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.d.ts.map +1 -0
  138. package/types/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.types.d.ts +8 -0
  139. package/types/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.types.d.ts.map +1 -0
  140. package/types/components/Breadcrumbs/variations/_size/base.d.ts +2 -0
  141. package/types/components/Breadcrumbs/variations/_size/base.d.ts.map +1 -0
  142. package/types/components/Breadcrumbs/variations/_view/base.d.ts +2 -0
  143. package/types/components/Breadcrumbs/variations/_view/base.d.ts.map +1 -0
  144. package/types/components/Header/ui/HeaderArrow/HeaderArrow.d.ts +2 -2
  145. package/types/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.config.d.ts +18 -0
  146. package/types/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.config.d.ts.map +1 -0
  147. package/types/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.d.ts +19 -0
  148. package/types/examples/plasma_b2c/components/Breadcrumbs/Breadcrumbs.d.ts.map +1 -0
  149. package/types/examples/plasma_b2c/components/Header/Header.d.ts +1 -1
  150. package/types/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.config.d.ts +18 -0
  151. package/types/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.config.d.ts.map +1 -0
  152. package/types/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.d.ts +19 -0
  153. package/types/examples/plasma_web/components/Breadcrumbs/Breadcrumbs.d.ts.map +1 -0
  154. package/types/examples/plasma_web/components/Header/Header.d.ts +1 -1
  155. package/types/index.d.ts +1 -0
  156. package/types/index.d.ts.map +1 -1
@@ -0,0 +1,40 @@
1
+ import './Breadcrumbs.styles_1troyzr.css';
2
+ import { styled } from '@linaria/react';
3
+ import { linkConfig } from '../Link/Link.js';
4
+ import '@linaria/core';
5
+ import { component, mergeConfig } from '../../engines/common.js';
6
+ import 'react';
7
+ import { IconDisclosureRight } from '../_Icon/Icons/IconDisclosureRight.js';
8
+ import { tokens } from './Breadcrumbs.tokens.js';
9
+
10
+ var mergedLinkConfig = /*#__PURE__*/mergeConfig(linkConfig);
11
+ var Link = /*#__PURE__*/component(mergedLinkConfig);
12
+ var _exp = function _exp() {
13
+ return Link;
14
+ };
15
+ var _exp2 = function _exp2() {
16
+ return function (_ref) {
17
+ var isHref = _ref.isHref;
18
+ return isHref ? 1 : "var(".concat(tokens.breadcrumbsOpacity, ")");
19
+ };
20
+ };
21
+ var StyledLink = /*#__PURE__*/styled(_exp())({
22
+ name: "StyledLink",
23
+ "class": "shehk3i",
24
+ propsAsIs: true,
25
+ vars: {
26
+ "shehk3i-0": [/*#__PURE__*/_exp2()]
27
+ }
28
+ });
29
+ var base = "bkgt5xr";
30
+ var _exp12 = function _exp12() {
31
+ return IconDisclosureRight;
32
+ };
33
+ var Separator = /*#__PURE__*/styled(_exp12())({
34
+ name: "Separator",
35
+ "class": "sajtslk",
36
+ propsAsIs: true
37
+ });
38
+
39
+ export { Separator, StyledLink, base };
40
+ //# sourceMappingURL=Breadcrumbs.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Breadcrumbs.styles.js","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport { css } from '@linaria/core';\n\nimport { linkConfig } from '../Link';\nimport { component, mergeConfig } from '../../engines';\nimport { IconDisclosureRight } from '../_Icon';\nimport { addFocus } from '../../mixins';\n\nimport { tokens } from './Breadcrumbs.tokens';\n\nconst mergedLinkConfig = mergeConfig(linkConfig);\nconst Link = component(mergedLinkConfig);\n\nexport const StyledLink = styled(Link)<{ isHref: boolean }>`\n opacity: ${({ isHref }) => (isHref ? 1 : `var(${tokens.breadcrumbsOpacity})`)};\n\n ${addFocus({\n outlineOffset: '0rem',\n outlineSize: '0.125rem',\n outlineRadius: '0rem',\n outlineColor: `var(${tokens.breadcrumbsFocusOutlineColor})`,\n })}\n`;\n\nexport const base = css`\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(${tokens.breadcrumbsGap});\n\n color: var(${tokens.breadcrumbsColor});\n font-family: var(${tokens.breadcrumbsFontFamily});\n font-size: var(${tokens.breadcrumbsFontSize});\n font-weight: var(${tokens.breadcrumbsFontWeight});\n font-style: var(${tokens.breadcrumbsFontStyle});\n letter-spacing: var(${tokens.breadcrumbsLetterSpacing});\n line-height: var(${tokens.breadcrumbsLineHeight});\n`;\n\nexport const Separator = styled(IconDisclosureRight)`\n color: var(${tokens.breadcrumbsColor});\n opacity: var(${tokens.breadcrumbsOpacity});\n`;\n"],"names":["mergedLinkConfig","mergeConfig","linkConfig","Link","component","_exp","_exp2","_ref","isHref","concat","tokens","breadcrumbsOpacity","StyledLink","styled","name","class","propsAsIs","vars","base","_exp12","IconDisclosureRight","Separator"],"mappings":";;;;;;;;AAUA,IAAMA,gBAAgB,gBAAGC,WAAW,CAACC,UAAU,CAAC,CAAA;AAChD,IAAMC,IAAI,gBAAGC,SAAS,CAACJ,gBAAgB,CAAC,CAAA;AAAC,IAAAK,IAAA,GAVvBA,SAUuBA,IAAAA,GAAA;AAAA,EAAA,OAERF,IAAI,CAAA;AAAA,CAAA,CAAA;AAAA,IAAAG,KAAA,GAZnBA,SAYmBA,KAAAA,GAAA;AAAA,EAAA,OACtB,UAAAC,IAAA,EAAA;AAAA,IAAA,IAAGC,MAAAA,GAAAA,IAAAA,CAAAA,MAAAA,CAAAA;IAAAA,OAAcA,MAAM,GAAG,CAAC,GAAA,MAAA,CAAAC,MAAA,CAAUC,MAAM,CAACC,kBAAmB,EAAG,GAAA,CAAA,CAAA;AAAA,GAAA,CAAA;AAAA,CAAA,CAAA;AAD1E,IAAMC,UAAU,gBAAGC,MAAM,CAAAR,IAAA,EAAA,CAAA,CAAA;AAAAS,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAAC,EAAAA,IAAA,EAAA;AAAA,IAAA,WAAA,EAAA,cACjBX,KAAkE,EAAA,CAAA;AAAA,GAAA;AAAA,CAQhF,EAAA;AAEM,IAAMY,IAAI,GAahB,UAAA;AAAC,IAAAC,MAAA,GApCgBA,SAoChBA,MAAAA,GAAA;AAAA,EAAA,OAE8BC,mBAAmB,CAAA;AAAA,CAAA,CAAA;AAA5C,IAAMC,SAAS,gBAAGR,MAAM,CAAAM,MAAA,EAAA,CAAA,CAAA;AAAAL,EAAAA,IAAA,EAAA,WAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CAG9B;;;;"}
@@ -0,0 +1,3 @@
1
+ .shehk3i{opacity:var(--shehk3i-0);position:relative;}.shehk3i::before{content:'';position:absolute;top:0rem;left:0rem;right:0rem;bottom:0rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:0rem;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.shehk3i.focus-visible:focus::before,.shehk3i[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-breadcrumbs-focus-outline-color);}
2
+ .bkgt5xr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-breadcrumbs-gap);color:var(--plasma-breadcrumbs-color);font-family:var(--plasma-breadcrumbs-font-family);font-size:var(--plasma-breadcrumbs-font-size);font-weight:var(--plasma-breadcrumbs-font-weight);font-style:var(--plasma-breadcrumbs-font-style);-webkit-letter-spacing:var(--plasma-breadcrumbs-letter-spacing);-moz-letter-spacing:var(--plasma-breadcrumbs-letter-spacing);-ms-letter-spacing:var(--plasma-breadcrumbs-letter-spacing);letter-spacing:var(--plasma-breadcrumbs-letter-spacing);line-height:var(--plasma-breadcrumbs-line-height);}
3
+ .sajtslk{color:var(--plasma-breadcrumbs-color);opacity:var(--plasma-breadcrumbs-opacity);}
@@ -0,0 +1,18 @@
1
+ var classes = {
2
+ breadcrumbsRoot: 'breadcrumbs-root'
3
+ };
4
+ var tokens = {
5
+ breadcrumbsGap: '--plasma-breadcrumbs-gap',
6
+ breadcrumbsOpacity: '--plasma-breadcrumbs-opacity',
7
+ breadcrumbsFocusOutlineColor: '--plasma-breadcrumbs-focus-outline-color',
8
+ breadcrumbsColor: '--plasma-breadcrumbs-color',
9
+ breadcrumbsFontFamily: '--plasma-breadcrumbs-font-family',
10
+ breadcrumbsFontSize: '--plasma-breadcrumbs-font-size',
11
+ breadcrumbsFontStyle: '--plasma-breadcrumbs-font-style',
12
+ breadcrumbsFontWeight: '--plasma-breadcrumbs-font-weight',
13
+ breadcrumbsLetterSpacing: '--plasma-breadcrumbs-letter-spacing',
14
+ breadcrumbsLineHeight: '--plasma-breadcrumbs-line-height'
15
+ };
16
+
17
+ export { classes, tokens };
18
+ //# sourceMappingURL=Breadcrumbs.tokens.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Breadcrumbs.tokens.js","sources":["../../../src/components/Breadcrumbs/Breadcrumbs.tokens.ts"],"sourcesContent":["export const classes = {\n breadcrumbsRoot: 'breadcrumbs-root',\n};\n\nexport const tokens = {\n breadcrumbsGap: '--plasma-breadcrumbs-gap',\n breadcrumbsOpacity: '--plasma-breadcrumbs-opacity',\n breadcrumbsFocusOutlineColor: '--plasma-breadcrumbs-focus-outline-color',\n\n breadcrumbsColor: '--plasma-breadcrumbs-color',\n breadcrumbsFontFamily: '--plasma-breadcrumbs-font-family',\n breadcrumbsFontSize: '--plasma-breadcrumbs-font-size',\n breadcrumbsFontStyle: '--plasma-breadcrumbs-font-style',\n breadcrumbsFontWeight: '--plasma-breadcrumbs-font-weight',\n breadcrumbsLetterSpacing: '--plasma-breadcrumbs-letter-spacing',\n breadcrumbsLineHeight: '--plasma-breadcrumbs-line-height',\n};\n"],"names":["classes","breadcrumbsRoot","tokens","breadcrumbsGap","breadcrumbsOpacity","breadcrumbsFocusOutlineColor","breadcrumbsColor","breadcrumbsFontFamily","breadcrumbsFontSize","breadcrumbsFontStyle","breadcrumbsFontWeight","breadcrumbsLetterSpacing","breadcrumbsLineHeight"],"mappings":"AAAO,IAAMA,OAAO,GAAG;AACnBC,EAAAA,eAAe,EAAE,kBAAA;AACrB,EAAC;AAEM,IAAMC,MAAM,GAAG;AAClBC,EAAAA,cAAc,EAAE,0BAA0B;AAC1CC,EAAAA,kBAAkB,EAAE,8BAA8B;AAClDC,EAAAA,4BAA4B,EAAE,0CAA0C;AAExEC,EAAAA,gBAAgB,EAAE,4BAA4B;AAC9CC,EAAAA,qBAAqB,EAAE,kCAAkC;AACzDC,EAAAA,mBAAmB,EAAE,gCAAgC;AACrDC,EAAAA,oBAAoB,EAAE,iCAAiC;AACvDC,EAAAA,qBAAqB,EAAE,kCAAkC;AACzDC,EAAAA,wBAAwB,EAAE,qCAAqC;AAC/DC,EAAAA,qBAAqB,EAAE,kCAAA;AAC3B;;;;"}
@@ -0,0 +1,33 @@
1
+ import { slicedToArray as _slicedToArray } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
2
+ import React, { useState } from 'react';
3
+ import { StyledRoot, StyledShorter, StyledHidden } from './BreadcrumbShorter.styles.js';
4
+
5
+ var BreadcrumbShorter = function BreadcrumbShorter(_ref) {
6
+ var children = _ref.children,
7
+ separator = _ref.separator;
8
+ var _useState = useState(false),
9
+ _useState2 = _slicedToArray(_useState, 2),
10
+ openShorter = _useState2[0],
11
+ setOpenShorter = _useState2[1];
12
+ var renderItems = children.flatMap(function (item, idx) {
13
+ return idx < children.length - 1 ? [item, separator] : [item];
14
+ });
15
+ var onKeyPress = function onKeyPress(event) {
16
+ event.persist();
17
+ if (event.keyCode === 13) {
18
+ setOpenShorter(true);
19
+ }
20
+ };
21
+ return /*#__PURE__*/React.createElement(StyledRoot, null, !openShorter && /*#__PURE__*/React.createElement(StyledShorter, {
22
+ tabIndex: 0,
23
+ onClick: function onClick() {
24
+ return setOpenShorter(true);
25
+ },
26
+ onKeyDown: onKeyPress
27
+ }, "..."), openShorter && /*#__PURE__*/React.createElement(StyledHidden, null, renderItems.map(function (item) {
28
+ return item;
29
+ })));
30
+ };
31
+
32
+ export { BreadcrumbShorter };
33
+ //# sourceMappingURL=BreadcrumbShorter.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BreadcrumbShorter.js","sources":["../../../../../src/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.tsx"],"sourcesContent":["import React, { HTMLAttributes, ReactNode, useState, KeyboardEvent } from 'react';\n\nimport { StyledHidden, StyledRoot, StyledShorter } from './BreadcrumbShorter.styles';\nimport { BreadcrumbShorterProps } from './BreadcrumbShorter.types';\n\nexport const BreadcrumbShorter: React.FC<HTMLAttributes<HTMLDivElement> & BreadcrumbShorterProps> = ({\n children,\n separator,\n}) => {\n const [openShorter, setOpenShorter] = useState(false);\n\n const renderItems: ReactNode[] = children.flatMap((item, idx) =>\n idx < children.length - 1 ? [item, separator] : [item],\n );\n\n const onKeyPress = (event: KeyboardEvent<HTMLDivElement>) => {\n event.persist();\n\n if (event.keyCode === 13) {\n setOpenShorter(true);\n }\n };\n\n return (\n <StyledRoot>\n {!openShorter && (\n <StyledShorter tabIndex={0} onClick={() => setOpenShorter(true)} onKeyDown={onKeyPress}>\n ...\n </StyledShorter>\n )}\n {openShorter && (\n <StyledHidden>\n {renderItems.map((item) => {\n return item;\n })}\n </StyledHidden>\n )}\n </StyledRoot>\n );\n};\n"],"names":["BreadcrumbShorter","_ref","children","separator","_useState","useState","_useState2","_slicedToArray","openShorter","setOpenShorter","renderItems","flatMap","item","idx","length","onKeyPress","event","persist","keyCode","React","createElement","StyledRoot","StyledShorter","tabIndex","onClick","onKeyDown","StyledHidden","map"],"mappings":";;;;IAKaA,iBAAoF,GAAG,SAAvFA,iBAAoFA,CAAAC,IAAA,EAG3F;AAAA,EAAA,IAFFC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,SAAS,GAAAF,IAAA,CAATE,SAAS,CAAA;AAET,EAAA,IAAAC,SAAA,GAAsCC,QAAQ,CAAC,KAAK,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAA9CI,IAAAA,WAAW,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,cAAc,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;EAElC,IAAMI,WAAwB,GAAGR,QAAQ,CAACS,OAAO,CAAC,UAACC,IAAI,EAAEC,GAAG,EAAA;AAAA,IAAA,OACxDA,GAAG,GAAGX,QAAQ,CAACY,MAAM,GAAG,CAAC,GAAG,CAACF,IAAI,EAAET,SAAS,CAAC,GAAG,CAACS,IAAI,CAAC,CAAA;AAAA,GAC1D,CAAC,CAAA;AAED,EAAA,IAAMG,UAAU,GAAG,SAAbA,UAAUA,CAAIC,KAAoC,EAAK;IACzDA,KAAK,CAACC,OAAO,EAAE,CAAA;AAEf,IAAA,IAAID,KAAK,CAACE,OAAO,KAAK,EAAE,EAAE;MACtBT,cAAc,CAAC,IAAI,CAAC,CAAA;AACxB,KAAA;GACH,CAAA;AAED,EAAA,oBACIU,KAAA,CAAAC,aAAA,CAACC,UAAU,EAAA,IAAA,EACN,CAACb,WAAW,iBACTW,KAAA,CAAAC,aAAA,CAACE,aAAa,EAAA;AAACC,IAAAA,QAAQ,EAAE,CAAE;IAACC,OAAO,EAAE,SAAAA,OAAA,GAAA;MAAA,OAAMf,cAAc,CAAC,IAAI,CAAC,CAAA;KAAC;AAACgB,IAAAA,SAAS,EAAEV,UAAAA;AAAW,GAAA,EAAC,KAEzE,CAClB,EACAP,WAAW,iBACRW,KAAA,CAAAC,aAAA,CAACM,YAAY,QACRhB,WAAW,CAACiB,GAAG,CAAC,UAACf,IAAI,EAAK;AACvB,IAAA,OAAOA,IAAI,CAAA;GACd,CACS,CAEV,CAAC,CAAA;AAErB;;;;"}
@@ -0,0 +1,21 @@
1
+ import styled from 'styled-components';
2
+ import { addFocus } from '../../../../mixins/addFocus.js';
3
+ import { tokens } from '../../Breadcrumbs.tokens.js';
4
+
5
+ var StyledRoot = /*#__PURE__*/styled.div.withConfig({
6
+ componentId: "plasma-new-hope__sc-1ufgggn-0"
7
+ })([""]);
8
+ var StyledShorter = /*#__PURE__*/styled.div.withConfig({
9
+ componentId: "plasma-new-hope__sc-1ufgggn-1"
10
+ })(["cursor:pointer;", ""], /*#__PURE__*/addFocus({
11
+ outlineOffset: '0.125rem',
12
+ outlineSize: '0.125rem',
13
+ outlineRadius: '0',
14
+ outlineColor: /*#__PURE__*/"var(".concat(tokens.breadcrumbsFocusOutlineColor, ")")
15
+ }));
16
+ var StyledHidden = /*#__PURE__*/styled.div.withConfig({
17
+ componentId: "plasma-new-hope__sc-1ufgggn-2"
18
+ })(["display:flex;align-items:center;gap:var(", ");"], tokens.breadcrumbsGap);
19
+
20
+ export { StyledHidden, StyledRoot, StyledShorter };
21
+ //# sourceMappingURL=BreadcrumbShorter.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BreadcrumbShorter.styles.js","sources":["../../../../../src/components/Breadcrumbs/ui/BreadcrumbShorter/BreadcrumbShorter.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { addFocus } from '../../../../mixins';\nimport { tokens } from '../../Breadcrumbs.tokens';\n\nexport const StyledRoot = styled.div``;\nexport const StyledShorter = styled.div`\n cursor: pointer;\n ${addFocus({\n outlineOffset: '0.125rem',\n outlineSize: '0.125rem',\n outlineRadius: '0',\n outlineColor: `var(${tokens.breadcrumbsFocusOutlineColor})`,\n })}\n`;\nexport const StyledHidden = styled.div`\n display: flex;\n align-items: center;\n gap: var(${tokens.breadcrumbsGap});\n`;\n"],"names":["StyledRoot","styled","div","withConfig","componentId","StyledShorter","addFocus","outlineOffset","outlineSize","outlineRadius","outlineColor","concat","tokens","breadcrumbsFocusOutlineColor","StyledHidden","breadcrumbsGap"],"mappings":";;;;IAKaA,UAAU,gBAAGC,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,+BAAA;AAAA,CAAE,CAAA,CAAA,CAAA,EAAA,CAAA,EAAA;IACzBC,aAAa,gBAAGJ,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,+BAAA;AAAA,CAAA,CAAA,CAAA,CAAA,iBAAA,EAAA,EAAA,CAAA,eAEjCE,QAAQ,CAAC;AACPC,EAAAA,aAAa,EAAE,UAAU;AACzBC,EAAAA,WAAW,EAAE,UAAU;AACvBC,EAAAA,aAAa,EAAE,GAAG;AAClBC,EAAAA,YAAY,eAAAC,MAAAA,CAAAA,MAAA,CAASC,MAAM,CAACC,4BAA4B,EAAA,GAAA,CAAA;AAC5D,CAAC,CAAC,EACL;IACYC,YAAY,gBAAGb,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,+BAAA;AAAA,CAGvBQ,CAAAA,CAAAA,CAAAA,0CAAAA,EAAAA,IAAAA,CAAAA,EAAAA,MAAM,CAACG,cAAc;;;;"}
@@ -0,0 +1,5 @@
1
+ import './base_x642ct.css';
2
+ var base = "b1js38v0";
3
+
4
+ export { base };
5
+ //# sourceMappingURL=base.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"base.js","sources":["../../../../../src/components/Breadcrumbs/variations/_size/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nexport const base = css``;\n"],"names":["base"],"mappings":"AAEO,IAAMA,IAAI,GAAQ;;;;"}
@@ -0,0 +1,5 @@
1
+ import './base_x642ct.css';
2
+ var base = "b1m0s7h0";
3
+
4
+ export { base };
5
+ //# sourceMappingURL=base.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"base.js","sources":["../../../../../src/components/Breadcrumbs/variations/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nexport const base = css``;\n"],"names":["base"],"mappings":"AAEO,IAAMA,IAAI,GAAQ;;;;"}
package/es/index.css CHANGED
@@ -33,6 +33,10 @@
33
33
 
34
34
  .ButtonGroup_styles_92nbdg_b181uun8__0ffde6c1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
35
35
 
36
+ .Breadcrumbs_styles_1troyzr_shehk3i__0db10aef{opacity:var(--shehk3i-0);position:relative;}.Breadcrumbs_styles_1troyzr_shehk3i__0db10aef::before{content:'';position:absolute;top:0rem;left:0rem;right:0rem;bottom:0rem;z-index:1;display:block;box-sizing:content-box;border:0.125rem solid transparent;border-radius:0rem;-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.Breadcrumbs_styles_1troyzr_shehk3i__0db10aef.Breadcrumbs_styles_1troyzr_focusVisible__0db10aef:focus::before,.Breadcrumbs_styles_1troyzr_shehk3i__0db10aef[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.125rem var(--plasma-breadcrumbs-focus-outline-color);}
37
+ .Breadcrumbs_styles_1troyzr_bkgt5xr__0db10aef{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--plasma-breadcrumbs-gap);color:var(--plasma-breadcrumbs-color);font-family:var(--plasma-breadcrumbs-font-family);font-size:var(--plasma-breadcrumbs-font-size);font-weight:var(--plasma-breadcrumbs-font-weight);font-style:var(--plasma-breadcrumbs-font-style);-webkit-letter-spacing:var(--plasma-breadcrumbs-letter-spacing);-moz-letter-spacing:var(--plasma-breadcrumbs-letter-spacing);-ms-letter-spacing:var(--plasma-breadcrumbs-letter-spacing);letter-spacing:var(--plasma-breadcrumbs-letter-spacing);line-height:var(--plasma-breadcrumbs-line-height);}
38
+ .Breadcrumbs_styles_1troyzr_sajtslk__0db10aef{color:var(--plasma-breadcrumbs-color);opacity:var(--plasma-breadcrumbs-opacity);}
39
+
36
40
  .IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
37
41
 
38
42
  .base_1lwlv7t_b13tc97x__334a4e59{color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}.base_1lwlv7t_b13tc97x__334a4e59:hover{color:var(--plasma-chip-color-hover);background-color:var(--plasma-chip-background-hover);scale:var(--plasma-chip-scale-hover);}.base_1lwlv7t_b13tc97x__334a4e59:active{color:var(--plasma-chip-color-active);background-color:var(--plasma-chip-background-active);scale:var(--plasma-chip-scale-active);}
package/es/index.js CHANGED
@@ -23,6 +23,8 @@ export { iconButtonConfig, iconButtonRoot } from './components/IconButton/IconBu
23
23
  export { tokens as iconButtonTokens } from './components/IconButton/IconButton.tokens.js';
24
24
  export { buttonGroupConfig, buttonGroupRoot } from './components/ButtonGroup/ButtonGroup.js';
25
25
  export { classes as buttonGroupClasses, tokens as buttonGroupTokens } from './components/ButtonGroup/ButtonGroup.tokens.js';
26
+ export { breadcrumbsConfig, breadcrumbsRoot } from './components/Breadcrumbs/Breadcrumbs.js';
27
+ export { classes as breadcrumbsClasses, tokens as breadcrumbsTokens } from './components/Breadcrumbs/Breadcrumbs.tokens.js';
26
28
  export { chipConfig, chipRoot } from './components/Chip/Chip.js';
27
29
  export { tokens as chipTokens } from './components/Chip/Chip.tokens.js';
28
30
  export { CellTextboxLabel } from './components/Cell/ui/CellTextboxLabel/CellTextboxLabel.js';
package/es/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-new-hope",
3
- "version": "0.111.0-canary.1308.10073134400.0",
3
+ "version": "0.112.0-canary.1310.10078865814.0",
4
4
  "description": "Salute Design System blueprint",
5
5
  "main": "cjs/index.js",
6
6
  "module": "es/index.js",
@@ -118,5 +118,5 @@
118
118
  "react-popper": "2.3.0",
119
119
  "storeon": "3.1.5"
120
120
  },
121
- "gitHead": "3a1857de396f4e1a3ef41085034ff4f92d01ae82"
121
+ "gitHead": "844f550cbc735000345035791091d9e33abfa59e"
122
122
  }
@@ -0,0 +1,94 @@
1
+ "use strict";
2
+
3
+ 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); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.breadcrumbsRoot = exports.breadcrumbsConfig = void 0;
8
+ var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
+ var _utils = /*#__PURE__*/require("../../utils");
10
+ var _base = /*#__PURE__*/require("./variations/_size/base");
11
+ var _base2 = /*#__PURE__*/require("./variations/_view/base");
12
+ var _Breadcrumbs = /*#__PURE__*/require("./Breadcrumbs.styles");
13
+ var _BreadcrumbShorter = /*#__PURE__*/require("./ui/BreadcrumbShorter/BreadcrumbShorter");
14
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
15
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
16
+ var shortItems = function shortItems(items, renderSeparator, showItems) {
17
+ if (!showItems) {
18
+ return items;
19
+ }
20
+ var leftSlice = Math.floor(showItems / 2);
21
+ var rightSlice = items.length - leftSlice - showItems % 2;
22
+ var renderItems = items.slice(leftSlice, rightSlice);
23
+ var shorter = /*#__PURE__*/_react["default"].createElement(_BreadcrumbShorter.BreadcrumbShorter, {
24
+ separator: renderSeparator
25
+ }, renderItems);
26
+ items.splice(leftSlice, rightSlice - leftSlice, shorter);
27
+ return items;
28
+ };
29
+ var convertIconSize = function convertIconSize(size) {
30
+ switch (size) {
31
+ case 's':
32
+ return 'xs';
33
+ case 'm':
34
+ return 's';
35
+ case 'l':
36
+ return 's';
37
+ default:
38
+ return 's';
39
+ }
40
+ };
41
+ var breadcrumbsRoot = exports.breadcrumbsRoot = function breadcrumbsRoot(Root) {
42
+ return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, outerRootRef) {
43
+ var view = _ref.view,
44
+ size = _ref.size,
45
+ separator = _ref.separator,
46
+ items = _ref.items,
47
+ showItems = _ref.showItems,
48
+ className = _ref.className;
49
+ var renderSeparator = separator !== null && separator !== void 0 ? separator : /*#__PURE__*/_react["default"].createElement(_Breadcrumbs.Separator, {
50
+ color: "inherit",
51
+ size: convertIconSize(size)
52
+ });
53
+ var renderItems = shortItems(items.map(function (item) {
54
+ if ('renderItem' in item) {
55
+ return item.renderItem();
56
+ }
57
+ return /*#__PURE__*/_react["default"].createElement(_Breadcrumbs.StyledLink, {
58
+ tabIndex: 0,
59
+ href: item.href,
60
+ isHref: !!item.href
61
+ }, item.title);
62
+ }), renderSeparator, showItems);
63
+ var itemsWithSeparator = renderItems.flatMap(function (item, idx) {
64
+ return idx < renderItems.length - 1 ? [item, renderSeparator] : [item];
65
+ });
66
+ return /*#__PURE__*/_react["default"].createElement(Root, {
67
+ ref: outerRootRef,
68
+ size: size,
69
+ view: view,
70
+ className: (0, _utils.cx)(className),
71
+ items: items
72
+ }, itemsWithSeparator.map(function (item) {
73
+ return item;
74
+ }));
75
+ });
76
+ };
77
+ var breadcrumbsConfig = exports.breadcrumbsConfig = {
78
+ name: 'Breadcrumbs',
79
+ tag: 'div',
80
+ layout: breadcrumbsRoot,
81
+ base: _Breadcrumbs.base,
82
+ variations: {
83
+ view: {
84
+ css: _base2.base
85
+ },
86
+ size: {
87
+ css: _base.base
88
+ }
89
+ },
90
+ defaults: {
91
+ view: 'default',
92
+ size: 'm'
93
+ }
94
+ };
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ 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); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.base = exports.StyledLink = exports.Separator = void 0;
8
+ var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
9
+ var _Link = /*#__PURE__*/require("../Link");
10
+ var _engines = /*#__PURE__*/require("../../engines");
11
+ var _Icon = /*#__PURE__*/require("../_Icon");
12
+ var _mixins = /*#__PURE__*/require("../../mixins");
13
+ var _Breadcrumbs = /*#__PURE__*/require("./Breadcrumbs.tokens");
14
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
15
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
16
+ var mergedLinkConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Link.linkConfig);
17
+ var Link = /*#__PURE__*/(0, _engines.component)(mergedLinkConfig);
18
+ var StyledLink = exports.StyledLink = /*#__PURE__*/(0, _styledComponents["default"])(Link).withConfig({
19
+ componentId: "plasma-new-hope__sc-4bjoev-0"
20
+ })(["opacity:", ";", ""], function (_ref) {
21
+ var isHref = _ref.isHref;
22
+ return isHref ? 1 : "var(".concat(_Breadcrumbs.tokens.breadcrumbsOpacity, ")");
23
+ }, /*#__PURE__*/(0, _mixins.addFocus)({
24
+ outlineOffset: '0rem',
25
+ outlineSize: '0.125rem',
26
+ outlineRadius: '0rem',
27
+ outlineColor: /*#__PURE__*/"var(".concat(_Breadcrumbs.tokens.breadcrumbsFocusOutlineColor, ")")
28
+ }));
29
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:flex;flex-direction:row;align-items:center;gap:var(", ");color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");"], _Breadcrumbs.tokens.breadcrumbsGap, _Breadcrumbs.tokens.breadcrumbsColor, _Breadcrumbs.tokens.breadcrumbsFontFamily, _Breadcrumbs.tokens.breadcrumbsFontSize, _Breadcrumbs.tokens.breadcrumbsFontWeight, _Breadcrumbs.tokens.breadcrumbsFontStyle, _Breadcrumbs.tokens.breadcrumbsLetterSpacing, _Breadcrumbs.tokens.breadcrumbsLineHeight);
30
+ var Separator = exports.Separator = /*#__PURE__*/(0, _styledComponents["default"])(_Icon.IconDisclosureRight).withConfig({
31
+ componentId: "plasma-new-hope__sc-4bjoev-1"
32
+ })(["color:var(", ");opacity:var(", ");"], _Breadcrumbs.tokens.breadcrumbsColor, _Breadcrumbs.tokens.breadcrumbsOpacity);
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.tokens = exports.classes = void 0;
7
+ var classes = exports.classes = {
8
+ breadcrumbsRoot: 'breadcrumbs-root'
9
+ };
10
+ var tokens = exports.tokens = {
11
+ breadcrumbsGap: '--plasma-breadcrumbs-gap',
12
+ breadcrumbsOpacity: '--plasma-breadcrumbs-opacity',
13
+ breadcrumbsFocusOutlineColor: '--plasma-breadcrumbs-focus-outline-color',
14
+ breadcrumbsColor: '--plasma-breadcrumbs-color',
15
+ breadcrumbsFontFamily: '--plasma-breadcrumbs-font-family',
16
+ breadcrumbsFontSize: '--plasma-breadcrumbs-font-size',
17
+ breadcrumbsFontStyle: '--plasma-breadcrumbs-font-style',
18
+ breadcrumbsFontWeight: '--plasma-breadcrumbs-font-weight',
19
+ breadcrumbsLetterSpacing: '--plasma-breadcrumbs-letter-spacing',
20
+ breadcrumbsLineHeight: '--plasma-breadcrumbs-line-height'
21
+ };
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -0,0 +1,78 @@
1
+ Структура файлов:
2
+
3
+ - Breadcrumbs.types.ts
4
+ - Breadcrumbs.tokens.ts
5
+ - Breadcrumbs.tsx
6
+ - index.ts
7
+ - variants:
8
+ - - \_size:
9
+ - - - base.ts
10
+ - - - tokens.json
11
+ - ui:
12
+ - - BreadcrumbItem:
13
+ - - - BreadcrumbItem.tsx
14
+ - - BreadcrumbShorter:
15
+ - - - BreadcrumbShorter.tsx
16
+ - - BreadcrumbSeparator:
17
+ - - - BreadcrumbSeparator.tsx
18
+
19
+ Логика работы:
20
+
21
+ 1. На вход идет 1 обязательный параметр: items
22
+
23
+ ```jsx
24
+ <Breadcrumbs items={[{ title: 'Главная', href: '/' }]}></Breadcreumbs>
25
+ ```
26
+
27
+ 2. Затем генерируется массив элементов хлебных крошек, между ними сепаратор ( если указан пропс, то используется элемент из параметра, иначе стандартный из BreadcrumbSeparator )
28
+
29
+ ```jsx
30
+ <Breadcrumbs items={[{ title: 'Главная', href: '/' }]} separator=">"></Breadcreumbs>
31
+ ```
32
+
33
+ 2.1. При генерации BreadcrumbItem, смотрит на href. Если он есть, то добавляется тег a, с указанной ссылкой, иначе ссылка не кликабельна
34
+
35
+ ```jsx
36
+ <Breadcrumbs
37
+ items={[
38
+ { title: 'Главная', href: '/' },
39
+ { title: 'Контакты' }, // Без ссылки
40
+ ]}
41
+ separator=">"
42
+ ></Breadcreumbs>
43
+ ```
44
+
45
+ 3. Можно указать в item, вместо title и href - renderItem. Эта функция, которая возвращает любое, что придумал разработчик. кастомный шортер, определенный функционал для него ( например кнопку )
46
+
47
+ ```jsx
48
+ const renderItem = () => {
49
+ return <Button>Контакты</Button>
50
+ }
51
+ <Breadcrumbs
52
+ items={[
53
+ {title: 'Главная', href: '/'},
54
+ {renderItem: renderItem}
55
+ {title: 'Адрес'}
56
+ ]}
57
+ separator=">">
58
+ </Breadcreumbs>
59
+ ```
60
+
61
+ ТАКЖЕ: Можно указать кол-во видимых элементов через параметр showItems. ShowItems: если указано четное число, напрмер 2 - то распределяется навномерно по 1 с каждой стороны. Если нечетное, напрмер 3 - то две будет справа и 1 слева. Все оставльное сокращается шортером
62
+
63
+ ```jsx
64
+ const renderItem = () => {
65
+ return <Button>Контакты</Button>
66
+ }
67
+ <Breadcrumbs
68
+ items={[
69
+ {title: 'Главная', href: '/'},
70
+ {renderItem: renderItem}
71
+ {title: 'Адрес'}
72
+ ]}
73
+ showItems={2}
74
+ separator=">">
75
+ </Breadcreumbs>
76
+ ```
77
+
78
+ 4. Затем все элементы рендерятся и показываются пользователю
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "breadcrumbsClasses", {
7
+ enumerable: true,
8
+ get: function get() {
9
+ return _Breadcrumbs2.classes;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "breadcrumbsConfig", {
13
+ enumerable: true,
14
+ get: function get() {
15
+ return _Breadcrumbs.breadcrumbsConfig;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "breadcrumbsRoot", {
19
+ enumerable: true,
20
+ get: function get() {
21
+ return _Breadcrumbs.breadcrumbsRoot;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "breadcrumbsTokens", {
25
+ enumerable: true,
26
+ get: function get() {
27
+ return _Breadcrumbs2.tokens;
28
+ }
29
+ });
30
+ var _Breadcrumbs = /*#__PURE__*/require("./Breadcrumbs");
31
+ var _Breadcrumbs2 = /*#__PURE__*/require("./Breadcrumbs.tokens");
@@ -0,0 +1,43 @@
1
+ "use strict";
2
+
3
+ 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); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.BreadcrumbShorter = void 0;
8
+ var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
+ var _BreadcrumbShorter = /*#__PURE__*/require("./BreadcrumbShorter.styles");
10
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
11
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
12
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
13
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
14
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
15
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
16
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
17
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
18
+ var BreadcrumbShorter = exports.BreadcrumbShorter = function BreadcrumbShorter(_ref) {
19
+ var children = _ref.children,
20
+ separator = _ref.separator;
21
+ var _useState = (0, _react.useState)(false),
22
+ _useState2 = _slicedToArray(_useState, 2),
23
+ openShorter = _useState2[0],
24
+ setOpenShorter = _useState2[1];
25
+ var renderItems = children.flatMap(function (item, idx) {
26
+ return idx < children.length - 1 ? [item, separator] : [item];
27
+ });
28
+ var onKeyPress = function onKeyPress(event) {
29
+ event.persist();
30
+ if (event.keyCode === 13) {
31
+ setOpenShorter(true);
32
+ }
33
+ };
34
+ return /*#__PURE__*/_react["default"].createElement(_BreadcrumbShorter.StyledRoot, null, !openShorter && /*#__PURE__*/_react["default"].createElement(_BreadcrumbShorter.StyledShorter, {
35
+ tabIndex: 0,
36
+ onClick: function onClick() {
37
+ return setOpenShorter(true);
38
+ },
39
+ onKeyDown: onKeyPress
40
+ }, "..."), openShorter && /*#__PURE__*/_react["default"].createElement(_BreadcrumbShorter.StyledHidden, null, renderItems.map(function (item) {
41
+ return item;
42
+ })));
43
+ };
@@ -0,0 +1,24 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.StyledShorter = exports.StyledRoot = exports.StyledHidden = void 0;
7
+ var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
8
+ var _mixins = /*#__PURE__*/require("../../../../mixins");
9
+ var _Breadcrumbs = /*#__PURE__*/require("../../Breadcrumbs.tokens");
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
+ var StyledRoot = exports.StyledRoot = /*#__PURE__*/_styledComponents["default"].div.withConfig({
12
+ componentId: "plasma-new-hope__sc-1shiits-0"
13
+ })([""]);
14
+ var StyledShorter = exports.StyledShorter = /*#__PURE__*/_styledComponents["default"].div.withConfig({
15
+ componentId: "plasma-new-hope__sc-1shiits-1"
16
+ })(["cursor:pointer;", ""], /*#__PURE__*/(0, _mixins.addFocus)({
17
+ outlineOffset: '0.125rem',
18
+ outlineSize: '0.125rem',
19
+ outlineRadius: '0',
20
+ outlineColor: /*#__PURE__*/"var(".concat(_Breadcrumbs.tokens.breadcrumbsFocusOutlineColor, ")")
21
+ }));
22
+ var StyledHidden = exports.StyledHidden = /*#__PURE__*/_styledComponents["default"].div.withConfig({
23
+ componentId: "plasma-new-hope__sc-1shiits-2"
24
+ })(["display:flex;align-items:center;gap:var(", ");"], _Breadcrumbs.tokens.breadcrumbsGap);
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.base = void 0;
7
+ var _styledComponents = /*#__PURE__*/require("styled-components");
8
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.base = void 0;
7
+ var _styledComponents = /*#__PURE__*/require("styled-components");
8
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);