@hitachivantara/uikit-react-core 5.3.0 → 5.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/dist/cjs/components/Dialog/Dialog.cjs +1 -1
  2. package/dist/cjs/components/Dialog/Dialog.cjs.map +1 -1
  3. package/dist/cjs/components/Dialog/Dialog.styles.cjs +3 -3
  4. package/dist/cjs/components/Dialog/Dialog.styles.cjs.map +1 -1
  5. package/dist/cjs/components/Forms/Suggestions/Suggestions.styles.cjs +4 -4
  6. package/dist/cjs/components/Forms/Suggestions/Suggestions.styles.cjs.map +1 -1
  7. package/dist/cjs/components/InlineEditor/InlineEditor.cjs +122 -0
  8. package/dist/cjs/components/InlineEditor/InlineEditor.cjs.map +1 -0
  9. package/dist/cjs/components/InlineEditor/InlineEditor.styles.cjs +74 -0
  10. package/dist/cjs/components/InlineEditor/InlineEditor.styles.cjs.map +1 -0
  11. package/dist/cjs/components/InlineEditor/inlineEditorClasses.cjs +8 -0
  12. package/dist/cjs/components/InlineEditor/inlineEditorClasses.cjs.map +1 -0
  13. package/dist/cjs/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.cjs +51 -0
  14. package/dist/cjs/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.cjs.map +1 -0
  15. package/dist/cjs/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.cjs +54 -0
  16. package/dist/cjs/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.cjs.map +1 -0
  17. package/dist/cjs/components/ScrollTo/Horizontal/HorizontalScrollListItem/horizontalScrollListItemClasses.cjs +8 -0
  18. package/dist/cjs/components/ScrollTo/Horizontal/HorizontalScrollListItem/horizontalScrollListItemClasses.cjs.map +1 -0
  19. package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs +126 -0
  20. package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs.map +1 -0
  21. package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.cjs +46 -0
  22. package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.cjs.map +1 -0
  23. package/dist/cjs/components/ScrollTo/Horizontal/scrollToHorizontalClasses.cjs +8 -0
  24. package/dist/cjs/components/ScrollTo/Horizontal/scrollToHorizontalClasses.cjs.map +1 -0
  25. package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs +90 -0
  26. package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs.map +1 -0
  27. package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.styles.cjs +43 -0
  28. package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.styles.cjs.map +1 -0
  29. package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.cjs +71 -0
  30. package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.cjs.map +1 -0
  31. package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.cjs +54 -0
  32. package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.cjs.map +1 -0
  33. package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.cjs +8 -0
  34. package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.cjs.map +1 -0
  35. package/dist/cjs/components/ScrollTo/Vertical/scrollToVerticalClasses.cjs +8 -0
  36. package/dist/cjs/components/ScrollTo/Vertical/scrollToVerticalClasses.cjs.map +1 -0
  37. package/dist/cjs/components/ScrollTo/useScrollTo.cjs +103 -0
  38. package/dist/cjs/components/ScrollTo/useScrollTo.cjs.map +1 -0
  39. package/dist/cjs/components/ScrollTo/utils.cjs +76 -0
  40. package/dist/cjs/components/ScrollTo/utils.cjs.map +1 -0
  41. package/dist/cjs/components/ScrollTo/withTooltip.cjs +20 -0
  42. package/dist/cjs/components/ScrollTo/withTooltip.cjs.map +1 -0
  43. package/dist/cjs/components/TimeAgo/TimeAgo.cjs +39 -0
  44. package/dist/cjs/components/TimeAgo/TimeAgo.cjs.map +1 -0
  45. package/dist/cjs/components/TimeAgo/formatUtils.cjs +134 -0
  46. package/dist/cjs/components/TimeAgo/formatUtils.cjs.map +1 -0
  47. package/dist/cjs/components/TimeAgo/timeAgoClasses.cjs +8 -0
  48. package/dist/cjs/components/TimeAgo/timeAgoClasses.cjs.map +1 -0
  49. package/dist/cjs/components/TimeAgo/useTimeAgo.cjs +29 -0
  50. package/dist/cjs/components/TimeAgo/useTimeAgo.cjs.map +1 -0
  51. package/dist/cjs/components/TimeAgo/useTimeout.cjs +17 -0
  52. package/dist/cjs/components/TimeAgo/useTimeout.cjs.map +1 -0
  53. package/dist/cjs/hocs/withTooltip.cjs +4 -4
  54. package/dist/cjs/hocs/withTooltip.cjs.map +1 -1
  55. package/dist/cjs/index.cjs +23 -0
  56. package/dist/cjs/index.cjs.map +1 -1
  57. package/dist/cjs/utils/theme.cjs +9 -0
  58. package/dist/cjs/utils/theme.cjs.map +1 -1
  59. package/dist/cjs/utils/wrapperTooltip.cjs +1 -1
  60. package/dist/cjs/utils/wrapperTooltip.cjs.map +1 -1
  61. package/dist/esm/components/Dialog/Dialog.js +2 -2
  62. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  63. package/dist/esm/components/Dialog/Dialog.styles.js +3 -3
  64. package/dist/esm/components/Dialog/Dialog.styles.js.map +1 -1
  65. package/dist/esm/components/Forms/Suggestions/Suggestions.styles.js +5 -5
  66. package/dist/esm/components/Forms/Suggestions/Suggestions.styles.js.map +1 -1
  67. package/dist/esm/components/InlineEditor/InlineEditor.js +122 -0
  68. package/dist/esm/components/InlineEditor/InlineEditor.js.map +1 -0
  69. package/dist/esm/components/InlineEditor/InlineEditor.styles.js +74 -0
  70. package/dist/esm/components/InlineEditor/InlineEditor.styles.js.map +1 -0
  71. package/dist/esm/components/InlineEditor/inlineEditorClasses.js +8 -0
  72. package/dist/esm/components/InlineEditor/inlineEditorClasses.js.map +1 -0
  73. package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js +51 -0
  74. package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js.map +1 -0
  75. package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.js +54 -0
  76. package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.js.map +1 -0
  77. package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/horizontalScrollListItemClasses.js +8 -0
  78. package/dist/esm/components/ScrollTo/Horizontal/HorizontalScrollListItem/horizontalScrollListItemClasses.js.map +1 -0
  79. package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.js +126 -0
  80. package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.js.map +1 -0
  81. package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.js +46 -0
  82. package/dist/esm/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.js.map +1 -0
  83. package/dist/esm/components/ScrollTo/Horizontal/scrollToHorizontalClasses.js +8 -0
  84. package/dist/esm/components/ScrollTo/Horizontal/scrollToHorizontalClasses.js.map +1 -0
  85. package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.js +90 -0
  86. package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.js.map +1 -0
  87. package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.styles.js +43 -0
  88. package/dist/esm/components/ScrollTo/Vertical/ScrollToVertical.styles.js.map +1 -0
  89. package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js +71 -0
  90. package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.js.map +1 -0
  91. package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js +54 -0
  92. package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js.map +1 -0
  93. package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.js +8 -0
  94. package/dist/esm/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.js.map +1 -0
  95. package/dist/esm/components/ScrollTo/Vertical/scrollToVerticalClasses.js +8 -0
  96. package/dist/esm/components/ScrollTo/Vertical/scrollToVerticalClasses.js.map +1 -0
  97. package/dist/esm/components/ScrollTo/useScrollTo.js +103 -0
  98. package/dist/esm/components/ScrollTo/useScrollTo.js.map +1 -0
  99. package/dist/esm/components/ScrollTo/utils.js +76 -0
  100. package/dist/esm/components/ScrollTo/utils.js.map +1 -0
  101. package/dist/esm/components/ScrollTo/withTooltip.js +20 -0
  102. package/dist/esm/components/ScrollTo/withTooltip.js.map +1 -0
  103. package/dist/esm/components/TimeAgo/TimeAgo.js +37 -0
  104. package/dist/esm/components/TimeAgo/TimeAgo.js.map +1 -0
  105. package/dist/esm/components/TimeAgo/formatUtils.js +126 -0
  106. package/dist/esm/components/TimeAgo/formatUtils.js.map +1 -0
  107. package/dist/esm/components/TimeAgo/timeAgoClasses.js +8 -0
  108. package/dist/esm/components/TimeAgo/timeAgoClasses.js.map +1 -0
  109. package/dist/esm/components/TimeAgo/useTimeAgo.js +29 -0
  110. package/dist/esm/components/TimeAgo/useTimeAgo.js.map +1 -0
  111. package/dist/esm/components/TimeAgo/useTimeout.js +17 -0
  112. package/dist/esm/components/TimeAgo/useTimeout.js.map +1 -0
  113. package/dist/esm/hocs/withTooltip.js +4 -4
  114. package/dist/esm/hocs/withTooltip.js.map +1 -1
  115. package/dist/esm/index.js +42 -19
  116. package/dist/esm/index.js.map +1 -1
  117. package/dist/esm/utils/theme.js +9 -0
  118. package/dist/esm/utils/theme.js.map +1 -1
  119. package/dist/esm/utils/wrapperTooltip.js +2 -2
  120. package/dist/esm/utils/wrapperTooltip.js.map +1 -1
  121. package/dist/types/index.d.ts +244 -1
  122. package/package.json +6 -6
@@ -91,7 +91,16 @@ const processThemes = (themesList) => {
91
91
  return [uikitStyles.themes.ds5];
92
92
  }
93
93
  };
94
+ const getVarValue = (cssVar) => {
95
+ const tempEl = document.createElement("div");
96
+ tempEl.style.setProperty("--temp", cssVar);
97
+ document.body.appendChild(tempEl);
98
+ const computedValue = getComputedStyle(tempEl).getPropertyValue("--temp").trim();
99
+ document.body.removeChild(tempEl);
100
+ return computedValue;
101
+ };
94
102
  exports.createTheme = createTheme;
103
+ exports.getVarValue = getVarValue;
95
104
  exports.processThemes = processThemes;
96
105
  exports.setElementAttrs = setElementAttrs;
97
106
  //# sourceMappingURL=theme.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"theme.cjs","sources":["../../../src/utils/theme.ts"],"sourcesContent":["/*eslint import/namespace: [2, { allowComputed: true }]*/\nimport { CSSProperties } from \"react\";\nimport {\n themes,\n HvThemeColorModeStructure,\n HvThemeStructure,\n theme,\n} from \"@hitachivantara/uikit-styles\";\nimport { HvTheme, HvCreateThemeProps } from \"@core/types\";\n\n/**\n * Sets the element style properties.\n */\nconst setElementStyle = (element: HTMLElement, style: CSSProperties) => {\n for (const property in style) {\n element.style[property] = style[property];\n }\n};\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n themeName: string,\n modeName: string,\n colorScheme: string,\n themeRootId?: string\n) => {\n const element = themeRootId\n ? document.getElementById(themeRootId)\n : document.body;\n\n if (element) {\n element.setAttribute(`data-theme`, themeName);\n element.setAttribute(`data-color-mode`, modeName);\n\n // Set default properties for all components to inherit\n setElementStyle(element, {\n colorScheme: colorScheme,\n backgroundColor: theme.colors.backgroundColor,\n accentColor: theme.colors.secondary,\n color: theme.colors.secondary,\n fontSize: theme.typography.body.fontSize,\n fontWeight: theme.typography.body.fontWeight,\n lineHeight: theme.typography.body.lineHeight,\n letterSpacing: theme.typography.body.letterSpacing,\n fontFamily: theme.fontFamily.body,\n });\n }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: object, customizations: object) => {\n const isObject = (val: any) =>\n val && typeof val === \"object\" && !Array.isArray(val);\n\n // Customized theme\n const customizedTheme = { ...obj };\n\n // Add new values to the theme or replace values\n Object.keys(customizations).forEach((key) => {\n if (customizedTheme[key]) {\n if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n customizedTheme[key] = applyThemeCustomizations(\n customizedTheme[key],\n customizations[key]\n );\n } else if (typeof customizedTheme[key] == typeof customizations[key]) {\n customizedTheme[key] = customizations[key];\n }\n } else {\n customizedTheme[key] = customizations[key];\n }\n });\n\n return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n const {\n name,\n base = \"ds5\",\n inheritColorModes = true,\n ...customizations\n } = props;\n\n // Apply customizations to the base theme\n const customizedTheme: HvTheme | HvThemeStructure = customizations\n ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n : { ...themes[base] };\n\n // Set theme name\n customizedTheme.name = name.trim();\n\n // Fill new color modes with missing colors\n if (customizations) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!themes[base].colors.modes[mode]) {\n customizedTheme.colors.modes[mode] = {\n ...themes[base].colors.modes.dawn,\n ...(customizedTheme.colors.modes[mode] as Partial<\n HvThemeColorModeStructure & { [key: string]: string }\n >),\n };\n }\n });\n }\n\n // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n // we're removing any color modes that might have been inherited\n if (!inheritColorModes && customizations.colors?.modes) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n delete customizedTheme.colors.modes[mode];\n }\n });\n }\n\n // Created theme\n return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n * - Cleans themes with the same name\n * - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n const list: (HvTheme | HvThemeStructure)[] = [];\n\n themesList.map((thm) => {\n const i: number = list.findIndex(\n (t) => t.name.trim() === thm.name.trim()\n );\n\n if (i !== -1) {\n list.splice(i, 1);\n list.push(thm);\n } else {\n list.push(thm);\n }\n });\n\n // Cleaned themes\n return list;\n } else {\n // DS5\n return [themes.ds5];\n }\n};\n"],"names":["setElementStyle","element","style","property","setElementAttrs","themeName","modeName","colorScheme","themeRootId","document","getElementById","body","setAttribute","backgroundColor","theme","colors","accentColor","secondary","color","fontSize","typography","fontWeight","lineHeight","letterSpacing","fontFamily","applyThemeCustomizations","obj","customizations","isObject","val","Array","isArray","customizedTheme","Object","keys","forEach","key","createTheme","props","name","base","inheritColorModes","themes","trim","modes","mode","dawn","includes","processThemes","themesList","length","list","map","thm","i","findIndex","t","splice","push","ds5"],"mappings":"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"}
