dinocollab-core 2.1.27 → 2.1.29

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 (195) hide show
  1. package/dist/_virtual/_rollupPluginBabelHelpers.js +2 -2
  2. package/dist/src/api-context/alert-global.js +1 -1
  3. package/dist/src/api-context/alert-global.js.map +1 -1
  4. package/dist/src/api-context/drawer-global.js +1 -1
  5. package/dist/src/api-context/drawer-global.js.map +1 -1
  6. package/dist/src/api-context/global-modal.js +1 -1
  7. package/dist/src/api-context/global-modal.js.map +1 -1
  8. package/dist/src/api-context/popover-global.js +1 -1
  9. package/dist/src/api-context/popover-global.js.map +1 -1
  10. package/dist/src/api-context/popover.js +1 -1
  11. package/dist/src/api-context/popover.js.map +1 -1
  12. package/dist/src/components/breadcrumbs.js +1 -1
  13. package/dist/src/components/breadcrumbs.js.map +1 -1
  14. package/dist/src/components/copy-to-clipboard.js +1 -1
  15. package/dist/src/components/copy-to-clipboard.js.map +1 -1
  16. package/dist/src/components/create.multi-select-dropdown.js +1 -1
  17. package/dist/src/components/create.multi-select-dropdown.js.map +1 -1
  18. package/dist/src/components/help-tooltip.js +1 -1
  19. package/dist/src/components/help-tooltip.js.map +1 -1
  20. package/dist/src/components/image-with-fallback.js +1 -1
  21. package/dist/src/components/image-with-fallback.js.map +1 -1
  22. package/dist/src/components/rich-tooltip.js +1 -1
  23. package/dist/src/components/rich-tooltip.js.map +1 -1
  24. package/dist/src/components/text-editor.js +1 -1
  25. package/dist/src/components/text-editor.js.map +1 -1
  26. package/dist/src/components/text-editor.preview.js +1 -1
  27. package/dist/src/components/text-editor.preview.js.map +1 -1
  28. package/dist/src/data-view/animation-switch.js +1 -1
  29. package/dist/src/data-view/animation-switch.js.map +1 -1
  30. package/dist/src/data-view/convert-filter-to-graphql.js +1 -1
  31. package/dist/src/data-view/convert-filter-to-graphql.js.map +1 -1
  32. package/dist/src/data-view/create.active-filters-panel.js +1 -1
  33. package/dist/src/data-view/create.active-filters-panel.js.map +1 -1
  34. package/dist/src/data-view/create.data-view.js +1 -1
  35. package/dist/src/data-view/create.data-view.js.map +1 -1
  36. package/dist/src/data-view/create.filter-bar.js +1 -1
  37. package/dist/src/data-view/create.filter-bar.js.map +1 -1
  38. package/dist/src/data-view/create.filter-menu.js +1 -1
  39. package/dist/src/data-view/create.filter-menu.js.map +1 -1
  40. package/dist/src/data-view/create.pagination-bar.js +1 -1
  41. package/dist/src/data-view/create.pagination-bar.js.map +1 -1
  42. package/dist/src/data-view/create.popper-panel.js +1 -1
  43. package/dist/src/data-view/create.popper-panel.js.map +1 -1
  44. package/dist/src/data-view/create.search-match.js +1 -1
  45. package/dist/src/data-view/create.search-match.js.map +1 -1
  46. package/dist/src/data-view/create.sort-menu.js +1 -1
  47. package/dist/src/data-view/create.sort-menu.js.map +1 -1
  48. package/dist/src/data-view/create.view-mode.js +1 -1
  49. package/dist/src/data-view/create.view-mode.js.map +1 -1
  50. package/dist/src/data-view/dino.js +1 -1
  51. package/dist/src/data-view/dino.js.map +1 -1
  52. package/dist/src/data-view/filter-store.js +1 -1
  53. package/dist/src/data-view/filter-store.js.map +1 -1
  54. package/dist/src/data-view/helpers.js +1 -1
  55. package/dist/src/data-view/helpers.js.map +1 -1
  56. package/dist/src/data-view/scroll-tracking.js +1 -1
  57. package/dist/src/data-view/scroll-tracking.js.map +1 -1
  58. package/dist/src/data-view/ui.units.js +1 -1
  59. package/dist/src/data-view/ui.units.js.map +1 -1
  60. package/dist/src/data-view/view-mode.content.js +1 -1
  61. package/dist/src/data-view/view-mode.content.js.map +1 -1
  62. package/dist/src/data-view/view-mode.units.js +1 -1
  63. package/dist/src/data-view/view-mode.units.js.map +1 -1
  64. package/dist/src/form/create.autocomplete.chips.js +1 -1
  65. package/dist/src/form/create.autocomplete.chips.js.map +1 -1
  66. package/dist/src/form/create.color-picker.js +1 -1
  67. package/dist/src/form/create.color-picker.js.map +1 -1
  68. package/dist/src/form/create.date-expired.js +1 -1
  69. package/dist/src/form/create.date-expired.js.map +1 -1
  70. package/dist/src/form/create.date-picker.js +1 -1
  71. package/dist/src/form/create.date-picker.js.map +1 -1
  72. package/dist/src/form/create.form-base.js +1 -1
  73. package/dist/src/form/create.form-base.js.map +1 -1
  74. package/dist/src/form/create.form-comfirm.js +1 -1
  75. package/dist/src/form/create.form-comfirm.js.map +1 -1
  76. package/dist/src/form/create.form-grid-layout.js +1 -1
  77. package/dist/src/form/create.form-grid-layout.js.map +1 -1
  78. package/dist/src/form/create.input-file.csv-local-parser.js +1 -1
  79. package/dist/src/form/create.input-file.csv-local-parser.js.map +1 -1
  80. package/dist/src/form/create.input.file.js +1 -1
  81. package/dist/src/form/create.input.file.js.map +1 -1
  82. package/dist/src/form/create.input.image-file.js +1 -1
  83. package/dist/src/form/create.input.image-file.js.map +1 -1
  84. package/dist/src/form/create.input.js +1 -1
  85. package/dist/src/form/create.input.js.map +1 -1
  86. package/dist/src/form/create.select-simple.js +1 -1
  87. package/dist/src/form/create.select-simple.js.map +1 -1
  88. package/dist/src/form/create.select-with-api.js +1 -1
  89. package/dist/src/form/create.select-with-api.js.map +1 -1
  90. package/dist/src/form/create.text-editor.js +1 -1
  91. package/dist/src/form/create.text-editor.js.map +1 -1
  92. package/dist/src/form/decorator.form.js +1 -1
  93. package/dist/src/form/decorator.form.js.map +1 -1
  94. package/dist/src/form/decorator.js +1 -1
  95. package/dist/src/form/decorator.js.map +1 -1
  96. package/dist/src/form/dino-form.js +1 -1
  97. package/dist/src/form/dino-form.js.map +1 -1
  98. package/dist/src/form/helpers.js +1 -1
  99. package/dist/src/form/helpers.js.map +1 -1
  100. package/dist/src/form/modal-wrapper.js +1 -1
  101. package/dist/src/form/modal-wrapper.js.map +1 -1
  102. package/dist/src/form/validator.js +1 -1
  103. package/dist/src/form/validator.js.map +1 -1
  104. package/dist/src/hooks/check-scrolled.js +1 -1
  105. package/dist/src/hooks/check-scrolled.js.map +1 -1
  106. package/dist/src/hooks/debounce.js +1 -1
  107. package/dist/src/hooks/debounce.js.map +1 -1
  108. package/dist/src/hooks/use-fetch-data.js +1 -1
  109. package/dist/src/hooks/use-fetch-data.js.map +1 -1
  110. package/dist/src/http-service/base/crud-service-base.js +1 -1
  111. package/dist/src/http-service/base/crud-service-base.js.map +1 -1
  112. package/dist/src/http-service/base/helpers.js +1 -1
  113. package/dist/src/http-service/base/helpers.js.map +1 -1
  114. package/dist/src/http-service/base/service-base.js +1 -1
  115. package/dist/src/http-service/base/service-base.js.map +1 -1
  116. package/dist/src/http-service/graphql/app-profile.js +1 -1
  117. package/dist/src/http-service/graphql/app-profile.js.map +1 -1
  118. package/dist/src/http-service/graphql/graphql-request.js +1 -1
  119. package/dist/src/http-service/graphql/graphql-request.js.map +1 -1
  120. package/dist/src/http-service/graphql/request-param.js +1 -1
  121. package/dist/src/http-service/graphql/request-param.js.map +1 -1
  122. package/dist/src/lab/attach-widget/helpers.js +1 -1
  123. package/dist/src/lab/attach-widget/helpers.js.map +1 -1
  124. package/dist/src/lab/attach-widget/modal.js +1 -1
  125. package/dist/src/lab/attach-widget/modal.js.map +1 -1
  126. package/dist/src/lab/attach-widget/styled.js +1 -1
  127. package/dist/src/lab/attach-widget/styled.js.map +1 -1
  128. package/dist/src/lab/attach-widget/widget.js +1 -1
  129. package/dist/src/lab/attach-widget/widget.js.map +1 -1
  130. package/dist/src/lab/input.social-links/create.js +1 -1
  131. package/dist/src/lab/input.social-links/create.js.map +1 -1
  132. package/dist/src/lab/input.social-links/units.js +1 -1
  133. package/dist/src/lab/input.social-links/units.js.map +1 -1
  134. package/dist/src/mfe-shared/navigation.js +1 -1
  135. package/dist/src/mfe-shared/navigation.js.map +1 -1
  136. package/dist/src/redux/create.hoc-lazy.js +1 -1
  137. package/dist/src/redux/create.hoc-lazy.js.map +1 -1
  138. package/dist/src/redux/dino.js +1 -1
  139. package/dist/src/redux/dino.js.map +1 -1
  140. package/dist/src/redux/ui.error-page.js +1 -1
  141. package/dist/src/redux/ui.error-page.js.map +1 -1
  142. package/dist/src/table/create.action-row.js +1 -1
  143. package/dist/src/table/create.action-row.js.map +1 -1
  144. package/dist/src/table/create.table.js +1 -1
  145. package/dist/src/table/create.table.js.map +1 -1
  146. package/dist/src/table/custom.filter-operators.js +1 -1
  147. package/dist/src/table/custom.filter-operators.js.map +1 -1
  148. package/dist/src/table/dino.js +1 -1
  149. package/dist/src/table/dino.js.map +1 -1
  150. package/dist/src/table/helpers.js +1 -1
  151. package/dist/src/table/helpers.js.map +1 -1
  152. package/dist/src/table/toolbar-pannel.js +1 -1
  153. package/dist/src/table/toolbar-pannel.js.map +1 -1
  154. package/dist/src/table/ui.buttons.js +1 -1
  155. package/dist/src/table/ui.buttons.js.map +1 -1
  156. package/dist/src/table/ui.units.js +1 -1
  157. package/dist/src/table/ui.units.js.map +1 -1
  158. package/dist/src/table-grid/create.table-grid.js +1 -1
  159. package/dist/src/table-grid/create.table-grid.js.map +1 -1
  160. package/dist/src/table-grid/dino.js +1 -1
  161. package/dist/src/table-grid/dino.js.map +1 -1
  162. package/dist/src/table-grid/filter-bar/base.js +1 -1
  163. package/dist/src/table-grid/filter-bar/base.js.map +1 -1
  164. package/dist/src/table-grid/filter-bar/create.filter-bar.js +1 -1
  165. package/dist/src/table-grid/filter-bar/create.filter-bar.js.map +1 -1
  166. package/dist/src/table-grid/filter-bar/create.filter-menu.js +1 -1
  167. package/dist/src/table-grid/filter-bar/create.filter-menu.js.map +1 -1
  168. package/dist/src/table-grid/filter-bar/create.filter-panel.js +1 -1
  169. package/dist/src/table-grid/filter-bar/create.filter-panel.js.map +1 -1
  170. package/dist/src/table-grid/filter-bar/create.filtered.js +1 -1
  171. package/dist/src/table-grid/filter-bar/create.filtered.js.map +1 -1
  172. package/dist/src/table-grid/filter-bar/ui.units.js +1 -1
  173. package/dist/src/table-grid/filter-bar/ui.units.js.map +1 -1
  174. package/dist/src/table-grid/helpers.js +1 -1
  175. package/dist/src/table-grid/helpers.js.map +1 -1
  176. package/dist/src/table-grid/item-actions.js +1 -1
  177. package/dist/src/table-grid/item-actions.js.map +1 -1
  178. package/dist/src/table-grid/styled.js +2 -0
  179. package/dist/src/table-grid/styled.js.map +1 -0
  180. package/dist/src/table-grid/toolbar-pannel.js +1 -1
  181. package/dist/src/table-grid/toolbar-pannel.js.map +1 -1
  182. package/dist/src/table-grid/url-query-param.js +1 -1
  183. package/dist/src/table-grid/url-query-param.js.map +1 -1
  184. package/dist/src/utils/helpers.js +1 -1
  185. package/dist/src/utils/helpers.js.map +1 -1
  186. package/dist/src/utils/json-object.js +1 -1
  187. package/dist/src/utils/json-object.js.map +1 -1
  188. package/dist/src/utils/query-param.js +1 -1
  189. package/dist/src/utils/query-param.js.map +1 -1
  190. package/dist/types/mfe-shared/navigation.d.ts +5 -2
  191. package/dist/types/table-grid/create.table-grid.d.ts +2 -2
  192. package/dist/types/table-grid/helpers.d.ts +0 -11
  193. package/dist/types/table-grid/styled.d.ts +19 -0
  194. package/dist/types/table-grid/types.d.ts +6 -1
  195. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"image-with-fallback.js","sources":["../../../src/components/image-with-fallback.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef, useState } from 'react'\r\nimport type { CSSProperties, FC, ImgHTMLAttributes, ReactNode } from 'react'\r\nimport { useDebounce } from '../hooks'\r\n\r\nexport interface IImageWithFallbackPropsOwner {\r\n src?: string\r\n alt?: string\r\n fallbackSrc: string\r\n loading?: ReactNode\r\n debounceDelay?: number\r\n}\r\n\r\nexport type IImageProps = Omit<ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>\r\n\r\nexport interface IImageWithFallbackProps extends IImageProps, IImageWithFallbackPropsOwner {}\r\n\r\nexport const ImageWithFallback: FC<IImageWithFallbackProps> = ({ src, fallbackSrc, alt, loading, debounceDelay = 0, ...props }) => {\r\n const debouncedSrc = useDebounce(src, debounceDelay)\r\n const debouncedFallbackSrc = useDebounce(fallbackSrc, debounceDelay)\r\n\r\n const effectiveSrc = debounceDelay > 0 ? debouncedSrc : src\r\n const effectiveFallbackSrc = debounceDelay > 0 ? debouncedFallbackSrc : fallbackSrc\r\n\r\n const [isLoading, setLoading] = useState(true)\r\n const [imgSrc, setImgSrc] = useState(effectiveSrc ?? effectiveFallbackSrc)\r\n\r\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\r\n const forceStopLoading = () => {\r\n if (timeoutRef.current) {\r\n clearTimeout(timeoutRef.current)\r\n timeoutRef.current = null\r\n }\r\n timeoutRef.current = setTimeout(() => {\r\n if (isLoading) setLoading(false)\r\n }, 2000)\r\n }\r\n\r\n useEffect(() => {\r\n setImgSrc(effectiveSrc ?? effectiveFallbackSrc)\r\n setLoading(true)\r\n }, [effectiveSrc, effectiveFallbackSrc])\r\n\r\n const loadingElement = isLoading && loading ? loading : <></>\r\n\r\n const mapStyle = () => {\r\n const obj: { style?: CSSProperties } = {}\r\n if (props.style) obj.style = props.style\r\n if (isLoading) obj.style = { ...obj.style, height: '0!important', transition: 'height 0.2s ease-in-out' }\r\n return obj\r\n }\r\n\r\n return (\r\n <Fragment>\r\n {loadingElement}\r\n <img\r\n {...props}\r\n {...mapStyle()}\r\n src={imgSrc}\r\n alt={alt}\r\n onLoadStart={() => setLoading(true)}\r\n onLoad={() => {\r\n setLoading(false)\r\n forceStopLoading()\r\n }}\r\n onError={() => {\r\n setImgSrc(fallbackSrc)\r\n setLoading(false)\r\n forceStopLoading()\r\n }}\r\n />\r\n </Fragment>\r\n )\r\n}\r\nexport default ImageWithFallback\r\n"],"names":["ImageWithFallback","_ref","src","fallbackSrc","alt","loading","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","_excluded","debouncedSrc","useDebounce","debouncedFallbackSrc","effectiveSrc","effectiveFallbackSrc","_useState","useState","_useState2","_slicedToArray","isLoading","setLoading","_useState3","_useState4","imgSrc","setImgSrc","timeoutRef","useRef","forceStopLoading","current","clearTimeout","setTimeout","useEffect","obj","loadingElement","_jsx","_jsxs","Fragment","children","_objectSpread","style","height","transition","onLoadStart","onLoad","onError"],"mappings":"qXAgBaA,EAAiD,SAAhCC,GAAoG,IAAjEC,EAAGD,EAAHC,IAAKC,EAAWF,EAAXE,YAAaC,EAAGH,EAAHG,IAAKC,EAAOJ,EAAPI,QAAOC,EAAAL,EAAEM,cAAAA,OAAgB,IAAHD,EAAG,EAACA,EAAKE,EAAKC,EAAAR,EAAAS,GACpHC,EAAeC,EAAYV,EAAKK,GAChCM,EAAuBD,EAAYT,EAAaI,GAEhDO,EAAeP,EAAgB,EAAII,EAAeT,EAClDa,EAAuBR,EAAgB,EAAIM,EAAuBV,EAExEa,EAAgCC,GAAS,GAAKC,EAAAC,EAAAH,EAAA,GAAvCI,EAASF,EAAA,GAAEG,EAAUH,EAAA,GAC5BI,EAA4BL,EAASH,QAAAA,EAAgBC,GAAqBQ,EAAAJ,EAAAG,EAAA,GAAnEE,EAAMD,EAAA,GAAEE,EAASF,EAAA,GAElBG,EAAaC,EAA6C,MAC1DC,EAAmB,WACnBF,EAAWG,UACbC,aAAaJ,EAAWG,SACxBH,EAAWG,QAAU,MAEvBH,EAAWG,QAAUE,YAAW,WAC1BX,GAAWC,GAAW,EAC3B,GAAE,IACJ,EAEDW,GAAU,WACRP,EAAUX,QAAAA,EAAgBC,GAC1BM,GAAW,EACb,GAAG,CAACP,EAAcC,IAElB,IAGQkB,EAHFC,EAAiBd,GAAaf,EAAUA,EAAU8B,QASxD,OACEC,EAACC,EAAQ,CAAAC,SAAA,CACNJ,EACDC,EAAA,MAAAI,EAAAA,EAAAA,EAAA,CAAA,EACM/B,IAVFyB,EAAiC,CAAE,EACrCzB,EAAMgC,QAAOP,EAAIO,MAAQhC,EAAMgC,OAC/BpB,IAAWa,EAAIO,MAAKD,EAAAA,EAAA,CAAA,EAAQN,EAAIO,OAAK,GAAA,CAAEC,OAAQ,cAAeC,WAAY,6BACvET,IAQW,CAAA,EAAA,CACd/B,IAAKsB,EACLpB,IAAKA,EACLuC,YAAa,WAAF,OAAQtB,GAAW,EAAK,EACnCuB,OAAQ,WACNvB,GAAW,GACXO,GACD,EACDiB,QAAS,WACPpB,EAAUtB,GACVkB,GAAW,GACXO,GACF,OAIR"}
