@dynatrace/strato-components 1.15.0 → 1.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (200) hide show
  1. package/buttons/button/Button.css +16 -16
  2. package/buttons/button/Button.js +4 -1
  3. package/buttons/button/Button.sty.js +4 -4
  4. package/buttons/intent-button/IntentButton.d.ts +1 -0
  5. package/buttons/intent-button/IntentButton.js +4 -1
  6. package/content/progress/ProgressBar.css +71 -71
  7. package/content/progress/ProgressBar.sty.js +5 -5
  8. package/content/progress/ProgressBarIcon.css +2 -2
  9. package/content/progress/ProgressBarIcon.sty.js +1 -1
  10. package/content/progress/ProgressBarLabel.css +3 -3
  11. package/content/progress/ProgressBarLabel.sty.js +1 -1
  12. package/content/progress/ProgressBarValue.css +5 -5
  13. package/content/progress/ProgressBarValue.sty.js +1 -1
  14. package/content/progress/ProgressCircle.css +40 -40
  15. package/content/progress/ProgressCircle.sty.d.ts +13 -7
  16. package/content/progress/ProgressCircle.sty.js +5 -5
  17. package/content/skeleton/Skeleton.css +7 -7
  18. package/content/skeleton/Skeleton.js +2 -2
  19. package/content/skeleton/Skeleton.sty.js +5 -5
  20. package/content/skeleton/SkeletonText.js +3 -3
  21. package/core/components/app-root/AppRoot.js +3 -1
  22. package/core/hooks/useBehavioralTrackingProps.d.ts +2 -0
  23. package/core/hooks/useBehavioralTrackingProps.js +46 -0
  24. package/core/index.d.ts +1 -0
  25. package/core/styles/focusRing.css +66 -66
  26. package/core/styles/focusRing.sty.d.ts +34 -10
  27. package/core/styles/focusRing.sty.js +2 -2
  28. package/core/types/behavior-tracking-props.d.ts +33 -0
  29. package/core/types/behavior-tracking-props.js +16 -0
  30. package/core/utils/colorUtils.css +60 -60
  31. package/core/utils/colorUtils.sty.d.ts +15 -5
  32. package/core/utils/colorUtils.sty.js +2 -2
  33. package/esm/buttons/button/Button.css +16 -16
  34. package/esm/buttons/button/Button.js +4 -1
  35. package/esm/buttons/button/Button.js.map +2 -2
  36. package/esm/buttons/button/Button.sty.js +4 -4
  37. package/esm/buttons/button/Button.sty.js.map +1 -1
  38. package/esm/buttons/index.js.map +2 -2
  39. package/esm/buttons/intent-button/IntentButton.js +4 -1
  40. package/esm/buttons/intent-button/IntentButton.js.map +2 -2
  41. package/esm/content/progress/ProgressBar.css +71 -71
  42. package/esm/content/progress/ProgressBar.sty.js +5 -5
  43. package/esm/content/progress/ProgressBar.sty.js.map +1 -1
  44. package/esm/content/progress/ProgressBarIcon.css +2 -2
  45. package/esm/content/progress/ProgressBarIcon.sty.js +1 -1
  46. package/esm/content/progress/ProgressBarIcon.sty.js.map +1 -1
  47. package/esm/content/progress/ProgressBarLabel.css +3 -3
  48. package/esm/content/progress/ProgressBarLabel.sty.js +1 -1
  49. package/esm/content/progress/ProgressBarLabel.sty.js.map +1 -1
  50. package/esm/content/progress/ProgressBarValue.css +5 -5
  51. package/esm/content/progress/ProgressBarValue.sty.js +1 -1
  52. package/esm/content/progress/ProgressBarValue.sty.js.map +1 -1
  53. package/esm/content/progress/ProgressCircle.css +40 -40
  54. package/esm/content/progress/ProgressCircle.sty.js +5 -5
  55. package/esm/content/progress/ProgressCircle.sty.js.map +1 -1
  56. package/esm/content/skeleton/Skeleton.css +7 -7
  57. package/esm/content/skeleton/Skeleton.js +1 -1
  58. package/esm/content/skeleton/Skeleton.js.map +1 -1
  59. package/esm/content/skeleton/Skeleton.sty.js +5 -5
  60. package/esm/content/skeleton/Skeleton.sty.js.map +1 -1
  61. package/esm/content/skeleton/SkeletonText.js +1 -1
  62. package/esm/content/skeleton/SkeletonText.js.map +1 -1
  63. package/esm/core/components/app-root/AppRoot.js +3 -1
  64. package/esm/core/components/app-root/AppRoot.js.map +2 -2
  65. package/esm/core/hooks/useBehavioralTrackingProps.js +27 -0
  66. package/esm/core/hooks/useBehavioralTrackingProps.js.map +7 -0
  67. package/esm/core/index.js.map +1 -1
  68. package/esm/core/styles/focusRing.css +66 -66
  69. package/esm/core/styles/focusRing.sty.js +2 -2
  70. package/esm/core/styles/focusRing.sty.js.map +1 -1
  71. package/esm/core/types/behavior-tracking-props.js +1 -0
  72. package/esm/core/types/behavior-tracking-props.js.map +7 -0
  73. package/esm/core/utils/colorUtils.css +60 -60
  74. package/esm/core/utils/colorUtils.sty.js +2 -2
  75. package/esm/core/utils/colorUtils.sty.js.map +1 -1
  76. package/esm/layouts/container/Container.css +4 -4
  77. package/esm/layouts/container/Container.sty.js +1 -1
  78. package/esm/layouts/container/Container.sty.js.map +1 -1
  79. package/esm/layouts/divider/Divider.css +6 -6
  80. package/esm/layouts/divider/Divider.sty.js +1 -1
  81. package/esm/layouts/divider/Divider.sty.js.map +1 -1
  82. package/esm/layouts/surface/Surface.css +39 -39
  83. package/esm/layouts/surface/Surface.sty.js +2 -2
  84. package/esm/layouts/surface/Surface.sty.js.map +1 -1
  85. package/esm/layouts/surface/variables.sty.js +1 -1
  86. package/esm/layouts/surface/variables.sty.js.map +1 -1
  87. package/esm/styles/colorUtils.css +60 -60
  88. package/esm/styles/colorUtils.sty.js +2 -2
  89. package/esm/styles/colorUtils.sty.js.map +1 -1
  90. package/esm/styles/container.css +47 -47
  91. package/esm/styles/container.sty.js +2 -2
  92. package/esm/styles/container.sty.js.map +1 -1
  93. package/esm/styles/ellipsis.css +1 -1
  94. package/esm/styles/ellipsis.sty.js +1 -1
  95. package/esm/styles/ellipsis.sty.js.map +1 -1
  96. package/esm/styles/field.css +153 -153
  97. package/esm/styles/field.sty.js +2 -2
  98. package/esm/styles/field.sty.js.map +1 -1
  99. package/esm/styles/sprinkles.css +262 -262
  100. package/esm/styles/sprinkles.sty.js +1 -1
  101. package/esm/styles/sprinkles.sty.js.map +1 -1
  102. package/esm/styles/textStyle.css +8 -8
  103. package/esm/styles/textStyle.sty.js +1 -1
  104. package/esm/styles/textStyle.sty.js.map +1 -1
  105. package/esm/typography/block-quote/Blockquote.css +2 -2
  106. package/esm/typography/block-quote/Blockquote.sty.js +1 -1
  107. package/esm/typography/block-quote/Blockquote.sty.js.map +1 -1
  108. package/esm/typography/code/Code.css +1 -1
  109. package/esm/typography/code/Code.sty.js +1 -1
  110. package/esm/typography/code/Code.sty.js.map +1 -1
  111. package/esm/typography/emphasis/Emphasis.css +1 -1
  112. package/esm/typography/emphasis/Emphasis.sty.js +1 -1
  113. package/esm/typography/emphasis/Emphasis.sty.js.map +1 -1
  114. package/esm/typography/external-link/ExternalLink.css +6 -8
  115. package/esm/typography/external-link/ExternalLink.js +1 -1
  116. package/esm/typography/external-link/ExternalLink.js.map +2 -2
  117. package/esm/typography/external-link/ExternalLink.sty.js +1 -1
  118. package/esm/typography/external-link/ExternalLink.sty.js.map +1 -1
  119. package/esm/typography/heading/Heading.css +7 -7
  120. package/esm/typography/heading/Heading.sty.js +1 -1
  121. package/esm/typography/heading/Heading.sty.js.map +1 -1
  122. package/esm/typography/highlight/Highlight.css +2 -2
  123. package/esm/typography/highlight/Highlight.sty.js +1 -1
  124. package/esm/typography/highlight/Highlight.sty.js.map +1 -1
  125. package/esm/typography/link/Link.css +3 -3
  126. package/esm/typography/link/Link.sty.js +1 -1
  127. package/esm/typography/link/Link.sty.js.map +1 -1
  128. package/esm/typography/list/List.css +4 -4
  129. package/esm/typography/list/List.sty.js +2 -2
  130. package/esm/typography/list/List.sty.js.map +1 -1
  131. package/esm/typography/paragraph/Paragraph.css +3 -3
  132. package/esm/typography/paragraph/Paragraph.sty.js +1 -1
  133. package/esm/typography/paragraph/Paragraph.sty.js.map +1 -1
  134. package/esm/typography/strikethrough/Strikethrough.css +1 -1
  135. package/esm/typography/strikethrough/Strikethrough.sty.js +1 -1
  136. package/esm/typography/strikethrough/Strikethrough.sty.js.map +1 -1
  137. package/esm/typography/strong/Strong.css +1 -1
  138. package/esm/typography/strong/Strong.sty.js +1 -1
  139. package/esm/typography/strong/Strong.sty.js.map +1 -1
  140. package/esm/typography/text/Text.css +3 -3
  141. package/esm/typography/text/Text.sty.js +1 -1
  142. package/esm/typography/text/Text.sty.js.map +1 -1
  143. package/esm/typography/text-ellipsis/TextEllipsis.css +6 -6
  144. package/esm/typography/text-ellipsis/TextEllipsis.sty.js +2 -2
  145. package/esm/typography/text-ellipsis/TextEllipsis.sty.js.map +1 -1
  146. package/esm/typography/utils.js +17 -9
  147. package/esm/typography/utils.js.map +2 -2
  148. package/layouts/container/Container.css +4 -4
  149. package/layouts/container/Container.sty.js +1 -1
  150. package/layouts/divider/Divider.css +6 -6
  151. package/layouts/divider/Divider.sty.js +1 -1
  152. package/layouts/surface/Surface.css +39 -39
  153. package/layouts/surface/Surface.sty.d.ts +19 -6
  154. package/layouts/surface/Surface.sty.js +2 -2
  155. package/layouts/surface/variables.sty.js +1 -1
  156. package/package.json +6 -6
  157. package/styles/colorUtils.css +60 -60
  158. package/styles/colorUtils.sty.d.ts +15 -5
  159. package/styles/colorUtils.sty.js +2 -2
  160. package/styles/container.css +47 -47
  161. package/styles/container.sty.d.ts +16 -6
  162. package/styles/container.sty.js +2 -2
  163. package/styles/ellipsis.css +1 -1
  164. package/styles/ellipsis.sty.js +1 -1
  165. package/styles/field.css +153 -153
  166. package/styles/field.sty.d.ts +24 -17
  167. package/styles/field.sty.js +2 -2
  168. package/styles/sprinkles.css +262 -262
  169. package/styles/sprinkles.sty.d.ts +12 -12
  170. package/styles/sprinkles.sty.js +1 -1
  171. package/styles/textStyle.css +8 -8
  172. package/styles/textStyle.sty.js +1 -1
  173. package/typography/block-quote/Blockquote.css +2 -2
  174. package/typography/block-quote/Blockquote.sty.js +1 -1
  175. package/typography/code/Code.css +1 -1
  176. package/typography/code/Code.sty.js +1 -1
  177. package/typography/emphasis/Emphasis.css +1 -1
  178. package/typography/emphasis/Emphasis.sty.js +1 -1
  179. package/typography/external-link/ExternalLink.css +6 -8
  180. package/typography/external-link/ExternalLink.js +1 -1
  181. package/typography/external-link/ExternalLink.sty.js +1 -1
  182. package/typography/heading/Heading.css +7 -7
  183. package/typography/heading/Heading.sty.js +1 -1
  184. package/typography/highlight/Highlight.css +2 -2
  185. package/typography/highlight/Highlight.sty.js +1 -1
  186. package/typography/link/Link.css +3 -3
  187. package/typography/link/Link.sty.js +1 -1
  188. package/typography/list/List.css +4 -4
  189. package/typography/list/List.sty.js +2 -2
  190. package/typography/paragraph/Paragraph.css +3 -3
  191. package/typography/paragraph/Paragraph.sty.js +1 -1
  192. package/typography/strikethrough/Strikethrough.css +1 -1
  193. package/typography/strikethrough/Strikethrough.sty.js +1 -1
  194. package/typography/strong/Strong.css +1 -1
  195. package/typography/strong/Strong.sty.js +1 -1
  196. package/typography/text/Text.css +3 -3
  197. package/typography/text/Text.sty.js +1 -1
  198. package/typography/text-ellipsis/TextEllipsis.css +6 -6
  199. package/typography/text-ellipsis/TextEllipsis.sty.js +2 -2
  200. package/typography/utils.js +17 -9