1
+ {"version":3,"file":"theme.cjs","sources":["../../../src/utils/theme.ts"],"sourcesContent":["/*eslint import/namespace: [2, { allowComputed: true }]*/\nimport { CSSProperties } from \"react\";\nimport {\n themes,\n HvThemeColorModeStructure,\n HvThemeStructure,\n theme,\n} from \"@hitachivantara/uikit-styles\";\nimport { HvTheme, HvCreateThemeProps } from \"@core/types\";\n\n/**\n * Sets the element style properties.\n */\nconst setElementStyle = (element: HTMLElement, style: CSSProperties) => {\n for (const property in style) {\n element.style[property] = style[property];\n }\n};\n\n/**\n * Sets the element attributes and style for a theme and color mode.\n */\nexport const setElementAttrs = (\n themeName: string,\n modeName: string,\n colorScheme: string,\n themeRootId?: string\n) => {\n const element = themeRootId\n ? document.getElementById(themeRootId)\n : document.body;\n\n if (element) {\n element.setAttribute(`data-theme`, themeName);\n element.setAttribute(`data-color-mode`, modeName);\n\n // Set default properties for all components to inherit\n setElementStyle(element, {\n colorScheme: colorScheme,\n backgroundColor: theme.colors.backgroundColor,\n accentColor: theme.colors.secondary,\n color: theme.colors.secondary,\n fontSize: theme.typography.body.fontSize,\n fontWeight: theme.typography.body.fontWeight,\n lineHeight: theme.typography.body.lineHeight,\n letterSpacing: theme.typography.body.letterSpacing,\n fontFamily: theme.fontFamily.body,\n });\n }\n};\n\n/**\n * Applies customizations to a theme.\n */\nconst applyThemeCustomizations = (obj: object, customizations: object) => {\n const isObject = (val: any) =>\n val && typeof val === \"object\" && !Array.isArray(val);\n\n // Customized theme\n const customizedTheme = { ...obj };\n\n // Add new values to the theme or replace values\n Object.keys(customizations).forEach((key) => {\n if (customizedTheme[key]) {\n if (isObject(customizedTheme[key]) && isObject(customizations[key])) {\n customizedTheme[key] = applyThemeCustomizations(\n customizedTheme[key],\n customizations[key]\n );\n } else if (typeof customizedTheme[key] == typeof customizations[key]) {\n customizedTheme[key] = customizations[key];\n }\n } else {\n customizedTheme[key] = customizations[key];\n }\n });\n\n return customizedTheme;\n};\n\n/**\n * Creates a customized theme based on the base theme and customizations given.\n * For the color modes, the colors that are not defined will be replaced by the values from the dawn mode of the base theme.\n */\nexport const createTheme = (\n props: HvCreateThemeProps\n): HvTheme | HvThemeStructure => {\n const {\n name,\n base = \"ds5\",\n inheritColorModes = true,\n ...customizations\n } = props;\n\n // Apply customizations to the base theme\n const customizedTheme: HvTheme | HvThemeStructure = customizations\n ? (applyThemeCustomizations(themes[base], customizations) as HvTheme)\n : { ...themes[base] };\n\n // Set theme name\n customizedTheme.name = name.trim();\n\n // Fill new color modes with missing colors\n if (customizations) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!themes[base].colors.modes[mode]) {\n customizedTheme.colors.modes[mode] = {\n ...themes[base].colors.modes.dawn,\n ...(customizedTheme.colors.modes[mode] as Partial<\n HvThemeColorModeStructure & { [key: string]: string }\n >),\n };\n }\n });\n }\n\n // If the flag `inheritColorModes` is false and customizations were given for the color modes,\n // we're removing any color modes that might have been inherited\n if (!inheritColorModes && customizations.colors?.modes) {\n Object.keys(customizedTheme.colors.modes).forEach((mode) => {\n if (!Object.keys(customizations.colors?.modes || {}).includes(mode)) {\n delete customizedTheme.colors.modes[mode];\n }\n });\n }\n\n // Created theme\n return customizedTheme;\n};\n\n/**\n * Process the themes provided to the HvProvider:\n * - Cleans themes with the same name\n * - Returns the default if the list is empty (ds5)\n */\nexport const processThemes = (\n themesList?: (HvTheme | HvThemeStructure)[]\n): (HvTheme | HvThemeStructure)[] => {\n if (themesList && Array.isArray(themesList) && themesList.length > 0) {\n const list: (HvTheme | HvThemeStructure)[] = [];\n\n themesList.map((thm) => {\n const i: number = list.findIndex(\n (t) => t.name.trim() === thm.name.trim()\n );\n\n if (i !== -1) {\n list.splice(i, 1);\n list.push(thm);\n } else {\n list.push(thm);\n }\n });\n\n // Cleaned themes\n return list;\n } else {\n // DS5\n return [themes.ds5];\n }\n};\n\n/**\n * Returns the computed value of a theme CSS var\n */\nexport const getVarValue = (cssVar: string): string => {\n const tempEl = document.createElement(\"div\");\n tempEl.style.setProperty(\"--temp\", cssVar);\n document.body.appendChild(tempEl);\n const computedValue = getComputedStyle(tempEl)\n .getPropertyValue(\"--temp\")\n .trim();\n document.body.removeChild(tempEl);\n return computedValue;\n};\n"],"names":["setElementStyle","element","style","property","setElementAttrs","themeName","modeName","colorScheme","themeRootId","document","getElementById","body","setAttribute","backgroundColor","theme","colors","accentColor","secondary","color","fontSize","typography","fontWeight","lineHeight","letterSpacing","fontFamily","applyThemeCustomizations","obj","customizations","isObject","val","Array","isArray","customizedTheme","Object","keys","forEach","key","createTheme","props","name","base","inheritColorModes","themes","trim","modes","mode","dawn","includes","processThemes","themesList","length","list","map","thm","i","findIndex","t","splice","push","ds5","getVarValue","cssVar","tempEl","createElement","setProperty","appendChild","computedValue","getComputedStyle","getPropertyValue","removeChild"],"mappings":"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"}
@@ -7,7 +7,7 @@ const hideTooltip = (evt) => {
7
7
  };
8
8
  const wrapperTooltip = (hasTooltips, Component, label) => {
9
9
  const ComponentFunction = () => Component;
10
- return hasTooltips ? withTooltip.default(ComponentFunction, label, "top", hideTooltip, {}, {}) : ComponentFunction;
10
+ return hasTooltips ? withTooltip.default(ComponentFunction, label, "top", hideTooltip) : ComponentFunction;
11
11
  };
12
12
  exports.wrapperTooltip = wrapperTooltip;
13
13
  //# sourceMappingURL=wrapperTooltip.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"wrapperTooltip.cjs","sources":["../../../src/utils/wrapperTooltip.tsx"],"sourcesContent":["import { withTooltip } from \"@core/hocs\";\n\nconst hideTooltip = (evt) => {\n const isOverFlow =\n evt.target.children.length > 1\n ? Array.of(...evt.target.children).some(\n (child) => child.scrollWidth > child.clientWidth\n )\n : evt.target.scrollWidth > evt.target.clientWidth;\n\n return !isOverFlow;\n};\n\nexport const wrapperTooltip = (hasTooltips, Component, label) => {\n const ComponentFunction = () => Component;\n return hasTooltips\n ? withTooltip(ComponentFunction, label, \"top\", hideTooltip, {}, {})\n : ComponentFunction;\n};\n"],"names":["hideTooltip","evt","isOverFlow","target","children","length","Array","of","some","child","scrollWidth","clientWidth","wrapperTooltip","hasTooltips","Component","label","ComponentFunction","withTooltip"],"mappings":";;;AAEA,MAAMA,cAAeC,CAAQ,QAAA;AACrBC,QAAAA,aACJD,IAAIE,OAAOC,SAASC,SAAS,IACzBC,MAAMC,GAAG,GAAGN,IAAIE,OAAOC,QAAQ,EAAEI,KAC9BC,CAAAA,UAAUA,MAAMC,cAAcD,MAAME,WAAW,IAElDV,IAAIE,OAAOO,cAAcT,IAAIE,OAAOQ;AAE1C,SAAO,CAACT;AACV;AAEO,MAAMU,iBAAiBA,CAACC,aAAaC,WAAWC,UAAU;AAC/D,QAAMC,oBAAoBA,MAAMF;AACzBD,SAAAA,cACHI,oBAAYD,mBAAmBD,OAAO,OAAOf,aAAa,CAAC,GAAG,EAAE,IAChEgB;AACN;;"}
1
+ {"version":3,"file":"wrapperTooltip.cjs","sources":["../../../src/utils/wrapperTooltip.tsx"],"sourcesContent":["import { withTooltip } from \"@core/hocs\";\n\nconst hideTooltip = (evt) => {\n const isOverFlow =\n evt.target.children.length > 1\n ? Array.of(...evt.target.children).some(\n (child) => child.scrollWidth > child.clientWidth\n )\n : evt.target.scrollWidth > evt.target.clientWidth;\n\n return !isOverFlow;\n};\n\nexport const wrapperTooltip = (hasTooltips, Component, label) => {\n const ComponentFunction = () => Component;\n return hasTooltips\n ? withTooltip(ComponentFunction, label, \"top\", hideTooltip)\n : ComponentFunction;\n};\n"],"names":["hideTooltip","evt","isOverFlow","target","children","length","Array","of","some","child","scrollWidth","clientWidth","wrapperTooltip","hasTooltips","Component","label","ComponentFunction","withTooltip"],"mappings":";;;AAEA,MAAMA,cAAeC,CAAQ,QAAA;AACrBC,QAAAA,aACJD,IAAIE,OAAOC,SAASC,SAAS,IACzBC,MAAMC,GAAG,GAAGN,IAAIE,OAAOC,QAAQ,EAAEI,KAC9BC,CAAAA,UAAUA,MAAMC,cAAcD,MAAME,WAAW,IAElDV,IAAIE,OAAOO,cAAcT,IAAIE,OAAOQ;AAE1C,SAAO,CAACT;AACV;AAEO,MAAMU,iBAAiBA,CAACC,aAAaC,WAAWC,UAAU;AAC/D,QAAMC,oBAAoBA,MAAMF;AAChC,SAAOD,cACHI,YAAAA,QAAYD,mBAAmBD,OAAO,OAAOf,WAAW,IACxDgB;AACN;;"}
@@ -9,7 +9,7 @@ import dialogClasses from "./dialogClasses.js";
9
9
  import { ClassNames } from "@emotion/react";
10
10
  import { jsx, jsxs } from "@emotion/react/jsx-runtime";
11
11
  import { getFocusableList } from "../../utils/focusableElementFinder.js";
12
- import withTooltip from "../../hocs/withTooltip.js";
12
+ import withTooltipUtil from "../../hocs/withTooltip.js";
13
13
  import { useTheme } from "../../hooks/useTheme.js";
14
14
  import { setId } from "../../utils/setId.js";
15
15
  import { isKeypress } from "../../utils/keyboardUtils/keyCheck.js";