1
+ {"version":3,"file":"image-with-fallback.js","sources":["../../../src/components/image-with-fallback.tsx"],"sourcesContent":["import { Fragment, useEffect, useRef, useState } from 'react'\r\nimport type { CSSProperties, FC, ImgHTMLAttributes, ReactNode } from 'react'\r\nimport { useDebounce } from '../hooks'\r\n\r\nexport interface IImageWithFallbackPropsOwner {\r\n src?: string\r\n alt?: string\r\n fallbackSrc: string\r\n loading?: ReactNode\r\n debounceDelay?: number\r\n}\r\n\r\nexport type IImageProps = Omit<ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>\r\n\r\nexport interface IImageWithFallbackProps extends IImageProps, IImageWithFallbackPropsOwner {}\r\n\r\nexport const ImageWithFallback: FC<IImageWithFallbackProps> = ({ src, fallbackSrc, alt, loading, debounceDelay = 0, ...props }) => {\r\n const debouncedSrc = useDebounce(src, debounceDelay)\r\n const debouncedFallbackSrc = useDebounce(fallbackSrc, debounceDelay)\r\n\r\n const effectiveSrc = debounceDelay > 0 ? debouncedSrc : src\r\n const effectiveFallbackSrc = debounceDelay > 0 ? debouncedFallbackSrc : fallbackSrc\r\n\r\n const [isLoading, setLoading] = useState(true)\r\n const [imgSrc, setImgSrc] = useState(effectiveSrc ?? effectiveFallbackSrc)\r\n\r\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\r\n const forceStopLoading = () => {\r\n if (timeoutRef.current) {\r\n clearTimeout(timeoutRef.current)\r\n timeoutRef.current = null\r\n }\r\n timeoutRef.current = setTimeout(() => {\r\n if (isLoading) setLoading(false)\r\n }, 2000)\r\n }\r\n\r\n useEffect(() => {\r\n setImgSrc(effectiveSrc ?? effectiveFallbackSrc)\r\n setLoading(true)\r\n }, [effectiveSrc, effectiveFallbackSrc])\r\n\r\n const loadingElement = isLoading && loading ? loading : <></>\r\n\r\n const mapStyle = () => {\r\n const obj: { style?: CSSProperties } = {}\r\n if (props.style) obj.style = props.style\r\n if (isLoading) obj.style = { ...obj.style, height: '0!important', transition: 'height 0.2s ease-in-out' }\r\n return obj\r\n }\r\n\r\n return (\r\n <Fragment>\r\n {loadingElement}\r\n <img\r\n {...props}\r\n {...mapStyle()}\r\n src={imgSrc}\r\n alt={alt}\r\n onLoadStart={() => setLoading(true)}\r\n onLoad={() => {\r\n setLoading(false)\r\n forceStopLoading()\r\n }}\r\n onError={() => {\r\n setImgSrc(fallbackSrc)\r\n setLoading(false)\r\n forceStopLoading()\r\n }}\r\n />\r\n </Fragment>\r\n )\r\n}\r\nexport default ImageWithFallback\r\n"],"names":["ImageWithFallback","_ref","src","fallbackSrc","alt","loading","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","_excluded","debouncedSrc","useDebounce","debouncedFallbackSrc","effectiveSrc","effectiveFallbackSrc","_useState","useState","_useState2","_slicedToArray","isLoading","setLoading","_useState3","_useState4","imgSrc","setImgSrc","timeoutRef","useRef","forceStopLoading","current","clearTimeout","setTimeout","useEffect","obj","loadingElement","_jsx","_jsxs","Fragment","children","_objectSpread","style","height","transition","onLoadStart","onLoad","onError"],"mappings":"qXAgBaA,EAAiD,SAAhCC,GAAoG,IAAjEC,EAAGD,EAAHC,IAAKC,EAAWF,EAAXE,YAAaC,EAAGH,EAAHG,IAAKC,EAAOJ,EAAPI,QAAOC,EAAAL,EAAEM,cAAAA,OAAgB,IAAHD,EAAG,EAACA,EAAKE,EAAKC,EAAAR,EAAAS,GACpHC,EAAeC,EAAYV,EAAKK,GAChCM,EAAuBD,EAAYT,EAAaI,GAEhDO,EAAeP,EAAgB,EAAII,EAAeT,EAClDa,EAAuBR,EAAgB,EAAIM,EAAuBV,EAExEa,EAAgCC,GAAS,GAAKC,EAAAC,EAAAH,EAAA,GAAvCI,EAASF,EAAA,GAAEG,EAAUH,EAAA,GAC5BI,EAA4BL,EAASH,QAAAA,EAAgBC,GAAqBQ,EAAAJ,EAAAG,EAAA,GAAnEE,EAAMD,EAAA,GAAEE,EAASF,EAAA,GAElBG,EAAaC,EAA6C,MAC1DC,EAAmB,WACnBF,EAAWG,UACbC,aAAaJ,EAAWG,SACxBH,EAAWG,QAAU,MAEvBH,EAAWG,QAAUE,WAAW,WAC1BX,GAAWC,GAAW,EAC3B,EAAE,IACJ,EAEDW,EAAU,WACRP,EAAUX,QAAAA,EAAgBC,GAC1BM,GAAW,EACb,EAAG,CAACP,EAAcC,IAElB,IAGQkB,EAHFC,EAAiBd,GAAaf,EAAUA,EAAU8B,QASxD,OACEC,EAACC,EAAQ,CAAAC,SAAA,CACNJ,EACDC,EAAA,MAAAI,EAAAA,EAAAA,EAAA,CAAA,EACM/B,IAVFyB,EAAiC,CAAE,EACrCzB,EAAMgC,QAAOP,EAAIO,MAAQhC,EAAMgC,OAC/BpB,IAAWa,EAAIO,MAAKD,EAAAA,EAAA,CAAA,EAAQN,EAAIO,OAAK,GAAA,CAAEC,OAAQ,cAAeC,WAAY,6BACvET,IAQW,CAAA,EAAA,CACd/B,IAAKsB,EACLpB,IAAKA,EACLuC,YAAa,WAAF,OAAQtB,GAAW,EAAK,EACnCuB,OAAQ,WACNvB,GAAW,GACXO,GACD,EACDiB,QAAS,WACPpB,EAAUtB,GACVkB,GAAW,GACXO,GACF,OAIR"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as e,objectWithoutProperties as t,objectSpread2 as r,inherits as a,createClass as o,classCallCheck as n,callSuper as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as p}from"react/jsx-runtime";import{Component as c}from"react";import{styled as s,Stack as d,Tooltip as u,tooltipClasses as m,Typography as h,Divider as f,Box as b}from"@mui/material";import x from"@mui/icons-material/HelpOutline";var g=["className"],v=function(){function t(){var r;n(this,t);for(var a=arguments.length,o=new Array(a),c=0;c<a;c++)o[c]=arguments[c];return r=i(this,t,[].concat(o)),e(r,"renderTitlePanel",(function(){var e=r.props,t=e.panel,a=e.renderPanel;return a?a():t?p(k,{className:y.titlePanel,children:[r.renderTitle(t.title),l(f,{}),l(b,{className:y.content,children:r.renderContent(t.content)})]}):l(h,{variant:"body2",children:"Please provide a panel configuration"})})),e(r,"renderTitle",(function(e){return e?"string"!=typeof e?e:l(h,{variant:"subtitle1",className:y.title,children:e}):null})),e(r,"renderContent",(function(e){return e?"string"!=typeof e?e:l(h,{variant:"body2",children:e}):null})),r}return a(t,c),o(t,[{key:"render",value:function(){var e=this.props,t=e.children,a=e.slots;return l(w,r(r({arrow:!0,placement:"bottom",title:this.renderTitlePanel(),className:y.root},null==a?void 0:a.tooltipProps),{},{children:l(d,{children:t})}))}}])}(),y={root:"RichTooltip-root",titlePanel:"RichTooltip-titlePanel",title:"RichTooltip-title",content:"RichTooltip-content"},P=function(e,t){return"".concat((null==t?void 0:t.prefix)||"",".").concat(y[e]).concat((null==t?void 0:t.suffix)||"")},k=s(d)((function(t){var r=t.theme;return e(e(e({},P("titlePanel",{prefix:"&"}),{gap:"6px"}),P("title"),{color:r.palette.primary.main,fontWeight:700,padding:r.spacing(1,1.5,0)}),P("content"),{padding:r.spacing(1,1.5,1.5),color:r.palette.text.primary})})),w=s((function(e){var a=e.className,o=t(e,g);return l(u,r(r({},o),{},{classes:{popper:a}}))}))((function(t){var r=t.theme;return e(e({},"& .".concat(m.tooltip),{backgroundColor:r.palette.background.paper,color:r.palette.text.primary,padding:0,minWidth:"360px",maxWidth:"450px",borderRadius:r.shape.borderRadius,boxShadow:"dark"===r.palette.mode?"rgba(0, 0, 0, 0.4) 0px 6px 30px":"rgba(0, 0, 0, 0.08) 0px 6px 30px",border:"1px solid ".concat(r.palette.divider)}),"& .".concat(m.arrow),{color:r.palette.background.paper})})),T=s(x)((function(e){var t=e.theme;return{position:"relative",zIndex:1,color:t.palette.primary.main,borderRadius:"50%",cursor:"help",animation:"pulseGlow 1.5s infinite","@keyframes pulseGlow":{"0%":{boxShadow:"dark"===t.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0.3)":"0 0 0 0 rgba(33, 150, 243, 0.3)"},"70%":{boxShadow:"dark"===t.palette.mode?"0 0 0 10px rgba(144, 202, 249, 0)":"0 0 0 10px rgba(33, 150, 243, 0)"},"100%":{boxShadow:"dark"===t.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0)":"0 0 0 0 rgba(33, 150, 243, 0)"}}}}));export{T as HelpOutlinePulseIcon,v as RichTooltip,v as default};
1
+ import{defineProperty as e,objectWithoutProperties as t,objectSpread2 as r,inherits as a,createClass as o,classCallCheck as n,callSuper as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as p}from"react/jsx-runtime";import{Component as c}from"react";import{styled as s,Stack as d,Tooltip as u,tooltipClasses as m,Typography as h,Divider as f,Box as b}from"@mui/material";import x from"@mui/icons-material/HelpOutline";var g=["className"],v=function(){function t(){var r;n(this,t);for(var a=arguments.length,o=new Array(a),c=0;c<a;c++)o[c]=arguments[c];return r=i(this,t,[].concat(o)),e(r,"renderTitlePanel",function(){var e=r.props,t=e.panel,a=e.renderPanel;return a?a():t?p(k,{className:y.titlePanel,children:[r.renderTitle(t.title),l(f,{}),l(b,{className:y.content,children:r.renderContent(t.content)})]}):l(h,{variant:"body2",children:"Please provide a panel configuration"})}),e(r,"renderTitle",function(e){return e?"string"!=typeof e?e:l(h,{variant:"subtitle1",className:y.title,children:e}):null}),e(r,"renderContent",function(e){return e?"string"!=typeof e?e:l(h,{variant:"body2",children:e}):null}),r}return a(t,c),o(t,[{key:"render",value:function(){var e=this.props,t=e.children,a=e.slots;return l(w,r(r({arrow:!0,placement:"bottom",title:this.renderTitlePanel(),className:y.root},null==a?void 0:a.tooltipProps),{},{children:l(d,{children:t})}))}}])}(),y={root:"RichTooltip-root",titlePanel:"RichTooltip-titlePanel",title:"RichTooltip-title",content:"RichTooltip-content"},P=function(e,t){return"".concat((null==t?void 0:t.prefix)||"",".").concat(y[e]).concat((null==t?void 0:t.suffix)||"")},k=s(d)(function(t){var r=t.theme;return e(e(e({},P("titlePanel",{prefix:"&"}),{gap:"6px"}),P("title"),{color:r.palette.primary.main,fontWeight:700,padding:r.spacing(1,1.5,0)}),P("content"),{padding:r.spacing(1,1.5,1.5),color:r.palette.text.primary})}),w=s(function(e){var a=e.className,o=t(e,g);return l(u,r(r({},o),{},{classes:{popper:a}}))})(function(t){var r=t.theme;return e(e({},"& .".concat(m.tooltip),{backgroundColor:r.palette.background.paper,color:r.palette.text.primary,padding:0,minWidth:"360px",maxWidth:"450px",borderRadius:r.shape.borderRadius,boxShadow:"dark"===r.palette.mode?"rgba(0, 0, 0, 0.4) 0px 6px 30px":"rgba(0, 0, 0, 0.08) 0px 6px 30px",border:"1px solid ".concat(r.palette.divider)}),"& .".concat(m.arrow),{color:r.palette.background.paper})}),T=s(x)(function(e){var t=e.theme;return{position:"relative",zIndex:1,color:t.palette.primary.main,borderRadius:"50%",cursor:"help",animation:"pulseGlow 1.5s infinite","@keyframes pulseGlow":{"0%":{boxShadow:"dark"===t.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0.3)":"0 0 0 0 rgba(33, 150, 243, 0.3)"},"70%":{boxShadow:"dark"===t.palette.mode?"0 0 0 10px rgba(144, 202, 249, 0)":"0 0 0 10px rgba(33, 150, 243, 0)"},"100%":{boxShadow:"dark"===t.palette.mode?"0 0 0 0 rgba(144, 202, 249, 0)":"0 0 0 0 rgba(33, 150, 243, 0)"}}}});export{T as HelpOutlinePulseIcon,v as RichTooltip,v as default};
2
2
  //# sourceMappingURL=rich-tooltip.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"rich-tooltip.js","sources":["../../../src/components/rich-tooltip.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { Box, Divider, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { ReactNode } from 'react'\r\nimport type { TooltipProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IRichTooltipPanelConfig {\r\n title: ReactNode\r\n content: ReactNode\r\n}\r\n\r\nexport interface IRichTooltipProps {\r\n panel?: IRichTooltipPanelConfig\r\n renderPanel?: () => ReactNode\r\n children: React.ReactNode\r\n slots?: {\r\n tooltipProps?: Partial<TooltipProps>\r\n }\r\n}\r\n\r\nexport class RichTooltip extends Component<IRichTooltipProps> {\r\n render() {\r\n const { children, slots } = this.props\r\n return (\r\n <TooltipStyled arrow placement='bottom' title={this.renderTitlePanel()} className={richTooltipClasses.root} {...slots?.tooltipProps}>\r\n <Stack>{children}</Stack>\r\n </TooltipStyled>\r\n )\r\n }\r\n\r\n renderTitlePanel = () => {\r\n const { panel, renderPanel } = this.props\r\n if (renderPanel) return renderPanel()\r\n if (!panel) return <Typography variant='body2'>Please provide a panel configuration</Typography>\r\n return (\r\n <TooltipTitlePanelStyled className={richTooltipClasses.titlePanel}>\r\n {this.renderTitle(panel.title)}\r\n <Divider />\r\n <Box className={richTooltipClasses.content}>{this.renderContent(panel.content)}</Box>\r\n </TooltipTitlePanelStyled>\r\n )\r\n }\r\n\r\n renderTitle = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return (\r\n <Typography variant='subtitle1' className={richTooltipClasses.title}>\r\n {value}\r\n </Typography>\r\n )\r\n }\r\n\r\n renderContent = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return <Typography variant='body2'>{value}</Typography>\r\n }\r\n}\r\n\r\nexport default RichTooltip\r\n\r\nconst richTooltipClasses = {\r\n root: 'RichTooltip-root',\r\n titlePanel: 'RichTooltip-titlePanel',\r\n title: 'RichTooltip-title',\r\n content: 'RichTooltip-content'\r\n}\r\n\r\nconst getRichTooltipClass = (key: keyof typeof richTooltipClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${richTooltipClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nconst TooltipTitlePanelStyled = styled(Stack)(({ theme }) => ({\r\n [getRichTooltipClass('titlePanel', { prefix: '&' })]: {\r\n gap: '6px'\r\n },\r\n [getRichTooltipClass('title')]: {\r\n color: theme.palette.primary.main,\r\n fontWeight: 700,\r\n padding: theme.spacing(1, 1.5, 0)\r\n },\r\n [getRichTooltipClass('content')]: {\r\n padding: theme.spacing(1, 1.5, 1.5),\r\n color: theme.palette.text.primary\r\n }\r\n}))\r\n\r\nconst TooltipStyled = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: theme.palette.background.paper,\r\n color: theme.palette.text.primary,\r\n padding: 0,\r\n minWidth: '360px',\r\n maxWidth: '450px',\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: theme.palette.mode === 'dark' ? 'rgba(0, 0, 0, 0.4) 0px 6px 30px' : 'rgba(0, 0, 0, 0.08) 0px 6px 30px',\r\n border: `1px solid ${theme.palette.divider}`\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: theme.palette.background.paper\r\n }\r\n}))\r\n\r\nexport const HelpOutlinePulseIcon = styled(HelpOutlineIcon)(({ theme }) => ({\r\n position: 'relative',\r\n zIndex: 1,\r\n color: theme.palette.primary.main,\r\n borderRadius: '50%',\r\n cursor: 'help',\r\n animation: 'pulseGlow 1.5s infinite',\r\n '@keyframes pulseGlow': {\r\n '0%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0.3)' : '0 0 0 0 rgba(33, 150, 243, 0.3)'\r\n },\r\n '70%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 10px rgba(144, 202, 249, 0)' : '0 0 0 10px rgba(33, 150, 243, 0)'\r\n },\r\n '100%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0)' : '0 0 0 0 rgba(33, 150, 243, 0)'\r\n }\r\n }\r\n}))\r\n"],"names":["RichTooltip","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_this$props","props","panel","renderPanel","_jsxs","TooltipTitlePanelStyled","className","richTooltipClasses","titlePanel","renderTitle","title","_jsx","Divider","Box","content","children","renderContent","Typography","variant","value","_inherits","Component","_createClass","key","_this$props2","slots","TooltipStyled","_objectSpread","arrow","placement","renderTitlePanel","root","tooltipProps","Stack","getRichTooltipClass","options","prefix","suffix","styled","_ref","theme","gap","color","palette","primary","main","fontWeight","padding","spacing","text","_ref3","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref4","tooltipClasses","tooltip","backgroundColor","background","paper","minWidth","maxWidth","borderRadius","shape","boxShadow","mode","border","divider","HelpOutlinePulseIcon","HelpOutlineIcon","_ref6","position","zIndex","cursor","animation"],"mappings":"+cAoBaA,aAAY,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GAqCtB,OArCsBP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,oBAUJ,WACjB,IAAAY,EAA+BZ,EAAKa,MAA5BC,EAAKF,EAALE,MAAOC,EAAWH,EAAXG,YACf,OAAIA,EAAoBA,IACnBD,EAEHE,EAACC,GAAwBC,UAAWC,EAAmBC,qBACpDpB,EAAKqB,YAAYP,EAAMQ,OACxBC,EAACC,MACDD,EAACE,EAAI,CAAAP,UAAWC,EAAmBO,QAAUC,SAAA3B,EAAK4B,cAAcd,EAAMY,cALvDH,EAACM,EAAU,CAACC,QAAQ,6DAQxCnB,EAAAX,EAEa,eAAA,SAAC+B,GACb,OAAKA,EACgB,iBAAVA,EAA2BA,EAEpCR,EAACM,EAAW,CAAAC,QAAQ,YAAYZ,UAAWC,EAAmBG,eAC3DS,IAJc,QAOpBpB,EAAAX,EAEe,iBAAA,SAAC+B,GACf,OAAKA,EACgB,iBAAVA,EAA2BA,EAC/BR,EAACM,EAAW,CAAAC,QAAQ,QAAOH,SAAEI,IAFjB,QAGpB/B,CAAA,CAAA,OAAAgC,EAAAjC,EArC8BkC,GAqC9BC,EAAAnC,EAAA,CAAA,CAAAoC,IAAA,SAAAJ,MApCD,WACE,IAAAK,EAA4B3B,KAAKI,MAAzBc,EAAQS,EAART,SAAUU,EAAKD,EAALC,MAClB,OACEd,EAACe,EAAaC,EAAAA,EAAA,CAACC,OAAM,EAAAC,UAAU,SAASnB,MAAOb,KAAKiC,mBAAoBxB,UAAWC,EAAmBwB,MAAUN,aAAAA,EAAAA,EAAOO,cAAY,GAAA,CACjIjB,SAAAJ,EAACsB,EAAO,CAAAlB,SAAAA,MAGd,IAAC,IAkCGR,EAAqB,CACzBwB,KAAM,mBACNvB,WAAY,yBACZE,MAAO,oBACPI,QAAS,uBAGLoB,EAAsB,SAACX,EAAsCY,GACjE,MAAA,GAAArC,QAAUqC,aAAAA,EAAAA,EAASC,SAAU,QAAEtC,OAAIS,EAAmBgB,IAAIzB,QAAGqC,aAAAA,EAAAA,EAASE,SAAU,GAClF,EAEMhC,EAA0BiC,EAAOL,EAAPK,EAAc,SAAAC,GAAA,IAAGC,EAAKD,EAALC,MAAK,OAAAzC,EAAAA,EAAAA,EACnDmC,CAAAA,EAAAA,EAAoB,aAAc,CAAEE,OAAQ,MAAS,CACpDK,IAAK,QAENP,EAAoB,SAAW,CAC9BQ,MAAOF,EAAMG,QAAQC,QAAQC,KAC7BC,WAAY,IACZC,QAASP,EAAMQ,QAAQ,EAAG,IAAK,KAEhCd,EAAoB,WAAa,CAChCa,QAASP,EAAMQ,QAAQ,EAAG,IAAK,KAC/BN,MAAOF,EAAMG,QAAQM,KAAKL,SAC3B,IAGGlB,EAAgBY,GAAO,SAAAY,GAAA,IAAG5C,EAAS4C,EAAT5C,UAAcL,EAAKkD,EAAAD,EAAAE,GAAA,OAAqBzC,EAAC0C,EAAO1B,EAAAA,KAAK1B,GAAK,GAAA,CAAEqD,QAAS,CAAEC,OAAQjD,KAAe,GAAxGgC,EAA0G,SAAAkB,GAAA,IAAGhB,EAAKgB,EAALhB,MAAK,OAAAzC,EAAAA,EAAA,CAAA,EAAA,MAAAD,OAC/H2D,EAAeC,SAAY,CAChCC,gBAAiBnB,EAAMG,QAAQiB,WAAWC,MAC1CnB,MAAOF,EAAMG,QAAQM,KAAKL,QAC1BG,QAAS,EACTe,SAAU,QACVC,SAAU,QACVC,aAAcxB,EAAMyB,MAAMD,aAC1BE,UAAkC,SAAvB1B,EAAMG,QAAQwB,KAAkB,kCAAoC,mCAC/EC,oBAAMtE,OAAe0C,EAAMG,QAAQ0B,iBACpCvE,OACM2D,EAAe7B,OAAU,CAC9Bc,MAAOF,EAAMG,QAAQiB,WAAWC,OACjC,IAGUS,EAAuBhC,EAAOiC,EAAPjC,EAAwB,SAAAkC,GAAA,IAAGhC,EAAKgC,EAALhC,MAAK,MAAQ,CAC1EiC,SAAU,WACVC,OAAQ,EACRhC,MAAOF,EAAMG,QAAQC,QAAQC,KAC7BmB,aAAc,MACdW,OAAQ,OACRC,UAAW,0BACX,uBAAwB,CACtB,KAAM,CACJV,UAAkC,SAAvB1B,EAAMG,QAAQwB,KAAkB,mCAAqC,mCAElF,MAAO,CACLD,UAAkC,SAAvB1B,EAAMG,QAAQwB,KAAkB,oCAAsC,oCAEnF,OAAQ,CACND,UAAkC,SAAvB1B,EAAMG,QAAQwB,KAAkB,iCAAmC,kCAGnF"}
1
+ {"version":3,"file":"rich-tooltip.js","sources":["../../../src/components/rich-tooltip.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { Box, Divider, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { ReactNode } from 'react'\r\nimport type { TooltipProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IRichTooltipPanelConfig {\r\n title: ReactNode\r\n content: ReactNode\r\n}\r\n\r\nexport interface IRichTooltipProps {\r\n panel?: IRichTooltipPanelConfig\r\n renderPanel?: () => ReactNode\r\n children: React.ReactNode\r\n slots?: {\r\n tooltipProps?: Partial<TooltipProps>\r\n }\r\n}\r\n\r\nexport class RichTooltip extends Component<IRichTooltipProps> {\r\n render() {\r\n const { children, slots } = this.props\r\n return (\r\n <TooltipStyled arrow placement='bottom' title={this.renderTitlePanel()} className={richTooltipClasses.root} {...slots?.tooltipProps}>\r\n <Stack>{children}</Stack>\r\n </TooltipStyled>\r\n )\r\n }\r\n\r\n renderTitlePanel = () => {\r\n const { panel, renderPanel } = this.props\r\n if (renderPanel) return renderPanel()\r\n if (!panel) return <Typography variant='body2'>Please provide a panel configuration</Typography>\r\n return (\r\n <TooltipTitlePanelStyled className={richTooltipClasses.titlePanel}>\r\n {this.renderTitle(panel.title)}\r\n <Divider />\r\n <Box className={richTooltipClasses.content}>{this.renderContent(panel.content)}</Box>\r\n </TooltipTitlePanelStyled>\r\n )\r\n }\r\n\r\n renderTitle = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return (\r\n <Typography variant='subtitle1' className={richTooltipClasses.title}>\r\n {value}\r\n </Typography>\r\n )\r\n }\r\n\r\n renderContent = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return <Typography variant='body2'>{value}</Typography>\r\n }\r\n}\r\n\r\nexport default RichTooltip\r\n\r\nconst richTooltipClasses = {\r\n root: 'RichTooltip-root',\r\n titlePanel: 'RichTooltip-titlePanel',\r\n title: 'RichTooltip-title',\r\n content: 'RichTooltip-content'\r\n}\r\n\r\nconst getRichTooltipClass = (key: keyof typeof richTooltipClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${richTooltipClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nconst TooltipTitlePanelStyled = styled(Stack)(({ theme }) => ({\r\n [getRichTooltipClass('titlePanel', { prefix: '&' })]: {\r\n gap: '6px'\r\n },\r\n [getRichTooltipClass('title')]: {\r\n color: theme.palette.primary.main,\r\n fontWeight: 700,\r\n padding: theme.spacing(1, 1.5, 0)\r\n },\r\n [getRichTooltipClass('content')]: {\r\n padding: theme.spacing(1, 1.5, 1.5),\r\n color: theme.palette.text.primary\r\n }\r\n}))\r\n\r\nconst TooltipStyled = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: theme.palette.background.paper,\r\n color: theme.palette.text.primary,\r\n padding: 0,\r\n minWidth: '360px',\r\n maxWidth: '450px',\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: theme.palette.mode === 'dark' ? 'rgba(0, 0, 0, 0.4) 0px 6px 30px' : 'rgba(0, 0, 0, 0.08) 0px 6px 30px',\r\n border: `1px solid ${theme.palette.divider}`\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: theme.palette.background.paper\r\n }\r\n}))\r\n\r\nexport const HelpOutlinePulseIcon = styled(HelpOutlineIcon)(({ theme }) => ({\r\n position: 'relative',\r\n zIndex: 1,\r\n color: theme.palette.primary.main,\r\n borderRadius: '50%',\r\n cursor: 'help',\r\n animation: 'pulseGlow 1.5s infinite',\r\n '@keyframes pulseGlow': {\r\n '0%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0.3)' : '0 0 0 0 rgba(33, 150, 243, 0.3)'\r\n },\r\n '70%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 10px rgba(144, 202, 249, 0)' : '0 0 0 10px rgba(33, 150, 243, 0)'\r\n },\r\n '100%': {\r\n boxShadow: theme.palette.mode === 'dark' ? '0 0 0 0 rgba(144, 202, 249, 0)' : '0 0 0 0 rgba(33, 150, 243, 0)'\r\n }\r\n }\r\n}))\r\n"],"names":["RichTooltip","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_this$props","props","panel","renderPanel","_jsxs","TooltipTitlePanelStyled","className","richTooltipClasses","titlePanel","renderTitle","title","_jsx","Divider","Box","content","children","renderContent","Typography","variant","value","_inherits","Component","_createClass","key","_this$props2","slots","TooltipStyled","_objectSpread","arrow","placement","renderTitlePanel","root","tooltipProps","Stack","getRichTooltipClass","options","prefix","suffix","styled","_ref","theme","gap","color","palette","primary","main","fontWeight","padding","spacing","text","_ref3","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref4","tooltipClasses","tooltip","backgroundColor","background","paper","minWidth","maxWidth","borderRadius","shape","boxShadow","mode","border","divider","HelpOutlinePulseIcon","HelpOutlineIcon","_ref6","position","zIndex","cursor","animation"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as r,createClass as e,classCallCheck as o,callSuper as t,defineProperty as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as i,jsx as a}from"react/jsx-runtime";import{Component as n}from"react";import{styled as s,Box as d}from"@mui/material";import u from"react-quill";import"react-quill/dist/quill.snow.css";var p={root:"DinoTextEditor-root",fullscreen:"DinoTextEditor-fullscreen"},h={formats:["header","bold","italic","underline","strike","blockquote","list","bullet","indent","link","image","align","color","background"],modules:{toolbar:[[{header:[1,2,3,4,5,6,!1]}],["bold","italic","underline","strike","blockquote"],[{align:""},{align:"center"},{align:"right"},{align:"justify"}],[{list:"ordered"},{list:"bullet"},{indent:"-1"},{indent:"+1"}],[{color:[]},{background:[]}],["link","image"],["clean"]]}},c=function(){function s(r){var e,i;return o(this,s),i=t(this,s,[r]),l(i,"handleChange",(function(r){var e=r;"<p><br></p>"===r&&(e=""),i.setState({value:e})})),l(i,"id",0),i.state={value:null!==(e=r.defautValue)&&void 0!==e?e:""},i}return r(s,n),e(s,[{key:"render",value:function(){var r=[p.root];return this.props.error&&r.push("error"),i(f,{id:this.props.id,sx:this.props.sx,className:r.join(" "),children:[!this.props.readOnly&&a("input",{name:this.props.name,defaultValue:this.state.value,hidden:!0},++this.id),a(u,{readOnly:this.props.readOnly,placeholder:"Enter the message",value:this.state.value,modules:h.modules,formats:h.formats,onChange:this.handleChange,onBlur:this.props.onBlur})]})}}])}(),m="#d32f2f",f=s(d)({margin:0,minHeight:"450px",display:"flex","& .quill":{flex:1},"& .ql-container":{height:"calc(100% - 42px)",borderBottomLeftRadius:"6px",borderBottomRightRadius:"6px"},"& .ql-toolbar":{borderTopLeftRadius:"6px",borderTopRightRadius:"6px"},"&.error .ql-toolbar":{borderTopColor:m,borderLeftColor:m,borderRightColor:m},"&.error .ql-container":{borderBottomColor:m,borderLeftColor:m,borderRightColor:m},"&.error .ql-editor.ql-blank::before":{color:m}});export{c as default,p as textEditorClasses};
1
+ import{inherits as r,createClass as e,classCallCheck as o,callSuper as t,defineProperty as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as i,jsx as a}from"react/jsx-runtime";import{Component as n}from"react";import{styled as s,Box as d}from"@mui/material";import u from"react-quill";import"react-quill/dist/quill.snow.css";var p={root:"DinoTextEditor-root",fullscreen:"DinoTextEditor-fullscreen"},h={formats:["header","bold","italic","underline","strike","blockquote","list","bullet","indent","link","image","align","color","background"],modules:{toolbar:[[{header:[1,2,3,4,5,6,!1]}],["bold","italic","underline","strike","blockquote"],[{align:""},{align:"center"},{align:"right"},{align:"justify"}],[{list:"ordered"},{list:"bullet"},{indent:"-1"},{indent:"+1"}],[{color:[]},{background:[]}],["link","image"],["clean"]]}},c=function(){function s(r){var e,i;return o(this,s),i=t(this,s,[r]),l(i,"handleChange",function(r){var e=r;"<p><br></p>"===r&&(e=""),i.setState({value:e})}),l(i,"id",0),i.state={value:null!==(e=r.defautValue)&&void 0!==e?e:""},i}return r(s,n),e(s,[{key:"render",value:function(){var r=[p.root];return this.props.error&&r.push("error"),i(f,{id:this.props.id,sx:this.props.sx,className:r.join(" "),children:[!this.props.readOnly&&a("input",{name:this.props.name,defaultValue:this.state.value,hidden:!0},++this.id),a(u,{readOnly:this.props.readOnly,placeholder:"Enter the message",value:this.state.value,modules:h.modules,formats:h.formats,onChange:this.handleChange,onBlur:this.props.onBlur})]})}}])}(),m="#d32f2f",f=s(d)({margin:0,minHeight:"450px",display:"flex","& .quill":{flex:1},"& .ql-container":{height:"calc(100% - 42px)",borderBottomLeftRadius:"6px",borderBottomRightRadius:"6px"},"& .ql-toolbar":{borderTopLeftRadius:"6px",borderTopRightRadius:"6px"},"&.error .ql-toolbar":{borderTopColor:m,borderLeftColor:m,borderRightColor:m},"&.error .ql-container":{borderBottomColor:m,borderLeftColor:m,borderRightColor:m},"&.error .ql-editor.ql-blank::before":{color:m}});export{c as default,p as textEditorClasses};
2
2
  //# sourceMappingURL=text-editor.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"text-editor.js","sources":["../../../src/components/text-editor.tsx"],"sourcesContent":["// /* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { Component } from 'react'\r\nimport { Box, styled, SxProps, Theme } from '@mui/material'\r\n/**\r\n * yarn add react-quill@2.0.0\r\n */\r\nimport ReactQuill from 'react-quill'\r\nimport 'react-quill/dist/quill.snow.css'\r\n\r\nexport const textEditorClasses = {\r\n root: 'DinoTextEditor-root',\r\n fullscreen: 'DinoTextEditor-fullscreen'\r\n}\r\n\r\nconst EditorToolbar: any = {}\r\n\r\nEditorToolbar.formats = [\r\n 'header',\r\n 'bold',\r\n 'italic',\r\n 'underline',\r\n 'strike',\r\n 'blockquote',\r\n 'list',\r\n 'bullet',\r\n 'indent',\r\n 'link',\r\n 'image',\r\n 'align',\r\n 'color',\r\n 'background'\r\n]\r\n\r\nEditorToolbar.modules = {\r\n toolbar: [\r\n [{ header: [1, 2, 3, 4, 5, 6, false] }],\r\n ['bold', 'italic', 'underline', 'strike', 'blockquote'],\r\n [{ align: '' }, { align: 'center' }, { align: 'right' }, { align: 'justify' }],\r\n [{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],\r\n [{ color: [] }, { background: [] }],\r\n ['link', 'image'],\r\n ['clean']\r\n ]\r\n}\r\n\r\nexport interface ITextEditorProps {\r\n id?: string\r\n name: string\r\n sx?: SxProps<Theme>\r\n readOnly?: boolean\r\n defautValue?: string\r\n error?: boolean\r\n onBlur?: () => void\r\n}\r\n\r\nexport interface ITextEditorState {\r\n value: string\r\n}\r\n\r\nclass TextEditor extends Component<ITextEditorProps, ITextEditorState> {\r\n constructor(props: ITextEditorProps) {\r\n super(props)\r\n this.state = { value: props.defautValue ?? '' }\r\n }\r\n handleChange = (value: string) => {\r\n let str = value\r\n if (value === '<p><br></p>') str = ''\r\n this.setState({ value: str })\r\n }\r\n\r\n id = 0\r\n render() {\r\n const classes = [textEditorClasses.root]\r\n if (this.props.error) classes.push('error')\r\n return (\r\n <Wrapper id={this.props.id} sx={this.props.sx} className={classes.join(' ')}>\r\n {!this.props.readOnly && <input key={++this.id} name={this.props.name} defaultValue={this.state.value} hidden />}\r\n <ReactQuill\r\n readOnly={this.props.readOnly}\r\n placeholder='Enter the message'\r\n value={this.state.value}\r\n modules={EditorToolbar.modules}\r\n formats={EditorToolbar.formats}\r\n onChange={this.handleChange}\r\n onBlur={this.props.onBlur}\r\n />\r\n </Wrapper>\r\n )\r\n }\r\n}\r\n\r\nexport default TextEditor\r\n\r\nconst borderColor = '#d32f2f'\r\n\r\nconst Wrapper = styled(Box)({\r\n margin: 0,\r\n minHeight: '450px',\r\n display: 'flex',\r\n '& .quill': { flex: 1 },\r\n '& .ql-container': {\r\n height: 'calc(100% - 42px)',\r\n borderBottomLeftRadius: '6px',\r\n borderBottomRightRadius: '6px'\r\n },\r\n '& .ql-toolbar': {\r\n borderTopLeftRadius: '6px',\r\n borderTopRightRadius: '6px'\r\n },\r\n '&.error .ql-toolbar': {\r\n borderTopColor: borderColor,\r\n borderLeftColor: borderColor,\r\n borderRightColor: borderColor\r\n },\r\n '&.error .ql-container': {\r\n borderBottomColor: borderColor,\r\n borderLeftColor: borderColor,\r\n borderRightColor: borderColor\r\n },\r\n '&.error .ql-editor.ql-blank::before': {\r\n color: borderColor\r\n }\r\n})\r\n"],"names":["textEditorClasses","root","fullscreen","EditorToolbar","toolbar","header","align","list","indent","color","background","TextEditor","props","_props$defautValue","_this","_classCallCheck","_callSuper","_defineProperty","value","str","setState","state","defautValue","_inherits","Component","_createClass","key","classes","this","error","push","_jsxs","Wrapper","id","sx","className","join","children","readOnly","_jsx","name","defaultValue","hidden","ReactQuill","placeholder","modules","formats","onChange","handleChange","onBlur","borderColor","styled","Box","margin","minHeight","display","flex","height","borderBottomLeftRadius","borderBottomRightRadius","borderTopLeftRadius","borderTopRightRadius","borderTopColor","borderLeftColor","borderRightColor","borderBottomColor"],"mappings":"sVASO,IAAMA,EAAoB,CAC/BC,KAAM,sBACNC,WAAY,6BAGRC,EAAqB,CAE3BA,QAAwB,CACtB,SACA,OACA,SACA,YACA,SACA,aACA,OACA,SACA,SACA,OACA,QACA,QACA,QACA,cAGFA,QAAwB,CACtBC,QAAS,CACP,CAAC,CAAEC,OAAQ,CAAC,EAAG,EAAG,EAAG,EAAG,EAAG,GAAG,KAC9B,CAAC,OAAQ,SAAU,YAAa,SAAU,cAC1C,CAAC,CAAEC,MAAO,IAAM,CAAEA,MAAO,UAAY,CAAEA,MAAO,SAAW,CAAEA,MAAO,YAClE,CAAC,CAAEC,KAAM,WAAa,CAAEA,KAAM,UAAY,CAAEC,OAAQ,MAAQ,CAAEA,OAAQ,OACtE,CAAC,CAAEC,MAAO,IAAM,CAAEC,WAAY,KAC9B,CAAC,OAAQ,SACT,CAAC,YAkBCC,aACJ,SAAAA,EAAYC,GAAuB,IAAAC,EAAAC,EAEc,OAFdC,OAAAJ,GACjCG,EAAAE,EAAAL,KAAAA,GAAMC,IAAMK,EAAAH,EAGC,gBAAA,SAACI,GACd,IAAIC,EAAMD,EACI,gBAAVA,IAAyBC,EAAM,IACnCL,EAAKM,SAAS,CAAEF,MAAOC,OACxBF,EAAAH,EAAA,KAEI,GARHA,EAAKO,MAAQ,CAAEH,MAAwBL,QAAnBA,EAAED,EAAMU,mBAAWT,IAAAA,EAAAA,EAAI,IAAIC,CACjD,CAAC,OAAAS,EAAAZ,EAJsBa,GAItBC,EAAAd,EAAA,CAAA,CAAAe,IAAA,SAAAR,MAQD,WACE,IAAMS,EAAU,CAAC3B,EAAkBC,MAEnC,OADI2B,KAAKhB,MAAMiB,OAAOF,EAAQG,KAAK,SAEjCC,EAACC,EAAQ,CAAAC,GAAIL,KAAKhB,MAAMqB,GAAIC,GAAIN,KAAKhB,MAAMsB,GAAIC,UAAWR,EAAQS,KAAK,KACpEC,SAAA,EAACT,KAAKhB,MAAM0B,UAAYC,EAAA,QAAA,CAAuBC,KAAMZ,KAAKhB,MAAM4B,KAAMC,aAAcb,KAAKP,MAAMH,MAAOwB,QAAlE,KAAEd,KAAKK,IAC5CM,EAACI,GACCL,SAAUV,KAAKhB,MAAM0B,SACrBM,YAAY,oBACZ1B,MAAOU,KAAKP,MAAMH,MAClB2B,QAAS1C,EAAc0C,QACvBC,QAAS3C,EAAc2C,QACvBC,SAAUnB,KAAKoB,aACfC,OAAQrB,KAAKhB,MAAMqC,WAI3B,IAAC,IAKGC,EAAc,UAEdlB,EAAUmB,EAAOC,EAAPD,CAAY,CAC1BE,OAAQ,EACRC,UAAW,QACXC,QAAS,OACT,WAAY,CAAEC,KAAM,GACpB,kBAAmB,CACjBC,OAAQ,oBACRC,uBAAwB,MACxBC,wBAAyB,OAE3B,gBAAiB,CACfC,oBAAqB,MACrBC,qBAAsB,OAExB,sBAAuB,CACrBC,eAAgBZ,EAChBa,gBAAiBb,EACjBc,iBAAkBd,GAEpB,wBAAyB,CACvBe,kBAAmBf,EACnBa,gBAAiBb,EACjBc,iBAAkBd,GAEpB,sCAAuC,CACrCzC,MAAOyC"}
1
+ {"version":3,"file":"text-editor.js","sources":["../../../src/components/text-editor.tsx"],"sourcesContent":["// /* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport React, { Component } from 'react'\r\nimport { Box, styled, SxProps, Theme } from '@mui/material'\r\n/**\r\n * yarn add react-quill@2.0.0\r\n */\r\nimport ReactQuill from 'react-quill'\r\nimport 'react-quill/dist/quill.snow.css'\r\n\r\nexport const textEditorClasses = {\r\n root: 'DinoTextEditor-root',\r\n fullscreen: 'DinoTextEditor-fullscreen'\r\n}\r\n\r\nconst EditorToolbar: any = {}\r\n\r\nEditorToolbar.formats = [\r\n 'header',\r\n 'bold',\r\n 'italic',\r\n 'underline',\r\n 'strike',\r\n 'blockquote',\r\n 'list',\r\n 'bullet',\r\n 'indent',\r\n 'link',\r\n 'image',\r\n 'align',\r\n 'color',\r\n 'background'\r\n]\r\n\r\nEditorToolbar.modules = {\r\n toolbar: [\r\n [{ header: [1, 2, 3, 4, 5, 6, false] }],\r\n ['bold', 'italic', 'underline', 'strike', 'blockquote'],\r\n [{ align: '' }, { align: 'center' }, { align: 'right' }, { align: 'justify' }],\r\n [{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],\r\n [{ color: [] }, { background: [] }],\r\n ['link', 'image'],\r\n ['clean']\r\n ]\r\n}\r\n\r\nexport interface ITextEditorProps {\r\n id?: string\r\n name: string\r\n sx?: SxProps<Theme>\r\n readOnly?: boolean\r\n defautValue?: string\r\n error?: boolean\r\n onBlur?: () => void\r\n}\r\n\r\nexport interface ITextEditorState {\r\n value: string\r\n}\r\n\r\nclass TextEditor extends Component<ITextEditorProps, ITextEditorState> {\r\n constructor(props: ITextEditorProps) {\r\n super(props)\r\n this.state = { value: props.defautValue ?? '' }\r\n }\r\n handleChange = (value: string) => {\r\n let str = value\r\n if (value === '<p><br></p>') str = ''\r\n this.setState({ value: str })\r\n }\r\n\r\n id = 0\r\n render() {\r\n const classes = [textEditorClasses.root]\r\n if (this.props.error) classes.push('error')\r\n return (\r\n <Wrapper id={this.props.id} sx={this.props.sx} className={classes.join(' ')}>\r\n {!this.props.readOnly && <input key={++this.id} name={this.props.name} defaultValue={this.state.value} hidden />}\r\n <ReactQuill\r\n readOnly={this.props.readOnly}\r\n placeholder='Enter the message'\r\n value={this.state.value}\r\n modules={EditorToolbar.modules}\r\n formats={EditorToolbar.formats}\r\n onChange={this.handleChange}\r\n onBlur={this.props.onBlur}\r\n />\r\n </Wrapper>\r\n )\r\n }\r\n}\r\n\r\nexport default TextEditor\r\n\r\nconst borderColor = '#d32f2f'\r\n\r\nconst Wrapper = styled(Box)({\r\n margin: 0,\r\n minHeight: '450px',\r\n display: 'flex',\r\n '& .quill': { flex: 1 },\r\n '& .ql-container': {\r\n height: 'calc(100% - 42px)',\r\n borderBottomLeftRadius: '6px',\r\n borderBottomRightRadius: '6px'\r\n },\r\n '& .ql-toolbar': {\r\n borderTopLeftRadius: '6px',\r\n borderTopRightRadius: '6px'\r\n },\r\n '&.error .ql-toolbar': {\r\n borderTopColor: borderColor,\r\n borderLeftColor: borderColor,\r\n borderRightColor: borderColor\r\n },\r\n '&.error .ql-container': {\r\n borderBottomColor: borderColor,\r\n borderLeftColor: borderColor,\r\n borderRightColor: borderColor\r\n },\r\n '&.error .ql-editor.ql-blank::before': {\r\n color: borderColor\r\n }\r\n})\r\n"],"names":["textEditorClasses","root","fullscreen","EditorToolbar","toolbar","header","align","list","indent","color","background","TextEditor","props","_props$defautValue","_this","_classCallCheck","_callSuper","_defineProperty","value","str","setState","state","defautValue","_inherits","Component","_createClass","key","classes","this","error","push","_jsxs","Wrapper","id","sx","className","join","children","readOnly","_jsx","name","defaultValue","hidden","ReactQuill","placeholder","modules","formats","onChange","handleChange","onBlur","borderColor","styled","Box","margin","minHeight","display","flex","height","borderBottomLeftRadius","borderBottomRightRadius","borderTopLeftRadius","borderTopRightRadius","borderTopColor","borderLeftColor","borderRightColor","borderBottomColor"],"mappings":"sVASO,IAAMA,EAAoB,CAC/BC,KAAM,sBACNC,WAAY,6BAGRC,EAAqB,CAE3BA,QAAwB,CACtB,SACA,OACA,SACA,YACA,SACA,aACA,OACA,SACA,SACA,OACA,QACA,QACA,QACA,cAGFA,QAAwB,CACtBC,QAAS,CACP,CAAC,CAAEC,OAAQ,CAAC,EAAG,EAAG,EAAG,EAAG,EAAG,GAAG,KAC9B,CAAC,OAAQ,SAAU,YAAa,SAAU,cAC1C,CAAC,CAAEC,MAAO,IAAM,CAAEA,MAAO,UAAY,CAAEA,MAAO,SAAW,CAAEA,MAAO,YAClE,CAAC,CAAEC,KAAM,WAAa,CAAEA,KAAM,UAAY,CAAEC,OAAQ,MAAQ,CAAEA,OAAQ,OACtE,CAAC,CAAEC,MAAO,IAAM,CAAEC,WAAY,KAC9B,CAAC,OAAQ,SACT,CAAC,YAkBCC,aACJ,SAAAA,EAAYC,GAAuB,IAAAC,EAAAC,EAEc,OAFdC,OAAAJ,GACjCG,EAAAE,EAAAL,KAAAA,GAAMC,IAAMK,EAAAH,EAGC,eAAA,SAACI,GACd,IAAIC,EAAMD,EACI,gBAAVA,IAAyBC,EAAM,IACnCL,EAAKM,SAAS,CAAEF,MAAOC,MACxBF,EAAAH,EAAA,KAEI,GARHA,EAAKO,MAAQ,CAAEH,MAAwBL,QAAnBA,EAAED,EAAMU,mBAAWT,IAAAA,EAAAA,EAAI,IAAIC,CACjD,CAAC,OAAAS,EAAAZ,EAJsBa,GAItBC,EAAAd,EAAA,CAAA,CAAAe,IAAA,SAAAR,MAQD,WACE,IAAMS,EAAU,CAAC3B,EAAkBC,MAEnC,OADI2B,KAAKhB,MAAMiB,OAAOF,EAAQG,KAAK,SAEjCC,EAACC,EAAQ,CAAAC,GAAIL,KAAKhB,MAAMqB,GAAIC,GAAIN,KAAKhB,MAAMsB,GAAIC,UAAWR,EAAQS,KAAK,KACpEC,SAAA,EAACT,KAAKhB,MAAM0B,UAAYC,EAAA,QAAA,CAAuBC,KAAMZ,KAAKhB,MAAM4B,KAAMC,aAAcb,KAAKP,MAAMH,MAAOwB,QAAlE,KAAEd,KAAKK,IAC5CM,EAACI,GACCL,SAAUV,KAAKhB,MAAM0B,SACrBM,YAAY,oBACZ1B,MAAOU,KAAKP,MAAMH,MAClB2B,QAAS1C,EAAc0C,QACvBC,QAAS3C,EAAc2C,QACvBC,SAAUnB,KAAKoB,aACfC,OAAQrB,KAAKhB,MAAMqC,WAI3B,IAAC,IAKGC,EAAc,UAEdlB,EAAUmB,EAAOC,EAAPD,CAAY,CAC1BE,OAAQ,EACRC,UAAW,QACXC,QAAS,OACT,WAAY,CAAEC,KAAM,GACpB,kBAAmB,CACjBC,OAAQ,oBACRC,uBAAwB,MACxBC,wBAAyB,OAE3B,gBAAiB,CACfC,oBAAqB,MACrBC,qBAAsB,OAExB,sBAAuB,CACrBC,eAAgBZ,EAChBa,gBAAiBb,EACjBc,iBAAkBd,GAEpB,wBAAyB,CACvBe,kBAAmBf,EACnBa,gBAAiBb,EACjBc,iBAAkBd,GAEpB,sCAAuC,CACrCzC,MAAOyC"}
@@ -1,2 +1,2 @@
1
- import{jsx as e,Fragment as n}from"react/jsx-runtime";import r from"react";var t=function(t){var c=r.useRef(null);return r.useEffect((function(){var e=document.createElement("template");if(e.innerHTML='\n <link rel="stylesheet" href="css/quill.snow.css">\n <div class=\'ql-editor\'>'.concat(t.children,"</div>\n "),c.current){var n=c.current.shadowRoot||c.current.attachShadow({mode:"open"});n.innerHTML="",n.appendChild(e.content.cloneNode(!0))}}),[t.children]),e(n,{children:e("div",{ref:c})})};export{t as default};
1
+ import{jsx as e,Fragment as n}from"react/jsx-runtime";import r from"react";var t=function(t){var c=r.useRef(null);return r.useEffect(function(){var e=document.createElement("template");if(e.innerHTML='\n <link rel="stylesheet" href="css/quill.snow.css">\n <div class=\'ql-editor\'>'.concat(t.children,"</div>\n "),c.current){var n=c.current.shadowRoot||c.current.attachShadow({mode:"open"});n.innerHTML="",n.appendChild(e.content.cloneNode(!0))}},[t.children]),e(n,{children:e("div",{ref:c})})};export{t as default};
2
2
  //# sourceMappingURL=text-editor.preview.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"text-editor.preview.js","sources":["../../../src/components/text-editor.preview.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\n\r\nconst TextEditorPreview: FC<{ children: string }> = (props) => {\r\n const contentRef = React.useRef<HTMLDivElement | null>(null)\r\n\r\n React.useEffect(() => {\r\n // Lấy phần tử template\r\n const template = document.createElement('template')\r\n template.innerHTML = `\r\n <link rel=\"stylesheet\" href=\"css/quill.snow.css\">\r\n <div class='ql-editor'>${props.children}</div>\r\n `\r\n\r\n // Tạo shadow DOM và chèn nội dung từ template\r\n if (contentRef.current) {\r\n const shadowRoot = contentRef.current.shadowRoot || contentRef.current.attachShadow({ mode: 'open' })\r\n\r\n shadowRoot.innerHTML = '' // Reset nội dung cũ\r\n shadowRoot.appendChild(template.content.cloneNode(true))\r\n }\r\n }, [props.children])\r\n\r\n return (\r\n <>\r\n <div ref={contentRef}></div>\r\n </>\r\n )\r\n}\r\n\r\nexport default TextEditorPreview\r\n"],"names":["TextEditorPreview","props","contentRef","React","useRef","useEffect","template","document","createElement","innerHTML","concat","children","current","shadowRoot","attachShadow","mode","appendChild","content","cloneNode","_jsx","ref"],"mappings":"2EAEA,IAAMA,EAA8C,SAACC,GACnD,IAAMC,EAAaC,EAAMC,OAA8B,MAmBvD,OAjBAD,EAAME,WAAU,WAEd,IAAMC,EAAWC,SAASC,cAAc,YAOxC,GANAF,EAASG,UAASC,6FAAAA,OAEST,EAAMU,SAChC,gBAGGT,EAAWU,QAAS,CACtB,IAAMC,EAAaX,EAAWU,QAAQC,YAAcX,EAAWU,QAAQE,aAAa,CAAEC,KAAM,SAE5FF,EAAWJ,UAAY,GACvBI,EAAWG,YAAYV,EAASW,QAAQC,WAAU,GACnD,CACH,GAAG,CAACjB,EAAMU,WAGRQ,cACEA,EAAK,MAAA,CAAAC,IAAKlB,KAGhB"}
1
+ {"version":3,"file":"text-editor.preview.js","sources":["../../../src/components/text-editor.preview.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\n\r\nconst TextEditorPreview: FC<{ children: string }> = (props) => {\r\n const contentRef = React.useRef<HTMLDivElement | null>(null)\r\n\r\n React.useEffect(() => {\r\n // Lấy phần tử template\r\n const template = document.createElement('template')\r\n template.innerHTML = `\r\n <link rel=\"stylesheet\" href=\"css/quill.snow.css\">\r\n <div class='ql-editor'>${props.children}</div>\r\n `\r\n\r\n // Tạo shadow DOM và chèn nội dung từ template\r\n if (contentRef.current) {\r\n const shadowRoot = contentRef.current.shadowRoot || contentRef.current.attachShadow({ mode: 'open' })\r\n\r\n shadowRoot.innerHTML = '' // Reset nội dung cũ\r\n shadowRoot.appendChild(template.content.cloneNode(true))\r\n }\r\n }, [props.children])\r\n\r\n return (\r\n <>\r\n <div ref={contentRef}></div>\r\n </>\r\n )\r\n}\r\n\r\nexport default TextEditorPreview\r\n"],"names":["TextEditorPreview","props","contentRef","React","useRef","useEffect","template","document","createElement","innerHTML","concat","children","current","shadowRoot","attachShadow","mode","appendChild","content","cloneNode","_jsx","ref"],"mappings":"2EAEA,IAAMA,EAA8C,SAACC,GACnD,IAAMC,EAAaC,EAAMC,OAA8B,MAmBvD,OAjBAD,EAAME,UAAU,WAEd,IAAMC,EAAWC,SAASC,cAAc,YAOxC,GANAF,EAASG,UAASC,6FAAAA,OAEST,EAAMU,SAChC,gBAGGT,EAAWU,QAAS,CACtB,IAAMC,EAAaX,EAAWU,QAAQC,YAAcX,EAAWU,QAAQE,aAAa,CAAEC,KAAM,SAE5FF,EAAWJ,UAAY,GACvBI,EAAWG,YAAYV,EAASW,QAAQC,WAAU,GACnD,CACH,EAAG,CAACjB,EAAMU,WAGRQ,cACEA,EAAK,MAAA,CAAAC,IAAKlB,KAGhB"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as t,objectSpread2 as n,slicedToArray as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{styled as o}from"@mui/material";import{useRef as a,useState as u,useEffect as l,useMemo as c,cloneElement as s}from"react";import{EViewMode as m}from"./view-mode.types.js";var d={enter:300,exit:180,ease:"cubic-bezier(0.25, 0.1, 0.25, 1)",delayEnter:40,delayExit:0,transformOriginList:"top center",transformOriginModule:"top center",translateY:10,horizontalScale:.98,mountDelay:50,hold:100},f=function(t){var o=a(null),s=a(null),f=a(null),p=n(n({},d),t.animConfig||{}),w=u(t.mode),g=e(w,2),x=g[0],T=g[1],D=u(!0),L=e(D,2),H=L[0],O=L[1],S=a(null),A=a(null);l((function(){var n,e;if(t.mode!==x){A.current&&(window.clearTimeout(A.current),A.current=null),S.current=t.mode;var r=null===(n=o.current)||void 0===n?void 0:n.offsetHeight;o.current&&"number"==typeof r&&(o.current.style.height="".concat(r,"px"),o.current.style.transition="height ".concat(p.enter,"ms ").concat(p.ease)),O(!1);var i=p.exit+(null!==(e=p.hold)&&void 0!==e?e:0);return A.current=window.setTimeout((function(){var t=S.current;S.current=null,null!=t&&(T(t),requestAnimationFrame((function(){var n,e,r,i,a=null!==(n=null!==(e=null===(r=(t===m.List?s:f).current)||void 0===r?void 0:r.offsetHeight)&&void 0!==e?e:null===(i=o.current)||void 0===i?void 0:i.offsetHeight)&&void 0!==n?n:0;O(!0),o.current&&(o.current.style.height="".concat(a,"px"),window.setTimeout((function(){o.current&&(o.current.style.height="")}),p.enter))}))),A.current=null}),i),function(){A.current&&(window.clearTimeout(A.current),A.current=null)}}}),[t.mode,x]);var E=c((function(){var n=h.root,e=h.pane,r=h.paneList,i=h.paneModule,o=h.autoHeight;return{root:[n,t.autoHeight?o:""],paneList:[e,r],paneModule:[e,i]}}),[t.mode,t.autoHeight]);return r(y,{className:E.root.join(" "),children:i("div",{ref:o,className:h.content,children:[x===m.List&&r(v,{open:H,timeout:{enter:d.enter,exit:d.exit},mountDelay:p.mountDelay,anim:p,style:{transitionTimingFunction:d.ease,transitionDuration:"".concat(d.enter,"ms"),transitionDelay:"".concat(H?p.delayEnter:p.delayExit,"ms"),transformOrigin:p.transformOriginList},children:r("div",{ref:s,className:E.paneList.join(" "),"aria-hidden":x!==m.List,children:t.listNode})}),x===m.Module&&r(v,{open:H,timeout:{enter:d.enter,exit:d.exit},mountDelay:p.mountDelay,anim:p,style:{transitionTimingFunction:d.ease,transitionDuration:"".concat(d.enter,"ms"),transitionDelay:"".concat(H?p.delayEnter:p.delayExit,"ms"),transformOrigin:p.transformOriginModule},children:r("div",{ref:f,className:E.paneModule.join(" "),"aria-hidden":x!==m.Module,children:t.moduleNode})})]})})},h={root:"AnimationSwitch-root",content:"AnimationSwitch-content",autoHeight:"AnimationSwitch-auto-height",pane:"AnimationSwitch-pane",paneList:"AnimationSwitch-pane-list",paneModule:"AnimationSwitch-pane-module"},p=function(t,n){return"".concat((null==n?void 0:n.prefix)||"",".").concat(h[t]).concat((null==n?void 0:n.suffix)||"")},y=o("div")((function(n){return n.theme,t(t(t({},p("root",{prefix:"&"}),{width:"100%"}),p("content"),{position:"relative",width:"100%"}),"&:not(".concat(p("autoHeight"),")"),t(t({height:"100%"},p("content"),{height:"100%"}),p("pane"),{height:"100%",display:"flex"}))})),v=function(t){var r,i,o=t.open,c=t.timeout,m=t.mountDelay,f=t.style,h=t.anim,p=t.children,y=null!=h?h:d,v="number"==typeof c?c:null!==(r=null==c?void 0:c.enter)&&void 0!==r?r:y.enter,w="number"==typeof c?c:null!==(i=null==c?void 0:c.exit)&&void 0!==i?i:y.exit,g=null!=m?m:y.mountDelay,x=u(o),T=e(x,2),D=T[0],L=T[1],H=u(o),O=e(H,2),S=O[0],A=O[1],E=a(null),M=a(null);if(l((function(){if(o)return M.current&&(window.clearTimeout(M.current),M.current=null),L(!0),void(g>0?(E.current&&window.clearTimeout(E.current),E.current=window.setTimeout((function(){A(!0),E.current=null}),g)):A(!0));A(!1),E.current&&(window.clearTimeout(E.current),E.current=null),M.current&&window.clearTimeout(M.current),M.current=window.setTimeout((function(){L(!1),M.current=null}),w)}),[o,g,v,w]),l((function(){return function(){E.current&&window.clearTimeout(E.current),M.current&&window.clearTimeout(M.current)}}),[]),!D)return null;var b={transitionProperty:"opacity, transform",transitionTimingFunction:y.ease,transitionDuration:"".concat(S?v:w,"ms"),transitionDelay:"".concat(S?y.delayEnter:y.delayExit,"ms"),transformOrigin:(null==f?void 0:f.transformOrigin)||y.transformOriginList},j={opacity:0,transform:"translateY(".concat(y.translateY,"px) scaleX(").concat(y.horizontalScale,")")},N=n(n(n({},b),S?{opacity:1,transform:"translateY(0) scaleX(1)"}:j),f);return s(p,{style:N})};export{y as AnimationSwitchStyled,h as animationSwitchClasses,f as default};
1
+ import{defineProperty as t,objectSpread2 as n,slicedToArray as e}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{styled as o}from"@mui/material";import{useRef as a,useState as u,useEffect as l,useMemo as c,cloneElement as s}from"react";import{EViewMode as m}from"./view-mode.types.js";var d={enter:300,exit:180,ease:"cubic-bezier(0.25, 0.1, 0.25, 1)",delayEnter:40,delayExit:0,transformOriginList:"top center",transformOriginModule:"top center",translateY:10,horizontalScale:.98,mountDelay:50,hold:100},f=function(t){var o=a(null),s=a(null),f=a(null),p=n(n({},d),t.animConfig||{}),w=u(t.mode),g=e(w,2),x=g[0],T=g[1],D=u(!0),L=e(D,2),H=L[0],O=L[1],S=a(null),A=a(null);l(function(){var n,e;if(t.mode!==x){A.current&&(window.clearTimeout(A.current),A.current=null),S.current=t.mode;var r=null===(n=o.current)||void 0===n?void 0:n.offsetHeight;o.current&&"number"==typeof r&&(o.current.style.height="".concat(r,"px"),o.current.style.transition="height ".concat(p.enter,"ms ").concat(p.ease)),O(!1);var i=p.exit+(null!==(e=p.hold)&&void 0!==e?e:0);return A.current=window.setTimeout(function(){var t=S.current;S.current=null,null!=t&&(T(t),requestAnimationFrame(function(){var n,e,r,i,a=null!==(n=null!==(e=null===(r=(t===m.List?s:f).current)||void 0===r?void 0:r.offsetHeight)&&void 0!==e?e:null===(i=o.current)||void 0===i?void 0:i.offsetHeight)&&void 0!==n?n:0;O(!0),o.current&&(o.current.style.height="".concat(a,"px"),window.setTimeout(function(){o.current&&(o.current.style.height="")},p.enter))})),A.current=null},i),function(){A.current&&(window.clearTimeout(A.current),A.current=null)}}},[t.mode,x]);var E=c(function(){var n=h.root,e=h.pane,r=h.paneList,i=h.paneModule,o=h.autoHeight;return{root:[n,t.autoHeight?o:""],paneList:[e,r],paneModule:[e,i]}},[t.mode,t.autoHeight]);return r(y,{className:E.root.join(" "),children:i("div",{ref:o,className:h.content,children:[x===m.List&&r(v,{open:H,timeout:{enter:d.enter,exit:d.exit},mountDelay:p.mountDelay,anim:p,style:{transitionTimingFunction:d.ease,transitionDuration:"".concat(d.enter,"ms"),transitionDelay:"".concat(H?p.delayEnter:p.delayExit,"ms"),transformOrigin:p.transformOriginList},children:r("div",{ref:s,className:E.paneList.join(" "),"aria-hidden":x!==m.List,children:t.listNode})}),x===m.Module&&r(v,{open:H,timeout:{enter:d.enter,exit:d.exit},mountDelay:p.mountDelay,anim:p,style:{transitionTimingFunction:d.ease,transitionDuration:"".concat(d.enter,"ms"),transitionDelay:"".concat(H?p.delayEnter:p.delayExit,"ms"),transformOrigin:p.transformOriginModule},children:r("div",{ref:f,className:E.paneModule.join(" "),"aria-hidden":x!==m.Module,children:t.moduleNode})})]})})},h={root:"AnimationSwitch-root",content:"AnimationSwitch-content",autoHeight:"AnimationSwitch-auto-height",pane:"AnimationSwitch-pane",paneList:"AnimationSwitch-pane-list",paneModule:"AnimationSwitch-pane-module"},p=function(t,n){return"".concat((null==n?void 0:n.prefix)||"",".").concat(h[t]).concat((null==n?void 0:n.suffix)||"")},y=o("div")(function(n){return n.theme,t(t(t({},p("root",{prefix:"&"}),{width:"100%"}),p("content"),{position:"relative",width:"100%"}),"&:not(".concat(p("autoHeight"),")"),t(t({height:"100%"},p("content"),{height:"100%"}),p("pane"),{height:"100%",display:"flex"}))}),v=function(t){var r,i,o=t.open,c=t.timeout,m=t.mountDelay,f=t.style,h=t.anim,p=t.children,y=null!=h?h:d,v="number"==typeof c?c:null!==(r=null==c?void 0:c.enter)&&void 0!==r?r:y.enter,w="number"==typeof c?c:null!==(i=null==c?void 0:c.exit)&&void 0!==i?i:y.exit,g=null!=m?m:y.mountDelay,x=u(o),T=e(x,2),D=T[0],L=T[1],H=u(o),O=e(H,2),S=O[0],A=O[1],E=a(null),M=a(null);if(l(function(){if(o)return M.current&&(window.clearTimeout(M.current),M.current=null),L(!0),void(g>0?(E.current&&window.clearTimeout(E.current),E.current=window.setTimeout(function(){A(!0),E.current=null},g)):A(!0));A(!1),E.current&&(window.clearTimeout(E.current),E.current=null),M.current&&window.clearTimeout(M.current),M.current=window.setTimeout(function(){L(!1),M.current=null},w)},[o,g,v,w]),l(function(){return function(){E.current&&window.clearTimeout(E.current),M.current&&window.clearTimeout(M.current)}},[]),!D)return null;var b={transitionProperty:"opacity, transform",transitionTimingFunction:y.ease,transitionDuration:"".concat(S?v:w,"ms"),transitionDelay:"".concat(S?y.delayEnter:y.delayExit,"ms"),transformOrigin:(null==f?void 0:f.transformOrigin)||y.transformOriginList},j={opacity:0,transform:"translateY(".concat(y.translateY,"px) scaleX(").concat(y.horizontalScale,")")},N=n(n(n({},b),S?{opacity:1,transform:"translateY(0) scaleX(1)"}:j),f);return s(p,{style:N})};export{y as AnimationSwitchStyled,h as animationSwitchClasses,f as default};
2
2
  //# sourceMappingURL=animation-switch.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"animation-switch.js","sources":["../../../src/data-view/animation-switch.tsx"],"sourcesContent":["import { styled } from '@mui/material'\r\nimport { useMemo, useRef, useState, useEffect, cloneElement } from 'react'\r\nimport type { FC, ReactNode, ReactElement, CSSProperties } from 'react'\r\nimport { EViewMode } from './view-mode.types'\r\n\r\n// Animation defaults and configuration for the view-mode switch.\r\n// These values can be tuned here or overridden via the `animConfig` prop.\r\nconst DEFAULT_ANIM = {\r\n enter: 300,\r\n exit: 180,\r\n ease: 'cubic-bezier(0.25, 0.1, 0.25, 1)',\r\n delayEnter: 40,\r\n delayExit: 0,\r\n transformOriginList: 'top center',\r\n transformOriginModule: 'top center',\r\n // how far to translate vertically when hiding (px)\r\n translateY: 10,\r\n // horizontal shrink factor (1 = no shrink, 0.95 = 95% width)\r\n horizontalScale: 0.98,\r\n // how long to wait (ms) after mounting children before starting enter animation\r\n mountDelay: 50,\r\n // extra hold time (ms) after exit completes before shrinking height\r\n hold: 100\r\n}\r\n\r\ninterface IProps {\r\n mode: EViewMode\r\n moduleNode: ReactNode\r\n listNode: ReactNode\r\n autoHeight?: boolean\r\n animConfig?: Partial<typeof DEFAULT_ANIM>\r\n}\r\n\r\nconst AnimationSwitch: FC<IProps> = (props) => {\r\n // refs to measure heights\r\n const wrapperRef = useRef<HTMLDivElement | null>(null)\r\n const listRef = useRef<HTMLDivElement | null>(null)\r\n const moduleRef = useRef<HTMLDivElement | null>(null)\r\n // animation config merged from defaults + props\r\n const anim = { ...DEFAULT_ANIM, ...(props.animConfig || {}) }\r\n\r\n // mountedMode: which pane is currently mounted (rendered). We sequence\r\n // transitions by hiding the currently mounted pane first, then swapping\r\n // to the requested mode after the exit animation finishes.\r\n const [mountedMode, setMountedMode] = useState<EViewMode>(props.mode)\r\n const [mountedOpen, setMountedOpen] = useState<boolean>(true)\r\n const pendingModeRef = useRef<EViewMode | null>(null)\r\n const exitTimerRef = useRef<number | null>(null)\r\n\r\n useEffect(() => {\r\n // if prop didn't change, nothing to do\r\n if (props.mode === mountedMode) return\r\n\r\n // if a swap is already pending, replace it\r\n if (exitTimerRef.current) {\r\n window.clearTimeout(exitTimerRef.current)\r\n exitTimerRef.current = null\r\n }\r\n\r\n // request a swap: hide the currently mounted pane first\r\n pendingModeRef.current = props.mode\r\n\r\n // lock the current wrapper height so it doesn't shrink immediately\r\n const currentH = wrapperRef.current?.offsetHeight\r\n if (wrapperRef.current && typeof currentH === 'number') {\r\n wrapperRef.current.style.height = `${currentH}px`\r\n wrapperRef.current.style.transition = `height ${anim.enter}ms ${anim.ease}`\r\n }\r\n\r\n setMountedOpen(false)\r\n\r\n // after exit duration + optional hold, swap mounted pane and show it\r\n const exitDur = anim.exit\r\n const totalDelay = exitDur + (anim.hold ?? 0)\r\n exitTimerRef.current = window.setTimeout(() => {\r\n const next = pendingModeRef.current\r\n pendingModeRef.current = null\r\n if (next != null) {\r\n // mount the next pane\r\n setMountedMode(next)\r\n\r\n // wait a frame for DOM to mount the new content, measure and animate height\r\n requestAnimationFrame(() => {\r\n const targetRef = next === EViewMode.List ? listRef : moduleRef\r\n const newH = targetRef.current?.offsetHeight ?? wrapperRef.current?.offsetHeight ?? 0\r\n\r\n // start enter animation for the new pane\r\n setMountedOpen(true)\r\n\r\n // animate wrapper height from previous to new\r\n if (wrapperRef.current) {\r\n // ensure we set a numeric height first (we set currentH earlier)\r\n wrapperRef.current.style.height = `${newH}px`\r\n // after the transition finishes, reset to auto\r\n window.setTimeout(() => {\r\n if (wrapperRef.current) wrapperRef.current.style.height = ''\r\n }, anim.enter)\r\n }\r\n })\r\n }\r\n exitTimerRef.current = null\r\n }, totalDelay)\r\n\r\n return () => {\r\n if (exitTimerRef.current) {\r\n window.clearTimeout(exitTimerRef.current)\r\n exitTimerRef.current = null\r\n }\r\n }\r\n }, [props.mode, mountedMode])\r\n\r\n const classes = useMemo(() => {\r\n const { root, pane, paneList, paneModule, autoHeight } = animationSwitchClasses\r\n const rootClasses = [root, props.autoHeight ? autoHeight : '']\r\n const paneListClasses = [pane, paneList]\r\n const paneModuleClasses = [pane, paneModule]\r\n return { root: rootClasses, paneList: paneListClasses, paneModule: paneModuleClasses }\r\n }, [props.mode, props.autoHeight])\r\n\r\n return (\r\n <AnimationSwitchStyled className={classes.root.join(' ')}>\r\n <div ref={wrapperRef} className={animationSwitchClasses.content}>\r\n {mountedMode === EViewMode.List && (\r\n <CombinedTransition\r\n open={mountedOpen}\r\n timeout={{ enter: DEFAULT_ANIM.enter, exit: DEFAULT_ANIM.exit }}\r\n mountDelay={anim.mountDelay}\r\n anim={anim}\r\n style={{\r\n transitionTimingFunction: DEFAULT_ANIM.ease,\r\n transitionDuration: `${DEFAULT_ANIM.enter}ms`,\r\n transitionDelay: `${mountedOpen ? anim.delayEnter : anim.delayExit}ms`,\r\n transformOrigin: anim.transformOriginList\r\n }}\r\n >\r\n <div ref={listRef} className={classes.paneList.join(' ')} aria-hidden={mountedMode !== EViewMode.List}>\r\n {props.listNode}\r\n </div>\r\n </CombinedTransition>\r\n )}\r\n\r\n {mountedMode === EViewMode.Module && (\r\n <CombinedTransition\r\n open={mountedOpen}\r\n timeout={{ enter: DEFAULT_ANIM.enter, exit: DEFAULT_ANIM.exit }}\r\n mountDelay={anim.mountDelay}\r\n anim={anim}\r\n style={{\r\n transitionTimingFunction: DEFAULT_ANIM.ease,\r\n transitionDuration: `${DEFAULT_ANIM.enter}ms`,\r\n transitionDelay: `${mountedOpen ? anim.delayEnter : anim.delayExit}ms`,\r\n transformOrigin: anim.transformOriginModule\r\n }}\r\n >\r\n <div ref={moduleRef} className={classes.paneModule.join(' ')} aria-hidden={mountedMode !== EViewMode.Module}>\r\n {props.moduleNode}\r\n </div>\r\n </CombinedTransition>\r\n )}\r\n </div>\r\n </AnimationSwitchStyled>\r\n )\r\n}\r\nexport default AnimationSwitch\r\n\r\nexport const animationSwitchClasses = {\r\n root: 'AnimationSwitch-root',\r\n content: 'AnimationSwitch-content',\r\n autoHeight: 'AnimationSwitch-auto-height',\r\n pane: 'AnimationSwitch-pane',\r\n paneList: 'AnimationSwitch-pane-list',\r\n paneModule: 'AnimationSwitch-pane-module'\r\n}\r\n\r\nconst getClasses = (key: keyof typeof animationSwitchClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${animationSwitchClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nexport const AnimationSwitchStyled = styled('div')(({ theme }) => ({\r\n [getClasses('root', { prefix: '&' })]: { width: '100%' },\r\n [getClasses('content')]: {\r\n position: 'relative',\r\n width: '100%'\r\n },\r\n // autoHeight mode\r\n // [getClasses('autoHeight', { prefix: '&' })]: { overflow: 'clip' },\r\n [`&:not(${getClasses('autoHeight')})`]: {\r\n height: '100%',\r\n [getClasses('content')]: { height: '100%' },\r\n [getClasses('pane')]: { height: '100%', display: 'flex' }\r\n }\r\n}))\r\n\r\n// Custom Transition-like component that mounts children immediately\r\n// then waits `mountDelay` before starting the enter animation. On close,\r\n// it runs the exit animation and then unmounts after exit duration.\r\nconst CombinedTransition: FC<{\r\n open: boolean\r\n timeout?: number | { enter?: number; exit?: number }\r\n mountDelay?: number\r\n style?: CSSProperties\r\n anim?: typeof DEFAULT_ANIM\r\n children: ReactElement\r\n}> = ({ open, timeout, mountDelay, style, anim, children }) => {\r\n const cfg = anim ?? DEFAULT_ANIM\r\n const enterDur = typeof timeout === 'number' ? timeout : timeout?.enter ?? cfg.enter\r\n const exitDur = typeof timeout === 'number' ? timeout : timeout?.exit ?? cfg.exit\r\n const delayMount = mountDelay ?? cfg.mountDelay\r\n\r\n const [mounted, setMounted] = useState(open)\r\n const [showing, setShowing] = useState(open)\r\n const mountTimer = useRef<number | null>(null)\r\n const unmountTimer = useRef<number | null>(null)\r\n\r\n useEffect(() => {\r\n // open -> mount immediately, then wait mountDelay before starting enter\r\n if (open) {\r\n if (unmountTimer.current) {\r\n window.clearTimeout(unmountTimer.current)\r\n unmountTimer.current = null\r\n }\r\n setMounted(true)\r\n // delay the start of the enter animation so inner children can render\r\n if (delayMount > 0) {\r\n if (mountTimer.current) window.clearTimeout(mountTimer.current)\r\n mountTimer.current = window.setTimeout(() => {\r\n setShowing(true)\r\n mountTimer.current = null\r\n }, delayMount)\r\n } else {\r\n setShowing(true)\r\n }\r\n return\r\n }\r\n\r\n // close -> start exit immediately, then unmount after exitDur\r\n setShowing(false)\r\n if (mountTimer.current) {\r\n window.clearTimeout(mountTimer.current)\r\n mountTimer.current = null\r\n }\r\n if (unmountTimer.current) window.clearTimeout(unmountTimer.current)\r\n unmountTimer.current = window.setTimeout(() => {\r\n setMounted(false)\r\n unmountTimer.current = null\r\n }, exitDur)\r\n return\r\n }, [open, delayMount, enterDur, exitDur])\r\n\r\n useEffect(() => {\r\n return () => {\r\n if (mountTimer.current) window.clearTimeout(mountTimer.current)\r\n if (unmountTimer.current) window.clearTimeout(unmountTimer.current)\r\n }\r\n }, [])\r\n\r\n if (!mounted) return null\r\n\r\n const baseStyle: CSSProperties = {\r\n transitionProperty: 'opacity, transform',\r\n transitionTimingFunction: cfg.ease,\r\n transitionDuration: `${showing ? enterDur : exitDur}ms`,\r\n transitionDelay: `${showing ? cfg.delayEnter : cfg.delayExit}ms`,\r\n transformOrigin: style?.transformOrigin || cfg.transformOriginList\r\n }\r\n\r\n const visibleStyle: CSSProperties = { opacity: 1, transform: `translateY(0) scaleX(1)` }\r\n const hiddenStyle: CSSProperties = { opacity: 0, transform: `translateY(${cfg.translateY}px) scaleX(${cfg.horizontalScale})` }\r\n\r\n const styleObj: CSSProperties = { ...baseStyle, ...(showing ? visibleStyle : hiddenStyle), ...style }\r\n\r\n return cloneElement(children, { style: styleObj })\r\n}\r\n"],"names":["DEFAULT_ANIM","enter","exit","ease","delayEnter","delayExit","transformOriginList","transformOriginModule","translateY","horizontalScale","mountDelay","hold","AnimationSwitch","props","wrapperRef","useRef","listRef","moduleRef","anim","_objectSpread","animConfig","_useState","useState","mode","_useState2","_slicedToArray","mountedMode","setMountedMode","_useState3","_useState4","mountedOpen","setMountedOpen","pendingModeRef","exitTimerRef","useEffect","_wrapperRef$current","_anim$hold","current","window","clearTimeout","currentH","offsetHeight","style","height","concat","transition","totalDelay","setTimeout","next","requestAnimationFrame","_ref","_targetRef$current$of","_targetRef$current","_wrapperRef$current2","newH","EViewMode","List","classes","useMemo","root","animationSwitchClasses","pane","paneList","paneModule","autoHeight","_jsx","AnimationSwitchStyled","className","join","children","_jsxs","ref","content","CombinedTransition","open","timeout","transitionTimingFunction","transitionDuration","transitionDelay","transformOrigin","listNode","Module","moduleNode","getClasses","key","options","prefix","suffix","styled","_ref2","theme","_defineProperty","width","position","display","_ref4","_timeout$enter","_timeout$exit","cfg","enterDur","exitDur","delayMount","_useState5","_useState6","mounted","setMounted","_useState7","_useState8","showing","setShowing","mountTimer","unmountTimer","baseStyle","transitionProperty","hiddenStyle","opacity","transform","styleObj","cloneElement"],"mappings":"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"}
1
+ {"version":3,"file":"animation-switch.js","sources":["../../../src/data-view/animation-switch.tsx"],"sourcesContent":["import { styled } from '@mui/material'\r\nimport { useMemo, useRef, useState, useEffect, cloneElement } from 'react'\r\nimport type { FC, ReactNode, ReactElement, CSSProperties } from 'react'\r\nimport { EViewMode } from './view-mode.types'\r\n\r\n// Animation defaults and configuration for the view-mode switch.\r\n// These values can be tuned here or overridden via the `animConfig` prop.\r\nconst DEFAULT_ANIM = {\r\n enter: 300,\r\n exit: 180,\r\n ease: 'cubic-bezier(0.25, 0.1, 0.25, 1)',\r\n delayEnter: 40,\r\n delayExit: 0,\r\n transformOriginList: 'top center',\r\n transformOriginModule: 'top center',\r\n // how far to translate vertically when hiding (px)\r\n translateY: 10,\r\n // horizontal shrink factor (1 = no shrink, 0.95 = 95% width)\r\n horizontalScale: 0.98,\r\n // how long to wait (ms) after mounting children before starting enter animation\r\n mountDelay: 50,\r\n // extra hold time (ms) after exit completes before shrinking height\r\n hold: 100\r\n}\r\n\r\ninterface IProps {\r\n mode: EViewMode\r\n moduleNode: ReactNode\r\n listNode: ReactNode\r\n autoHeight?: boolean\r\n animConfig?: Partial<typeof DEFAULT_ANIM>\r\n}\r\n\r\nconst AnimationSwitch: FC<IProps> = (props) => {\r\n // refs to measure heights\r\n const wrapperRef = useRef<HTMLDivElement | null>(null)\r\n const listRef = useRef<HTMLDivElement | null>(null)\r\n const moduleRef = useRef<HTMLDivElement | null>(null)\r\n // animation config merged from defaults + props\r\n const anim = { ...DEFAULT_ANIM, ...(props.animConfig || {}) }\r\n\r\n // mountedMode: which pane is currently mounted (rendered). We sequence\r\n // transitions by hiding the currently mounted pane first, then swapping\r\n // to the requested mode after the exit animation finishes.\r\n const [mountedMode, setMountedMode] = useState<EViewMode>(props.mode)\r\n const [mountedOpen, setMountedOpen] = useState<boolean>(true)\r\n const pendingModeRef = useRef<EViewMode | null>(null)\r\n const exitTimerRef = useRef<number | null>(null)\r\n\r\n useEffect(() => {\r\n // if prop didn't change, nothing to do\r\n if (props.mode === mountedMode) return\r\n\r\n // if a swap is already pending, replace it\r\n if (exitTimerRef.current) {\r\n window.clearTimeout(exitTimerRef.current)\r\n exitTimerRef.current = null\r\n }\r\n\r\n // request a swap: hide the currently mounted pane first\r\n pendingModeRef.current = props.mode\r\n\r\n // lock the current wrapper height so it doesn't shrink immediately\r\n const currentH = wrapperRef.current?.offsetHeight\r\n if (wrapperRef.current && typeof currentH === 'number') {\r\n wrapperRef.current.style.height = `${currentH}px`\r\n wrapperRef.current.style.transition = `height ${anim.enter}ms ${anim.ease}`\r\n }\r\n\r\n setMountedOpen(false)\r\n\r\n // after exit duration + optional hold, swap mounted pane and show it\r\n const exitDur = anim.exit\r\n const totalDelay = exitDur + (anim.hold ?? 0)\r\n exitTimerRef.current = window.setTimeout(() => {\r\n const next = pendingModeRef.current\r\n pendingModeRef.current = null\r\n if (next != null) {\r\n // mount the next pane\r\n setMountedMode(next)\r\n\r\n // wait a frame for DOM to mount the new content, measure and animate height\r\n requestAnimationFrame(() => {\r\n const targetRef = next === EViewMode.List ? listRef : moduleRef\r\n const newH = targetRef.current?.offsetHeight ?? wrapperRef.current?.offsetHeight ?? 0\r\n\r\n // start enter animation for the new pane\r\n setMountedOpen(true)\r\n\r\n // animate wrapper height from previous to new\r\n if (wrapperRef.current) {\r\n // ensure we set a numeric height first (we set currentH earlier)\r\n wrapperRef.current.style.height = `${newH}px`\r\n // after the transition finishes, reset to auto\r\n window.setTimeout(() => {\r\n if (wrapperRef.current) wrapperRef.current.style.height = ''\r\n }, anim.enter)\r\n }\r\n })\r\n }\r\n exitTimerRef.current = null\r\n }, totalDelay)\r\n\r\n return () => {\r\n if (exitTimerRef.current) {\r\n window.clearTimeout(exitTimerRef.current)\r\n exitTimerRef.current = null\r\n }\r\n }\r\n }, [props.mode, mountedMode])\r\n\r\n const classes = useMemo(() => {\r\n const { root, pane, paneList, paneModule, autoHeight } = animationSwitchClasses\r\n const rootClasses = [root, props.autoHeight ? autoHeight : '']\r\n const paneListClasses = [pane, paneList]\r\n const paneModuleClasses = [pane, paneModule]\r\n return { root: rootClasses, paneList: paneListClasses, paneModule: paneModuleClasses }\r\n }, [props.mode, props.autoHeight])\r\n\r\n return (\r\n <AnimationSwitchStyled className={classes.root.join(' ')}>\r\n <div ref={wrapperRef} className={animationSwitchClasses.content}>\r\n {mountedMode === EViewMode.List && (\r\n <CombinedTransition\r\n open={mountedOpen}\r\n timeout={{ enter: DEFAULT_ANIM.enter, exit: DEFAULT_ANIM.exit }}\r\n mountDelay={anim.mountDelay}\r\n anim={anim}\r\n style={{\r\n transitionTimingFunction: DEFAULT_ANIM.ease,\r\n transitionDuration: `${DEFAULT_ANIM.enter}ms`,\r\n transitionDelay: `${mountedOpen ? anim.delayEnter : anim.delayExit}ms`,\r\n transformOrigin: anim.transformOriginList\r\n }}\r\n >\r\n <div ref={listRef} className={classes.paneList.join(' ')} aria-hidden={mountedMode !== EViewMode.List}>\r\n {props.listNode}\r\n </div>\r\n </CombinedTransition>\r\n )}\r\n\r\n {mountedMode === EViewMode.Module && (\r\n <CombinedTransition\r\n open={mountedOpen}\r\n timeout={{ enter: DEFAULT_ANIM.enter, exit: DEFAULT_ANIM.exit }}\r\n mountDelay={anim.mountDelay}\r\n anim={anim}\r\n style={{\r\n transitionTimingFunction: DEFAULT_ANIM.ease,\r\n transitionDuration: `${DEFAULT_ANIM.enter}ms`,\r\n transitionDelay: `${mountedOpen ? anim.delayEnter : anim.delayExit}ms`,\r\n transformOrigin: anim.transformOriginModule\r\n }}\r\n >\r\n <div ref={moduleRef} className={classes.paneModule.join(' ')} aria-hidden={mountedMode !== EViewMode.Module}>\r\n {props.moduleNode}\r\n </div>\r\n </CombinedTransition>\r\n )}\r\n </div>\r\n </AnimationSwitchStyled>\r\n )\r\n}\r\nexport default AnimationSwitch\r\n\r\nexport const animationSwitchClasses = {\r\n root: 'AnimationSwitch-root',\r\n content: 'AnimationSwitch-content',\r\n autoHeight: 'AnimationSwitch-auto-height',\r\n pane: 'AnimationSwitch-pane',\r\n paneList: 'AnimationSwitch-pane-list',\r\n paneModule: 'AnimationSwitch-pane-module'\r\n}\r\n\r\nconst getClasses = (key: keyof typeof animationSwitchClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${animationSwitchClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nexport const AnimationSwitchStyled = styled('div')(({ theme }) => ({\r\n [getClasses('root', { prefix: '&' })]: { width: '100%' },\r\n [getClasses('content')]: {\r\n position: 'relative',\r\n width: '100%'\r\n },\r\n // autoHeight mode\r\n // [getClasses('autoHeight', { prefix: '&' })]: { overflow: 'clip' },\r\n [`&:not(${getClasses('autoHeight')})`]: {\r\n height: '100%',\r\n [getClasses('content')]: { height: '100%' },\r\n [getClasses('pane')]: { height: '100%', display: 'flex' }\r\n }\r\n}))\r\n\r\n// Custom Transition-like component that mounts children immediately\r\n// then waits `mountDelay` before starting the enter animation. On close,\r\n// it runs the exit animation and then unmounts after exit duration.\r\nconst CombinedTransition: FC<{\r\n open: boolean\r\n timeout?: number | { enter?: number; exit?: number }\r\n mountDelay?: number\r\n style?: CSSProperties\r\n anim?: typeof DEFAULT_ANIM\r\n children: ReactElement\r\n}> = ({ open, timeout, mountDelay, style, anim, children }) => {\r\n const cfg = anim ?? DEFAULT_ANIM\r\n const enterDur = typeof timeout === 'number' ? timeout : timeout?.enter ?? cfg.enter\r\n const exitDur = typeof timeout === 'number' ? timeout : timeout?.exit ?? cfg.exit\r\n const delayMount = mountDelay ?? cfg.mountDelay\r\n\r\n const [mounted, setMounted] = useState(open)\r\n const [showing, setShowing] = useState(open)\r\n const mountTimer = useRef<number | null>(null)\r\n const unmountTimer = useRef<number | null>(null)\r\n\r\n useEffect(() => {\r\n // open -> mount immediately, then wait mountDelay before starting enter\r\n if (open) {\r\n if (unmountTimer.current) {\r\n window.clearTimeout(unmountTimer.current)\r\n unmountTimer.current = null\r\n }\r\n setMounted(true)\r\n // delay the start of the enter animation so inner children can render\r\n if (delayMount > 0) {\r\n if (mountTimer.current) window.clearTimeout(mountTimer.current)\r\n mountTimer.current = window.setTimeout(() => {\r\n setShowing(true)\r\n mountTimer.current = null\r\n }, delayMount)\r\n } else {\r\n setShowing(true)\r\n }\r\n return\r\n }\r\n\r\n // close -> start exit immediately, then unmount after exitDur\r\n setShowing(false)\r\n if (mountTimer.current) {\r\n window.clearTimeout(mountTimer.current)\r\n mountTimer.current = null\r\n }\r\n if (unmountTimer.current) window.clearTimeout(unmountTimer.current)\r\n unmountTimer.current = window.setTimeout(() => {\r\n setMounted(false)\r\n unmountTimer.current = null\r\n }, exitDur)\r\n return\r\n }, [open, delayMount, enterDur, exitDur])\r\n\r\n useEffect(() => {\r\n return () => {\r\n if (mountTimer.current) window.clearTimeout(mountTimer.current)\r\n if (unmountTimer.current) window.clearTimeout(unmountTimer.current)\r\n }\r\n }, [])\r\n\r\n if (!mounted) return null\r\n\r\n const baseStyle: CSSProperties = {\r\n transitionProperty: 'opacity, transform',\r\n transitionTimingFunction: cfg.ease,\r\n transitionDuration: `${showing ? enterDur : exitDur}ms`,\r\n transitionDelay: `${showing ? cfg.delayEnter : cfg.delayExit}ms`,\r\n transformOrigin: style?.transformOrigin || cfg.transformOriginList\r\n }\r\n\r\n const visibleStyle: CSSProperties = { opacity: 1, transform: `translateY(0) scaleX(1)` }\r\n const hiddenStyle: CSSProperties = { opacity: 0, transform: `translateY(${cfg.translateY}px) scaleX(${cfg.horizontalScale})` }\r\n\r\n const styleObj: CSSProperties = { ...baseStyle, ...(showing ? visibleStyle : hiddenStyle), ...style }\r\n\r\n return cloneElement(children, { style: styleObj })\r\n}\r\n"],"names":["DEFAULT_ANIM","enter","exit","ease","delayEnter","delayExit","transformOriginList","transformOriginModule","translateY","horizontalScale","mountDelay","hold","AnimationSwitch","props","wrapperRef","useRef","listRef","moduleRef","anim","_objectSpread","animConfig","_useState","useState","mode","_useState2","_slicedToArray","mountedMode","setMountedMode","_useState3","_useState4","mountedOpen","setMountedOpen","pendingModeRef","exitTimerRef","useEffect","_wrapperRef$current","_anim$hold","current","window","clearTimeout","currentH","offsetHeight","style","height","concat","transition","totalDelay","setTimeout","next","requestAnimationFrame","_ref","_targetRef$current$of","_targetRef$current","_wrapperRef$current2","newH","EViewMode","List","classes","useMemo","root","animationSwitchClasses","pane","paneList","paneModule","autoHeight","_jsx","AnimationSwitchStyled","className","join","children","_jsxs","ref","content","CombinedTransition","open","timeout","transitionTimingFunction","transitionDuration","transitionDelay","transformOrigin","listNode","Module","moduleNode","getClasses","key","options","prefix","suffix","styled","_ref2","theme","_defineProperty","width","position","display","_ref4","_timeout$enter","_timeout$exit","cfg","enterDur","exitDur","delayMount","_useState5","_useState6","mounted","setMounted","_useState7","_useState8","showing","setShowing","mountTimer","unmountTimer","baseStyle","transitionProperty","hiddenStyle","opacity","transform","styleObj","cloneElement"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{createClass as e,classCallCheck as i,defineProperty as t,createForOfIteratorHelper as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{mapDateLogic as l}from"./helpers.js";import{createRequestBuilder as n}from"../http-service/graphql/request-param.js";import{getKeyConverter as o}from"../http-service/graphql/key-converter.js";var a=e((function e(a){var u=this;i(this,e),t(this,"fromFilter",(function(e){return u.filterStateStore=e,u})),t(this,"applySingleFilterCondition",(function(e,i){var t,r,n,o,a=null!==(t=null===(r=i.value)||void 0===r?void 0:r.toString())&&void 0!==t?t:"",u=null!==(n=i.keyConvert.deep)&&void 0!==n?n:i.keyConvert.field,v=i.keyConvert.custom;if(v)e.filterCustom(v(a),i.option);else if(u)if("date"===(null===(o=i.filter)||void 0===o?void 0:o.type)&&i.filter.dateLogic){var d=l[i.filter.dateLogic];e.filterCustom("".concat(u.toString()).concat(d,'"').concat(a,'"'),i.option)}else e.filterContains(u,a,i.option)})),t(this,"applyMulFilterCondition",(function(e,i,t){if(0!==i.length)if(1===i.length){var l=i[0];t&&(l.option=t),u.applySingleFilterCondition(e,l)}else e.scope((function(e){var t,l=r(i);try{for(l.s();!(t=l.n()).done;){var n=t.value;u.applySingleFilterCondition(e,n)}}catch(e){l.e(e)}finally{l.f()}return e}),t)})),t(this,"handleFilter",(function(e){var i,t=null===(i=u.filterStateStore)||void 0===i?void 0:i.filter;if(t){var l=Object.keys(t).filter(Boolean),n=l.reduce((function(e,i){var l,n,a=o(i,u.keyConverter),v=null!==(l=t[i])&&void 0!==l?l:[],d=r(a);try{for(d.s();!(n=d.n()).done;){var f,c=n.value,s=r(v);try{for(s.s();!(f=s.n()).done;){var p,h=f.value;if(h.value){var y=null!==(p=e[i])&&void 0!==p?p:[];y.push({value:h.value,keyConvert:c,filter:h,option:{logic:"Or"}}),e[i]=y}}}catch(e){s.e(e)}finally{s.f()}}}catch(e){d.e(e)}finally{d.f()}return e}),{});e.scope((function(i){for(var t in n){var r=n[t];r&&0!==r.length&&u.applyMulFilterCondition(1===l.length?e:i,r,{logic:"And"})}return i}),{logic:"And"})}})),t(this,"handleQuickSearch",(function(e){var i,t=null===(i=u.filterStateStore)||void 0===i?void 0:i.quickSearch;if(t&&u.quickSearchFields&&0!==u.quickSearchFields.length){var l=(Array.isArray(t)?t:[t]).map((function(e){return null==e?void 0:e.toString().trim()})).filter(Boolean);if(0!==l.length){var n=u.quickSearchFields.reduce((function(e,i){var t,n=o(i,u.keyConverter),a=r(n);try{for(a.s();!(t=a.n()).done;){var v,d=t.value,f=r(l);try{for(f.s();!(v=f.n()).done;){var c=v.value;c&&e.push({value:c,keyConvert:d})}}catch(e){f.e(e)}finally{f.f()}}}catch(e){a.e(e)}finally{a.f()}return e}),[]);n.length>0&&e.scope((function(e){var i,t=r(n);try{for(t.s();!(i=t.n()).done;){var l=i.value;u.applySingleFilterCondition(e,l)}}catch(e){t.e(e)}finally{t.f()}return e}))}}})),t(this,"handlePagination",(function(e){var i,t,r,l,n,o,a=null!==(i=null===(t=u.filterStateStore)||void 0===t?void 0:t.pagination)&&void 0!==i?i:{},v=a.page,d=a.pageSize,f=null!==(r=null!=v?v:null===(l=u.defaultFilter)||void 0===l||null===(l=l.pagination)||void 0===l?void 0:l.page)&&void 0!==r?r:0,c=null!==(n=null!=d?d:null===(o=u.defaultFilter)||void 0===o||null===(o=o.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==n?n:10;e.take(c).skip(f*c)})),t(this,"handleSort",(function(e){var i,t,r,l=null!==(i=null===(t=u.filterStateStore)||void 0===t?void 0:t.sort)&&void 0!==i?i:null===(r=u.defaultFilter)||void 0===r?void 0:r.sort;if(l){var n=o(l.field,u.keyConverter);if(n.length>0){var a,v=n[0],d=null!==(a=v.deep)&&void 0!==a?a:v.field;d&&e.sort(d,{direction:"asc"===l.direction?"ASC":"DESC"})}}})),t(this,"prebuild",(function(e){return u.prebuildFunc=e,u})),t(this,"build",(function(){var e=n({ignoreEmpty:!0});return u.handleSort(e),u.handlePagination(e),u.handleQuickSearch(e),u.handleFilter(e),u.prebuildFunc&&u.prebuildFunc(e),e.build()})),this.keyConverter=a.keyConverter,this.quickSearchFields=a.quickSearchFields,this.defaultFilter=a.defaultFilter})),u=function(e){return new a(e)};export{u as createConvertFilterToGraphQL,a as default};
1
+ import{createClass as e,classCallCheck as i,defineProperty as t,createForOfIteratorHelper as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{mapDateLogic as l}from"./helpers.js";import{createRequestBuilder as n}from"../http-service/graphql/request-param.js";import{getKeyConverter as o}from"../http-service/graphql/key-converter.js";var a=e(function e(a){var u=this;i(this,e),t(this,"fromFilter",function(e){return u.filterStateStore=e,u}),t(this,"applySingleFilterCondition",function(e,i){var t,r,n,o,a=null!==(t=null===(r=i.value)||void 0===r?void 0:r.toString())&&void 0!==t?t:"",u=null!==(n=i.keyConvert.deep)&&void 0!==n?n:i.keyConvert.field,v=i.keyConvert.custom;if(v)e.filterCustom(v(a),i.option);else if(u)if("date"===(null===(o=i.filter)||void 0===o?void 0:o.type)&&i.filter.dateLogic){var d=l[i.filter.dateLogic];e.filterCustom("".concat(u.toString()).concat(d,'"').concat(a,'"'),i.option)}else e.filterContains(u,a,i.option)}),t(this,"applyMulFilterCondition",function(e,i,t){if(0!==i.length)if(1===i.length){var l=i[0];t&&(l.option=t),u.applySingleFilterCondition(e,l)}else e.scope(function(e){var t,l=r(i);try{for(l.s();!(t=l.n()).done;){var n=t.value;u.applySingleFilterCondition(e,n)}}catch(e){l.e(e)}finally{l.f()}return e},t)}),t(this,"handleFilter",function(e){var i,t=null===(i=u.filterStateStore)||void 0===i?void 0:i.filter;if(t){var l=Object.keys(t).filter(Boolean),n=l.reduce(function(e,i){var l,n,a=o(i,u.keyConverter),v=null!==(l=t[i])&&void 0!==l?l:[],d=r(a);try{for(d.s();!(n=d.n()).done;){var f,c=n.value,s=r(v);try{for(s.s();!(f=s.n()).done;){var p,h=f.value;if(h.value){var y=null!==(p=e[i])&&void 0!==p?p:[];y.push({value:h.value,keyConvert:c,filter:h,option:{logic:"Or"}}),e[i]=y}}}catch(e){s.e(e)}finally{s.f()}}}catch(e){d.e(e)}finally{d.f()}return e},{});e.scope(function(i){for(var t in n){var r=n[t];r&&0!==r.length&&u.applyMulFilterCondition(1===l.length?e:i,r,{logic:"And"})}return i},{logic:"And"})}}),t(this,"handleQuickSearch",function(e){var i,t=null===(i=u.filterStateStore)||void 0===i?void 0:i.quickSearch;if(t&&u.quickSearchFields&&0!==u.quickSearchFields.length){var l=(Array.isArray(t)?t:[t]).map(function(e){return null==e?void 0:e.toString().trim()}).filter(Boolean);if(0!==l.length){var n=u.quickSearchFields.reduce(function(e,i){var t,n=o(i,u.keyConverter),a=r(n);try{for(a.s();!(t=a.n()).done;){var v,d=t.value,f=r(l);try{for(f.s();!(v=f.n()).done;){var c=v.value;c&&e.push({value:c,keyConvert:d})}}catch(e){f.e(e)}finally{f.f()}}}catch(e){a.e(e)}finally{a.f()}return e},[]);n.length>0&&e.scope(function(e){var i,t=r(n);try{for(t.s();!(i=t.n()).done;){var l=i.value;u.applySingleFilterCondition(e,l)}}catch(e){t.e(e)}finally{t.f()}return e})}}}),t(this,"handlePagination",function(e){var i,t,r,l,n,o,a=null!==(i=null===(t=u.filterStateStore)||void 0===t?void 0:t.pagination)&&void 0!==i?i:{},v=a.page,d=a.pageSize,f=null!==(r=null!=v?v:null===(l=u.defaultFilter)||void 0===l||null===(l=l.pagination)||void 0===l?void 0:l.page)&&void 0!==r?r:0,c=null!==(n=null!=d?d:null===(o=u.defaultFilter)||void 0===o||null===(o=o.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==n?n:10;e.take(c).skip(f*c)}),t(this,"handleSort",function(e){var i,t,r,l=null!==(i=null===(t=u.filterStateStore)||void 0===t?void 0:t.sort)&&void 0!==i?i:null===(r=u.defaultFilter)||void 0===r?void 0:r.sort;if(l){var n=o(l.field,u.keyConverter);if(n.length>0){var a,v=n[0],d=null!==(a=v.deep)&&void 0!==a?a:v.field;d&&e.sort(d,{direction:"asc"===l.direction?"ASC":"DESC"})}}}),t(this,"prebuild",function(e){return u.prebuildFunc=e,u}),t(this,"build",function(){var e=n({ignoreEmpty:!0});return u.handleSort(e),u.handlePagination(e),u.handleQuickSearch(e),u.handleFilter(e),u.prebuildFunc&&u.prebuildFunc(e),e.build()}),this.keyConverter=a.keyConverter,this.quickSearchFields=a.quickSearchFields,this.defaultFilter=a.defaultFilter}),u=function(e){return new a(e)};export{u as createConvertFilterToGraphQL,a as default};
2
2
  //# sourceMappingURL=convert-filter-to-graphql.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"convert-filter-to-graphql.js","sources":["../../../src/data-view/convert-filter-to-graphql.ts"],"sourcesContent":["import { mapDateLogic } from './helpers'\r\nimport { createRequestBuilder, IFilterOption, RequestParam } from '../http-service/graphql/request-param'\r\nimport { getKeyConverter, IKeyConverterDef, IKeyConverterModel } from '../http-service/graphql/key-converter'\r\nimport { IFilterItem, IFilterState } from './types'\r\n\r\nexport interface ISingleFilterCondition<G extends object> {\r\n value: any\r\n keyConvert: IKeyConverterDef<G>\r\n option?: Partial<IFilterOption>\r\n filter?: IFilterItem\r\n}\r\n\r\nexport interface IFilterToGraphQLParams<T, G extends object> {\r\n keyConverter: IKeyConverterModel<T, G>\r\n quickSearchFields?: (keyof T)[]\r\n defaultFilter?: IFilterState<T>\r\n}\r\n\r\nclass ConvertFilterToGraphQL<T, G extends object> {\r\n private keyConverter\r\n private quickSearchFields?: (keyof T)[]\r\n private defaultFilter?: IFilterState<T>\r\n\r\n constructor(params: IFilterToGraphQLParams<T, G>) {\r\n this.keyConverter = params.keyConverter\r\n this.quickSearchFields = params.quickSearchFields\r\n this.defaultFilter = params.defaultFilter\r\n }\r\n\r\n private filterStateStore?: IFilterState<T>\r\n fromFilter = (filterState: IFilterState<T>) => {\r\n this.filterStateStore = filterState\r\n return this\r\n }\r\n\r\n private applySingleFilterCondition = (rp: RequestParam<G>, params: ISingleFilterCondition<G>) => {\r\n const val = params.value?.toString() ?? ''\r\n const targetField = (params.keyConvert.deep ?? params.keyConvert.field) as keyof G\r\n const custom = params.keyConvert.custom\r\n if (custom) {\r\n rp.filterCustom(custom(val), params.option)\r\n return\r\n }\r\n if (!targetField) return\r\n if (params.filter?.type === 'date' && params.filter.dateLogic) {\r\n const logic = mapDateLogic[params.filter.dateLogic]\r\n rp.filterCustom(`${targetField.toString()}${logic}\"${val}\"`, params.option)\r\n return\r\n }\r\n rp.filterContains(targetField, val, params.option)\r\n }\r\n\r\n private applyMulFilterCondition = (rp: RequestParam<G>, items: ISingleFilterCondition<G>[], option?: Partial<IFilterOption>) => {\r\n if (items.length === 0) return\r\n else if (items.length === 1) {\r\n const i = items[0]\r\n if (option) i.option = option\r\n this.applySingleFilterCondition(rp, i)\r\n } else {\r\n rp.scope((q) => {\r\n for (const item of items) {\r\n this.applySingleFilterCondition(q, item)\r\n }\r\n return q\r\n }, option)\r\n }\r\n }\r\n\r\n private handleFilter = (rp: RequestParam<G>) => {\r\n const filter = this.filterStateStore?.filter\r\n if (!filter) return\r\n\r\n const keys = Object.keys(filter).filter(Boolean) as (keyof T)[]\r\n const list = keys.reduce<{ [key in keyof T]?: ISingleFilterCondition<G>[] }>((a, k) => {\r\n const keyConverteds = getKeyConverter(k, this.keyConverter)\r\n const items = filter[k] ?? []\r\n for (const keyConverted of keyConverteds) {\r\n for (const item of items) {\r\n if (!item.value) continue\r\n const list: ISingleFilterCondition<G>[] = a[k] ?? []\r\n list.push({ value: item.value, keyConvert: keyConverted, filter: item, option: { logic: 'Or' } })\r\n a[k] = list\r\n }\r\n }\r\n return a\r\n }, {})\r\n\r\n rp.scope(\r\n (q) => {\r\n for (const key in list) {\r\n const items = list[key]\r\n if (!items || items.length === 0) continue\r\n this.applyMulFilterCondition(keys.length === 1 ? rp : q, items, { logic: 'And' })\r\n }\r\n return q\r\n },\r\n { logic: 'And' }\r\n )\r\n }\r\n\r\n private handleQuickSearch = (rp: RequestParam<G>) => {\r\n const quickSearch = this.filterStateStore?.quickSearch\r\n if (!quickSearch || !this.quickSearchFields || this.quickSearchFields.length === 0) return\r\n\r\n // Convert quickSearch to array of strings\r\n const values = Array.isArray(quickSearch) ? quickSearch : [quickSearch]\r\n const trimmedValues = values.map((v) => v?.toString().trim()).filter(Boolean)\r\n\r\n if (trimmedValues.length === 0) return\r\n\r\n const list = this.quickSearchFields.reduce<ISingleFilterCondition<G>[]>((a, field) => {\r\n const keyConverteds = getKeyConverter(field, this.keyConverter)\r\n for (const keyConverted of keyConverteds) {\r\n for (const val of trimmedValues) {\r\n if (!val) continue\r\n a.push({ value: val, keyConvert: keyConverted })\r\n }\r\n }\r\n return a\r\n }, [])\r\n\r\n // Apply quick search with OR logic (scope)\r\n if (list.length > 0) {\r\n rp.scope((q) => {\r\n for (const item of list) {\r\n this.applySingleFilterCondition(q, item)\r\n }\r\n return q\r\n })\r\n }\r\n }\r\n\r\n private handlePagination = (rp: RequestParam<G>) => {\r\n const { page, pageSize } = this.filterStateStore?.pagination ?? {}\r\n const finalPage = page ?? this.defaultFilter?.pagination?.page ?? 0\r\n const finalPageSize = pageSize ?? this.defaultFilter?.pagination?.pageSize ?? 10\r\n rp.take(finalPageSize).skip(finalPage * finalPageSize)\r\n }\r\n\r\n private handleSort = (rp: RequestParam<G>) => {\r\n const sort = this.filterStateStore?.sort ?? this.defaultFilter?.sort\r\n if (!sort) return\r\n\r\n const keyConverteds = getKeyConverter(sort.field, this.keyConverter)\r\n if (keyConverteds.length > 0) {\r\n const keyConverted = keyConverteds[0] // Use first converter for sorting\r\n const targetField = (keyConverted.deep ?? keyConverted.field) as keyof G\r\n\r\n if (targetField) {\r\n rp.sort(targetField, { direction: sort.direction === 'asc' ? 'ASC' : 'DESC' })\r\n }\r\n }\r\n }\r\n\r\n private prebuildFunc?: (rp: RequestParam<G>) => RequestParam<G>\r\n prebuild = (func: (requestParam: RequestParam<G>) => RequestParam<G>) => {\r\n this.prebuildFunc = func\r\n return this\r\n }\r\n\r\n build = () => {\r\n const requestBuilder = createRequestBuilder<G>({ ignoreEmpty: true })\r\n this.handleSort(requestBuilder)\r\n this.handlePagination(requestBuilder)\r\n this.handleQuickSearch(requestBuilder)\r\n this.handleFilter(requestBuilder)\r\n if (this.prebuildFunc) this.prebuildFunc(requestBuilder)\r\n return requestBuilder.build()\r\n }\r\n}\r\nexport default ConvertFilterToGraphQL\r\n\r\nexport const createConvertFilterToGraphQL = <T, G extends object>(params: IFilterToGraphQLParams<T, G>) => {\r\n return new ConvertFilterToGraphQL<T, G>(params)\r\n}\r\n"],"names":["ConvertFilterToGraphQL","_createClass","params","_this","this","_classCallCheck","_defineProperty","filterState","filterStateStore","rp","_params$value$toStrin","_params$value","_params$keyConvert$de","_params$filter","val","value","toString","targetField","keyConvert","deep","field","custom","filterCustom","option","filter","type","dateLogic","logic","mapDateLogic","concat","filterContains","items","length","i","applySingleFilterCondition","scope","q","_step","_iterator","_createForOfIteratorHelper","s","n","done","item","err","e","f","_this$filterStateStor","keys","Object","Boolean","list","reduce","a","k","_filter$k","_step2","keyConverteds","getKeyConverter","keyConverter","_iterator2","_step3","keyConverted","_iterator3","_a$k","push","key","applyMulFilterCondition","_this$filterStateStor2","quickSearch","quickSearchFields","trimmedValues","Array","isArray","map","v","trim","_step4","_iterator4","_step5","_iterator5","_step6","_iterator6","_this$filterStateStor3","_this$filterStateStor4","_ref2","_this$defaultFilter","_ref3","_this$defaultFilter2","_ref","pagination","page","pageSize","finalPage","defaultFilter","finalPageSize","take","skip","_this$filterStateStor5","_this$filterStateStor6","_this$defaultFilter3","sort","_keyConverted$deep","direction","func","prebuildFunc","requestBuilder","createRequestBuilder","ignoreEmpty","handleSort","handlePagination","handleQuickSearch","handleFilter","build","createConvertFilterToGraphQL"],"mappings":"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"}
1
+ {"version":3,"file":"convert-filter-to-graphql.js","sources":["../../../src/data-view/convert-filter-to-graphql.ts"],"sourcesContent":["import { mapDateLogic } from './helpers'\r\nimport { createRequestBuilder, IFilterOption, RequestParam } from '../http-service/graphql/request-param'\r\nimport { getKeyConverter, IKeyConverterDef, IKeyConverterModel } from '../http-service/graphql/key-converter'\r\nimport { IFilterItem, IFilterState } from './types'\r\n\r\nexport interface ISingleFilterCondition<G extends object> {\r\n value: any\r\n keyConvert: IKeyConverterDef<G>\r\n option?: Partial<IFilterOption>\r\n filter?: IFilterItem\r\n}\r\n\r\nexport interface IFilterToGraphQLParams<T, G extends object> {\r\n keyConverter: IKeyConverterModel<T, G>\r\n quickSearchFields?: (keyof T)[]\r\n defaultFilter?: IFilterState<T>\r\n}\r\n\r\nclass ConvertFilterToGraphQL<T, G extends object> {\r\n private keyConverter\r\n private quickSearchFields?: (keyof T)[]\r\n private defaultFilter?: IFilterState<T>\r\n\r\n constructor(params: IFilterToGraphQLParams<T, G>) {\r\n this.keyConverter = params.keyConverter\r\n this.quickSearchFields = params.quickSearchFields\r\n this.defaultFilter = params.defaultFilter\r\n }\r\n\r\n private filterStateStore?: IFilterState<T>\r\n fromFilter = (filterState: IFilterState<T>) => {\r\n this.filterStateStore = filterState\r\n return this\r\n }\r\n\r\n private applySingleFilterCondition = (rp: RequestParam<G>, params: ISingleFilterCondition<G>) => {\r\n const val = params.value?.toString() ?? ''\r\n const targetField = (params.keyConvert.deep ?? params.keyConvert.field) as keyof G\r\n const custom = params.keyConvert.custom\r\n if (custom) {\r\n rp.filterCustom(custom(val), params.option)\r\n return\r\n }\r\n if (!targetField) return\r\n if (params.filter?.type === 'date' && params.filter.dateLogic) {\r\n const logic = mapDateLogic[params.filter.dateLogic]\r\n rp.filterCustom(`${targetField.toString()}${logic}\"${val}\"`, params.option)\r\n return\r\n }\r\n rp.filterContains(targetField, val, params.option)\r\n }\r\n\r\n private applyMulFilterCondition = (rp: RequestParam<G>, items: ISingleFilterCondition<G>[], option?: Partial<IFilterOption>) => {\r\n if (items.length === 0) return\r\n else if (items.length === 1) {\r\n const i = items[0]\r\n if (option) i.option = option\r\n this.applySingleFilterCondition(rp, i)\r\n } else {\r\n rp.scope((q) => {\r\n for (const item of items) {\r\n this.applySingleFilterCondition(q, item)\r\n }\r\n return q\r\n }, option)\r\n }\r\n }\r\n\r\n private handleFilter = (rp: RequestParam<G>) => {\r\n const filter = this.filterStateStore?.filter\r\n if (!filter) return\r\n\r\n const keys = Object.keys(filter).filter(Boolean) as (keyof T)[]\r\n const list = keys.reduce<{ [key in keyof T]?: ISingleFilterCondition<G>[] }>((a, k) => {\r\n const keyConverteds = getKeyConverter(k, this.keyConverter)\r\n const items = filter[k] ?? []\r\n for (const keyConverted of keyConverteds) {\r\n for (const item of items) {\r\n if (!item.value) continue\r\n const list: ISingleFilterCondition<G>[] = a[k] ?? []\r\n list.push({ value: item.value, keyConvert: keyConverted, filter: item, option: { logic: 'Or' } })\r\n a[k] = list\r\n }\r\n }\r\n return a\r\n }, {})\r\n\r\n rp.scope(\r\n (q) => {\r\n for (const key in list) {\r\n const items = list[key]\r\n if (!items || items.length === 0) continue\r\n this.applyMulFilterCondition(keys.length === 1 ? rp : q, items, { logic: 'And' })\r\n }\r\n return q\r\n },\r\n { logic: 'And' }\r\n )\r\n }\r\n\r\n private handleQuickSearch = (rp: RequestParam<G>) => {\r\n const quickSearch = this.filterStateStore?.quickSearch\r\n if (!quickSearch || !this.quickSearchFields || this.quickSearchFields.length === 0) return\r\n\r\n // Convert quickSearch to array of strings\r\n const values = Array.isArray(quickSearch) ? quickSearch : [quickSearch]\r\n const trimmedValues = values.map((v) => v?.toString().trim()).filter(Boolean)\r\n\r\n if (trimmedValues.length === 0) return\r\n\r\n const list = this.quickSearchFields.reduce<ISingleFilterCondition<G>[]>((a, field) => {\r\n const keyConverteds = getKeyConverter(field, this.keyConverter)\r\n for (const keyConverted of keyConverteds) {\r\n for (const val of trimmedValues) {\r\n if (!val) continue\r\n a.push({ value: val, keyConvert: keyConverted })\r\n }\r\n }\r\n return a\r\n }, [])\r\n\r\n // Apply quick search with OR logic (scope)\r\n if (list.length > 0) {\r\n rp.scope((q) => {\r\n for (const item of list) {\r\n this.applySingleFilterCondition(q, item)\r\n }\r\n return q\r\n })\r\n }\r\n }\r\n\r\n private handlePagination = (rp: RequestParam<G>) => {\r\n const { page, pageSize } = this.filterStateStore?.pagination ?? {}\r\n const finalPage = page ?? this.defaultFilter?.pagination?.page ?? 0\r\n const finalPageSize = pageSize ?? this.defaultFilter?.pagination?.pageSize ?? 10\r\n rp.take(finalPageSize).skip(finalPage * finalPageSize)\r\n }\r\n\r\n private handleSort = (rp: RequestParam<G>) => {\r\n const sort = this.filterStateStore?.sort ?? this.defaultFilter?.sort\r\n if (!sort) return\r\n\r\n const keyConverteds = getKeyConverter(sort.field, this.keyConverter)\r\n if (keyConverteds.length > 0) {\r\n const keyConverted = keyConverteds[0] // Use first converter for sorting\r\n const targetField = (keyConverted.deep ?? keyConverted.field) as keyof G\r\n\r\n if (targetField) {\r\n rp.sort(targetField, { direction: sort.direction === 'asc' ? 'ASC' : 'DESC' })\r\n }\r\n }\r\n }\r\n\r\n private prebuildFunc?: (rp: RequestParam<G>) => RequestParam<G>\r\n prebuild = (func: (requestParam: RequestParam<G>) => RequestParam<G>) => {\r\n this.prebuildFunc = func\r\n return this\r\n }\r\n\r\n build = () => {\r\n const requestBuilder = createRequestBuilder<G>({ ignoreEmpty: true })\r\n this.handleSort(requestBuilder)\r\n this.handlePagination(requestBuilder)\r\n this.handleQuickSearch(requestBuilder)\r\n this.handleFilter(requestBuilder)\r\n if (this.prebuildFunc) this.prebuildFunc(requestBuilder)\r\n return requestBuilder.build()\r\n }\r\n}\r\nexport default ConvertFilterToGraphQL\r\n\r\nexport const createConvertFilterToGraphQL = <T, G extends object>(params: IFilterToGraphQLParams<T, G>) => {\r\n return new ConvertFilterToGraphQL<T, G>(params)\r\n}\r\n"],"names":["ConvertFilterToGraphQL","_createClass","params","_this","this","_classCallCheck","_defineProperty","filterState","filterStateStore","rp","_params$value$toStrin","_params$value","_params$keyConvert$de","_params$filter","val","value","toString","targetField","keyConvert","deep","field","custom","filterCustom","option","filter","type","dateLogic","logic","mapDateLogic","concat","filterContains","items","length","i","applySingleFilterCondition","scope","q","_step","_iterator","_createForOfIteratorHelper","s","n","done","item","err","e","f","_this$filterStateStor","keys","Object","Boolean","list","reduce","a","k","_filter$k","_step2","keyConverteds","getKeyConverter","keyConverter","_iterator2","_step3","keyConverted","_iterator3","_a$k","push","key","applyMulFilterCondition","_this$filterStateStor2","quickSearch","quickSearchFields","trimmedValues","Array","isArray","map","v","trim","_step4","_iterator4","_step5","_iterator5","_step6","_iterator6","_this$filterStateStor3","_this$filterStateStor4","_ref2","_this$defaultFilter","_ref3","_this$defaultFilter2","_ref","pagination","page","pageSize","finalPage","defaultFilter","finalPageSize","take","skip","_this$filterStateStor5","_this$filterStateStor6","_this$defaultFilter3","sort","_keyConverted$deep","direction","func","prebuildFunc","requestBuilder","createRequestBuilder","ignoreEmpty","handleSort","handlePagination","handleQuickSearch","handleFilter","build","createConvertFilterToGraphQL"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as e,inherits as t,createClass as i,classCallCheck as r,callSuper as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,Fragment as l,jsxs as o}from"react/jsx-runtime";import{Component as c,Fragment as s}from"react";import{styled as d,Box as u,Collapse as m,Typography as v,Chip as f}from"@mui/material";import{createFilterStore as p}from"./filter-store.js";import{ClearAllButton as h,mapSortConfigs as x}from"./ui.units.js";import{mapDataViewContext as C}from"./context.js";import{formatDatetime as g}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{mapDateLogicText as S}from"./helpers.js";var w={root:"ActiveFiltersPanel-root",content:"ActiveFiltersPanel-content",item:"ActiveFiltersPanel-item",itemContent:"ActiveFiltersPanel-itemContent",itemChip:"ActiveFiltersPanel-itemChip",removeButton:"ActiveFiltersPanel-removeButton",overlay:"ActiveFiltersPanel-overlay"};function b(){return function(){function d(t){var i;return r(this,d),i=a(this,d,[t]),e(i,"handleAnimationExited",(function(){i.setState({isClosing:!0})})),e(i,"renderItems",(function(e){var t;return o(u,{className:w.item,children:[o(v,{variant:"caption",sx:{fontWeight:700},children:[e.label||(null===(t=e.field)||void 0===t?void 0:t.toString()),":"]}),n(u,{className:w.itemContent,children:e.items.map((function(t){return n(f,{clickable:!0,size:"small",label:t.label||t.value,className:w.itemChip,onDelete:function(){e.isQuickSearch?i.removeQuickSearch(t):e.field&&i.removeFilter(e.field,t)}},t.value)}))})]})})),e(i,"renderFilters",(function(){var e,t=(null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.filter)||{},r=Object.keys(t);return 0===r.length?n(l,{}):r.map((function(e){var r,a=(null!==(r=t[e])&&void 0!==r?r:[]).reduce((function(e,t){var i,r,a,n,l=t.label||(null===(i=t.value)||void 0===i?void 0:i.toString());"date"===t.type&&t.dateLogic&&(l="".concat(S[t.dateLogic]," ").concat(g(null!==(a=null===(n=t.value)||void 0===n?void 0:n.toString())&&void 0!==a?a:"","style2")));return t.value&&e.push({value:null===(r=t.value)||void 0===r?void 0:r.toString(),label:l}),e}),[]);return n(s,{children:i.renderItems({field:e,label:e.toString(),items:a})},e.toString())}))})),e(i,"renderSort",(function(){var e,t,r=null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.sort;if(!r)return n(l,{});var a=null===(t=i.dataViewContext.filterBarConfigs.fields)||void 0===t?void 0:t[r.field],c=(null==a?void 0:a.label)||r.field.toString(),s=x[r.direction];return o(u,{className:w.item,children:[n(v,{variant:"caption",sx:{fontWeight:700},children:"Sort:"}),n(f,{clickable:!0,size:"small",label:o(u,{sx:{display:"flex",alignItems:"center",gap:.5},children:[n("span",{children:c}),s.icon]}),className:w.itemChip,onClick:i.toggleSortDirection,onDelete:function(){return i.removeSort()},title:"".concat(c," - ").concat(s.title)})]})})),e(i,"removeFilter",(function(e,t){var r=p(i.dataViewContext.filterState).removeFilterItem(e,t.value,{reason:"filter"});i.dataViewContext.onFilterStateChange(r.build())})),e(i,"removeQuickSearch",(function(e){var t=p(i.dataViewContext.filterState).removeQuickSearchItem(e.value,{reason:"quickSearch"});i.dataViewContext.onFilterStateChange(t.build())})),e(i,"removeSort",(function(){var e=p(i.dataViewContext.filterState).removeSort({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())})),e(i,"toggleSortDirection",(function(){var e=p(i.dataViewContext.filterState).toggleSortDirection({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())})),e(i,"handleClearAll",(function(){var e=i.dataViewContext.filterBarConfigs.defaultValue||{},t=p(i.dataViewContext.filterState,e).reset();i.dataViewContext.onFilterStateChange(t.build())})),i.state={data:null,isClosing:!1},i}return t(d,c),i(d,[{key:"render",value:function(){var e=this;return C((function(t){if(e.dataViewContext=t,!e.dataViewContext)return n(l,{});var i=e.dataViewContext.filterBarConfigs.defaultValue,r=p(e.dataViewContext.filterState,i).isEmpty();return n(m,{in:!r,timeout:300,unmountOnExit:!0,orientation:"vertical",onExited:e.handleAnimationExited,children:o(k,{className:w.root,children:[o(u,{className:w.content,children:[e.renderSort(),e.renderQuickSearch(),e.renderFilters(),!r&&n(h,{className:w.removeButton,onClick:e.handleClearAll})]}),e.props.loading&&n(u,{className:w.overlay})]})})}))}},{key:"renderQuickSearch",value:function(){var e,t=(null===(e=this.dataViewContext.filterState)||void 0===e?void 0:e.quickSearch)||[],i=(Array.isArray(t)?t:[t]).map((function(e){return{value:e}}));return i&&0!==i.length?this.renderItems({label:"Quick search",items:i,isQuickSearch:!0}):n(l,{})}}])}()}var k=d(u)(e(e(e(e(e({position:"relative"},".".concat(w.content),{display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px"}),".".concat(w.item),{display:"flex",flexWrap:"wrap",border:"dashed 1px var(--color-divider, rgba(145 160 170 / 20%))",borderRadius:"4px",alignItems:"center",padding:"6px 8px",gap:"8px"}),".".concat(w.itemContent),{display:"flex",flexWrap:"wrap",gap:"4px"}),".".concat(w.itemChip),{borderRadius:"4px",height:"100%","& .MuiChip-label":{overflowWrap:"break-word",wordBreak:"break-word",whiteSpace:"normal",textOverflow:"clip"}}),".".concat(w.overlay),{position:"absolute",top:0,left:0,width:"100%",height:"100%",backdropFilter:"blur(1px)"}));export{w as activeFiltersPanelClasses,b as default};
1
+ import{defineProperty as e,inherits as t,createClass as i,classCallCheck as r,callSuper as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,Fragment as l,jsxs as o}from"react/jsx-runtime";import{Component as c,Fragment as s}from"react";import{styled as d,Box as u,Collapse as m,Typography as v,Chip as f}from"@mui/material";import{createFilterStore as p}from"./filter-store.js";import{ClearAllButton as h,mapSortConfigs as x}from"./ui.units.js";import{mapDataViewContext as C}from"./context.js";import{formatDatetime as g}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{mapDateLogicText as S}from"./helpers.js";var w={root:"ActiveFiltersPanel-root",content:"ActiveFiltersPanel-content",item:"ActiveFiltersPanel-item",itemContent:"ActiveFiltersPanel-itemContent",itemChip:"ActiveFiltersPanel-itemChip",removeButton:"ActiveFiltersPanel-removeButton",overlay:"ActiveFiltersPanel-overlay"};function b(){return function(){function d(t){var i;return r(this,d),i=a(this,d,[t]),e(i,"handleAnimationExited",function(){i.setState({isClosing:!0})}),e(i,"renderItems",function(e){var t;return o(u,{className:w.item,children:[o(v,{variant:"caption",sx:{fontWeight:700},children:[e.label||(null===(t=e.field)||void 0===t?void 0:t.toString()),":"]}),n(u,{className:w.itemContent,children:e.items.map(function(t){return n(f,{clickable:!0,size:"small",label:t.label||t.value,className:w.itemChip,onDelete:function(){e.isQuickSearch?i.removeQuickSearch(t):e.field&&i.removeFilter(e.field,t)}},t.value)})})]})}),e(i,"renderFilters",function(){var e,t=(null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.filter)||{},r=Object.keys(t);return 0===r.length?n(l,{}):r.map(function(e){var r,a=(null!==(r=t[e])&&void 0!==r?r:[]).reduce(function(e,t){var i,r,a,n,l=t.label||(null===(i=t.value)||void 0===i?void 0:i.toString());"date"===t.type&&t.dateLogic&&(l="".concat(S[t.dateLogic]," ").concat(g(null!==(a=null===(n=t.value)||void 0===n?void 0:n.toString())&&void 0!==a?a:"","style2")));return t.value&&e.push({value:null===(r=t.value)||void 0===r?void 0:r.toString(),label:l}),e},[]);return n(s,{children:i.renderItems({field:e,label:e.toString(),items:a})},e.toString())})}),e(i,"renderSort",function(){var e,t,r=null===(e=i.dataViewContext.filterState)||void 0===e?void 0:e.sort;if(!r)return n(l,{});var a=null===(t=i.dataViewContext.filterBarConfigs.fields)||void 0===t?void 0:t[r.field],c=(null==a?void 0:a.label)||r.field.toString(),s=x[r.direction];return o(u,{className:w.item,children:[n(v,{variant:"caption",sx:{fontWeight:700},children:"Sort:"}),n(f,{clickable:!0,size:"small",label:o(u,{sx:{display:"flex",alignItems:"center",gap:.5},children:[n("span",{children:c}),s.icon]}),className:w.itemChip,onClick:i.toggleSortDirection,onDelete:function(){return i.removeSort()},title:"".concat(c," - ").concat(s.title)})]})}),e(i,"removeFilter",function(e,t){var r=p(i.dataViewContext.filterState).removeFilterItem(e,t.value,{reason:"filter"});i.dataViewContext.onFilterStateChange(r.build())}),e(i,"removeQuickSearch",function(e){var t=p(i.dataViewContext.filterState).removeQuickSearchItem(e.value,{reason:"quickSearch"});i.dataViewContext.onFilterStateChange(t.build())}),e(i,"removeSort",function(){var e=p(i.dataViewContext.filterState).removeSort({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())}),e(i,"toggleSortDirection",function(){var e=p(i.dataViewContext.filterState).toggleSortDirection({reason:"sort"});i.dataViewContext.onFilterStateChange(e.build())}),e(i,"handleClearAll",function(){var e=i.dataViewContext.filterBarConfigs.defaultValue||{},t=p(i.dataViewContext.filterState,e).reset();i.dataViewContext.onFilterStateChange(t.build())}),i.state={data:null,isClosing:!1},i}return t(d,c),i(d,[{key:"render",value:function(){var e=this;return C(function(t){if(e.dataViewContext=t,!e.dataViewContext)return n(l,{});var i=e.dataViewContext.filterBarConfigs.defaultValue,r=p(e.dataViewContext.filterState,i).isEmpty();return n(m,{in:!r,timeout:300,unmountOnExit:!0,orientation:"vertical",onExited:e.handleAnimationExited,children:o(k,{className:w.root,children:[o(u,{className:w.content,children:[e.renderSort(),e.renderQuickSearch(),e.renderFilters(),!r&&n(h,{className:w.removeButton,onClick:e.handleClearAll})]}),e.props.loading&&n(u,{className:w.overlay})]})})})}},{key:"renderQuickSearch",value:function(){var e,t=(null===(e=this.dataViewContext.filterState)||void 0===e?void 0:e.quickSearch)||[],i=(Array.isArray(t)?t:[t]).map(function(e){return{value:e}});return i&&0!==i.length?this.renderItems({label:"Quick search",items:i,isQuickSearch:!0}):n(l,{})}}])}()}var k=d(u)(e(e(e(e(e({position:"relative"},".".concat(w.content),{display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px"}),".".concat(w.item),{display:"flex",flexWrap:"wrap",border:"dashed 1px var(--color-divider, rgba(145 160 170 / 20%))",borderRadius:"4px",alignItems:"center",padding:"6px 8px",gap:"8px"}),".".concat(w.itemContent),{display:"flex",flexWrap:"wrap",gap:"4px"}),".".concat(w.itemChip),{borderRadius:"4px",height:"100%","& .MuiChip-label":{overflowWrap:"break-word",wordBreak:"break-word",whiteSpace:"normal",textOverflow:"clip"}}),".".concat(w.overlay),{position:"absolute",top:0,left:0,width:"100%",height:"100%",backdropFilter:"blur(1px)"}));export{w as activeFiltersPanelClasses,b as default};
2
2
  //# sourceMappingURL=create.active-filters-panel.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.active-filters-panel.js","sources":["../../../src/data-view/create.active-filters-panel.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Chip, Collapse, styled, Typography } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { ClearAllButton, mapSortConfigs } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { IFilterItem, IFilterMap, IFilterState, IItemBase } from './types'\r\nimport { formatDatetime } from '../utils'\r\nimport { mapDateLogicText } from './helpers'\r\n\r\nexport const activeFiltersPanelClasses = {\r\n root: 'ActiveFiltersPanel-root',\r\n content: 'ActiveFiltersPanel-content',\r\n item: 'ActiveFiltersPanel-item',\r\n itemContent: 'ActiveFiltersPanel-itemContent',\r\n itemChip: 'ActiveFiltersPanel-itemChip',\r\n removeButton: 'ActiveFiltersPanel-removeButton',\r\n overlay: 'ActiveFiltersPanel-overlay'\r\n}\r\n\r\ninterface IRenderItemsParams<T> {\r\n field?: keyof T\r\n label?: string\r\n items: IItemBase[]\r\n isQuickSearch?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelProps {\r\n loading?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelState<T> {\r\n data: IFilterState<T> | null\r\n isClosing: boolean\r\n}\r\n\r\nfunction createActiveFiltersPanel<T>(): ComponentType<IActiveFiltersPanelProps> {\r\n class ActiveFiltersPanel extends Component<IActiveFiltersPanelProps, IActiveFiltersPanelState<T>> {\r\n declare dataViewContext: IDataViewContext<T>\r\n\r\n constructor(props: IActiveFiltersPanelProps) {\r\n super(props)\r\n this.state = {\r\n data: null,\r\n isClosing: false\r\n }\r\n }\r\n\r\n // Handle animation completion\r\n private handleAnimationExited = () => {\r\n this.setState({ isClosing: true })\r\n }\r\n\r\n render() {\r\n return mapDataViewContext((context) => {\r\n this.dataViewContext = context\r\n if (!this.dataViewContext) return <></>\r\n const { defaultValue } = this.dataViewContext.filterBarConfigs\r\n const isEmpty = createFilterStore(this.dataViewContext.filterState, defaultValue).isEmpty()\r\n return (\r\n <Collapse in={!isEmpty} timeout={300} unmountOnExit orientation='vertical' onExited={this.handleAnimationExited}>\r\n <Wrap className={activeFiltersPanelClasses.root}>\r\n <Box className={activeFiltersPanelClasses.content}>\r\n {this.renderSort()}\r\n {this.renderQuickSearch()}\r\n {this.renderFilters()}\r\n {!isEmpty && <ClearAllButton className={activeFiltersPanelClasses.removeButton} onClick={this.handleClearAll} />}\r\n </Box>\r\n {this.props.loading && <Box className={activeFiltersPanelClasses.overlay} />}\r\n </Wrap>\r\n </Collapse>\r\n )\r\n })\r\n }\r\n\r\n renderItems = (p: IRenderItemsParams<T>) => (\r\n <Box className={activeFiltersPanelClasses.item}>\r\n <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n {p.label || p.field?.toString()}:\r\n </Typography>\r\n <Box className={activeFiltersPanelClasses.itemContent}>\r\n {p.items.map((item) => (\r\n <Chip\r\n key={item.value}\r\n clickable\r\n size='small'\r\n label={item.label || item.value}\r\n className={activeFiltersPanelClasses.itemChip}\r\n onDelete={() => {\r\n if (p.isQuickSearch) {\r\n this.removeQuickSearch(item)\r\n return\r\n }\r\n if (!p.field) return\r\n this.removeFilter(p.field, item)\r\n }}\r\n />\r\n ))}\r\n </Box>\r\n </Box>\r\n )\r\n\r\n renderQuickSearch() {\r\n const val = this.dataViewContext.filterState?.quickSearch || []\r\n const list = (Array.isArray(val) ? val : [val]).map((value) => ({ value }))\r\n if (!list || list.length === 0) return <></>\r\n return this.renderItems({ label: 'Quick search', items: list, isQuickSearch: true })\r\n }\r\n\r\n renderFilters = () => {\r\n const filter: IFilterMap<T> = this.dataViewContext.filterState?.filter || {}\r\n const keys = Object.keys(filter) as Array<keyof T>\r\n if (keys.length === 0) return <></>\r\n return keys.map((key) => {\r\n const filterItems = (filter[key] ?? []) as IFilterItem[]\r\n const items = filterItems.reduce<IItemBase[]>((acc, item) => {\r\n let label = item.label || item.value?.toString()\r\n if (item.type === 'date' && item.dateLogic) {\r\n label = `${mapDateLogicText[item.dateLogic]} ${formatDatetime(item.value?.toString() ?? '', 'style2')}`\r\n }\r\n if (!!item.value) acc.push({ value: item.value?.toString(), label })\r\n return acc\r\n }, [])\r\n return <Fragment key={key.toString()}>{this.renderItems({ field: key, label: key.toString(), items })}</Fragment>\r\n })\r\n }\r\n\r\n renderSort = () => {\r\n const sort = this.dataViewContext.filterState?.sort\r\n if (!sort) return <></>\r\n\r\n const fieldConfig = this.dataViewContext.filterBarConfigs.fields?.[sort.field]\r\n const fieldLabel = fieldConfig?.label || sort.field.toString()\r\n const sortConfig = mapSortConfigs[sort.direction]\r\n\r\n return (\r\n <Box className={activeFiltersPanelClasses.item}>\r\n <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n Sort:\r\n </Typography>\r\n {/* <Box className={activeFiltersPanelClasses.itemContent}> */}\r\n <Chip\r\n clickable\r\n size='small'\r\n label={\r\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\r\n <span>{fieldLabel}</span>\r\n {sortConfig.icon}\r\n </Box>\r\n }\r\n className={activeFiltersPanelClasses.itemChip}\r\n onClick={this.toggleSortDirection}\r\n onDelete={() => this.removeSort()}\r\n title={`${fieldLabel} - ${sortConfig.title}`}\r\n />\r\n {/* </Box> */}\r\n </Box>\r\n )\r\n }\r\n\r\n removeFilter = (field: keyof T, item: IItemBase) => {\r\n const store = createFilterStore(this.dataViewContext.filterState).removeFilterItem(field, item.value, { reason: 'filter' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n removeQuickSearch = (item: IItemBase) => {\r\n const store = createFilterStore(this.dataViewContext.filterState).removeQuickSearchItem(item.value, { reason: 'quickSearch' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n removeSort = () => {\r\n const store = createFilterStore(this.dataViewContext.filterState).removeSort({ reason: 'sort' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n toggleSortDirection = () => {\r\n const store = createFilterStore(this.dataViewContext.filterState).toggleSortDirection({ reason: 'sort' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n handleClearAll = () => {\r\n const fValue = this.dataViewContext.filterBarConfigs.defaultValue || {}\r\n // Trực tiếp clear data, logic đóng sẽ được xử lý tự động\r\n const store = createFilterStore(this.dataViewContext.filterState, fValue).reset()\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n }\r\n\r\n return ActiveFiltersPanel\r\n}\r\n\r\nexport default createActiveFiltersPanel\r\n\r\nconst Wrap = styled(Box)({\r\n position: 'relative',\r\n [`.${activeFiltersPanelClasses.content}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n flexWrap: 'wrap',\r\n gap: '8px'\r\n },\r\n [`.${activeFiltersPanelClasses.item}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n border: 'dashed 1px var(--color-divider, rgba(145 160 170 / 20%))',\r\n borderRadius: '4px',\r\n alignItems: 'center',\r\n padding: '6px 8px',\r\n gap: '8px'\r\n },\r\n [`.${activeFiltersPanelClasses.itemContent}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gap: '4px'\r\n },\r\n [`.${activeFiltersPanelClasses.itemChip}`]: {\r\n borderRadius: '4px',\r\n height: '100%',\r\n '& .MuiChip-label': {\r\n overflowWrap: 'break-word',\r\n wordBreak: 'break-word',\r\n whiteSpace: 'normal',\r\n textOverflow: 'clip'\r\n }\r\n },\r\n [`.${activeFiltersPanelClasses.overlay}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n backdropFilter: 'blur(1px)'\r\n }\r\n})\r\n"],"names":["activeFiltersPanelClasses","root","content","item","itemContent","itemChip","removeButton","overlay","createActiveFiltersPanel","ActiveFiltersPanel","props","_this","_classCallCheck","_callSuper","_defineProperty","setState","isClosing","p","_p$field","_jsxs","Box","className","children","Typography","variant","sx","fontWeight","label","field","toString","_jsx","items","map","Chip","clickable","size","value","onDelete","isQuickSearch","removeQuickSearch","removeFilter","_this$dataViewContext","filter","dataViewContext","filterState","keys","Object","length","key","_filter$key","reduce","acc","_item$value","_item$value3","_item$value$toString","_item$value2","type","dateLogic","concat","mapDateLogicText","formatDatetime","push","Fragment","renderItems","_this$dataViewContext2","_this$dataViewContext3","sort","fieldConfig","filterBarConfigs","fields","fieldLabel","sortConfig","mapSortConfigs","direction","display","alignItems","gap","icon","onClick","toggleSortDirection","removeSort","title","store","createFilterStore","removeFilterItem","reason","onFilterStateChange","build","removeQuickSearchItem","fValue","defaultValue","reset","state","data","_inherits","Component","_createClass","_this2","this","mapDataViewContext","context","isEmpty","Collapse","in","timeout","unmountOnExit","orientation","onExited","handleAnimationExited","Wrap","renderSort","renderQuickSearch","renderFilters","ClearAllButton","handleClearAll","loading","_this$dataViewContext4","val","quickSearch","list","Array","isArray","styled","position","flexWrap","border","borderRadius","padding","height","overflowWrap","wordBreak","whiteSpace","textOverflow","top","left","width","backdropFilter"],"mappings":"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"}
1
+ {"version":3,"file":"create.active-filters-panel.js","sources":["../../../src/data-view/create.active-filters-panel.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Chip, Collapse, styled, Typography } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { ClearAllButton, mapSortConfigs } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { IFilterItem, IFilterMap, IFilterState, IItemBase } from './types'\r\nimport { formatDatetime } from '../utils'\r\nimport { mapDateLogicText } from './helpers'\r\n\r\nexport const activeFiltersPanelClasses = {\r\n root: 'ActiveFiltersPanel-root',\r\n content: 'ActiveFiltersPanel-content',\r\n item: 'ActiveFiltersPanel-item',\r\n itemContent: 'ActiveFiltersPanel-itemContent',\r\n itemChip: 'ActiveFiltersPanel-itemChip',\r\n removeButton: 'ActiveFiltersPanel-removeButton',\r\n overlay: 'ActiveFiltersPanel-overlay'\r\n}\r\n\r\ninterface IRenderItemsParams<T> {\r\n field?: keyof T\r\n label?: string\r\n items: IItemBase[]\r\n isQuickSearch?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelProps {\r\n loading?: boolean\r\n}\r\n\r\nexport interface IActiveFiltersPanelState<T> {\r\n data: IFilterState<T> | null\r\n isClosing: boolean\r\n}\r\n\r\nfunction createActiveFiltersPanel<T>(): ComponentType<IActiveFiltersPanelProps> {\r\n class ActiveFiltersPanel extends Component<IActiveFiltersPanelProps, IActiveFiltersPanelState<T>> {\r\n declare dataViewContext: IDataViewContext<T>\r\n\r\n constructor(props: IActiveFiltersPanelProps) {\r\n super(props)\r\n this.state = {\r\n data: null,\r\n isClosing: false\r\n }\r\n }\r\n\r\n // Handle animation completion\r\n private handleAnimationExited = () => {\r\n this.setState({ isClosing: true })\r\n }\r\n\r\n render() {\r\n return mapDataViewContext((context) => {\r\n this.dataViewContext = context\r\n if (!this.dataViewContext) return <></>\r\n const { defaultValue } = this.dataViewContext.filterBarConfigs\r\n const isEmpty = createFilterStore(this.dataViewContext.filterState, defaultValue).isEmpty()\r\n return (\r\n <Collapse in={!isEmpty} timeout={300} unmountOnExit orientation='vertical' onExited={this.handleAnimationExited}>\r\n <Wrap className={activeFiltersPanelClasses.root}>\r\n <Box className={activeFiltersPanelClasses.content}>\r\n {this.renderSort()}\r\n {this.renderQuickSearch()}\r\n {this.renderFilters()}\r\n {!isEmpty && <ClearAllButton className={activeFiltersPanelClasses.removeButton} onClick={this.handleClearAll} />}\r\n </Box>\r\n {this.props.loading && <Box className={activeFiltersPanelClasses.overlay} />}\r\n </Wrap>\r\n </Collapse>\r\n )\r\n })\r\n }\r\n\r\n renderItems = (p: IRenderItemsParams<T>) => (\r\n <Box className={activeFiltersPanelClasses.item}>\r\n <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n {p.label || p.field?.toString()}:\r\n </Typography>\r\n <Box className={activeFiltersPanelClasses.itemContent}>\r\n {p.items.map((item) => (\r\n <Chip\r\n key={item.value}\r\n clickable\r\n size='small'\r\n label={item.label || item.value}\r\n className={activeFiltersPanelClasses.itemChip}\r\n onDelete={() => {\r\n if (p.isQuickSearch) {\r\n this.removeQuickSearch(item)\r\n return\r\n }\r\n if (!p.field) return\r\n this.removeFilter(p.field, item)\r\n }}\r\n />\r\n ))}\r\n </Box>\r\n </Box>\r\n )\r\n\r\n renderQuickSearch() {\r\n const val = this.dataViewContext.filterState?.quickSearch || []\r\n const list = (Array.isArray(val) ? val : [val]).map((value) => ({ value }))\r\n if (!list || list.length === 0) return <></>\r\n return this.renderItems({ label: 'Quick search', items: list, isQuickSearch: true })\r\n }\r\n\r\n renderFilters = () => {\r\n const filter: IFilterMap<T> = this.dataViewContext.filterState?.filter || {}\r\n const keys = Object.keys(filter) as Array<keyof T>\r\n if (keys.length === 0) return <></>\r\n return keys.map((key) => {\r\n const filterItems = (filter[key] ?? []) as IFilterItem[]\r\n const items = filterItems.reduce<IItemBase[]>((acc, item) => {\r\n let label = item.label || item.value?.toString()\r\n if (item.type === 'date' && item.dateLogic) {\r\n label = `${mapDateLogicText[item.dateLogic]} ${formatDatetime(item.value?.toString() ?? '', 'style2')}`\r\n }\r\n if (!!item.value) acc.push({ value: item.value?.toString(), label })\r\n return acc\r\n }, [])\r\n return <Fragment key={key.toString()}>{this.renderItems({ field: key, label: key.toString(), items })}</Fragment>\r\n })\r\n }\r\n\r\n renderSort = () => {\r\n const sort = this.dataViewContext.filterState?.sort\r\n if (!sort) return <></>\r\n\r\n const fieldConfig = this.dataViewContext.filterBarConfigs.fields?.[sort.field]\r\n const fieldLabel = fieldConfig?.label || sort.field.toString()\r\n const sortConfig = mapSortConfigs[sort.direction]\r\n\r\n return (\r\n <Box className={activeFiltersPanelClasses.item}>\r\n <Typography variant='caption' sx={{ fontWeight: 700 }}>\r\n Sort:\r\n </Typography>\r\n {/* <Box className={activeFiltersPanelClasses.itemContent}> */}\r\n <Chip\r\n clickable\r\n size='small'\r\n label={\r\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\r\n <span>{fieldLabel}</span>\r\n {sortConfig.icon}\r\n </Box>\r\n }\r\n className={activeFiltersPanelClasses.itemChip}\r\n onClick={this.toggleSortDirection}\r\n onDelete={() => this.removeSort()}\r\n title={`${fieldLabel} - ${sortConfig.title}`}\r\n />\r\n {/* </Box> */}\r\n </Box>\r\n )\r\n }\r\n\r\n removeFilter = (field: keyof T, item: IItemBase) => {\r\n const store = createFilterStore(this.dataViewContext.filterState).removeFilterItem(field, item.value, { reason: 'filter' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n removeQuickSearch = (item: IItemBase) => {\r\n const store = createFilterStore(this.dataViewContext.filterState).removeQuickSearchItem(item.value, { reason: 'quickSearch' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n removeSort = () => {\r\n const store = createFilterStore(this.dataViewContext.filterState).removeSort({ reason: 'sort' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n toggleSortDirection = () => {\r\n const store = createFilterStore(this.dataViewContext.filterState).toggleSortDirection({ reason: 'sort' })\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n\r\n handleClearAll = () => {\r\n const fValue = this.dataViewContext.filterBarConfigs.defaultValue || {}\r\n // Trực tiếp clear data, logic đóng sẽ được xử lý tự động\r\n const store = createFilterStore(this.dataViewContext.filterState, fValue).reset()\r\n this.dataViewContext.onFilterStateChange(store.build())\r\n }\r\n }\r\n\r\n return ActiveFiltersPanel\r\n}\r\n\r\nexport default createActiveFiltersPanel\r\n\r\nconst Wrap = styled(Box)({\r\n position: 'relative',\r\n [`.${activeFiltersPanelClasses.content}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n flexWrap: 'wrap',\r\n gap: '8px'\r\n },\r\n [`.${activeFiltersPanelClasses.item}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n border: 'dashed 1px var(--color-divider, rgba(145 160 170 / 20%))',\r\n borderRadius: '4px',\r\n alignItems: 'center',\r\n padding: '6px 8px',\r\n gap: '8px'\r\n },\r\n [`.${activeFiltersPanelClasses.itemContent}`]: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gap: '4px'\r\n },\r\n [`.${activeFiltersPanelClasses.itemChip}`]: {\r\n borderRadius: '4px',\r\n height: '100%',\r\n '& .MuiChip-label': {\r\n overflowWrap: 'break-word',\r\n wordBreak: 'break-word',\r\n whiteSpace: 'normal',\r\n textOverflow: 'clip'\r\n }\r\n },\r\n [`.${activeFiltersPanelClasses.overlay}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n backdropFilter: 'blur(1px)'\r\n }\r\n})\r\n"],"names":["activeFiltersPanelClasses","root","content","item","itemContent","itemChip","removeButton","overlay","createActiveFiltersPanel","ActiveFiltersPanel","props","_this","_classCallCheck","_callSuper","_defineProperty","setState","isClosing","p","_p$field","_jsxs","Box","className","children","Typography","variant","sx","fontWeight","label","field","toString","_jsx","items","map","Chip","clickable","size","value","onDelete","isQuickSearch","removeQuickSearch","removeFilter","_this$dataViewContext","filter","dataViewContext","filterState","keys","Object","length","key","_filter$key","reduce","acc","_item$value","_item$value3","_item$value$toString","_item$value2","type","dateLogic","concat","mapDateLogicText","formatDatetime","push","Fragment","renderItems","_this$dataViewContext2","_this$dataViewContext3","sort","fieldConfig","filterBarConfigs","fields","fieldLabel","sortConfig","mapSortConfigs","direction","display","alignItems","gap","icon","onClick","toggleSortDirection","removeSort","title","store","createFilterStore","removeFilterItem","reason","onFilterStateChange","build","removeQuickSearchItem","fValue","defaultValue","reset","state","data","_inherits","Component","_createClass","_this2","this","mapDataViewContext","context","isEmpty","Collapse","in","timeout","unmountOnExit","orientation","onExited","handleAnimationExited","Wrap","renderSort","renderQuickSearch","renderFilters","ClearAllButton","handleClearAll","loading","_this$dataViewContext4","val","quickSearch","list","Array","isArray","styled","position","flexWrap","border","borderRadius","padding","height","overflowWrap","wordBreak","whiteSpace","textOverflow","top","left","width","backdropFilter"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as e,createClass as i,objectSpread2 as t,classCallCheck as o,callSuper as n,defineProperty as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as a,Fragment as s}from"react/jsx-runtime";import{Component as d}from"react";import{styled as u,Box as v,Stack as f}from"@mui/material";import{SortButton as p}from"./ui.units.js";import{createViewMode as g}from"./create.view-mode.js";import{defaultViewMode as h,ViewModeButtons as c}from"./view-mode.units.js";import{getViewModeFromURL as C,syncViewModeToURL as m}from"./query-param-url.js";import{defaultFilterBarState as w,DataViewContext as S}from"./context.js";import{createFilterBar as y}from"./create.filter-bar.js";import M from"./scroll-tracking.js";import{createPaginationBar as B}from"./create.pagination-bar.js";import{createPopperPanel as H}from"./create.popper-panel.js";import P from"./create.active-filters-panel.js";function b(u){var b=y(),k=H(),F=P(),V=g(u.viewMode),T=B();return function(){function g(e){var i;return o(this,g),i=n(this,g,[e]),l(i,"mergeConfig",(function(e){var t,o,n,l,r=e.slots;i.configCache={filterBar:Object.assign({},u.filterBar,null==r?void 0:r.filterBarConfigs),viewMode:null==r?void 0:r.viewModeConfigs,paginationBar:Object.assign({},u.paginationBar,null==r?void 0:r.paginationBarConfigs),enablePaginationTop:null!==(t=null!==(o=null==r||null===(n=r.paginationBarConfigs)||void 0===n?void 0:n.enablePaginationTop)&&void 0!==o?o:null===(l=u.paginationBar)||void 0===l?void 0:l.enablePaginationTop)&&void 0!==t&&t,scrollTracking:Object.assign({},u.scrollTracking,null==r?void 0:r.scrollTracking),autoHeight:e.autoHeight||u.autoHeight||!1}})),l(i,"configCache",{}),l(i,"refFilterButton",null),l(i,"refSortButton",null),l(i,"renderFooter",(function(){var e,o,n,l,a=(null===(e=i.props.slots)||void 0===e?void 0:e.footerProps)||{};return r(j,t(t({},a.wrapProps),{},{children:!1!==a.enablePagination&&r(T,t({count:null!==(o=null===(n=i.props.data)||void 0===n?void 0:n.totalItems)&&void 0!==o?o:0,defaultFilter:null===(l=i.internalConfig.filterBar)||void 0===l?void 0:l.defaultValue,filter:i.filterState,onChange:i.onFilterStateChangeHandler},i.internalConfig.paginationBar))}))})),l(i,"onViewModeChangeHandler",(function(e){i.setState({viewMode:e},(function(){var t,o;if(i.props.syncViewModeToURL){var n,l,r,a,s=null!==(n=null!==(l=null===(r=i.internalConfig.viewMode)||void 0===r?void 0:r.defaultValue)&&void 0!==l?l:null===(a=u.viewMode)||void 0===a?void 0:a.defaultValue)&&void 0!==n?n:h;m({viewMode:e,defaultViewMode:s})}null===(t=(o=i.props).onViewModeChange)||void 0===t||t.call(o,e)}))})),l(i,"onKeywordChangeHandler",(function(e){return i.setState({keyword:e})})),l(i,"onScrollChangeHandler",(function(e){return i.setState({scrolled:e.isScrolled})})),l(i,"onPopperPanelChangeHandler",(function(e,t){return i.setState({anchorEl:e,area:t})})),l(i,"onClearHandler",(function(){return i.setState(w)})),l(i,"onPanelCloseHandler",(function(){i.setState({anchorEl:null,area:void 0,keyword:""})})),l(i,"onFilterStateChangeHandler",(function(e){i.props.filter||i.setState(t(t({},w),{},{filterState:e})),i.props.onFilterChange&&i.props.onFilterChange(e),i.props.filter&&i.setState(w)})),i.mergeConfig(e),i.state=i.getDefaultState(e),i}return e(g,d),i(g,[{key:"getDefaultState",value:function(e){var i,o,n,l,r,a,s=null!==(i=null!==(o=null===(n=e.slots)||void 0===n||null===(n=n.viewModeConfigs)||void 0===n?void 0:n.defaultValue)&&void 0!==o?o:null===(l=u.viewMode)||void 0===l?void 0:l.defaultValue)&&void 0!==i?i:h,d=e.syncViewModeToURL?C({defaultViewMode:s}):s;return t(t({},w),{},{filterState:null!==(r=null===(a=this.internalConfig.filterBar)||void 0===a?void 0:a.defaultValue)&&void 0!==r?r:{},viewMode:d})}},{key:"filterState",get:function(){var e;return null!==(e=this.props.filter)&&void 0!==e?e:this.state.filterState}},{key:"viewMode",get:function(){var e;return null!==(e=this.props.viewMode)&&void 0!==e?e:this.state.viewMode}},{key:"internalConfig",get:function(){return this.configCache}},{key:"shouldComponentUpdate",value:function(e){var i,t,o,n,l=JSON.stringify(null===(i=e.slots)||void 0===i?void 0:i.filterBarConfigs)!==JSON.stringify(null===(t=this.props.slots)||void 0===t?void 0:t.filterBarConfigs),r=JSON.stringify(null===(o=e.slots)||void 0===o?void 0:o.viewModeConfigs)!==JSON.stringify(null===(n=this.props.slots)||void 0===n?void 0:n.viewModeConfigs);return(l||r)&&this.mergeConfig(e),!0}},{key:"render",value:function(){var e,i,o,n,l,d,u,g,h,C,m,w,y,B,H,P,j,I={keyword:this.state.keyword.trim(),filterBarConfigs:null!==(e=this.internalConfig.filterBar)&&void 0!==e?e:{},filterState:this.filterState,anchorEl:this.state.anchorEl,area:this.state.area,viewMode:this.state.viewMode,scrolled:this.state.scrolled,onFilterStateChange:this.onFilterStateChangeHandler,onKeywordChange:this.onKeywordChangeHandler,onPopperPanelChange:this.onPopperPanelChangeHandler,onPanelClose:this.onPanelCloseHandler,onClear:this.onClearHandler};return r(S.Provider,{value:I,children:a(f,{sx:{height:"100%",flex:1},children:[(null===(i=this.internalConfig.filterBar)||void 0===i?void 0:i.enableSticky)&&r(M,t({onChange:this.onScrollChangeHandler},this.internalConfig.scrollTracking)),null===(o=this.props.slots)||void 0===o||null===(o=o.filterSlots)||void 0===o?void 0:o.above,r(b,{id:null===(n=this.internalConfig.scrollTracking)||void 0===n?void 0:n.elementId,slots:t(t({},null===(l=this.props.slots)||void 0===l?void 0:l.primaryInputSlots),{},{right:a(s,{children:[(null===(d=this.internalConfig.filterBar)||void 0===d?void 0:d.enableSort)&&r(p,{}),null===(u=this.props.slots)||void 0===u||null===(u=u.primaryInputSlots)||void 0===u?void 0:u.right]})}),children:r(k,{})}),null===(g=this.props.slots)||void 0===g||null===(g=g.filterSlots)||void 0===g?void 0:g.below,null===(h=this.props.slots)||void 0===h||null===(h=h.activeFiltersPanelSlots)||void 0===h?void 0:h.above,a(x,{children:[r(c,{value:this.state.viewMode,onChange:this.onViewModeChangeHandler}),null===(C=this.props.slots)||void 0===C||null===(C=C.activeFiltersPanelSlots)||void 0===C?void 0:C.left,a(f,{flexDirection:"row",sx:{flexWrap:"wrap",alignItems:"center",gap:1,flexGrow:1},children:[r(F,{loading:this.props.loading}),r(v,{sx:{display:"flex",alignItems:"center",gap:1,flexGrow:1,justifyContent:"end"},children:this.internalConfig.enablePaginationTop&&r(T,t({count:null!==(m=null===(w=this.props.data)||void 0===w?void 0:w.totalItems)&&void 0!==m?m:0,defaultFilter:null===(y=this.internalConfig.filterBar)||void 0===y?void 0:y.defaultValue,filter:this.filterState,onChange:this.onFilterStateChangeHandler},this.internalConfig.paginationBar))})]}),null===(B=this.props.slots)||void 0===B||null===(B=B.activeFiltersPanelSlots)||void 0===B?void 0:B.right]}),null===(H=this.props.slots)||void 0===H||null===(H=H.activeFiltersPanelSlots)||void 0===H?void 0:H.below,r(V,{data:null!==(P=null===(j=this.props.data)||void 0===j?void 0:j.items)&&void 0!==P?P:[],viewMode:this.viewMode,loading:this.props.loading,error:this.props.error,autoHeight:this.internalConfig.autoHeight,slots:this.internalConfig.viewMode}),this.renderFooter()]})})}}])}()}var x=u(v)({display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px",marginBottom:"8px",minHeight:"var(--filter-bar-height, 40px)"}),j=u(v)({display:"flex",justifyContent:"flex-end",width:"100%"});export{b as default};
1
+ import{inherits as e,createClass as i,objectSpread2 as t,classCallCheck as o,callSuper as n,defineProperty as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as a,Fragment as s}from"react/jsx-runtime";import{Component as d}from"react";import{styled as u,Box as v,Stack as f}from"@mui/material";import{SortButton as p}from"./ui.units.js";import{createViewMode as g}from"./create.view-mode.js";import{defaultViewMode as h,ViewModeButtons as c}from"./view-mode.units.js";import{getViewModeFromURL as C,syncViewModeToURL as m}from"./query-param-url.js";import{defaultFilterBarState as w,DataViewContext as S}from"./context.js";import{createFilterBar as y}from"./create.filter-bar.js";import M from"./scroll-tracking.js";import{createPaginationBar as B}from"./create.pagination-bar.js";import{createPopperPanel as H}from"./create.popper-panel.js";import P from"./create.active-filters-panel.js";function b(u){var b=y(),k=H(),F=P(),V=g(u.viewMode),T=B();return function(){function g(e){var i;return o(this,g),i=n(this,g,[e]),l(i,"mergeConfig",function(e){var t,o,n,l,r=e.slots;i.configCache={filterBar:Object.assign({},u.filterBar,null==r?void 0:r.filterBarConfigs),viewMode:null==r?void 0:r.viewModeConfigs,paginationBar:Object.assign({},u.paginationBar,null==r?void 0:r.paginationBarConfigs),enablePaginationTop:null!==(t=null!==(o=null==r||null===(n=r.paginationBarConfigs)||void 0===n?void 0:n.enablePaginationTop)&&void 0!==o?o:null===(l=u.paginationBar)||void 0===l?void 0:l.enablePaginationTop)&&void 0!==t&&t,scrollTracking:Object.assign({},u.scrollTracking,null==r?void 0:r.scrollTracking),autoHeight:e.autoHeight||u.autoHeight||!1}}),l(i,"configCache",{}),l(i,"refFilterButton",null),l(i,"refSortButton",null),l(i,"renderFooter",function(){var e,o,n,l,a=(null===(e=i.props.slots)||void 0===e?void 0:e.footerProps)||{};return r(j,t(t({},a.wrapProps),{},{children:!1!==a.enablePagination&&r(T,t({count:null!==(o=null===(n=i.props.data)||void 0===n?void 0:n.totalItems)&&void 0!==o?o:0,defaultFilter:null===(l=i.internalConfig.filterBar)||void 0===l?void 0:l.defaultValue,filter:i.filterState,onChange:i.onFilterStateChangeHandler},i.internalConfig.paginationBar))}))}),l(i,"onViewModeChangeHandler",function(e){i.setState({viewMode:e},function(){var t,o;if(i.props.syncViewModeToURL){var n,l,r,a,s=null!==(n=null!==(l=null===(r=i.internalConfig.viewMode)||void 0===r?void 0:r.defaultValue)&&void 0!==l?l:null===(a=u.viewMode)||void 0===a?void 0:a.defaultValue)&&void 0!==n?n:h;m({viewMode:e,defaultViewMode:s})}null===(t=(o=i.props).onViewModeChange)||void 0===t||t.call(o,e)})}),l(i,"onKeywordChangeHandler",function(e){return i.setState({keyword:e})}),l(i,"onScrollChangeHandler",function(e){return i.setState({scrolled:e.isScrolled})}),l(i,"onPopperPanelChangeHandler",function(e,t){return i.setState({anchorEl:e,area:t})}),l(i,"onClearHandler",function(){return i.setState(w)}),l(i,"onPanelCloseHandler",function(){i.setState({anchorEl:null,area:void 0,keyword:""})}),l(i,"onFilterStateChangeHandler",function(e){i.props.filter||i.setState(t(t({},w),{},{filterState:e})),i.props.onFilterChange&&i.props.onFilterChange(e),i.props.filter&&i.setState(w)}),i.mergeConfig(e),i.state=i.getDefaultState(e),i}return e(g,d),i(g,[{key:"getDefaultState",value:function(e){var i,o,n,l,r,a,s=null!==(i=null!==(o=null===(n=e.slots)||void 0===n||null===(n=n.viewModeConfigs)||void 0===n?void 0:n.defaultValue)&&void 0!==o?o:null===(l=u.viewMode)||void 0===l?void 0:l.defaultValue)&&void 0!==i?i:h,d=e.syncViewModeToURL?C({defaultViewMode:s}):s;return t(t({},w),{},{filterState:null!==(r=null===(a=this.internalConfig.filterBar)||void 0===a?void 0:a.defaultValue)&&void 0!==r?r:{},viewMode:d})}},{key:"filterState",get:function(){var e;return null!==(e=this.props.filter)&&void 0!==e?e:this.state.filterState}},{key:"viewMode",get:function(){var e;return null!==(e=this.props.viewMode)&&void 0!==e?e:this.state.viewMode}},{key:"internalConfig",get:function(){return this.configCache}},{key:"shouldComponentUpdate",value:function(e){var i,t,o,n,l=JSON.stringify(null===(i=e.slots)||void 0===i?void 0:i.filterBarConfigs)!==JSON.stringify(null===(t=this.props.slots)||void 0===t?void 0:t.filterBarConfigs),r=JSON.stringify(null===(o=e.slots)||void 0===o?void 0:o.viewModeConfigs)!==JSON.stringify(null===(n=this.props.slots)||void 0===n?void 0:n.viewModeConfigs);return(l||r)&&this.mergeConfig(e),!0}},{key:"render",value:function(){var e,i,o,n,l,d,u,g,h,C,m,w,y,B,H,P,j,I={keyword:this.state.keyword.trim(),filterBarConfigs:null!==(e=this.internalConfig.filterBar)&&void 0!==e?e:{},filterState:this.filterState,anchorEl:this.state.anchorEl,area:this.state.area,viewMode:this.state.viewMode,scrolled:this.state.scrolled,onFilterStateChange:this.onFilterStateChangeHandler,onKeywordChange:this.onKeywordChangeHandler,onPopperPanelChange:this.onPopperPanelChangeHandler,onPanelClose:this.onPanelCloseHandler,onClear:this.onClearHandler};return r(S.Provider,{value:I,children:a(f,{sx:{height:"100%",flex:1},children:[(null===(i=this.internalConfig.filterBar)||void 0===i?void 0:i.enableSticky)&&r(M,t({onChange:this.onScrollChangeHandler},this.internalConfig.scrollTracking)),null===(o=this.props.slots)||void 0===o||null===(o=o.filterSlots)||void 0===o?void 0:o.above,r(b,{id:null===(n=this.internalConfig.scrollTracking)||void 0===n?void 0:n.elementId,slots:t(t({},null===(l=this.props.slots)||void 0===l?void 0:l.primaryInputSlots),{},{right:a(s,{children:[(null===(d=this.internalConfig.filterBar)||void 0===d?void 0:d.enableSort)&&r(p,{}),null===(u=this.props.slots)||void 0===u||null===(u=u.primaryInputSlots)||void 0===u?void 0:u.right]})}),children:r(k,{})}),null===(g=this.props.slots)||void 0===g||null===(g=g.filterSlots)||void 0===g?void 0:g.below,null===(h=this.props.slots)||void 0===h||null===(h=h.activeFiltersPanelSlots)||void 0===h?void 0:h.above,a(x,{children:[r(c,{value:this.state.viewMode,onChange:this.onViewModeChangeHandler}),null===(C=this.props.slots)||void 0===C||null===(C=C.activeFiltersPanelSlots)||void 0===C?void 0:C.left,a(f,{flexDirection:"row",sx:{flexWrap:"wrap",alignItems:"center",gap:1,flexGrow:1},children:[r(F,{loading:this.props.loading}),r(v,{sx:{display:"flex",alignItems:"center",gap:1,flexGrow:1,justifyContent:"end"},children:this.internalConfig.enablePaginationTop&&r(T,t({count:null!==(m=null===(w=this.props.data)||void 0===w?void 0:w.totalItems)&&void 0!==m?m:0,defaultFilter:null===(y=this.internalConfig.filterBar)||void 0===y?void 0:y.defaultValue,filter:this.filterState,onChange:this.onFilterStateChangeHandler},this.internalConfig.paginationBar))})]}),null===(B=this.props.slots)||void 0===B||null===(B=B.activeFiltersPanelSlots)||void 0===B?void 0:B.right]}),null===(H=this.props.slots)||void 0===H||null===(H=H.activeFiltersPanelSlots)||void 0===H?void 0:H.below,r(V,{data:null!==(P=null===(j=this.props.data)||void 0===j?void 0:j.items)&&void 0!==P?P:[],viewMode:this.viewMode,loading:this.props.loading,error:this.props.error,autoHeight:this.internalConfig.autoHeight,slots:this.internalConfig.viewMode}),this.renderFooter()]})})}}])}()}var x=u(v)({display:"flex",alignItems:"center",flexWrap:"wrap",gap:"8px",marginBottom:"8px",minHeight:"var(--filter-bar-height, 40px)"}),j=u(v)({display:"flex",justifyContent:"flex-end",width:"100%"});export{b as default};
2
2
  //# sourceMappingURL=create.data-view.js.map