@@ -27,9 +27,17 @@ __export(utils_exports, {
27
27
  });
28
28
  module.exports = __toCommonJS(utils_exports);
29
29
  var import_user_preferences = require("@dynatrace-sdk/user-preferences");
30
- const localizedSegmenter = new Intl.Segmenter((0, import_user_preferences.getLanguage)(), {
31
- granularity: "grapheme"
32
- });
30
+ let localizedSegmenter;
31
+ function getLocalizedSegmenter() {
32
+ if (localizedSegmenter) {
33
+ return localizedSegmenter;
34
+ }
35
+ const segmenter = new Intl.Segmenter((0, import_user_preferences.getLanguage)(), {
36
+ granularity: "grapheme"
37
+ });
38
+ localizedSegmenter = segmenter;
39
+ return localizedSegmenter;
40
+ }
33
41
  const ELLIPSIS_CHARACTER = "\u2026";
34
42
  const ELLIPSIS_APPROXIMATION_THRESHOLD = 15;
35
43
  let inMemContext2d;
@@ -72,9 +80,10 @@ function centerEllipsizeText(originalText, textFont, maxWidthInPx) {
72
80
  let attempt = 1;
73
81
  let prefixLength = initialPrefixSuffixLength;
74
82
  let suffixLength = initialPrefixSuffixLength;
75
- const originalSegmentedText = Array.from(
76
- localizedSegmenter.segment(originalText)
77
- ).map((segment) => segment.segment);
83
+ const segmenter = getLocalizedSegmenter();
84
+ const originalSegmentedText = Array.from(segmenter.segment(originalText)).map(
85
+ (segment) => segment.segment
86
+ );
78
87
  do {
79
88
  const originalSegmentedTextCopy = [...originalSegmentedText];
80
89
  prefixLength -= attempt % 2 === 1 ? 1 : 0;
@@ -102,9 +111,8 @@ function getFontString(textFont) {
102
111
  ).join(" ");
103
112
  }
104
113
  function calculateEllipsisInfo(originalText, textFont, maxWidthInPx) {
105
- const originalTextLength = Array.from(
106
- localizedSegmenter.segment(originalText)
107
- ).length;
114
+ const segmenter = getLocalizedSegmenter();
115
+ const originalTextLength = Array.from(segmenter.segment(originalText)).length;
108
116
  if (originalTextLength <= 1) {
109
117
  return null;
110
118
  }