@@ -88,7 +88,7 @@ const HvDialog = ({
88
88
  const closeButtonDisplay = () => /* @__PURE__ */ jsx(Close, {
89
89
  role: "presentation"
90
90
  });
91
- const CloseButtonTooltipWrapper = buttonTitle ? withTooltip(closeButtonDisplay, buttonTitle, "top", null, null, null) : closeButtonDisplay;
91
+ const CloseButtonTooltipWrapper = buttonTitle ? withTooltipUtil(closeButtonDisplay, buttonTitle, "top") : closeButtonDisplay;
92
92
  return /* @__PURE__ */ jsx(ClassNames, {
93
93
  children: ({
94
94
  css
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import React, { useCallback, useRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport MuiDialog, { DialogProps as MuiDialogProps } from \"@mui/material/Dialog\";\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport isNil from \"lodash/isNil\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { StyledBackdrop, StyledClose, styles } from \"./Dialog.styles\";\nimport {\n isKeypress,\n keyboardCodes,\n setId,\n getFocusableList,\n} from \"@core/utils\";\nimport { withTooltip } from \"@core/hocs\";\nimport dialogClasses, { HvDialogClasses } from \"./dialogClasses\";\nimport { useTheme } from \"@core/hooks\";\nimport { ClassNames } from \"@emotion/react\";\n\nexport interface HvDialogProps\n extends Omit<MuiDialogProps, \"fullScreen\" | \"classes\" | \"open\">,\n HvBaseProps {\n /** Id to be applied to the root node. */\n id?: string;\n /** Current state of the Dialog. */\n open?: boolean;\n /** Function executed on close. */\n onClose?: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /** Element id that should be focus when the Dialog opens. */\n firstFocusable?: string;\n /** Title for the button close. */\n buttonTitle?: string;\n /** Set the dialog to fullscreen mode. */\n fullscreen?: boolean;\n /** Prevent closing the dialog when clicking on the backdrop. */\n disableBackdropClick?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvDialogClasses;\n}\n\nexport const HvDialog = ({\n classes,\n className,\n id,\n children,\n open = false,\n onClose,\n firstFocusable,\n buttonTitle = \"Close\",\n fullscreen = false,\n disableBackdropClick = false,\n ...others\n}: HvDialogProps) => {\n delete (others as any).fullScreen;\n\n const { activeTheme, selectedMode, rootId } = useTheme();\n\n const focusableQueue = useRef<{\n first?: HTMLElement;\n last?: HTMLElement;\n }>({ first: undefined, last: undefined });\n\n // Because the `disableBackdropClick` property was deprecated in MUI5\n // and we want to maintain that functionality to the user we're wrapping\n // the onClose call here to make that check.\n const wrappedClose = (\n event,\n bypassValidation: boolean = false,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => {\n if (bypassValidation) {\n onClose?.(event, reason);\n } else if (!disableBackdropClick) {\n onClose?.(event, reason);\n }\n };\n\n const measuredRef = useCallback(\n (node) => {\n if (node) {\n const focusableList = getFocusableList(node);\n focusableQueue.current = {\n first: focusableList[1],\n last: focusableList[focusableList.length - 2],\n };\n if (isNil(firstFocusable)) focusableList[1].focus();\n else {\n const element =\n firstFocusable && document.getElementById(firstFocusable);\n if (element) element.focus();\n else {\n console.warn(`firstFocusable element ${firstFocusable} not found.`);\n\n focusableList[1].focus();\n }\n }\n }\n },\n [firstFocusable]\n );\n\n const keyDownHandler = (event) => {\n if (\n isKeypress(event, keyboardCodes.Tab) &&\n !isNil(event.target) &&\n !isNil(focusableQueue)\n ) {\n if (event.shiftKey && event.target === focusableQueue.current.first) {\n focusableQueue.current.last?.focus();\n event.preventDefault();\n }\n if (!event.shiftKey && event.target === focusableQueue.current.last) {\n focusableQueue.current.first?.focus();\n event.preventDefault();\n }\n }\n // Needed as this handler overrides the one in the material ui Modal.\n else if (isKeypress(event, keyboardCodes.Esc)) {\n if (\n \"onEscapeKeyDown\" in others &&\n typeof others.onEscapeKeyDown === \"function\"\n ) {\n others.onEscapeKeyDown(event);\n }\n\n if (!others.disableEscapeKeyDown) {\n // Swallow the event, in case someone is listening for the escape key on the body.\n event.stopPropagation();\n\n wrappedClose(event, true, \"escapeKeyDown\");\n }\n }\n };\n\n const closeButtonDisplay = () => <Close role=\"presentation\" />;\n\n const CloseButtonTooltipWrapper = buttonTitle\n ? withTooltip(closeButtonDisplay, buttonTitle, \"top\", null, null, null)\n : closeButtonDisplay;\n\n return (\n <ClassNames>\n {({ css }) => (\n <MuiDialog\n container={document.getElementById(rootId || \"\") || document.body}\n className={clsx(dialogClasses.root, classes?.root, className)}\n id={id}\n ref={measuredRef}\n open={open}\n fullScreen={fullscreen}\n onClose={(event, reason) => wrappedClose(event, undefined, reason)}\n onKeyDown={keyDownHandler}\n fullWidth\n maxWidth={false}\n slots={{\n backdrop: (backdropProps) => (\n <StyledBackdrop\n open={open}\n onClick={(event) => wrappedClose(event)}\n $backColor={\n activeTheme?.colors?.modes[selectedMode].atmo4 ||\n theme.colors.atmo4\n }\n {...backdropProps}\n />\n ),\n }}\n classes={{ container: css({ position: \"relative\" }) }}\n BackdropProps={{\n classes: {\n root: clsx(classes?.background, dialogClasses.background),\n },\n }}\n PaperProps={{\n classes: {\n root: clsx(\n css(styles.paper),\n classes?.paper,\n dialogClasses.paper,\n css({ position: \"absolute\" }),\n fullscreen &&\n clsx(\n dialogClasses.fullscreen,\n classes?.fullscreen,\n \"fullscreen\"\n )\n ),\n },\n }}\n aria-modal\n {...others}\n >\n <StyledClose\n id={setId(id, \"close\")}\n className={clsx(dialogClasses.closeButton, classes?.closeButton)}\n variant=\"secondaryGhost\"\n onClick={(event) => wrappedClose(event, true, undefined)}\n aria-label={buttonTitle}\n >\n <CloseButtonTooltipWrapper />\n </StyledClose>\n {children && typeof children === \"object\"\n ? React.Children.map(\n children,\n (c: React.ReactNode) =>\n c &&\n React.cloneElement(c as React.ReactElement, { fullscreen })\n )\n : children}\n </MuiDialog>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvDialog","classes","className","id","children","open","onClose","firstFocusable","buttonTitle","fullscreen","disableBackdropClick","others","fullScreen","activeTheme","selectedMode","rootId","useTheme","focusableQueue","useRef","first","undefined","last","wrappedClose","event","bypassValidation","reason","measuredRef","useCallback","node","focusableList","getFocusableList","current","length","isNil","focus","element","document","getElementById","warn","keyDownHandler","isKeypress","keyboardCodes","Tab","target","shiftKey","preventDefault","Esc","onEscapeKeyDown","disableEscapeKeyDown","stopPropagation","closeButtonDisplay","_jsx","Close","role","CloseButtonTooltipWrapper","withTooltip","ClassNames","css","MuiDialog","container","body","clsx","dialogClasses","root","ref","onKeyDown","fullWidth","maxWidth","slots","backdrop","backdropProps","StyledBackdrop","onClick","$backColor","colors","modes","atmo4","theme","position","BackdropProps","background","PaperProps","styles","paper","StyledClose","setId","closeButton","variant","React","Children","map","c","cloneElement"],"mappings":"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"}
1
+ {"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import React, { useCallback, useRef } from \"react\";\nimport { clsx } from \"clsx\";\nimport MuiDialog, { DialogProps as MuiDialogProps } from \"@mui/material/Dialog\";\nimport { Close } from \"@hitachivantara/uikit-react-icons\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport isNil from \"lodash/isNil\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { StyledBackdrop, StyledClose, styles } from \"./Dialog.styles\";\nimport {\n isKeypress,\n keyboardCodes,\n setId,\n getFocusableList,\n} from \"@core/utils\";\nimport { withTooltip } from \"@core/hocs\";\nimport dialogClasses, { HvDialogClasses } from \"./dialogClasses\";\nimport { useTheme } from \"@core/hooks\";\nimport { ClassNames } from \"@emotion/react\";\n\nexport interface HvDialogProps\n extends Omit<MuiDialogProps, \"fullScreen\" | \"classes\" | \"open\">,\n HvBaseProps {\n /** Id to be applied to the root node. */\n id?: string;\n /** Current state of the Dialog. */\n open?: boolean;\n /** Function executed on close. */\n onClose?: (\n event: React.SyntheticEvent,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => void;\n /** Element id that should be focus when the Dialog opens. */\n firstFocusable?: string;\n /** Title for the button close. */\n buttonTitle?: string;\n /** Set the dialog to fullscreen mode. */\n fullscreen?: boolean;\n /** Prevent closing the dialog when clicking on the backdrop. */\n disableBackdropClick?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvDialogClasses;\n}\n\nexport const HvDialog = ({\n classes,\n className,\n id,\n children,\n open = false,\n onClose,\n firstFocusable,\n buttonTitle = \"Close\",\n fullscreen = false,\n disableBackdropClick = false,\n ...others\n}: HvDialogProps) => {\n delete (others as any).fullScreen;\n\n const { activeTheme, selectedMode, rootId } = useTheme();\n\n const focusableQueue = useRef<{\n first?: HTMLElement;\n last?: HTMLElement;\n }>({ first: undefined, last: undefined });\n\n // Because the `disableBackdropClick` property was deprecated in MUI5\n // and we want to maintain that functionality to the user we're wrapping\n // the onClose call here to make that check.\n const wrappedClose = (\n event,\n bypassValidation: boolean = false,\n reason?: \"escapeKeyDown\" | \"backdropClick\"\n ) => {\n if (bypassValidation) {\n onClose?.(event, reason);\n } else if (!disableBackdropClick) {\n onClose?.(event, reason);\n }\n };\n\n const measuredRef = useCallback(\n (node) => {\n if (node) {\n const focusableList = getFocusableList(node);\n focusableQueue.current = {\n first: focusableList[1],\n last: focusableList[focusableList.length - 2],\n };\n if (isNil(firstFocusable)) focusableList[1].focus();\n else {\n const element =\n firstFocusable && document.getElementById(firstFocusable);\n if (element) element.focus();\n else {\n console.warn(`firstFocusable element ${firstFocusable} not found.`);\n\n focusableList[1].focus();\n }\n }\n }\n },\n [firstFocusable]\n );\n\n const keyDownHandler = (event) => {\n if (\n isKeypress(event, keyboardCodes.Tab) &&\n !isNil(event.target) &&\n !isNil(focusableQueue)\n ) {\n if (event.shiftKey && event.target === focusableQueue.current.first) {\n focusableQueue.current.last?.focus();\n event.preventDefault();\n }\n if (!event.shiftKey && event.target === focusableQueue.current.last) {\n focusableQueue.current.first?.focus();\n event.preventDefault();\n }\n }\n // Needed as this handler overrides the one in the material ui Modal.\n else if (isKeypress(event, keyboardCodes.Esc)) {\n if (\n \"onEscapeKeyDown\" in others &&\n typeof others.onEscapeKeyDown === \"function\"\n ) {\n others.onEscapeKeyDown(event);\n }\n\n if (!others.disableEscapeKeyDown) {\n // Swallow the event, in case someone is listening for the escape key on the body.\n event.stopPropagation();\n\n wrappedClose(event, true, \"escapeKeyDown\");\n }\n }\n };\n\n const closeButtonDisplay = () => <Close role=\"presentation\" />;\n\n const CloseButtonTooltipWrapper = buttonTitle\n ? withTooltip(closeButtonDisplay, buttonTitle, \"top\")\n : closeButtonDisplay;\n\n return (\n <ClassNames>\n {({ css }) => (\n <MuiDialog\n container={document.getElementById(rootId || \"\") || document.body}\n className={clsx(dialogClasses.root, classes?.root, className)}\n id={id}\n ref={measuredRef}\n open={open}\n fullScreen={fullscreen}\n onClose={(event, reason) => wrappedClose(event, undefined, reason)}\n onKeyDown={keyDownHandler}\n fullWidth\n maxWidth={false}\n slots={{\n backdrop: (backdropProps) => (\n <StyledBackdrop\n open={open}\n onClick={(event) => wrappedClose(event)}\n $backColor={\n activeTheme?.colors?.modes[selectedMode].atmo4 ||\n theme.colors.atmo4\n }\n {...backdropProps}\n />\n ),\n }}\n classes={{ container: css({ position: \"relative\" }) }}\n BackdropProps={{\n classes: {\n root: clsx(classes?.background, dialogClasses.background),\n },\n }}\n PaperProps={{\n classes: {\n root: clsx(\n css(styles.paper),\n classes?.paper,\n dialogClasses.paper,\n css({ position: \"absolute\" }),\n fullscreen &&\n clsx(\n dialogClasses.fullscreen,\n classes?.fullscreen,\n \"fullscreen\"\n )\n ),\n },\n }}\n aria-modal\n {...others}\n >\n <StyledClose\n id={setId(id, \"close\")}\n className={clsx(dialogClasses.closeButton, classes?.closeButton)}\n variant=\"secondaryGhost\"\n onClick={(event) => wrappedClose(event, true, undefined)}\n aria-label={buttonTitle}\n >\n <CloseButtonTooltipWrapper />\n </StyledClose>\n {children && typeof children === \"object\"\n ? React.Children.map(\n children,\n (c: React.ReactNode) =>\n c &&\n React.cloneElement(c as React.ReactElement, { fullscreen })\n )\n : children}\n </MuiDialog>\n )}\n </ClassNames>\n );\n};\n"],"names":["HvDialog","classes","className","id","children","open","onClose","firstFocusable","buttonTitle","fullscreen","disableBackdropClick","others","fullScreen","activeTheme","selectedMode","rootId","useTheme","focusableQueue","useRef","first","undefined","last","wrappedClose","event","bypassValidation","reason","measuredRef","useCallback","node","focusableList","getFocusableList","current","length","isNil","focus","element","document","getElementById","warn","keyDownHandler","isKeypress","keyboardCodes","Tab","target","shiftKey","preventDefault","Esc","onEscapeKeyDown","disableEscapeKeyDown","stopPropagation","closeButtonDisplay","_jsx","Close","role","CloseButtonTooltipWrapper","withTooltip","ClassNames","css","MuiDialog","container","body","clsx","dialogClasses","root","ref","onKeyDown","fullWidth","maxWidth","slots","backdrop","backdropProps","StyledBackdrop","onClick","$backColor","colors","modes","atmo4","theme","position","BackdropProps","background","PaperProps","styles","paper","StyledClose","setId","closeButton","variant","React","Children","map","c","cloneElement"],"mappings":"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"}
@@ -34,7 +34,7 @@ const styles = {
34
34
  boxShadow: ["none", "0 2px 12px rgba(65,65,65,0.12)"],
35
35
  borderRadius: theme.dialog.borderRadius,
36
36
  [`&.${paperClasses.root}`]: {
37
- width: "inherit",
37
+ // width: "inherit",
38
38
  minWidth: "33.3333333%",
39
39
  maxWidth: "83.3333333%",
40
40
  "&.fullscreen": {
@@ -59,7 +59,7 @@ const StyledBackdrop = /* @__PURE__ */ _styled(Backdrop, process.env.NODE_ENV ==
59
59
  $backColor
60
60
  }) => ({
61
61
  background: fade($backColor, 0.8)
62
- }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRGlhbG9nL0RpYWxvZy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJDOEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9EaWFsb2cvRGlhbG9nLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7XG4gIHBhcGVyQ2xhc3NlcyBhcyBNdWlQYXBlckNsYXNzZXMsXG4gIEJhY2tkcm9wIGFzIE11aUJhY2tkcm9wLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgZmFkZSBmcm9tIFwiQGNvcmUvdXRpbHMvaGV4VG9SZ2JBXCI7XG5pbXBvcnQgeyBIdkJ1dHRvbiwgSHZCdXR0b25Qcm9wcyB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5pbXBvcnQgeyBmb3J3YXJkUmVmLCBSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IENTU0ludGVycG9sYXRpb24gfSBmcm9tIFwiQGVtb3Rpb24vc2VyaWFsaXplXCI7XG5cbmV4cG9ydCBjb25zdCBzdHlsZXM6IHsgW2tleTogc3RyaW5nXTogQ1NTSW50ZXJwb2xhdGlvbiB9ID0ge1xuICBwYXBlcjoge1xuICAgIFtgJi5NdWlEaWFsb2ctcGFwZXJgXToge1xuICAgICAgbWF4SGVpZ2h0OiBgY2FsYygxMDAlIC0gKDIgKiAke3RoZW1lLmRpYWxvZy5tYXJnaW59KSlgLFxuICAgICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICAgICAgY29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gICAgICBmbGV4OiBcIjAgMCA4My4zMzMzMzMzJVwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgICBwYWRkaW5nOiBcIjBweFwiLFxuICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgYm94U2hhZG93OiBbXCJub25lXCIsIFwiMCAycHggMTJweCByZ2JhKDY1LDY1LDY1LDAuMTIpXCJdLFxuICAgICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5kaWFsb2cuYm9yZGVyUmFkaXVzLFxuICAgICAgW2AmLiR7TXVpUGFwZXJDbGFzc2VzLnJvb3R9YF06IHtcbiAgICAgICAgd2lkdGg6IFwiaW5oZXJpdFwiLFxuICAgICAgICBtaW5XaWR0aDogXCIzMy4zMzMzMzMzJVwiLFxuICAgICAgICBtYXhXaWR0aDogXCI4My4zMzMzMzMzJVwiLFxuICAgICAgICBcIiYuZnVsbHNjcmVlblwiOiB7XG4gICAgICAgICAgZmxleDogXCIxXCIsXG4gICAgICAgICAgYm9yZGVyUmFkaXVzOiBcIjBcIixcbiAgICAgICAgICB3aWR0aDogXCJpbmhlcml0XCIsXG4gICAgICAgICAgbWluV2lkdGg6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heFdpZHRoOiBcIjEwMCVcIixcbiAgICAgICAgICBtaW5IZWlnaHQ6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heEhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH0sXG4gIH0sXG59O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQoXG4gIE11aUJhY2tkcm9wLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRiYWNrQ29sb3IgfTogeyAkYmFja0NvbG9yOiBzdHJpbmcgfSkgPT4gKHtcbiAgYmFja2dyb3VuZDogZmFkZSgkYmFja0NvbG9yLCAwLjgpLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2UgPSBzdHlsZWQoXG4gIGZvcndhcmRSZWYoKHByb3BzOiBIdkJ1dHRvblByb3BzLCByZWY/OiBSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KSA9PiB7XG4gICAgcmV0dXJuIDxIdkJ1dHRvbiB7Li4ucHJvcHN9IHJlZj17cmVmfSAvPjtcbiAgfSlcbikoe1xuICBwYWRkaW5nOiAwLFxuICBtaW5XaWR0aDogXCJhdXRvXCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogdGhlbWUuc3BhY2Uuc20sXG4gIHJpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgd2lkdGg6IDMyLFxuICBoZWlnaHQ6IDMyLFxufSk7XG4iXX0= */");
62
+ }), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRGlhbG9nL0RpYWxvZy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJDOEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9EaWFsb2cvRGlhbG9nLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7XG4gIHBhcGVyQ2xhc3NlcyBhcyBNdWlQYXBlckNsYXNzZXMsXG4gIEJhY2tkcm9wIGFzIE11aUJhY2tkcm9wLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgZmFkZSBmcm9tIFwiQGNvcmUvdXRpbHMvaGV4VG9SZ2JBXCI7XG5pbXBvcnQgeyBIdkJ1dHRvbiwgSHZCdXR0b25Qcm9wcyB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5pbXBvcnQgeyBmb3J3YXJkUmVmLCBSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IENTU0ludGVycG9sYXRpb24gfSBmcm9tIFwiQGVtb3Rpb24vc2VyaWFsaXplXCI7XG5cbmV4cG9ydCBjb25zdCBzdHlsZXM6IHsgW2tleTogc3RyaW5nXTogQ1NTSW50ZXJwb2xhdGlvbiB9ID0ge1xuICBwYXBlcjoge1xuICAgIFtgJi5NdWlEaWFsb2ctcGFwZXJgXToge1xuICAgICAgbWF4SGVpZ2h0OiBgY2FsYygxMDAlIC0gKDIgKiAke3RoZW1lLmRpYWxvZy5tYXJnaW59KSlgLFxuICAgICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICAgICAgY29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gICAgICBmbGV4OiBcIjAgMCA4My4zMzMzMzMzJVwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgICBwYWRkaW5nOiBcIjBweFwiLFxuICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgYm94U2hhZG93OiBbXCJub25lXCIsIFwiMCAycHggMTJweCByZ2JhKDY1LDY1LDY1LDAuMTIpXCJdLFxuICAgICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5kaWFsb2cuYm9yZGVyUmFkaXVzLFxuICAgICAgW2AmLiR7TXVpUGFwZXJDbGFzc2VzLnJvb3R9YF06IHtcbiAgICAgICAgLy8gd2lkdGg6IFwiaW5oZXJpdFwiLFxuICAgICAgICBtaW5XaWR0aDogXCIzMy4zMzMzMzMzJVwiLFxuICAgICAgICBtYXhXaWR0aDogXCI4My4zMzMzMzMzJVwiLFxuICAgICAgICBcIiYuZnVsbHNjcmVlblwiOiB7XG4gICAgICAgICAgZmxleDogXCIxXCIsXG4gICAgICAgICAgYm9yZGVyUmFkaXVzOiBcIjBcIixcbiAgICAgICAgICB3aWR0aDogXCJpbmhlcml0XCIsXG4gICAgICAgICAgbWluV2lkdGg6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heFdpZHRoOiBcIjEwMCVcIixcbiAgICAgICAgICBtaW5IZWlnaHQ6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heEhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH0sXG4gIH0sXG59O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQoXG4gIE11aUJhY2tkcm9wLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRiYWNrQ29sb3IgfTogeyAkYmFja0NvbG9yOiBzdHJpbmcgfSkgPT4gKHtcbiAgYmFja2dyb3VuZDogZmFkZSgkYmFja0NvbG9yLCAwLjgpLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2UgPSBzdHlsZWQoXG4gIGZvcndhcmRSZWYoKHByb3BzOiBIdkJ1dHRvblByb3BzLCByZWY/OiBSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KSA9PiB7XG4gICAgcmV0dXJuIDxIdkJ1dHRvbiB7Li4ucHJvcHN9IHJlZj17cmVmfSAvPjtcbiAgfSlcbikoe1xuICBwYWRkaW5nOiAwLFxuICBtaW5XaWR0aDogXCJhdXRvXCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogdGhlbWUuc3BhY2Uuc20sXG4gIHJpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgd2lkdGg6IDMyLFxuICBoZWlnaHQ6IDMyLFxufSk7XG4iXX0= */");
63
63
  const StyledClose = /* @__PURE__ */ _styled(forwardRef((props, ref) => {
64
64
  return /* @__PURE__ */ jsx(HvButton, {
65
65
  ...props,
@@ -78,7 +78,7 @@ const StyledClose = /* @__PURE__ */ _styled(forwardRef((props, ref) => {
78
78
  right: theme.space.sm,
79
79
  width: 32,
80
80
  height: 32
81
- }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRGlhbG9nL0RpYWxvZy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtEMkIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9EaWFsb2cvRGlhbG9nLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7XG4gIHBhcGVyQ2xhc3NlcyBhcyBNdWlQYXBlckNsYXNzZXMsXG4gIEJhY2tkcm9wIGFzIE11aUJhY2tkcm9wLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgZmFkZSBmcm9tIFwiQGNvcmUvdXRpbHMvaGV4VG9SZ2JBXCI7XG5pbXBvcnQgeyBIdkJ1dHRvbiwgSHZCdXR0b25Qcm9wcyB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5pbXBvcnQgeyBmb3J3YXJkUmVmLCBSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IENTU0ludGVycG9sYXRpb24gfSBmcm9tIFwiQGVtb3Rpb24vc2VyaWFsaXplXCI7XG5cbmV4cG9ydCBjb25zdCBzdHlsZXM6IHsgW2tleTogc3RyaW5nXTogQ1NTSW50ZXJwb2xhdGlvbiB9ID0ge1xuICBwYXBlcjoge1xuICAgIFtgJi5NdWlEaWFsb2ctcGFwZXJgXToge1xuICAgICAgbWF4SGVpZ2h0OiBgY2FsYygxMDAlIC0gKDIgKiAke3RoZW1lLmRpYWxvZy5tYXJnaW59KSlgLFxuICAgICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICAgICAgY29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gICAgICBmbGV4OiBcIjAgMCA4My4zMzMzMzMzJVwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgICBwYWRkaW5nOiBcIjBweFwiLFxuICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgYm94U2hhZG93OiBbXCJub25lXCIsIFwiMCAycHggMTJweCByZ2JhKDY1LDY1LDY1LDAuMTIpXCJdLFxuICAgICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5kaWFsb2cuYm9yZGVyUmFkaXVzLFxuICAgICAgW2AmLiR7TXVpUGFwZXJDbGFzc2VzLnJvb3R9YF06IHtcbiAgICAgICAgd2lkdGg6IFwiaW5oZXJpdFwiLFxuICAgICAgICBtaW5XaWR0aDogXCIzMy4zMzMzMzMzJVwiLFxuICAgICAgICBtYXhXaWR0aDogXCI4My4zMzMzMzMzJVwiLFxuICAgICAgICBcIiYuZnVsbHNjcmVlblwiOiB7XG4gICAgICAgICAgZmxleDogXCIxXCIsXG4gICAgICAgICAgYm9yZGVyUmFkaXVzOiBcIjBcIixcbiAgICAgICAgICB3aWR0aDogXCJpbmhlcml0XCIsXG4gICAgICAgICAgbWluV2lkdGg6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heFdpZHRoOiBcIjEwMCVcIixcbiAgICAgICAgICBtaW5IZWlnaHQ6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heEhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH0sXG4gIH0sXG59O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQoXG4gIE11aUJhY2tkcm9wLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRiYWNrQ29sb3IgfTogeyAkYmFja0NvbG9yOiBzdHJpbmcgfSkgPT4gKHtcbiAgYmFja2dyb3VuZDogZmFkZSgkYmFja0NvbG9yLCAwLjgpLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2UgPSBzdHlsZWQoXG4gIGZvcndhcmRSZWYoKHByb3BzOiBIdkJ1dHRvblByb3BzLCByZWY/OiBSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KSA9PiB7XG4gICAgcmV0dXJuIDxIdkJ1dHRvbiB7Li4ucHJvcHN9IHJlZj17cmVmfSAvPjtcbiAgfSlcbikoe1xuICBwYWRkaW5nOiAwLFxuICBtaW5XaWR0aDogXCJhdXRvXCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogdGhlbWUuc3BhY2Uuc20sXG4gIHJpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgd2lkdGg6IDMyLFxuICBoZWlnaHQ6IDMyLFxufSk7XG4iXX0= */");
81
+ }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRGlhbG9nL0RpYWxvZy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtEMkIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9EaWFsb2cvRGlhbG9nLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7XG4gIHBhcGVyQ2xhc3NlcyBhcyBNdWlQYXBlckNsYXNzZXMsXG4gIEJhY2tkcm9wIGFzIE11aUJhY2tkcm9wLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgZmFkZSBmcm9tIFwiQGNvcmUvdXRpbHMvaGV4VG9SZ2JBXCI7XG5pbXBvcnQgeyBIdkJ1dHRvbiwgSHZCdXR0b25Qcm9wcyB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5pbXBvcnQgeyBmb3J3YXJkUmVmLCBSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IENTU0ludGVycG9sYXRpb24gfSBmcm9tIFwiQGVtb3Rpb24vc2VyaWFsaXplXCI7XG5cbmV4cG9ydCBjb25zdCBzdHlsZXM6IHsgW2tleTogc3RyaW5nXTogQ1NTSW50ZXJwb2xhdGlvbiB9ID0ge1xuICBwYXBlcjoge1xuICAgIFtgJi5NdWlEaWFsb2ctcGFwZXJgXToge1xuICAgICAgbWF4SGVpZ2h0OiBgY2FsYygxMDAlIC0gKDIgKiAke3RoZW1lLmRpYWxvZy5tYXJnaW59KSlgLFxuICAgICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgICBmbGV4RGlyZWN0aW9uOiBcImNvbHVtblwiLFxuICAgICAgY29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG4gICAgICBmbGV4OiBcIjAgMCA4My4zMzMzMzMzJVwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgICBwYWRkaW5nOiBcIjBweFwiLFxuICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgYm94U2hhZG93OiBbXCJub25lXCIsIFwiMCAycHggMTJweCByZ2JhKDY1LDY1LDY1LDAuMTIpXCJdLFxuICAgICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5kaWFsb2cuYm9yZGVyUmFkaXVzLFxuICAgICAgW2AmLiR7TXVpUGFwZXJDbGFzc2VzLnJvb3R9YF06IHtcbiAgICAgICAgLy8gd2lkdGg6IFwiaW5oZXJpdFwiLFxuICAgICAgICBtaW5XaWR0aDogXCIzMy4zMzMzMzMzJVwiLFxuICAgICAgICBtYXhXaWR0aDogXCI4My4zMzMzMzMzJVwiLFxuICAgICAgICBcIiYuZnVsbHNjcmVlblwiOiB7XG4gICAgICAgICAgZmxleDogXCIxXCIsXG4gICAgICAgICAgYm9yZGVyUmFkaXVzOiBcIjBcIixcbiAgICAgICAgICB3aWR0aDogXCJpbmhlcml0XCIsXG4gICAgICAgICAgbWluV2lkdGg6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heFdpZHRoOiBcIjEwMCVcIixcbiAgICAgICAgICBtaW5IZWlnaHQ6IFwiMTAwJVwiLFxuICAgICAgICAgIG1heEhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH0sXG4gIH0sXG59O1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFja2Ryb3AgPSBzdHlsZWQoXG4gIE11aUJhY2tkcm9wLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRiYWNrQ29sb3IgfTogeyAkYmFja0NvbG9yOiBzdHJpbmcgfSkgPT4gKHtcbiAgYmFja2dyb3VuZDogZmFkZSgkYmFja0NvbG9yLCAwLjgpLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2UgPSBzdHlsZWQoXG4gIGZvcndhcmRSZWYoKHByb3BzOiBIdkJ1dHRvblByb3BzLCByZWY/OiBSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KSA9PiB7XG4gICAgcmV0dXJuIDxIdkJ1dHRvbiB7Li4ucHJvcHN9IHJlZj17cmVmfSAvPjtcbiAgfSlcbikoe1xuICBwYWRkaW5nOiAwLFxuICBtaW5XaWR0aDogXCJhdXRvXCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRvcDogdGhlbWUuc3BhY2Uuc20sXG4gIHJpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgd2lkdGg6IDMyLFxuICBoZWlnaHQ6IDMyLFxufSk7XG4iXX0= */");
82
82
  export {
83
83
  StyledBackdrop,
84
84
  StyledClose,
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.styles.js","sources":["../../../../src/components/Dialog/Dialog.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n paperClasses as MuiPaperClasses,\n Backdrop as MuiBackdrop,\n} from \"@mui/material\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\nimport fade from \"@core/utils/hexToRgbA\";\nimport { HvButton, HvButtonProps } from \"@core/components\";\nimport { forwardRef, Ref } from \"react\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\n\nexport const styles: { [key: string]: CSSInterpolation } = {\n paper: {\n [`&.MuiDialog-paper`]: {\n maxHeight: `calc(100% - (2 * ${theme.dialog.margin}))`,\n display: \"flex\",\n flexDirection: \"column\",\n color: theme.colors.secondary,\n flex: \"0 0 83.3333333%\",\n backgroundColor: theme.colors.atmo1,\n padding: \"0px\",\n overflow: \"auto\",\n boxShadow: [\"none\", \"0 2px 12px rgba(65,65,65,0.12)\"],\n borderRadius: theme.dialog.borderRadius,\n [`&.${MuiPaperClasses.root}`]: {\n width: \"inherit\",\n minWidth: \"33.3333333%\",\n maxWidth: \"83.3333333%\",\n \"&.fullscreen\": {\n flex: \"1\",\n borderRadius: \"0\",\n width: \"inherit\",\n minWidth: \"100%\",\n maxWidth: \"100%\",\n minHeight: \"100%\",\n maxHeight: \"100%\",\n },\n },\n },\n },\n};\n\nexport const StyledBackdrop = styled(\n MuiBackdrop,\n transientOptions\n)(({ $backColor }: { $backColor: string }) => ({\n background: fade($backColor, 0.8),\n}));\n\nexport const StyledClose = styled(\n forwardRef((props: HvButtonProps, ref?: Ref<HTMLButtonElement>) => {\n return <HvButton {...props} ref={ref} />;\n })\n)({\n padding: 0,\n minWidth: \"auto\",\n position: \"absolute\",\n top: theme.space.sm,\n right: theme.space.sm,\n width: 32,\n height: 32,\n});\n"],"names":["styles","paper","maxHeight","theme","dialog","margin","display","flexDirection","color","colors","secondary","flex","backgroundColor","atmo1","padding","overflow","boxShadow","borderRadius","MuiPaperClasses","root","width","minWidth","maxWidth","minHeight","StyledBackdrop","MuiBackdrop","process","env","NODE_ENV","_extends","target","transientOptions","label","$backColor","background","fade","StyledClose","_styled","forwardRef","props","ref","HvButton","position","top","space","sm","right","height"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYO,MAAMA,SAA8C;AAAA,EACzDC,OAAO;AAAA,IACL,CAAE,mBAAkB,GAAG;AAAA,MACrBC,WAAY,oBAAmBC,MAAMC,OAAOC;AAAAA,MAC5CC,SAAS;AAAA,MACTC,eAAe;AAAA,MACfC,OAAOL,MAAMM,OAAOC;AAAAA,MACpBC,MAAM;AAAA,MACNC,iBAAiBT,MAAMM,OAAOI;AAAAA,MAC9BC,SAAS;AAAA,MACTC,UAAU;AAAA,MACVC,WAAW,CAAC,QAAQ,gCAAgC;AAAA,MACpDC,cAAcd,MAAMC,OAAOa;AAAAA,MAC3B,CAAE,KAAIC,aAAgBC,MAAM,GAAG;AAAA,QAC7BC,OAAO;AAAA,QACPC,UAAU;AAAA,QACVC,UAAU;AAAA,QACV,gBAAgB;AAAA,UACdX,MAAM;AAAA,UACNM,cAAc;AAAA,UACdG,OAAO;AAAA,UACPC,UAAU;AAAA,UACVC,UAAU;AAAA,UACVC,WAAW;AAAA,UACXrB,WAAW;AAAA,QACb;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEasB,MAAAA,yCACXC,UAAWC,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACXC,gBAAgB,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,gBAAgB,CACjB,EAAC,CAAC;AAAA,EAAEE;AAAmC,OAAO;AAAA,EAC7CC,YAAYC,KAAKF,YAAY,GAAG;AAClC,IAAEP,QAAAC,IAAAC,aAAC,eAAA,KAAA,i7FAAA;AAEI,MAAMQ,cAAcC,wBACzBC,WAAW,CAACC,OAAsBC,QAAiC;AACjE,6BAAQC,UAAQ;AAAA,IAAA,GAAKF;AAAAA,IAAOC;AAAAA,EAAAA,CAAY;AAC1C,CAAC,GAACd,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAE,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAE,OAAA;AAAA,CAAA,EACF;AAAA,EACAlB,SAAS;AAAA,EACTO,UAAU;AAAA,EACVqB,UAAU;AAAA,EACVC,KAAKxC,MAAMyC,MAAMC;AAAAA,EACjBC,OAAO3C,MAAMyC,MAAMC;AAAAA,EACnBzB,OAAO;AAAA,EACP2B,QAAQ;AACV,GAACrB,QAAAC,IAAAC,aAAC,eAAA,KAAA,i7FAAA;"}
1
+ {"version":3,"file":"Dialog.styles.js","sources":["../../../../src/components/Dialog/Dialog.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n paperClasses as MuiPaperClasses,\n Backdrop as MuiBackdrop,\n} from \"@mui/material\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\nimport fade from \"@core/utils/hexToRgbA\";\nimport { HvButton, HvButtonProps } from \"@core/components\";\nimport { forwardRef, Ref } from \"react\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\n\nexport const styles: { [key: string]: CSSInterpolation } = {\n paper: {\n [`&.MuiDialog-paper`]: {\n maxHeight: `calc(100% - (2 * ${theme.dialog.margin}))`,\n display: \"flex\",\n flexDirection: \"column\",\n color: theme.colors.secondary,\n flex: \"0 0 83.3333333%\",\n backgroundColor: theme.colors.atmo1,\n padding: \"0px\",\n overflow: \"auto\",\n boxShadow: [\"none\", \"0 2px 12px rgba(65,65,65,0.12)\"],\n borderRadius: theme.dialog.borderRadius,\n [`&.${MuiPaperClasses.root}`]: {\n // width: \"inherit\",\n minWidth: \"33.3333333%\",\n maxWidth: \"83.3333333%\",\n \"&.fullscreen\": {\n flex: \"1\",\n borderRadius: \"0\",\n width: \"inherit\",\n minWidth: \"100%\",\n maxWidth: \"100%\",\n minHeight: \"100%\",\n maxHeight: \"100%\",\n },\n },\n },\n },\n};\n\nexport const StyledBackdrop = styled(\n MuiBackdrop,\n transientOptions\n)(({ $backColor }: { $backColor: string }) => ({\n background: fade($backColor, 0.8),\n}));\n\nexport const StyledClose = styled(\n forwardRef((props: HvButtonProps, ref?: Ref<HTMLButtonElement>) => {\n return <HvButton {...props} ref={ref} />;\n })\n)({\n padding: 0,\n minWidth: \"auto\",\n position: \"absolute\",\n top: theme.space.sm,\n right: theme.space.sm,\n width: 32,\n height: 32,\n});\n"],"names":["styles","paper","maxHeight","theme","dialog","margin","display","flexDirection","color","colors","secondary","flex","backgroundColor","atmo1","padding","overflow","boxShadow","borderRadius","MuiPaperClasses","root","minWidth","maxWidth","width","minHeight","StyledBackdrop","MuiBackdrop","process","env","NODE_ENV","_extends","target","transientOptions","label","$backColor","background","fade","StyledClose","_styled","forwardRef","props","ref","HvButton","position","top","space","sm","right","height"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYO,MAAMA,SAA8C;AAAA,EACzDC,OAAO;AAAA,IACL,CAAE,mBAAkB,GAAG;AAAA,MACrBC,WAAY,oBAAmBC,MAAMC,OAAOC;AAAAA,MAC5CC,SAAS;AAAA,MACTC,eAAe;AAAA,MACfC,OAAOL,MAAMM,OAAOC;AAAAA,MACpBC,MAAM;AAAA,MACNC,iBAAiBT,MAAMM,OAAOI;AAAAA,MAC9BC,SAAS;AAAA,MACTC,UAAU;AAAA,MACVC,WAAW,CAAC,QAAQ,gCAAgC;AAAA,MACpDC,cAAcd,MAAMC,OAAOa;AAAAA,MAC3B,CAAE,KAAIC,aAAgBC,MAAM,GAAG;AAAA;AAAA,QAE7BC,UAAU;AAAA,QACVC,UAAU;AAAA,QACV,gBAAgB;AAAA,UACdV,MAAM;AAAA,UACNM,cAAc;AAAA,UACdK,OAAO;AAAA,UACPF,UAAU;AAAA,UACVC,UAAU;AAAA,UACVE,WAAW;AAAA,UACXrB,WAAW;AAAA,QACb;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEasB,MAAAA,yCACXC,UAAWC,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACXC,gBAAgB,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,gBAAgB,CACjB,EAAC,CAAC;AAAA,EAAEE;AAAmC,OAAO;AAAA,EAC7CC,YAAYC,KAAKF,YAAY,GAAG;AAClC,IAAEP,QAAAC,IAAAC,aAAC,eAAA,KAAA,q7FAAA;AAEI,MAAMQ,cAAcC,wBACzBC,WAAW,CAACC,OAAsBC,QAAiC;AACjE,6BAAQC,UAAQ;AAAA,IAAA,GAAKF;AAAAA,IAAOC;AAAAA,EAAAA,CAAY;AAC1C,CAAC,GAACd,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAE,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAE,OAAA;AAAA,CAAA,EACF;AAAA,EACAlB,SAAS;AAAA,EACTM,UAAU;AAAA,EACVsB,UAAU;AAAA,EACVC,KAAKxC,MAAMyC,MAAMC;AAAAA,EACjBC,OAAO3C,MAAMyC,MAAMC;AAAAA,EACnBvB,OAAO;AAAA,EACPyB,QAAQ;AACV,GAACrB,QAAAC,IAAAC,aAAC,eAAA,KAAA,q7FAAA;"}
@@ -1,5 +1,5 @@
1
1
  import _styled from "@emotion/styled/base";
2
- import { PopperUnstyled } from "@mui/base";
2
+ import { Popper } from "@mui/base";
3
3
  import { theme } from "@hitachivantara/uikit-styles";
4
4
  import { HvSelectionList } from "../../SelectionList/SelectionList.js";
5
5
  function _EMOTION_STRINGIFIED_CSS_ERROR__() {
@@ -16,7 +16,7 @@ const StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "prod
16
16
  } : {
17
17
  name: "bjn8wh",
18
18
  styles: "position:relative",
19
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9Gb3Jtcy9TdWdnZXN0aW9ucy9TdWdnZXN0aW9ucy5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQb3BwZXJVbnN0eWxlZCB9IGZyb20gXCJAbXVpL2Jhc2VcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IEh2U2VsZWN0aW9uTGlzdCB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU2VsZWN0aW9uTGlzdCA9IHN0eWxlZChIdlNlbGVjdGlvbkxpc3QpKHtcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gIGJveFNoYWRvdzogdGhlbWUuY29sb3JzLnNoYWRvdyxcbiAgcGFkZGluZzogdGhlbWUuc3BhY2UueHMsXG4gIHdpZHRoOiBcIjEwMCVcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUG9wcGVyID0gc3R5bGVkKFBvcHBlclVuc3R5bGVkKSh7XG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgdHJhbnNmb3JtOiBcInRyYW5zbGF0ZTNkKDAsIC0xcHgsIDApICFpbXBvcnRhbnRcIixcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy50b29sdGlwLFxufSk7XG4iXX0= */",
19
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9Gb3Jtcy9TdWdnZXN0aW9ucy9TdWdnZXN0aW9ucy5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQb3BwZXIgfSBmcm9tIFwiQG11aS9iYXNlXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyBIdlNlbGVjdGlvbkxpc3QgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50c1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFNlbGVjdGlvbkxpc3QgPSBzdHlsZWQoSHZTZWxlY3Rpb25MaXN0KSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICBib3hTaGFkb3c6IHRoZW1lLmNvbG9ycy5zaGFkb3csXG4gIHBhZGRpbmc6IHRoZW1lLnNwYWNlLnhzLFxuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFBvcHBlciA9IHN0eWxlZChQb3BwZXIpKHtcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICB0cmFuc2Zvcm06IFwidHJhbnNsYXRlM2QoMCwgLTFweCwgMCkgIWltcG9ydGFudFwiLFxuICB6SW5kZXg6IHRoZW1lLnpJbmRpY2VzLnRvb2x0aXAsXG59KTtcbiJdfQ== */",
20
20
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
21
21
  });
22
22
  const StyledSelectionList = /* @__PURE__ */ _styled(HvSelectionList, process.env.NODE_ENV === "production" ? {
@@ -29,8 +29,8 @@ const StyledSelectionList = /* @__PURE__ */ _styled(HvSelectionList, process.env
29
29
  boxShadow: theme.colors.shadow,
30
30
  padding: theme.space.xs,
31
31
  width: "100%"
32
- }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTbUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9Gb3Jtcy9TdWdnZXN0aW9ucy9TdWdnZXN0aW9ucy5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQb3BwZXJVbnN0eWxlZCB9IGZyb20gXCJAbXVpL2Jhc2VcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IEh2U2VsZWN0aW9uTGlzdCB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkU2VsZWN0aW9uTGlzdCA9IHN0eWxlZChIdlNlbGVjdGlvbkxpc3QpKHtcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gIGJveFNoYWRvdzogdGhlbWUuY29sb3JzLnNoYWRvdyxcbiAgcGFkZGluZzogdGhlbWUuc3BhY2UueHMsXG4gIHdpZHRoOiBcIjEwMCVcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUG9wcGVyID0gc3R5bGVkKFBvcHBlclVuc3R5bGVkKSh7XG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgdHJhbnNmb3JtOiBcInRyYW5zbGF0ZTNkKDAsIC0xcHgsIDApICFpbXBvcnRhbnRcIixcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy50b29sdGlwLFxufSk7XG4iXX0= */");
33
- const StyledPopper = /* @__PURE__ */ _styled(PopperUnstyled, process.env.NODE_ENV === "production" ? {
32
+ }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTbUMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9Gb3Jtcy9TdWdnZXN0aW9ucy9TdWdnZXN0aW9ucy5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQb3BwZXIgfSBmcm9tIFwiQG11aS9iYXNlXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyBIdlNlbGVjdGlvbkxpc3QgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50c1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFNlbGVjdGlvbkxpc3QgPSBzdHlsZWQoSHZTZWxlY3Rpb25MaXN0KSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICBib3hTaGFkb3c6IHRoZW1lLmNvbG9ycy5zaGFkb3csXG4gIHBhZGRpbmc6IHRoZW1lLnNwYWNlLnhzLFxuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFBvcHBlciA9IHN0eWxlZChQb3BwZXIpKHtcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICB0cmFuc2Zvcm06IFwidHJhbnNsYXRlM2QoMCwgLTFweCwgMCkgIWltcG9ydGFudFwiLFxuICB6SW5kZXg6IHRoZW1lLnpJbmRpY2VzLnRvb2x0aXAsXG59KTtcbiJdfQ== */");
33
+ const StyledPopper = /* @__PURE__ */ _styled(Popper, process.env.NODE_ENV === "production" ? {
34
34
  target: "eqrftyh0"
35
35
  } : {
36
36
  target: "eqrftyh0",
@@ -40,7 +40,7 @@ const StyledPopper = /* @__PURE__ */ _styled(PopperUnstyled, process.env.NODE_EN
40
40
  position: "absolute",
41
41
  transform: "translate3d(0, -1px, 0) !important",
42
42
  zIndex: theme.zIndices.tooltip
43
- }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQjRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgUG9wcGVyVW5zdHlsZWQgfSBmcm9tIFwiQG11aS9iYXNlXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyBIdlNlbGVjdGlvbkxpc3QgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50c1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFNlbGVjdGlvbkxpc3QgPSBzdHlsZWQoSHZTZWxlY3Rpb25MaXN0KSh7XG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICBib3hTaGFkb3c6IHRoZW1lLmNvbG9ycy5zaGFkb3csXG4gIHBhZGRpbmc6IHRoZW1lLnNwYWNlLnhzLFxuICB3aWR0aDogXCIxMDAlXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFBvcHBlciA9IHN0eWxlZChQb3BwZXJVbnN0eWxlZCkoe1xuICB3aWR0aDogXCIxMDAlXCIsXG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHRyYW5zZm9ybTogXCJ0cmFuc2xhdGUzZCgwLCAtMXB4LCAwKSAhaW1wb3J0YW50XCIsXG4gIHpJbmRleDogdGhlbWUuekluZGljZXMudG9vbHRpcCxcbn0pO1xuIl19 */");
43
+ }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQjRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvU3VnZ2VzdGlvbnMvU3VnZ2VzdGlvbnMuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgUG9wcGVyIH0gZnJvbSBcIkBtdWkvYmFzZVwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgSHZTZWxlY3Rpb25MaXN0IH0gZnJvbSBcIkBjb3JlL2NvbXBvbmVudHNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRTZWxlY3Rpb25MaXN0ID0gc3R5bGVkKEh2U2VsZWN0aW9uTGlzdCkoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm94U2hhZG93OiB0aGVtZS5jb2xvcnMuc2hhZG93LFxuICBwYWRkaW5nOiB0aGVtZS5zcGFjZS54cyxcbiAgd2lkdGg6IFwiMTAwJVwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3BwZXIgPSBzdHlsZWQoUG9wcGVyKSh7XG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgdHJhbnNmb3JtOiBcInRyYW5zbGF0ZTNkKDAsIC0xcHgsIDApICFpbXBvcnRhbnRcIixcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy50b29sdGlwLFxufSk7XG4iXX0= */");
44
44
  export {
45
45
  StyledPopper,
46
46
  StyledRoot,
@@ -1 +1 @@
1
- {"version":3,"file":"Suggestions.styles.js","sources":["../../../../../src/components/Forms/Suggestions/Suggestions.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { PopperUnstyled } from \"@mui/base\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvSelectionList } from \"@core/components\";\n\nexport const StyledRoot = styled(\"div\")({\n position: \"relative\",\n});\n\nexport const StyledSelectionList = styled(HvSelectionList)({\n backgroundColor: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n padding: theme.space.xs,\n width: \"100%\",\n});\n\nexport const StyledPopper = styled(PopperUnstyled)({\n width: \"100%\",\n position: \"absolute\",\n transform: \"translate3d(0, -1px, 0) !important\",\n zIndex: theme.zIndices.tooltip,\n});\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledSelectionList","HvSelectionList","backgroundColor","theme","colors","atmo1","boxShadow","shadow","padding","space","xs","width","StyledPopper","PopperUnstyled","position","transform","zIndex","zIndices","tooltip"],"mappings":";;;;;;;AAKO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAErC;AAEK,MAAMC,sBAA6BC,wBAAAA,iBAAeX,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACzDQ,iBAAiBC,MAAMC,OAAOC;AAAAA,EAC9BC,WAAWH,MAAMC,OAAOG;AAAAA,EACxBC,SAASL,MAAMM,MAAMC;AAAAA,EACrBC,OAAO;AACT,GAACrB,QAAAC,IAAAC,aAAC,eAAA,KAAA,i3CAAA;AAEK,MAAMoB,eAAsBC,wBAAAA,gBAAcvB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACjDiB,OAAO;AAAA,EACPG,UAAU;AAAA,EACVC,WAAW;AAAA,EACXC,QAAQb,MAAMc,SAASC;AACzB,GAAC5B,QAAAC,IAAAC,aAAC,eAAA,KAAA,i3CAAA;"}
1
+ {"version":3,"file":"Suggestions.styles.js","sources":["../../../../../src/components/Forms/Suggestions/Suggestions.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { Popper } from \"@mui/base\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvSelectionList } from \"@core/components\";\n\nexport const StyledRoot = styled(\"div\")({\n position: \"relative\",\n});\n\nexport const StyledSelectionList = styled(HvSelectionList)({\n backgroundColor: theme.colors.atmo1,\n boxShadow: theme.colors.shadow,\n padding: theme.space.xs,\n width: \"100%\",\n});\n\nexport const StyledPopper = styled(Popper)({\n width: \"100%\",\n position: \"absolute\",\n transform: \"translate3d(0, -1px, 0) !important\",\n zIndex: theme.zIndices.tooltip,\n});\n"],"names":["StyledRoot","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","StyledSelectionList","HvSelectionList","backgroundColor","theme","colors","atmo1","boxShadow","shadow","padding","space","xs","width","StyledPopper","Popper","position","transform","zIndex","zIndices","tooltip"],"mappings":";;;;;;;AAKO,MAAMA,aAAoB,wBAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAErC;AAEK,MAAMC,sBAA6BC,wBAAAA,iBAAeX,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACzDQ,iBAAiBC,MAAMC,OAAOC;AAAAA,EAC9BC,WAAWH,MAAMC,OAAOG;AAAAA,EACxBC,SAASL,MAAMM,MAAMC;AAAAA,EACrBC,OAAO;AACT,GAACrB,QAAAC,IAAAC,aAAC,eAAA,KAAA,61CAAA;AAEK,MAAMoB,eAAsBC,wBAAAA,QAAMvB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACzCiB,OAAO;AAAA,EACPG,UAAU;AAAA,EACVC,WAAW;AAAA,EACXC,QAAQb,MAAMc,SAASC;AACzB,GAAC5B,QAAAC,IAAAC,aAAC,eAAA,KAAA,61CAAA;"}
@@ -0,0 +1,122 @@
1
+ import { clsx } from "clsx";
2
+ import { ClassNames } from "@emotion/react";
3
+ import { useState, useRef, useLayoutEffect } from "react";
4
+ import inlineEditorClasses from "./inlineEditorClasses.js";
5
+ import { styles } from "./InlineEditor.styles.js";
6
+ import { theme } from "@hitachivantara/uikit-styles";
7
+ import { Edit } from "@hitachivantara/uikit-react-icons";
8
+ import { jsx, jsxs } from "@emotion/react/jsx-runtime";
9
+ import { getVarValue } from "../../utils/theme.js";
10
+ import { useControlled } from "../../hooks/useControlled.js";
11
+ import { HvInput } from "../Input/Input.js";
12
+ import { HvButton } from "../Button/Button.js";
13
+ import { HvTypography } from "../Typography/Typography.js";
14
+ import { isKeypress } from "../../utils/keyboardUtils/keyCheck.js";
15
+ import { keyboardCodes } from "../../utils/keyboardUtils/keyboardCodes.js";
16
+ const getTypographyStyles = (typography) => {
17
+ let typographyStyles = {};
18
+ Object.keys(typography).map((k) => {
19
+ typographyStyles[k] = getVarValue(typography[k]);
20
+ });
21
+ return typographyStyles;
22
+ };
23
+ const HvInlineEditor = ({
24
+ className,
25
+ classes,
26
+ value: valueProp,
27
+ defaultValue,
28
+ showIcon,
29
+ component: InputComponent = HvInput,
30
+ variant = "body",
31
+ placeholder = "Enter text",
32
+ onBlur,
33
+ onChange,
34
+ onKeyDown,
35
+ buttonProps,
36
+ typographyProps,
37
+ ...others
38
+ }) => {
39
+ const [value, setValue] = useControlled(valueProp, defaultValue);
40
+ const [editMode, setEditMode] = useState(false);
41
+ const [cachedValue, setCachedValue] = useState(value);
42
+ const inputRef = useRef();
43
+ const typographyStyles = getTypographyStyles(theme.typography[variant] || {});
44
+ const {
45
+ lineHeight
46
+ } = typographyStyles;
47
+ useLayoutEffect(() => {
48
+ const input = inputRef.current;
49
+ if (editMode && input) {
50
+ input.focus();
51
+ input.select();
52
+ }
53
+ }, [editMode]);
54
+ const handleClick = () => {
55
+ setEditMode(true);
56
+ setCachedValue(value);
57
+ };
58
+ const handleBlur = (event) => {
59
+ setEditMode(false);
60
+ const newValue = value || cachedValue;
61
+ setValue(newValue);
62
+ onBlur == null ? void 0 : onBlur(event, newValue);
63
+ };
64
+ const handleKeyDown = (event) => {
65
+ if (isKeypress(event, keyboardCodes.Esc)) {
66
+ setEditMode(false);
67
+ setValue(cachedValue);
68
+ }
69
+ onKeyDown == null ? void 0 : onKeyDown(event);
70
+ };
71
+ const handleChange = (event, val) => {
72
+ setValue(val);
73
+ onChange == null ? void 0 : onChange(event, val);
74
+ };
75
+ return /* @__PURE__ */ jsx(ClassNames, {
76
+ children: ({
77
+ css
78
+ }) => /* @__PURE__ */ jsx("div", {
79
+ className: clsx(className, inlineEditorClasses.root, classes == null ? void 0 : classes.root, css(styles.root)),
80
+ children: editMode ? /* @__PURE__ */ jsx(InputComponent, {
81
+ inputRef,
82
+ classes: {
83
+ root: clsx(classes == null ? void 0 : classes.inputRoot, inlineEditorClasses.inputRoot),
84
+ input: clsx(classes == null ? void 0 : classes.input, inlineEditorClasses.input, css(styles.input)),
85
+ inputBorderContainer: clsx(classes == null ? void 0 : classes.inputBorderContainer, inlineEditorClasses.inputBorderContainer, css(styles.inputBorderContainer))
86
+ },
87
+ inputProps: {
88
+ style: {
89
+ ...typographyStyles,
90
+ height: InputComponent === HvInput ? lineHeight : void 0
91
+ }
92
+ },
93
+ value,
94
+ onBlur: handleBlur,
95
+ onChange: handleChange,
96
+ onKeyDown: handleKeyDown,
97
+ ...others
98
+ }) : /* @__PURE__ */ jsxs(HvButton, {
99
+ variant: "secondaryGhost",
100
+ overrideIconColors: false,
101
+ className: clsx(classes == null ? void 0 : classes.button, inlineEditorClasses.button, css(styles.button), parseInt(lineHeight, 10) >= 28 && clsx(classes == null ? void 0 : classes.largeText, inlineEditorClasses.largeText, css(styles.largeText))),
102
+ onClick: handleClick,
103
+ ...buttonProps,
104
+ children: [/* @__PURE__ */ jsx(HvTypography, {
105
+ variant,
106
+ noWrap: true,
107
+ className: clsx(classes == null ? void 0 : classes.text, inlineEditorClasses.text, css(styles.text), !value && clsx(classes == null ? void 0 : classes.textEmpty, inlineEditorClasses.textEmpty, css(styles.textEmpty))),
108
+ ...typographyProps,
109
+ children: value || placeholder
110
+ }), /* @__PURE__ */ jsx(Edit, {
111
+ color: "secondary_60",
112
+ role: "presentation",
113
+ className: clsx(classes == null ? void 0 : classes.icon, inlineEditorClasses.icon, css(styles.icon), showIcon && clsx(classes == null ? void 0 : classes.iconVisible, inlineEditorClasses.iconVisible, css(styles.iconVisible)))
114
+ })]
115
+ })
116
+ })
117
+ });
118
+ };
119
+ export {
120
+ HvInlineEditor
121
+ };
122
+ //# sourceMappingURL=InlineEditor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InlineEditor.js","sources":["../../../../src/components/InlineEditor/InlineEditor.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ClassNames } from \"@emotion/react\";\nimport React, { useLayoutEffect, useRef, useState } from \"react\";\nimport { HvBaseProps } from \"@core/types\";\nimport { useControlled } from \"@core/hooks\";\nimport { getVarValue, isKeypress, keyboardCodes } from \"@core/utils\";\nimport {\n HvButtonProps,\n HvTypographyVariants,\n HvTypographyProps,\n HvInput,\n HvButton,\n HvTypography,\n} from \"@core/components\";\nimport inlineEditorClasses, {\n HvInlineEditorClasses,\n} from \"./inlineEditorClasses\";\nimport { styles } from \"./InlineEditor.styles\";\nimport { HvThemeTypographyProps, theme } from \"@hitachivantara/uikit-styles\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nexport interface HvInlineEditorProps\n extends Omit<HvBaseProps<HTMLDivElement>, \"onBlur\" | \"onChange\"> {\n /** The value of the form element. */\n value?: string;\n /** Whether the Edit icon should always be visible */\n showIcon?: boolean;\n /** Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`) */\n component?: React.ElementType;\n /** Variant of the HvTypography to display */\n variant?: HvTypographyVariants;\n /** Called when the input is blurred. */\n onBlur?: (\n event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>,\n value: string\n ) => void;\n /** Called when the input value changes. */\n onChange?: (event: React.SyntheticEvent, value: string) => void;\n /** Props passed to the HvButton component */\n buttonProps?: HvButtonProps;\n /** Props passed to the HvTypography text component */\n typographyProps?: HvTypographyProps;\n /** A Jss Object used to override or extend the styles applied to the empty state component. */\n classes?: HvInlineEditorClasses;\n}\n\nconst getTypographyStyles = (typography): HvThemeTypographyProps => {\n let typographyStyles = {};\n Object.keys(typography).map((k) => {\n typographyStyles[k] = getVarValue(typography[k]);\n });\n return typographyStyles;\n};\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nexport const HvInlineEditor = ({\n className,\n classes,\n value: valueProp,\n defaultValue,\n showIcon,\n component: InputComponent = HvInput,\n variant = \"body\",\n placeholder = \"Enter text\",\n onBlur,\n onChange,\n onKeyDown,\n buttonProps,\n typographyProps,\n ...others\n}: HvInlineEditorProps) => {\n const [value, setValue] = useControlled(valueProp, defaultValue);\n const [editMode, setEditMode] = useState(false);\n const [cachedValue, setCachedValue] = useState(value);\n const inputRef = useRef<HTMLInputElement>();\n\n const typographyStyles = getTypographyStyles(theme.typography[variant] || {});\n const { lineHeight } = typographyStyles;\n\n useLayoutEffect(() => {\n const input = inputRef.current;\n if (editMode && input) {\n input.focus();\n input.select();\n }\n }, [editMode]);\n\n const handleClick = () => {\n setEditMode(true);\n setCachedValue(value);\n };\n\n const handleBlur = (event) => {\n setEditMode(false);\n\n const newValue = value || cachedValue; // empty values should be ignored\n setValue(newValue);\n onBlur?.(event, newValue);\n };\n\n const handleKeyDown = (event) => {\n if (isKeypress(event, keyboardCodes.Esc)) {\n setEditMode(false);\n setValue(cachedValue);\n }\n onKeyDown?.(event);\n };\n\n const handleChange = (event, val) => {\n setValue(val);\n onChange?.(event, val);\n };\n\n return (\n <ClassNames>\n {({ css }) => (\n <div\n className={clsx(\n className,\n inlineEditorClasses.root,\n classes?.root,\n css(styles.root)\n )}\n >\n {editMode ? (\n <InputComponent\n inputRef={inputRef}\n classes={{\n root: clsx(classes?.inputRoot, inlineEditorClasses.inputRoot),\n input: clsx(\n classes?.input,\n inlineEditorClasses.input,\n css(styles.input)\n ),\n inputBorderContainer: clsx(\n classes?.inputBorderContainer,\n inlineEditorClasses.inputBorderContainer,\n css(styles.inputBorderContainer)\n ),\n }}\n inputProps={{\n style: {\n ...typographyStyles,\n height: InputComponent === HvInput ? lineHeight : undefined,\n },\n }}\n value={value}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n {...others}\n />\n ) : (\n <HvButton\n variant=\"secondaryGhost\"\n overrideIconColors={false}\n className={clsx(\n classes?.button,\n inlineEditorClasses.button,\n css(styles.button),\n parseInt(lineHeight as string, 10) >= 28 &&\n clsx(\n classes?.largeText,\n inlineEditorClasses.largeText,\n css(styles.largeText)\n )\n )}\n onClick={handleClick}\n {...buttonProps}\n >\n <HvTypography\n variant={variant}\n noWrap\n className={clsx(\n classes?.text,\n inlineEditorClasses.text,\n css(styles.text),\n !value &&\n clsx(\n classes?.textEmpty,\n inlineEditorClasses.textEmpty,\n css(styles.textEmpty)\n )\n )}\n {...typographyProps}\n >\n {value || placeholder}\n </HvTypography>\n <Edit\n color=\"secondary_60\"\n role=\"presentation\"\n className={clsx(\n classes?.icon,\n inlineEditorClasses.icon,\n css(styles.icon),\n showIcon &&\n clsx(\n classes?.iconVisible,\n inlineEditorClasses.iconVisible,\n css(styles.iconVisible)\n )\n )}\n />\n </HvButton>\n )}\n </div>\n )}\n </ClassNames>\n );\n};\n"],"names":["getTypographyStyles","typography","typographyStyles","Object","keys","map","k","getVarValue","HvInlineEditor","className","classes","value","valueProp","defaultValue","showIcon","component","InputComponent","HvInput","variant","placeholder","onBlur","onChange","onKeyDown","buttonProps","typographyProps","others","setValue","useControlled","editMode","setEditMode","useState","cachedValue","setCachedValue","inputRef","useRef","theme","lineHeight","useLayoutEffect","input","current","focus","select","handleClick","handleBlur","event","newValue","handleKeyDown","isKeypress","keyboardCodes","Esc","handleChange","val","ClassNames","children","css","clsx","inlineEditorClasses","root","styles","_jsx","inputRoot","inputBorderContainer","inputProps","style","height","undefined","_jsxs","HvButton","overrideIconColors","button","parseInt","largeText","onClick","HvTypography","noWrap","text","textEmpty","Edit","color","role","icon","iconVisible"],"mappings":"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"}
@@ -0,0 +1,74 @@
1
+ import { theme } from "@hitachivantara/uikit-styles";
2
+ import inlineEditorClasses from "./inlineEditorClasses.js";
3
+ import baseInputClasses from "../BaseInput/baseInputClasses.js";
4
+ import inputClasses from "../Input/inputClasses.js";
5
+ const styles = {
6
+ root: {
7
+ [`& .${baseInputClasses.inputRoot}.${inputClasses.inputRoot}`]: {
8
+ height: "100%"
9
+ }
10
+ },
11
+ inputBorderContainer: {
12
+ top: "unset",
13
+ bottom: 0
14
+ },
15
+ input: {
16
+ padding: theme.spacing([0, "8px"])
17
+ },
18
+ text: {
19
+ overflow: "hidden",
20
+ textOverflow: "ellipsis",
21
+ whiteSpace: "nowrap",
22
+ alignSelf: "center"
23
+ },
24
+ textEmpty: {
25
+ color: theme.typography.placeholderText.color
26
+ },
27
+ button: {
28
+ padding: theme.spacing([0, "8px"]),
29
+ boxSizing: "border-box",
30
+ cursor: "text",
31
+ height: "100%",
32
+ width: "100%",
33
+ maxWidth: "100%",
34
+ justifyContent: "flex-start",
35
+ backgroundColor: "transparent",
36
+ "&:hover, &:focus": {
37
+ outline: `1px solid ${theme.inlineEditor.hoverBorderColor}`,
38
+ backgroundColor: "transparent",
39
+ [`& .${inlineEditorClasses.icon}`]: {
40
+ visibility: "visible"
41
+ }
42
+ },
43
+ "&:active": {
44
+ outline: `1px solid ${theme.inlineEditor.activeBorderColor}`,
45
+ backgroundColor: "transparent",
46
+ [`& .${inlineEditorClasses.icon}`]: {
47
+ visibility: "visible"
48
+ }
49
+ },
50
+ "& > div": {
51
+ width: "100%"
52
+ },
53
+ "& > div > span": {
54
+ width: "100%",
55
+ overflow: "hidden"
56
+ }
57
+ },
58
+ icon: {
59
+ cursor: "pointer",
60
+ visibility: "hidden",
61
+ minWidth: 32,
62
+ alignSelf: "center"
63
+ },
64
+ iconVisible: {
65
+ visibility: "visible"
66
+ },
67
+ largeText: {
68
+ margin: theme.spacing([0, "8px"])
69
+ }
70
+ };
71
+ export {
72
+ styles
73
+ };
74
+ //# sourceMappingURL=InlineEditor.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InlineEditor.styles.js","sources":["../../../../src/components/InlineEditor/InlineEditor.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { baseInputClasses, inputClasses } from \"../index\";\nimport inlineEditorClasses from \"./inlineEditorClasses\";\n\nexport const styles: {\n root: CSSInterpolation;\n inputBorderContainer: CSSInterpolation;\n input: CSSInterpolation;\n text: CSSInterpolation;\n textEmpty: CSSInterpolation;\n button: CSSInterpolation;\n icon: CSSInterpolation;\n iconVisible: CSSInterpolation;\n largeText: CSSInterpolation;\n} = {\n root: {\n [`& .${baseInputClasses.inputRoot}.${inputClasses.inputRoot}`]: {\n height: \"100%\",\n },\n },\n inputBorderContainer: {\n top: \"unset\",\n bottom: 0,\n },\n input: {\n padding: theme.spacing([0, \"8px\"]),\n },\n text: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n alignSelf: \"center\",\n },\n textEmpty: {\n color: theme.typography.placeholderText.color,\n },\n button: {\n padding: theme.spacing([0, \"8px\"]),\n boxSizing: \"border-box\",\n cursor: \"text\",\n height: \"100%\",\n width: \"100%\",\n maxWidth: \"100%\",\n justifyContent: \"flex-start\",\n\n backgroundColor: \"transparent\",\n \"&:hover, &:focus\": {\n outline: `1px solid ${theme.inlineEditor.hoverBorderColor}`,\n backgroundColor: \"transparent\",\n [`& .${inlineEditorClasses.icon}`]: {\n visibility: \"visible\",\n },\n },\n \"&:active\": {\n outline: `1px solid ${theme.inlineEditor.activeBorderColor}`,\n backgroundColor: \"transparent\",\n [`& .${inlineEditorClasses.icon}`]: {\n visibility: \"visible\",\n },\n },\n \"& > div\": {\n width: \"100%\",\n },\n \"& > div > span\": {\n width: \"100%\",\n overflow: \"hidden\",\n },\n },\n icon: {\n cursor: \"pointer\",\n visibility: \"hidden\",\n minWidth: 32,\n alignSelf: \"center\",\n },\n iconVisible: {\n visibility: \"visible\",\n },\n largeText: {\n margin: theme.spacing([0, \"8px\"]),\n },\n};\n"],"names":["styles","root","baseInputClasses","inputRoot","inputClasses","height","inputBorderContainer","top","bottom","input","padding","theme","spacing","text","overflow","textOverflow","whiteSpace","alignSelf","textEmpty","color","typography","placeholderText","button","boxSizing","cursor","width","maxWidth","justifyContent","backgroundColor","outline","inlineEditor","hoverBorderColor","inlineEditorClasses","icon","visibility","activeBorderColor","minWidth","iconVisible","largeText","margin"],"mappings":";;;;AAKO,MAAMA,SAUT;AAAA,EACFC,MAAM;AAAA,IACJ,CAAE,MAAKC,iBAAiBC,aAAaC,aAAaD,WAAW,GAAG;AAAA,MAC9DE,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,sBAAsB;AAAA,IACpBC,KAAK;AAAA,IACLC,QAAQ;AAAA,EACV;AAAA,EACAC,OAAO;AAAA,IACLC,SAASC,MAAMC,QAAQ,CAAC,GAAG,KAAK,CAAC;AAAA,EACnC;AAAA,EACAC,MAAM;AAAA,IACJC,UAAU;AAAA,IACVC,cAAc;AAAA,IACdC,YAAY;AAAA,IACZC,WAAW;AAAA,EACb;AAAA,EACAC,WAAW;AAAA,IACTC,OAAOR,MAAMS,WAAWC,gBAAgBF;AAAAA,EAC1C;AAAA,EACAG,QAAQ;AAAA,IACNZ,SAASC,MAAMC,QAAQ,CAAC,GAAG,KAAK,CAAC;AAAA,IACjCW,WAAW;AAAA,IACXC,QAAQ;AAAA,IACRnB,QAAQ;AAAA,IACRoB,OAAO;AAAA,IACPC,UAAU;AAAA,IACVC,gBAAgB;AAAA,IAEhBC,iBAAiB;AAAA,IACjB,oBAAoB;AAAA,MAClBC,SAAU,aAAYlB,MAAMmB,aAAaC;AAAAA,MACzCH,iBAAiB;AAAA,MACjB,CAAE,MAAKI,oBAAoBC,MAAM,GAAG;AAAA,QAClCC,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACA,YAAY;AAAA,MACVL,SAAU,aAAYlB,MAAMmB,aAAaK;AAAAA,MACzCP,iBAAiB;AAAA,MACjB,CAAE,MAAKI,oBAAoBC,MAAM,GAAG;AAAA,QAClCC,YAAY;AAAA,MACd;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACTT,OAAO;AAAA,IACT;AAAA,IACA,kBAAkB;AAAA,MAChBA,OAAO;AAAA,MACPX,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EACAmB,MAAM;AAAA,IACJT,QAAQ;AAAA,IACRU,YAAY;AAAA,IACZE,UAAU;AAAA,IACVnB,WAAW;AAAA,EACb;AAAA,EACAoB,aAAa;AAAA,IACXH,YAAY;AAAA,EACd;AAAA,EACAI,WAAW;AAAA,IACTC,QAAQ5B,MAAMC,QAAQ,CAAC,GAAG,KAAK,CAAC;AAAA,EAClC;AACF;"}
@@ -0,0 +1,8 @@
1
+ import { getClasses } from "../../utils/classes.js";
2
+ const classKeys = ["root", "button", "largeText", "text", "textEmpty", "icon", "iconVisible", "inputRoot", "input", "inputBorderContainer"];
3
+ const inlineEditorClasses = getClasses(classKeys, "HvInlineEditor");
4
+ const inlineEditorClasses$1 = inlineEditorClasses;
5
+ export {
6
+ inlineEditorClasses$1 as default
7
+ };
8
+ //# sourceMappingURL=inlineEditorClasses.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"inlineEditorClasses.js","sources":["../../../../src/components/InlineEditor/inlineEditorClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvInlineEditorClasses {\n root?: string;\n button?: string;\n largeText?: string;\n text?: string;\n textEmpty?: string;\n icon?: string;\n iconVisible?: string;\n inputRoot?: string;\n input?: string;\n inputBorderContainer?: string;\n}\n\nconst classKeys: string[] = [\n \"root\",\n \"button\",\n \"largeText\",\n \"text\",\n \"textEmpty\",\n \"icon\",\n \"iconVisible\",\n \"inputRoot\",\n \"input\",\n \"inputBorderContainer\",\n];\n\nconst inlineEditorClasses = getClasses<HvInlineEditorClasses>(\n classKeys,\n \"HvInlineEditor\"\n);\n\nexport default inlineEditorClasses;\n"],"names":["classKeys","inlineEditorClasses","getClasses"],"mappings":";AAeA,MAAMA,YAAsB,CAC1B,QACA,UACA,aACA,QACA,aACA,QACA,eACA,aACA,SACA,sBAAsB;AAGxB,MAAMC,sBAAsBC,WAC1BF,WACA,gBAAgB;AAGlB,MAAA,wBAAeC;"}
@@ -0,0 +1,51 @@
1
+ import horizontalScrollListItemClasses from "./horizontalScrollListItemClasses.js";
2
+ import { ClassNames } from "@emotion/react";
3
+ import { clsx } from "clsx";
4
+ import { styles } from "./HorizontalScrollListItem.styles.js";
5
+ import { jsx } from "@emotion/react/jsx-runtime";
6
+ import { setId } from "../../../../utils/setId.js";
7
+ const HvHorizontalScrollListItem = ({
8
+ id,
9
+ className,
10
+ classes,
11
+ selected,
12
+ children,
13
+ onClick,
14
+ onKeyDown,
15
+ tooltipWrapper,
16
+ ...others
17
+ }) => {
18
+ const variant = selected ? "label" : "body";
19
+ const labelId = setId(id, "label");
20
+ const buttonId = setId(id, "button");
21
+ const Tooltip = tooltipWrapper;
22
+ return /* @__PURE__ */ jsx(ClassNames, {
23
+ children: ({
24
+ css
25
+ }) => /* @__PURE__ */ jsx("li", {
26
+ id,
27
+ className: clsx(className, classes == null ? void 0 : classes.root, horizontalScrollListItemClasses.root, css(styles.root)),
28
+ "aria-current": selected,
29
+ children: /* @__PURE__ */ jsx("div", {
30
+ id: buttonId,
31
+ role: "button",
32
+ tabIndex: 0,
33
+ onClick,
34
+ onKeyDown,
35
+ className: clsx(classes == null ? void 0 : classes.button, horizontalScrollListItemClasses.button, css(styles.button)),
36
+ "aria-labelledby": labelId,
37
+ ...others,
38
+ children: /* @__PURE__ */ jsx(Tooltip, {
39
+ id: labelId,
40
+ className: clsx(classes == null ? void 0 : classes.text, horizontalScrollListItemClasses.text, css(styles.text), selected && clsx(classes == null ? void 0 : classes.selected, horizontalScrollListItemClasses.selected, css(styles.selected))),
41
+ variant,
42
+ children
43
+ })
44
+ })
45
+ })
46
+ });
47
+ };
48
+ export {
49
+ HvHorizontalScrollListItem
50
+ };
51
+ //# sourceMappingURL=HorizontalScrollListItem.js.map