@contember/react-utils 1.3.0-alpha.8 → 2.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (276) hide show
  1. package/dist/development/context/createContext.cjs +10 -0
  2. package/dist/development/context/createContext.cjs.map +1 -0
  3. package/dist/development/context/createContext.js +10 -0
  4. package/dist/development/context/createContext.js.map +1 -0
  5. package/dist/development/context/{createNonNullableContextFactory.cjs → createRequiredContext.cjs} +6 -5
  6. package/dist/development/context/createRequiredContext.cjs.map +1 -0
  7. package/dist/development/context/{createNonNullableContextFactory.js → createRequiredContext.js} +6 -5
  8. package/dist/development/context/createRequiredContext.js.map +1 -0
  9. package/dist/development/hooks/useAutoHeightTextArea.cjs +1 -1
  10. package/dist/development/hooks/useAutoHeightTextArea.cjs.map +1 -1
  11. package/dist/development/hooks/useAutoHeightTextArea.js +1 -1
  12. package/dist/development/hooks/useAutoHeightTextArea.js.map +1 -1
  13. package/dist/development/hooks/useStoredState.cjs +89 -12
  14. package/dist/development/hooks/useStoredState.cjs.map +1 -1
  15. package/dist/development/hooks/useStoredState.js +91 -14
  16. package/dist/development/hooks/useStoredState.js.map +1 -1
  17. package/dist/development/index.cjs +11 -41
  18. package/dist/development/index.cjs.map +1 -1
  19. package/dist/development/index.js +12 -42
  20. package/dist/development/index.js.map +1 -1
  21. package/dist/production/context/createContext.cjs +10 -0
  22. package/dist/production/context/createContext.cjs.map +1 -0
  23. package/dist/production/context/createContext.js +10 -0
  24. package/dist/production/context/createContext.js.map +1 -0
  25. package/dist/production/context/{createNonNullableContextFactory.cjs → createRequiredContext.cjs} +6 -5
  26. package/dist/production/context/createRequiredContext.cjs.map +1 -0
  27. package/dist/production/context/{createNonNullableContextFactory.js → createRequiredContext.js} +6 -5
  28. package/dist/production/context/createRequiredContext.js.map +1 -0
  29. package/dist/production/hooks/useAutoHeightTextArea.cjs +1 -1
  30. package/dist/production/hooks/useAutoHeightTextArea.cjs.map +1 -1
  31. package/dist/production/hooks/useAutoHeightTextArea.js +1 -1
  32. package/dist/production/hooks/useAutoHeightTextArea.js.map +1 -1
  33. package/dist/production/hooks/useStoredState.cjs +89 -12
  34. package/dist/production/hooks/useStoredState.cjs.map +1 -1
  35. package/dist/production/hooks/useStoredState.js +91 -14
  36. package/dist/production/hooks/useStoredState.js.map +1 -1
  37. package/dist/production/index.cjs +11 -41
  38. package/dist/production/index.cjs.map +1 -1
  39. package/dist/production/index.js +12 -42
  40. package/dist/production/index.js.map +1 -1
  41. package/dist/types/context/createContext.d.ts +3 -0
  42. package/dist/types/context/createContext.d.ts.map +1 -0
  43. package/dist/types/context/createRequiredContext.d.ts +3 -0
  44. package/dist/types/context/createRequiredContext.d.ts.map +1 -0
  45. package/dist/types/context/index.d.ts +2 -2
  46. package/dist/types/context/index.d.ts.map +1 -1
  47. package/dist/types/hooks/index.d.ts +0 -10
  48. package/dist/types/hooks/index.d.ts.map +1 -1
  49. package/dist/types/hooks/useArrayMapMemo.d.ts.map +1 -1
  50. package/dist/types/hooks/useConstantLengthInvariant.d.ts.map +1 -1
  51. package/dist/types/hooks/useConstantValueInvariant.d.ts.map +1 -1
  52. package/dist/types/hooks/useDebounce.d.ts.map +1 -1
  53. package/dist/types/hooks/useObjectMemo.d.ts.map +1 -1
  54. package/dist/types/hooks/usePreviousValue.d.ts.map +1 -1
  55. package/dist/types/hooks/useStoredState.d.ts +14 -1
  56. package/dist/types/hooks/useStoredState.d.ts.map +1 -1
  57. package/dist/types/index.d.ts +0 -1
  58. package/dist/types/index.d.ts.map +1 -1
  59. package/dist/types/referentiallyStable/identityFunction.d.ts.map +1 -1
  60. package/dist/types/referentiallyStable/useReferentiallyStableCallback.d.ts.map +1 -1
  61. package/dist/types/tsconfig.tsbuildinfo +1 -1
  62. package/package.json +3 -3
  63. package/src/context/createContext.ts +9 -0
  64. package/src/context/{createNonNullableContextFactory.ts → createRequiredContext.ts} +6 -4
  65. package/src/context/index.ts +2 -2
  66. package/src/hooks/index.ts +0 -10
  67. package/src/hooks/useAutoHeightTextArea.ts +1 -1
  68. package/src/hooks/useStoredState.ts +103 -14
  69. package/src/index.ts +0 -1
  70. package/dist/development/context/createNonNullableContextFactory.cjs.map +0 -1
  71. package/dist/development/context/createNonNullableContextFactory.js.map +0 -1
  72. package/dist/development/context/createOptionalContextFactory.cjs +0 -13
  73. package/dist/development/context/createOptionalContextFactory.cjs.map +0 -1
  74. package/dist/development/context/createOptionalContextFactory.js +0 -13
  75. package/dist/development/context/createOptionalContextFactory.js.map +0 -1
  76. package/dist/development/hooks/useAddClassNameDuringResize.cjs +0 -32
  77. package/dist/development/hooks/useAddClassNameDuringResize.cjs.map +0 -1
  78. package/dist/development/hooks/useAddClassNameDuringResize.js +0 -32
  79. package/dist/development/hooks/useAddClassNameDuringResize.js.map +0 -1
  80. package/dist/development/hooks/useCloseOnClickOutside.cjs +0 -25
  81. package/dist/development/hooks/useCloseOnClickOutside.cjs.map +0 -1
  82. package/dist/development/hooks/useCloseOnClickOutside.js +0 -25
  83. package/dist/development/hooks/useCloseOnClickOutside.js.map +0 -1
  84. package/dist/development/hooks/useCloseOnEscape.cjs +0 -20
  85. package/dist/development/hooks/useCloseOnEscape.cjs.map +0 -1
  86. package/dist/development/hooks/useCloseOnEscape.js +0 -20
  87. package/dist/development/hooks/useCloseOnEscape.js.map +0 -1
  88. package/dist/development/hooks/useContainerWidth.cjs +0 -14
  89. package/dist/development/hooks/useContainerWidth.cjs.map +0 -1
  90. package/dist/development/hooks/useContainerWidth.js +0 -14
  91. package/dist/development/hooks/useContainerWidth.js.map +0 -1
  92. package/dist/development/hooks/useElementSize.cjs +0 -37
  93. package/dist/development/hooks/useElementSize.cjs.map +0 -1
  94. package/dist/development/hooks/useElementSize.js +0 -37
  95. package/dist/development/hooks/useElementSize.js.map +0 -1
  96. package/dist/development/hooks/useElementTopOffset.cjs +0 -29
  97. package/dist/development/hooks/useElementTopOffset.cjs.map +0 -1
  98. package/dist/development/hooks/useElementTopOffset.js +0 -29
  99. package/dist/development/hooks/useElementTopOffset.js.map +0 -1
  100. package/dist/development/hooks/useEventHandler.cjs +0 -19
  101. package/dist/development/hooks/useEventHandler.cjs.map +0 -1
  102. package/dist/development/hooks/useEventHandler.js +0 -19
  103. package/dist/development/hooks/useEventHandler.js.map +0 -1
  104. package/dist/development/hooks/useOnElementMutation.cjs +0 -35
  105. package/dist/development/hooks/useOnElementMutation.cjs.map +0 -1
  106. package/dist/development/hooks/useOnElementMutation.js +0 -35
  107. package/dist/development/hooks/useOnElementMutation.js.map +0 -1
  108. package/dist/development/hooks/useOnScrollWithin.cjs +0 -52
  109. package/dist/development/hooks/useOnScrollWithin.cjs.map +0 -1
  110. package/dist/development/hooks/useOnScrollWithin.js +0 -52
  111. package/dist/development/hooks/useOnScrollWithin.js.map +0 -1
  112. package/dist/development/hooks/useScrollOffsets.cjs +0 -67
  113. package/dist/development/hooks/useScrollOffsets.cjs.map +0 -1
  114. package/dist/development/hooks/useScrollOffsets.js +0 -67
  115. package/dist/development/hooks/useScrollOffsets.js.map +0 -1
  116. package/dist/development/theming/ColorSchemeProvider.cjs +0 -16
  117. package/dist/development/theming/ColorSchemeProvider.cjs.map +0 -1
  118. package/dist/development/theming/ColorSchemeProvider.js +0 -16
  119. package/dist/development/theming/ColorSchemeProvider.js.map +0 -1
  120. package/dist/development/theming/GlobalClassNamePrefixContext.cjs +0 -6
  121. package/dist/development/theming/GlobalClassNamePrefixContext.cjs.map +0 -1
  122. package/dist/development/theming/GlobalClassNamePrefixContext.js +0 -6
  123. package/dist/development/theming/GlobalClassNamePrefixContext.js.map +0 -1
  124. package/dist/development/theming/contexts.cjs +0 -12
  125. package/dist/development/theming/contexts.cjs.map +0 -1
  126. package/dist/development/theming/contexts.js +0 -12
  127. package/dist/development/theming/contexts.js.map +0 -1
  128. package/dist/development/theming/useClassName.cjs +0 -17
  129. package/dist/development/theming/useClassName.cjs.map +0 -1
  130. package/dist/development/theming/useClassName.js +0 -17
  131. package/dist/development/theming/useClassName.js.map +0 -1
  132. package/dist/development/theming/useClassNameFactory.cjs +0 -22
  133. package/dist/development/theming/useClassNameFactory.cjs.map +0 -1
  134. package/dist/development/theming/useClassNameFactory.js +0 -22
  135. package/dist/development/theming/useClassNameFactory.js.map +0 -1
  136. package/dist/development/theming/useThemedClassName.cjs +0 -17
  137. package/dist/development/theming/useThemedClassName.cjs.map +0 -1
  138. package/dist/development/theming/useThemedClassName.js +0 -17
  139. package/dist/development/theming/useThemedClassName.js.map +0 -1
  140. package/dist/development/theming/useThemedClassNameFactory.cjs +0 -29
  141. package/dist/development/theming/useThemedClassNameFactory.cjs.map +0 -1
  142. package/dist/development/theming/useThemedClassNameFactory.js +0 -29
  143. package/dist/development/theming/useThemedClassNameFactory.js.map +0 -1
  144. package/dist/production/context/createNonNullableContextFactory.cjs.map +0 -1
  145. package/dist/production/context/createNonNullableContextFactory.js.map +0 -1
  146. package/dist/production/context/createOptionalContextFactory.cjs +0 -13
  147. package/dist/production/context/createOptionalContextFactory.cjs.map +0 -1
  148. package/dist/production/context/createOptionalContextFactory.js +0 -13
  149. package/dist/production/context/createOptionalContextFactory.js.map +0 -1
  150. package/dist/production/hooks/useAddClassNameDuringResize.cjs +0 -32
  151. package/dist/production/hooks/useAddClassNameDuringResize.cjs.map +0 -1
  152. package/dist/production/hooks/useAddClassNameDuringResize.js +0 -32
  153. package/dist/production/hooks/useAddClassNameDuringResize.js.map +0 -1
  154. package/dist/production/hooks/useCloseOnClickOutside.cjs +0 -25
  155. package/dist/production/hooks/useCloseOnClickOutside.cjs.map +0 -1
  156. package/dist/production/hooks/useCloseOnClickOutside.js +0 -25
  157. package/dist/production/hooks/useCloseOnClickOutside.js.map +0 -1
  158. package/dist/production/hooks/useCloseOnEscape.cjs +0 -20
  159. package/dist/production/hooks/useCloseOnEscape.cjs.map +0 -1
  160. package/dist/production/hooks/useCloseOnEscape.js +0 -20
  161. package/dist/production/hooks/useCloseOnEscape.js.map +0 -1
  162. package/dist/production/hooks/useContainerWidth.cjs +0 -14
  163. package/dist/production/hooks/useContainerWidth.cjs.map +0 -1
  164. package/dist/production/hooks/useContainerWidth.js +0 -14
  165. package/dist/production/hooks/useContainerWidth.js.map +0 -1
  166. package/dist/production/hooks/useElementSize.cjs +0 -37
  167. package/dist/production/hooks/useElementSize.cjs.map +0 -1
  168. package/dist/production/hooks/useElementSize.js +0 -37
  169. package/dist/production/hooks/useElementSize.js.map +0 -1
  170. package/dist/production/hooks/useElementTopOffset.cjs +0 -29
  171. package/dist/production/hooks/useElementTopOffset.cjs.map +0 -1
  172. package/dist/production/hooks/useElementTopOffset.js +0 -29
  173. package/dist/production/hooks/useElementTopOffset.js.map +0 -1
  174. package/dist/production/hooks/useEventHandler.cjs +0 -19
  175. package/dist/production/hooks/useEventHandler.cjs.map +0 -1
  176. package/dist/production/hooks/useEventHandler.js +0 -19
  177. package/dist/production/hooks/useEventHandler.js.map +0 -1
  178. package/dist/production/hooks/useOnElementMutation.cjs +0 -35
  179. package/dist/production/hooks/useOnElementMutation.cjs.map +0 -1
  180. package/dist/production/hooks/useOnElementMutation.js +0 -35
  181. package/dist/production/hooks/useOnElementMutation.js.map +0 -1
  182. package/dist/production/hooks/useOnScrollWithin.cjs +0 -52
  183. package/dist/production/hooks/useOnScrollWithin.cjs.map +0 -1
  184. package/dist/production/hooks/useOnScrollWithin.js +0 -52
  185. package/dist/production/hooks/useOnScrollWithin.js.map +0 -1
  186. package/dist/production/hooks/useScrollOffsets.cjs +0 -67
  187. package/dist/production/hooks/useScrollOffsets.cjs.map +0 -1
  188. package/dist/production/hooks/useScrollOffsets.js +0 -67
  189. package/dist/production/hooks/useScrollOffsets.js.map +0 -1
  190. package/dist/production/theming/ColorSchemeProvider.cjs +0 -12
  191. package/dist/production/theming/ColorSchemeProvider.cjs.map +0 -1
  192. package/dist/production/theming/ColorSchemeProvider.js +0 -12
  193. package/dist/production/theming/ColorSchemeProvider.js.map +0 -1
  194. package/dist/production/theming/GlobalClassNamePrefixContext.cjs +0 -6
  195. package/dist/production/theming/GlobalClassNamePrefixContext.cjs.map +0 -1
  196. package/dist/production/theming/GlobalClassNamePrefixContext.js +0 -6
  197. package/dist/production/theming/GlobalClassNamePrefixContext.js.map +0 -1
  198. package/dist/production/theming/contexts.cjs +0 -12
  199. package/dist/production/theming/contexts.cjs.map +0 -1
  200. package/dist/production/theming/contexts.js +0 -12
  201. package/dist/production/theming/contexts.js.map +0 -1
  202. package/dist/production/theming/useClassName.cjs +0 -17
  203. package/dist/production/theming/useClassName.cjs.map +0 -1
  204. package/dist/production/theming/useClassName.js +0 -17
  205. package/dist/production/theming/useClassName.js.map +0 -1
  206. package/dist/production/theming/useClassNameFactory.cjs +0 -22
  207. package/dist/production/theming/useClassNameFactory.cjs.map +0 -1
  208. package/dist/production/theming/useClassNameFactory.js +0 -22
  209. package/dist/production/theming/useClassNameFactory.js.map +0 -1
  210. package/dist/production/theming/useThemedClassName.cjs +0 -17
  211. package/dist/production/theming/useThemedClassName.cjs.map +0 -1
  212. package/dist/production/theming/useThemedClassName.js +0 -17
  213. package/dist/production/theming/useThemedClassName.js.map +0 -1
  214. package/dist/production/theming/useThemedClassNameFactory.cjs +0 -29
  215. package/dist/production/theming/useThemedClassNameFactory.cjs.map +0 -1
  216. package/dist/production/theming/useThemedClassNameFactory.js +0 -29
  217. package/dist/production/theming/useThemedClassNameFactory.js.map +0 -1
  218. package/dist/types/context/createNonNullableContextFactory.d.ts +0 -3
  219. package/dist/types/context/createNonNullableContextFactory.d.ts.map +0 -1
  220. package/dist/types/context/createOptionalContextFactory.d.ts +0 -3
  221. package/dist/types/context/createOptionalContextFactory.d.ts.map +0 -1
  222. package/dist/types/hooks/useAddClassNameDuringResize.d.ts +0 -13
  223. package/dist/types/hooks/useAddClassNameDuringResize.d.ts.map +0 -1
  224. package/dist/types/hooks/useCloseOnClickOutside.d.ts +0 -7
  225. package/dist/types/hooks/useCloseOnClickOutside.d.ts.map +0 -1
  226. package/dist/types/hooks/useCloseOnEscape.d.ts +0 -5
  227. package/dist/types/hooks/useCloseOnEscape.d.ts.map +0 -1
  228. package/dist/types/hooks/useContainerWidth.d.ts +0 -4
  229. package/dist/types/hooks/useContainerWidth.d.ts.map +0 -1
  230. package/dist/types/hooks/useElementSize.d.ts +0 -16
  231. package/dist/types/hooks/useElementSize.d.ts.map +0 -1
  232. package/dist/types/hooks/useElementTopOffset.d.ts +0 -3
  233. package/dist/types/hooks/useElementTopOffset.d.ts.map +0 -1
  234. package/dist/types/hooks/useEventHandler.d.ts +0 -10
  235. package/dist/types/hooks/useEventHandler.d.ts.map +0 -1
  236. package/dist/types/hooks/useOnElementMutation.d.ts +0 -3
  237. package/dist/types/hooks/useOnElementMutation.d.ts.map +0 -1
  238. package/dist/types/hooks/useOnScrollWithin.d.ts +0 -10
  239. package/dist/types/hooks/useOnScrollWithin.d.ts.map +0 -1
  240. package/dist/types/hooks/useScrollOffsets.d.ts +0 -14
  241. package/dist/types/hooks/useScrollOffsets.d.ts.map +0 -1
  242. package/dist/types/theming/ColorSchemeProvider.d.ts +0 -6
  243. package/dist/types/theming/ColorSchemeProvider.d.ts.map +0 -1
  244. package/dist/types/theming/GlobalClassNamePrefixContext.d.ts +0 -2
  245. package/dist/types/theming/GlobalClassNamePrefixContext.d.ts.map +0 -1
  246. package/dist/types/theming/contexts.d.ts +0 -12
  247. package/dist/types/theming/contexts.d.ts.map +0 -1
  248. package/dist/types/theming/index.d.ts +0 -8
  249. package/dist/types/theming/index.d.ts.map +0 -1
  250. package/dist/types/theming/useClassName.d.ts +0 -11
  251. package/dist/types/theming/useClassName.d.ts.map +0 -1
  252. package/dist/types/theming/useClassNameFactory.d.ts +0 -17
  253. package/dist/types/theming/useClassNameFactory.d.ts.map +0 -1
  254. package/dist/types/theming/useThemedClassName.d.ts +0 -39
  255. package/dist/types/theming/useThemedClassName.d.ts.map +0 -1
  256. package/dist/types/theming/useThemedClassNameFactory.d.ts +0 -3
  257. package/dist/types/theming/useThemedClassNameFactory.d.ts.map +0 -1
  258. package/src/context/createOptionalContextFactory.ts +0 -13
  259. package/src/hooks/useAddClassNameDuringResize.ts +0 -56
  260. package/src/hooks/useCloseOnClickOutside.ts +0 -27
  261. package/src/hooks/useCloseOnEscape.ts +0 -18
  262. package/src/hooks/useContainerWidth.ts +0 -13
  263. package/src/hooks/useElementSize.ts +0 -56
  264. package/src/hooks/useElementTopOffset.ts +0 -35
  265. package/src/hooks/useEventHandler.ts +0 -24
  266. package/src/hooks/useOnElementMutation.ts +0 -42
  267. package/src/hooks/useOnScrollWithin.ts +0 -68
  268. package/src/hooks/useScrollOffsets.ts +0 -87
  269. package/src/theming/ColorSchemeProvider.tsx +0 -16
  270. package/src/theming/GlobalClassNamePrefixContext.ts +0 -3
  271. package/src/theming/contexts.ts +0 -18
  272. package/src/theming/index.ts +0 -7
  273. package/src/theming/useClassName.ts +0 -28
  274. package/src/theming/useClassNameFactory.ts +0 -50
  275. package/src/theming/useThemedClassName.ts +0 -54
  276. package/src/theming/useThemedClassNameFactory.ts +0 -44
@@ -1,67 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const utilities = require("@contember/utilities");
4
- const react = require("react");
5
- const unwrapRefValue = require("./unwrapRefValue.cjs");
6
- const useOnScrollWithin = require("./useOnScrollWithin.cjs");
7
- const useOnWindowResize = require("./useOnWindowResize.cjs");
8
- const Context = require("../debug-context/Context.cjs");
9
- const useReferentiallyStableCallback = require("../referentiallyStable/useReferentiallyStableCallback.cjs");
10
- function useScrollOffsets(refOrElement, interval = 1e3 / 60) {
11
- const { logged } = Context.useScopedConsoleRef("useScrollOffsets").current;
12
- const [top, setTop] = react.useState(0);
13
- const [bottom, setBottom] = react.useState(0);
14
- const [left, setLeft] = react.useState(0);
15
- const [right, setRight] = react.useState(0);
16
- const updateScrollOffsetsState = useReferentiallyStableCallback.useReferentiallyStableCallback((offsets) => {
17
- logged("Update the offsets:", {
18
- previous: { bottom, left, right, top },
19
- next: offsets
20
- });
21
- if (offsets.bottom !== bottom)
22
- setBottom(offsets.bottom);
23
- if (offsets.left !== left)
24
- setLeft(offsets.left);
25
- if (offsets.right !== right)
26
- setRight(offsets.right);
27
- if (offsets.top !== top)
28
- setTop(offsets.top);
29
- });
30
- const handler = useReferentiallyStableCallback.useReferentiallyStableCallback(() => {
31
- const maybeScrollContent = unwrapRefValue.unwrapRefValue(refOrElement) ?? document;
32
- if (maybeScrollContent) {
33
- getElementScrollOffsets(maybeScrollContent).then(updateScrollOffsetsState);
34
- }
35
- });
36
- useOnScrollWithin.useOnScrollWithin(refOrElement, handler, interval);
37
- useOnWindowResize.useOnWindowResize(handler);
38
- react.useLayoutEffect(handler, [handler]);
39
- return react.useMemo(() => ({ bottom, left, right, top }), [bottom, left, right, top]);
40
- }
41
- function isIntrinsicScrollElement(element) {
42
- return element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement || element instanceof DocumentType || element instanceof Document || element instanceof HTMLDocument;
43
- }
44
- function getIntrinsicScrollContainer(element) {
45
- const html = document.body.parentElement;
46
- utilities.assert("HTML element exists", html, (value) => value instanceof HTMLElement);
47
- if (isIntrinsicScrollElement(element)) {
48
- return html;
49
- } else {
50
- return element;
51
- }
52
- }
53
- async function getElementScrollOffsets(element) {
54
- const isIntrinsicScrolling = isIntrinsicScrollElement(element);
55
- const scrollContainer = getIntrinsicScrollContainer(element);
56
- const { scrollLeft, scrollTop, scrollHeight, scrollWidth } = scrollContainer;
57
- const { height: scrollContainerHeight, width: scrollContainerWidth } = await utilities.getElementDimensions(scrollContainer);
58
- const height = isIntrinsicScrolling ? window.innerHeight : scrollContainerHeight;
59
- const width = isIntrinsicScrolling ? window.innerWidth : scrollContainerWidth;
60
- const left = Math.round(scrollLeft);
61
- const top = Math.round(scrollTop);
62
- const right = Math.round(scrollWidth - width - left);
63
- const bottom = Math.round(scrollHeight - height - top);
64
- return { bottom, left, right, top };
65
- }
66
- exports.useScrollOffsets = useScrollOffsets;
67
- //# sourceMappingURL=useScrollOffsets.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useScrollOffsets.cjs","sources":["../../../src/hooks/useScrollOffsets.ts"],"sourcesContent":["import { assert, getElementDimensions } from '@contember/utilities'\nimport { useLayoutEffect, useMemo, useState } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnScrollWithin } from './useOnScrollWithin'\nimport { useOnWindowResize } from './useOnWindowResize'\n\nexport type Offsets = {\n\tbottom: number;\n\tleft: number;\n\tright: number;\n\ttop: number;\n}\n\nexport function useScrollOffsets(refOrElement: RefObjectOrElement<HTMLElement | null> | null, interval: number = 1000 / 60) {\n\tconst { logged } = useScopedConsoleRef('useScrollOffsets').current\n\n\tconst [top, setTop] = useState(0)\n\tconst [bottom, setBottom] = useState(0)\n\tconst [left, setLeft] = useState(0)\n\tconst [right, setRight] = useState(0)\n\n\tconst updateScrollOffsetsState = useReferentiallyStableCallback((offsets: Offsets) => {\n\t\tlogged('Update the offsets:', {\n\t\t\tprevious: { bottom, left, right, top },\n\t\t\tnext: offsets,\n\t\t})\n\n\t\tif (offsets.bottom !== bottom) setBottom(offsets.bottom)\n\t\tif (offsets.left !== left) setLeft(offsets.left)\n\t\tif (offsets.right !== right) setRight(offsets.right)\n\t\tif (offsets.top !== top) setTop(offsets.top)\n\t})\n\n\tconst handler = useReferentiallyStableCallback(() => {\n\t\tconst maybeScrollContent = unwrapRefValue(refOrElement) ?? document\n\n\t\tif (maybeScrollContent) {\n\t\t\tgetElementScrollOffsets(maybeScrollContent).then(updateScrollOffsetsState)\n\t\t}\n\t})\n\n\tuseOnScrollWithin(refOrElement, handler, interval)\n\tuseOnWindowResize(handler)\n\tuseLayoutEffect(handler, [handler])\n\n\treturn useMemo(() => ({ bottom, left, right, top }), [bottom, left, right, top])\n}\n\nfunction isIntrinsicScrollElement(element: unknown): element is Document {\n\treturn element instanceof HTMLBodyElement\n\t\t|| element instanceof HTMLHtmlElement\n\t\t|| element instanceof DocumentType\n\t\t|| element instanceof Document\n\t\t|| element instanceof HTMLDocument\n}\n\nfunction getIntrinsicScrollContainer(element: HTMLElement | Document): HTMLElement {\n\tconst html = document.body.parentElement\n\tassert('HTML element exists', html, (value): value is HTMLElement => value instanceof HTMLElement)\n\n\tif (isIntrinsicScrollElement(element)) {\n\t\treturn html\n\t} else {\n\t\treturn element\n\t}\n}\n\nasync function getElementScrollOffsets(element: HTMLElement | Document): Promise<Offsets> {\n\tconst isIntrinsicScrolling = isIntrinsicScrollElement(element)\n\tconst scrollContainer = getIntrinsicScrollContainer(element)\n\n\tconst { scrollLeft, scrollTop, scrollHeight, scrollWidth } = scrollContainer\n\tconst { height: scrollContainerHeight, width: scrollContainerWidth } = await getElementDimensions(scrollContainer)\n\n\tconst height = isIntrinsicScrolling ? window.innerHeight : scrollContainerHeight\n\tconst width = isIntrinsicScrolling ? window.innerWidth : scrollContainerWidth\n\n\tconst left = Math.round(scrollLeft)\n\tconst top = Math.round(scrollTop)\n\n\tconst right = Math.round(scrollWidth - width - left)\n\tconst bottom = Math.round(scrollHeight - height - top)\n\n\treturn { bottom, left, right, top }\n}\n"],"names":["useScopedConsoleRef","useState","useReferentiallyStableCallback","unwrapRefValue","useOnScrollWithin","useOnWindowResize","useLayoutEffect","useMemo","assert","getElementDimensions"],"mappings":";;;;;;;;;AAeO,SAAS,iBAAiB,cAA6D,WAAmB,MAAO,IAAI;AAC3H,QAAM,EAAE,OAAW,IAAAA,QAAA,oBAAoB,kBAAkB,EAAE;AAE3D,QAAM,CAAC,KAAK,MAAM,IAAIC,eAAS,CAAC;AAChC,QAAM,CAAC,QAAQ,SAAS,IAAIA,eAAS,CAAC;AACtC,QAAM,CAAC,MAAM,OAAO,IAAIA,eAAS,CAAC;AAClC,QAAM,CAAC,OAAO,QAAQ,IAAIA,eAAS,CAAC;AAE9B,QAAA,2BAA2BC,8DAA+B,CAAC,YAAqB;AACrF,WAAO,uBAAuB;AAAA,MAC7B,UAAU,EAAE,QAAQ,MAAM,OAAO,IAAI;AAAA,MACrC,MAAM;AAAA,IAAA,CACN;AAED,QAAI,QAAQ,WAAW;AAAQ,gBAAU,QAAQ,MAAM;AACvD,QAAI,QAAQ,SAAS;AAAM,cAAQ,QAAQ,IAAI;AAC/C,QAAI,QAAQ,UAAU;AAAO,eAAS,QAAQ,KAAK;AACnD,QAAI,QAAQ,QAAQ;AAAK,aAAO,QAAQ,GAAG;AAAA,EAAA,CAC3C;AAEK,QAAA,UAAUA,+BAAAA,+BAA+B,MAAM;AAC9C,UAAA,qBAAqBC,eAAAA,eAAe,YAAY,KAAK;AAE3D,QAAI,oBAAoB;AACC,8BAAA,kBAAkB,EAAE,KAAK,wBAAwB;AAAA,IAC1E;AAAA,EAAA,CACA;AAEiBC,oBAAAA,kBAAA,cAAc,SAAS,QAAQ;AACjDC,oBAAA,kBAAkB,OAAO;AACTC,QAAAA,gBAAA,SAAS,CAAC,OAAO,CAAC;AAElC,SAAOC,MAAQ,QAAA,OAAO,EAAE,QAAQ,MAAM,OAAO,QAAQ,CAAC,QAAQ,MAAM,OAAO,GAAG,CAAC;AAChF;AAEA,SAAS,yBAAyB,SAAuC;AACjE,SAAA,mBAAmB,mBACtB,mBAAmB,mBACnB,mBAAmB,gBACnB,mBAAmB,YACnB,mBAAmB;AACxB;AAEA,SAAS,4BAA4B,SAA8C;AAC5E,QAAA,OAAO,SAAS,KAAK;AAC3BC,YAAA,OAAO,uBAAuB,MAAM,CAAC,UAAgC,iBAAiB,WAAW;AAE7F,MAAA,yBAAyB,OAAO,GAAG;AAC/B,WAAA;AAAA,EAAA,OACD;AACC,WAAA;AAAA,EACR;AACD;AAEA,eAAe,wBAAwB,SAAmD;AACnF,QAAA,uBAAuB,yBAAyB,OAAO;AACvD,QAAA,kBAAkB,4BAA4B,OAAO;AAE3D,QAAM,EAAE,YAAY,WAAW,cAAc,gBAAgB;AACvD,QAAA,EAAE,QAAQ,uBAAuB,OAAO,yBAAyB,MAAMC,UAAAA,qBAAqB,eAAe;AAE3G,QAAA,SAAS,uBAAuB,OAAO,cAAc;AACrD,QAAA,QAAQ,uBAAuB,OAAO,aAAa;AAEnD,QAAA,OAAO,KAAK,MAAM,UAAU;AAC5B,QAAA,MAAM,KAAK,MAAM,SAAS;AAEhC,QAAM,QAAQ,KAAK,MAAM,cAAc,QAAQ,IAAI;AACnD,QAAM,SAAS,KAAK,MAAM,eAAe,SAAS,GAAG;AAErD,SAAO,EAAE,QAAQ,MAAM,OAAO,IAAI;AACnC;;"}
@@ -1,67 +0,0 @@
1
- import { getElementDimensions, assert } from "@contember/utilities";
2
- import { useState, useLayoutEffect, useMemo } from "react";
3
- import { unwrapRefValue } from "./unwrapRefValue.js";
4
- import { useOnScrollWithin } from "./useOnScrollWithin.js";
5
- import { useOnWindowResize } from "./useOnWindowResize.js";
6
- import { useScopedConsoleRef } from "../debug-context/Context.js";
7
- import { useReferentiallyStableCallback } from "../referentiallyStable/useReferentiallyStableCallback.js";
8
- function useScrollOffsets(refOrElement, interval = 1e3 / 60) {
9
- const { logged } = useScopedConsoleRef("useScrollOffsets").current;
10
- const [top, setTop] = useState(0);
11
- const [bottom, setBottom] = useState(0);
12
- const [left, setLeft] = useState(0);
13
- const [right, setRight] = useState(0);
14
- const updateScrollOffsetsState = useReferentiallyStableCallback((offsets) => {
15
- logged("Update the offsets:", {
16
- previous: { bottom, left, right, top },
17
- next: offsets
18
- });
19
- if (offsets.bottom !== bottom)
20
- setBottom(offsets.bottom);
21
- if (offsets.left !== left)
22
- setLeft(offsets.left);
23
- if (offsets.right !== right)
24
- setRight(offsets.right);
25
- if (offsets.top !== top)
26
- setTop(offsets.top);
27
- });
28
- const handler = useReferentiallyStableCallback(() => {
29
- const maybeScrollContent = unwrapRefValue(refOrElement) ?? document;
30
- if (maybeScrollContent) {
31
- getElementScrollOffsets(maybeScrollContent).then(updateScrollOffsetsState);
32
- }
33
- });
34
- useOnScrollWithin(refOrElement, handler, interval);
35
- useOnWindowResize(handler);
36
- useLayoutEffect(handler, [handler]);
37
- return useMemo(() => ({ bottom, left, right, top }), [bottom, left, right, top]);
38
- }
39
- function isIntrinsicScrollElement(element) {
40
- return element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement || element instanceof DocumentType || element instanceof Document || element instanceof HTMLDocument;
41
- }
42
- function getIntrinsicScrollContainer(element) {
43
- const html = document.body.parentElement;
44
- assert("HTML element exists", html, (value) => value instanceof HTMLElement);
45
- if (isIntrinsicScrollElement(element)) {
46
- return html;
47
- } else {
48
- return element;
49
- }
50
- }
51
- async function getElementScrollOffsets(element) {
52
- const isIntrinsicScrolling = isIntrinsicScrollElement(element);
53
- const scrollContainer = getIntrinsicScrollContainer(element);
54
- const { scrollLeft, scrollTop, scrollHeight, scrollWidth } = scrollContainer;
55
- const { height: scrollContainerHeight, width: scrollContainerWidth } = await getElementDimensions(scrollContainer);
56
- const height = isIntrinsicScrolling ? window.innerHeight : scrollContainerHeight;
57
- const width = isIntrinsicScrolling ? window.innerWidth : scrollContainerWidth;
58
- const left = Math.round(scrollLeft);
59
- const top = Math.round(scrollTop);
60
- const right = Math.round(scrollWidth - width - left);
61
- const bottom = Math.round(scrollHeight - height - top);
62
- return { bottom, left, right, top };
63
- }
64
- export {
65
- useScrollOffsets
66
- };
67
- //# sourceMappingURL=useScrollOffsets.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useScrollOffsets.js","sources":["../../../src/hooks/useScrollOffsets.ts"],"sourcesContent":["import { assert, getElementDimensions } from '@contember/utilities'\nimport { useLayoutEffect, useMemo, useState } from 'react'\nimport { useScopedConsoleRef } from '../debug-context'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnScrollWithin } from './useOnScrollWithin'\nimport { useOnWindowResize } from './useOnWindowResize'\n\nexport type Offsets = {\n\tbottom: number;\n\tleft: number;\n\tright: number;\n\ttop: number;\n}\n\nexport function useScrollOffsets(refOrElement: RefObjectOrElement<HTMLElement | null> | null, interval: number = 1000 / 60) {\n\tconst { logged } = useScopedConsoleRef('useScrollOffsets').current\n\n\tconst [top, setTop] = useState(0)\n\tconst [bottom, setBottom] = useState(0)\n\tconst [left, setLeft] = useState(0)\n\tconst [right, setRight] = useState(0)\n\n\tconst updateScrollOffsetsState = useReferentiallyStableCallback((offsets: Offsets) => {\n\t\tlogged('Update the offsets:', {\n\t\t\tprevious: { bottom, left, right, top },\n\t\t\tnext: offsets,\n\t\t})\n\n\t\tif (offsets.bottom !== bottom) setBottom(offsets.bottom)\n\t\tif (offsets.left !== left) setLeft(offsets.left)\n\t\tif (offsets.right !== right) setRight(offsets.right)\n\t\tif (offsets.top !== top) setTop(offsets.top)\n\t})\n\n\tconst handler = useReferentiallyStableCallback(() => {\n\t\tconst maybeScrollContent = unwrapRefValue(refOrElement) ?? document\n\n\t\tif (maybeScrollContent) {\n\t\t\tgetElementScrollOffsets(maybeScrollContent).then(updateScrollOffsetsState)\n\t\t}\n\t})\n\n\tuseOnScrollWithin(refOrElement, handler, interval)\n\tuseOnWindowResize(handler)\n\tuseLayoutEffect(handler, [handler])\n\n\treturn useMemo(() => ({ bottom, left, right, top }), [bottom, left, right, top])\n}\n\nfunction isIntrinsicScrollElement(element: unknown): element is Document {\n\treturn element instanceof HTMLBodyElement\n\t\t|| element instanceof HTMLHtmlElement\n\t\t|| element instanceof DocumentType\n\t\t|| element instanceof Document\n\t\t|| element instanceof HTMLDocument\n}\n\nfunction getIntrinsicScrollContainer(element: HTMLElement | Document): HTMLElement {\n\tconst html = document.body.parentElement\n\tassert('HTML element exists', html, (value): value is HTMLElement => value instanceof HTMLElement)\n\n\tif (isIntrinsicScrollElement(element)) {\n\t\treturn html\n\t} else {\n\t\treturn element\n\t}\n}\n\nasync function getElementScrollOffsets(element: HTMLElement | Document): Promise<Offsets> {\n\tconst isIntrinsicScrolling = isIntrinsicScrollElement(element)\n\tconst scrollContainer = getIntrinsicScrollContainer(element)\n\n\tconst { scrollLeft, scrollTop, scrollHeight, scrollWidth } = scrollContainer\n\tconst { height: scrollContainerHeight, width: scrollContainerWidth } = await getElementDimensions(scrollContainer)\n\n\tconst height = isIntrinsicScrolling ? window.innerHeight : scrollContainerHeight\n\tconst width = isIntrinsicScrolling ? window.innerWidth : scrollContainerWidth\n\n\tconst left = Math.round(scrollLeft)\n\tconst top = Math.round(scrollTop)\n\n\tconst right = Math.round(scrollWidth - width - left)\n\tconst bottom = Math.round(scrollHeight - height - top)\n\n\treturn { bottom, left, right, top }\n}\n"],"names":[],"mappings":";;;;;;;AAeO,SAAS,iBAAiB,cAA6D,WAAmB,MAAO,IAAI;AAC3H,QAAM,EAAE,OAAW,IAAA,oBAAoB,kBAAkB,EAAE;AAE3D,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,CAAC;AAChC,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,CAAC;AACtC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC;AAClC,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,CAAC;AAE9B,QAAA,2BAA2B,+BAA+B,CAAC,YAAqB;AACrF,WAAO,uBAAuB;AAAA,MAC7B,UAAU,EAAE,QAAQ,MAAM,OAAO,IAAI;AAAA,MACrC,MAAM;AAAA,IAAA,CACN;AAED,QAAI,QAAQ,WAAW;AAAQ,gBAAU,QAAQ,MAAM;AACvD,QAAI,QAAQ,SAAS;AAAM,cAAQ,QAAQ,IAAI;AAC/C,QAAI,QAAQ,UAAU;AAAO,eAAS,QAAQ,KAAK;AACnD,QAAI,QAAQ,QAAQ;AAAK,aAAO,QAAQ,GAAG;AAAA,EAAA,CAC3C;AAEK,QAAA,UAAU,+BAA+B,MAAM;AAC9C,UAAA,qBAAqB,eAAe,YAAY,KAAK;AAE3D,QAAI,oBAAoB;AACC,8BAAA,kBAAkB,EAAE,KAAK,wBAAwB;AAAA,IAC1E;AAAA,EAAA,CACA;AAEiB,oBAAA,cAAc,SAAS,QAAQ;AACjD,oBAAkB,OAAO;AACT,kBAAA,SAAS,CAAC,OAAO,CAAC;AAElC,SAAO,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,QAAQ,CAAC,QAAQ,MAAM,OAAO,GAAG,CAAC;AAChF;AAEA,SAAS,yBAAyB,SAAuC;AACjE,SAAA,mBAAmB,mBACtB,mBAAmB,mBACnB,mBAAmB,gBACnB,mBAAmB,YACnB,mBAAmB;AACxB;AAEA,SAAS,4BAA4B,SAA8C;AAC5E,QAAA,OAAO,SAAS,KAAK;AAC3B,SAAO,uBAAuB,MAAM,CAAC,UAAgC,iBAAiB,WAAW;AAE7F,MAAA,yBAAyB,OAAO,GAAG;AAC/B,WAAA;AAAA,EAAA,OACD;AACC,WAAA;AAAA,EACR;AACD;AAEA,eAAe,wBAAwB,SAAmD;AACnF,QAAA,uBAAuB,yBAAyB,OAAO;AACvD,QAAA,kBAAkB,4BAA4B,OAAO;AAE3D,QAAM,EAAE,YAAY,WAAW,cAAc,gBAAgB;AACvD,QAAA,EAAE,QAAQ,uBAAuB,OAAO,yBAAyB,MAAM,qBAAqB,eAAe;AAE3G,QAAA,SAAS,uBAAuB,OAAO,cAAc;AACrD,QAAA,QAAQ,uBAAuB,OAAO,aAAa;AAEnD,QAAA,OAAO,KAAK,MAAM,UAAU;AAC5B,QAAA,MAAM,KAAK,MAAM,SAAS;AAEhC,QAAM,QAAQ,KAAK,MAAM,cAAc,QAAQ,IAAI;AACnD,QAAM,SAAS,KAAK,MAAM,eAAe,SAAS,GAAG;AAErD,SAAO,EAAE,QAAQ,MAAM,OAAO,IAAI;AACnC;"}
@@ -1,12 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const jsxRuntime = require("react/jsx-runtime");
4
- const react = require("react");
5
- const contexts = require("./contexts.cjs");
6
- const ColorSchemeProvider = react.memo(({ children, scheme }) => {
7
- const inheritedColorScheme = contexts.useColorScheme();
8
- return /* @__PURE__ */ jsxRuntime.jsx(contexts.ColorSchemeContext.Provider, { value: scheme ?? inheritedColorScheme, children });
9
- });
10
- ColorSchemeProvider.displayName = "Interface.ColorSchemeProvider";
11
- exports.ColorSchemeProvider = ColorSchemeProvider;
12
- //# sourceMappingURL=ColorSchemeProvider.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColorSchemeProvider.cjs","sources":["../../../src/theming/ColorSchemeProvider.tsx"],"sourcesContent":["import { memo } from 'react'\nimport { ColorSchemeContext, useColorScheme } from './contexts'\n\nexport type ColorSchemeProviderProps = {\n\tchildren: React.ReactNode\n\tscheme?: string\n}\n\nexport const ColorSchemeProvider = memo(({ children, scheme }: ColorSchemeProviderProps) => {\n\tconst inheritedColorScheme = useColorScheme()\n\n\treturn (\n\t\t<ColorSchemeContext.Provider value={scheme ?? inheritedColorScheme}>{children}</ColorSchemeContext.Provider>\n\t)\n})\nColorSchemeProvider.displayName = 'Interface.ColorSchemeProvider'\n"],"names":["memo","useColorScheme","ColorSchemeContext"],"mappings":";;;;;AAQO,MAAM,sBAAsBA,MAAAA,KAAK,CAAC,EAAE,UAAU,aAAuC;AAC3F,QAAM,uBAAuBC,SAAAA;AAE7B,wCACEC,SAAmB,mBAAA,UAAnB,EAA4B,OAAO,UAAU,sBAAuB,SAAS,CAAA;AAEhF,CAAC;AACD,oBAAoB,cAAc;;"}
@@ -1,12 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { memo } from "react";
3
- import { useColorScheme, ColorSchemeContext } from "./contexts.js";
4
- const ColorSchemeProvider = memo(({ children, scheme }) => {
5
- const inheritedColorScheme = useColorScheme();
6
- return /* @__PURE__ */ jsx(ColorSchemeContext.Provider, { value: scheme ?? inheritedColorScheme, children });
7
- });
8
- ColorSchemeProvider.displayName = "Interface.ColorSchemeProvider";
9
- export {
10
- ColorSchemeProvider
11
- };
12
- //# sourceMappingURL=ColorSchemeProvider.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ColorSchemeProvider.js","sources":["../../../src/theming/ColorSchemeProvider.tsx"],"sourcesContent":["import { memo } from 'react'\nimport { ColorSchemeContext, useColorScheme } from './contexts'\n\nexport type ColorSchemeProviderProps = {\n\tchildren: React.ReactNode\n\tscheme?: string\n}\n\nexport const ColorSchemeProvider = memo(({ children, scheme }: ColorSchemeProviderProps) => {\n\tconst inheritedColorScheme = useColorScheme()\n\n\treturn (\n\t\t<ColorSchemeContext.Provider value={scheme ?? inheritedColorScheme}>{children}</ColorSchemeContext.Provider>\n\t)\n})\nColorSchemeProvider.displayName = 'Interface.ColorSchemeProvider'\n"],"names":[],"mappings":";;;AAQO,MAAM,sBAAsB,KAAK,CAAC,EAAE,UAAU,aAAuC;AAC3F,QAAM,uBAAuB;AAE7B,6BACE,mBAAmB,UAAnB,EAA4B,OAAO,UAAU,sBAAuB,SAAS,CAAA;AAEhF,CAAC;AACD,oBAAoB,cAAc;"}
@@ -1,6 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const react = require("react");
4
- const GlobalClassNamePrefixContext = react.createContext("cui-");
5
- exports.GlobalClassNamePrefixContext = GlobalClassNamePrefixContext;
6
- //# sourceMappingURL=GlobalClassNamePrefixContext.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"GlobalClassNamePrefixContext.cjs","sources":["../../../src/theming/GlobalClassNamePrefixContext.ts"],"sourcesContent":["import { createContext } from 'react'\n\nexport const GlobalClassNamePrefixContext = createContext<string>('cui-')\n"],"names":["createContext"],"mappings":";;;AAEa,MAAA,+BAA+BA,oBAAsB,MAAM;;"}
@@ -1,6 +0,0 @@
1
- import { createContext } from "react";
2
- const GlobalClassNamePrefixContext = createContext("cui-");
3
- export {
4
- GlobalClassNamePrefixContext
5
- };
6
- //# sourceMappingURL=GlobalClassNamePrefixContext.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"GlobalClassNamePrefixContext.js","sources":["../../../src/theming/GlobalClassNamePrefixContext.ts"],"sourcesContent":["import { createContext } from 'react'\n\nexport const GlobalClassNamePrefixContext = createContext<string>('cui-')\n"],"names":[],"mappings":";AAEa,MAAA,+BAA+B,cAAsB,MAAM;"}
@@ -1,12 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const createOptionalContextFactory = require("../context/createOptionalContextFactory.cjs");
4
- const DEFAULT_COLOR_SCHEME = "system";
5
- const [ColorSchemeContext, useColorScheme] = createOptionalContextFactory.createOptionalContextFactory(
6
- "Interface.ColorScheme",
7
- DEFAULT_COLOR_SCHEME
8
- );
9
- exports.ColorSchemeContext = ColorSchemeContext;
10
- exports.DEFAULT_COLOR_SCHEME = DEFAULT_COLOR_SCHEME;
11
- exports.useColorScheme = useColorScheme;
12
- //# sourceMappingURL=contexts.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"contexts.cjs","sources":["../../../src/theming/contexts.ts"],"sourcesContent":["import { createOptionalContextFactory } from '../context'\n\nexport const DEFAULT_COLOR_SCHEME = 'system'\n\n\n/**\n * @group UI\n *\n * @description\n * Provides the current color scheme, possible values are `'light'`, `'dark'` or `'system'`.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme\n *\n */\nexport const [ColorSchemeContext, useColorScheme] = createOptionalContextFactory<string>(\n\t'Interface.ColorScheme',\n\tDEFAULT_COLOR_SCHEME,\n)\n"],"names":["createOptionalContextFactory"],"mappings":";;;AAEO,MAAM,uBAAuB;AAYvB,MAAA,CAAC,oBAAoB,cAAc,IAAIA,6BAAA;AAAA,EACnD;AAAA,EACA;AACD;;;;"}
@@ -1,12 +0,0 @@
1
- import { createOptionalContextFactory } from "../context/createOptionalContextFactory.js";
2
- const DEFAULT_COLOR_SCHEME = "system";
3
- const [ColorSchemeContext, useColorScheme] = createOptionalContextFactory(
4
- "Interface.ColorScheme",
5
- DEFAULT_COLOR_SCHEME
6
- );
7
- export {
8
- ColorSchemeContext,
9
- DEFAULT_COLOR_SCHEME,
10
- useColorScheme
11
- };
12
- //# sourceMappingURL=contexts.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"contexts.js","sources":["../../../src/theming/contexts.ts"],"sourcesContent":["import { createOptionalContextFactory } from '../context'\n\nexport const DEFAULT_COLOR_SCHEME = 'system'\n\n\n/**\n * @group UI\n *\n * @description\n * Provides the current color scheme, possible values are `'light'`, `'dark'` or `'system'`.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme\n *\n */\nexport const [ColorSchemeContext, useColorScheme] = createOptionalContextFactory<string>(\n\t'Interface.ColorScheme',\n\tDEFAULT_COLOR_SCHEME,\n)\n"],"names":[],"mappings":";AAEO,MAAM,uBAAuB;AAYvB,MAAA,CAAC,oBAAoB,cAAc,IAAI;AAAA,EACnD;AAAA,EACA;AACD;"}
@@ -1,17 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const utilities = require("@contember/utilities");
4
- const react = require("react");
5
- const GlobalClassNamePrefixContext = require("./GlobalClassNamePrefixContext.cjs");
6
- function useClassName(componentClassName, additionalClassName = null, prefixOverride) {
7
- const contextPrefix = react.useContext(GlobalClassNamePrefixContext.GlobalClassNamePrefixContext);
8
- const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
9
- const componentClassNameList = utilities.flatClassNameList(componentClassName).map(
10
- (componentClassName2) => `${classNamePrefix}${componentClassName2}`
11
- );
12
- return utilities.deduplicateClassName(componentClassNameList.concat(
13
- utilities.flatClassNameList(additionalClassName)
14
- )).join(" ");
15
- }
16
- exports.useClassName = useClassName;
17
- //# sourceMappingURL=useClassName.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useClassName.cjs","sources":["../../../src/theming/useClassName.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns Prefixed component class name.\n */\nexport function useClassName (\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName = null,\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\treturn deduplicateClassName(componentClassNameList.concat(\n\t\tflatClassNameList(additionalClassName),\n\t)).join(' ')\n}\n"],"names":["useContext","GlobalClassNamePrefixContext","flatClassNameList","componentClassName","deduplicateClassName"],"mappings":";;;;;AAYO,SAAS,aACf,oBACA,sBAAuC,MACvC,gBACC;AACK,QAAA,gBAAgBA,iBAAWC,6BAAAA,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmCC,UAAAA,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAC,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,SAAOC,UAAAA,qBAAqB,uBAAuB;AAAA,IAClDF,UAAAA,kBAAkB,mBAAmB;AAAA,EAAA,CACrC,EAAE,KAAK,GAAG;AACZ;;"}
@@ -1,17 +0,0 @@
1
- import { flatClassNameList, deduplicateClassName } from "@contember/utilities";
2
- import { useContext } from "react";
3
- import { GlobalClassNamePrefixContext } from "./GlobalClassNamePrefixContext.js";
4
- function useClassName(componentClassName, additionalClassName = null, prefixOverride) {
5
- const contextPrefix = useContext(GlobalClassNamePrefixContext);
6
- const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
7
- const componentClassNameList = flatClassNameList(componentClassName).map(
8
- (componentClassName2) => `${classNamePrefix}${componentClassName2}`
9
- );
10
- return deduplicateClassName(componentClassNameList.concat(
11
- flatClassNameList(additionalClassName)
12
- )).join(" ");
13
- }
14
- export {
15
- useClassName
16
- };
17
- //# sourceMappingURL=useClassName.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useClassName.js","sources":["../../../src/theming/useClassName.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns Prefixed component class name.\n */\nexport function useClassName (\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName = null,\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\treturn deduplicateClassName(componentClassNameList.concat(\n\t\tflatClassNameList(additionalClassName),\n\t)).join(' ')\n}\n"],"names":["componentClassName"],"mappings":";;;AAYO,SAAS,aACf,oBACA,sBAAuC,MACvC,gBACC;AACK,QAAA,gBAAgB,WAAW,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmC,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAA,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,SAAO,qBAAqB,uBAAuB;AAAA,IAClD,kBAAkB,mBAAmB;AAAA,EAAA,CACrC,EAAE,KAAK,GAAG;AACZ;"}
@@ -1,22 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const utilities = require("@contember/utilities");
4
- const react = require("react");
5
- const GlobalClassNamePrefixContext = require("./GlobalClassNamePrefixContext.cjs");
6
- const useReferentiallyStableCallback = require("../referentiallyStable/useReferentiallyStableCallback.cjs");
7
- function useClassNameFactory(componentClassName, glue = "-", prefixOverride) {
8
- const contextPrefix = react.useContext(GlobalClassNamePrefixContext.GlobalClassNamePrefixContext);
9
- const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
10
- const componentClassNameList = utilities.flatClassNameList(componentClassName).map(
11
- (componentClassName2) => `${classNamePrefix}${componentClassName2}`
12
- );
13
- function componentClassNameFor(suffix = null, additionalClassName = null) {
14
- const classNameSuffix = suffix ?? "";
15
- return utilities.deduplicateClassName((classNameSuffix ? classNameSuffix.match(/^[a-zA-Z0-9]/) ? componentClassNameList.map((componentClassName2) => `${componentClassName2}${glue}${classNameSuffix}`) : componentClassNameList.map((componentClassName2) => `${componentClassName2}${classNameSuffix}`) : componentClassNameList).concat(
16
- utilities.flatClassNameList(additionalClassName)
17
- )).join(" ");
18
- }
19
- return useReferentiallyStableCallback.useReferentiallyStableCallback(componentClassNameFor);
20
- }
21
- exports.useClassNameFactory = useClassNameFactory;
22
- //# sourceMappingURL=useClassNameFactory.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useClassNameFactory.cjs","sources":["../../../src/theming/useClassNameFactory.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * Returns a reusable function almost that is handy for components\n * with many sub-component parts that should inherit the root component\n * name.\n *\n * Also, product of the factory is a function that can be used outside of rules of hooks.\n *\n * @param componentClassName - Component class name\n * @param glue - String to use to glue component and sub-component suffix\n * @param prefixOverride - Context component prefix override\n * @returns\n */\nexport function useClassNameFactory(\n\tcomponentClassName: NestedClassName,\n\tglue: string | null = '-',\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\tfunction componentClassNameFor(\n\t\tsuffix: string | null | undefined = null,\n\t\tadditionalClassName: NestedClassName = null,\n\t): string {\n\t\tconst classNameSuffix: string = suffix ?? ''\n\n\t\treturn deduplicateClassName((classNameSuffix\n\t\t\t? (classNameSuffix.match(/^[a-zA-Z0-9]/)\n\t\t\t\t? componentClassNameList.map(componentClassName => `${componentClassName}${glue}${classNameSuffix}`)\n\t\t\t\t: componentClassNameList.map(componentClassName => `${componentClassName}${classNameSuffix}`)\n\t\t\t)\n\t\t\t: componentClassNameList\n\t\t).concat(\n\t\t\tflatClassNameList(additionalClassName),\n\t\t)).join(' ')\n\t}\n\n\treturn useReferentiallyStableCallback(componentClassNameFor)\n}\n"],"names":["useContext","GlobalClassNamePrefixContext","flatClassNameList","componentClassName","deduplicateClassName","useReferentiallyStableCallback"],"mappings":";;;;;;AAmBO,SAAS,oBACf,oBACA,OAAsB,KACtB,gBACC;AACK,QAAA,gBAAgBA,iBAAWC,6BAAAA,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmCC,UAAAA,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAC,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,WAAS,sBACR,SAAoC,MACpC,sBAAuC,MAC9B;AACT,UAAM,kBAA0B,UAAU;AAE1C,WAAOC,UAAsB,sBAAA,kBACzB,gBAAgB,MAAM,cAAc,IACpC,uBAAuB,IAAI,CAAAD,wBAAsB,GAAGA,mBAAkB,GAAG,IAAI,GAAG,eAAe,EAAE,IACjG,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,eAAe,EAAE,IAE3F,wBACD;AAAA,MACDD,UAAAA,kBAAkB,mBAAmB;AAAA,IAAA,CACrC,EAAE,KAAK,GAAG;AAAA,EACZ;AAEA,SAAOG,+BAAAA,+BAA+B,qBAAqB;AAC5D;;"}
@@ -1,22 +0,0 @@
1
- import { flatClassNameList, deduplicateClassName } from "@contember/utilities";
2
- import { useContext } from "react";
3
- import { GlobalClassNamePrefixContext } from "./GlobalClassNamePrefixContext.js";
4
- import { useReferentiallyStableCallback } from "../referentiallyStable/useReferentiallyStableCallback.js";
5
- function useClassNameFactory(componentClassName, glue = "-", prefixOverride) {
6
- const contextPrefix = useContext(GlobalClassNamePrefixContext);
7
- const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
8
- const componentClassNameList = flatClassNameList(componentClassName).map(
9
- (componentClassName2) => `${classNamePrefix}${componentClassName2}`
10
- );
11
- function componentClassNameFor(suffix = null, additionalClassName = null) {
12
- const classNameSuffix = suffix ?? "";
13
- return deduplicateClassName((classNameSuffix ? classNameSuffix.match(/^[a-zA-Z0-9]/) ? componentClassNameList.map((componentClassName2) => `${componentClassName2}${glue}${classNameSuffix}`) : componentClassNameList.map((componentClassName2) => `${componentClassName2}${classNameSuffix}`) : componentClassNameList).concat(
14
- flatClassNameList(additionalClassName)
15
- )).join(" ");
16
- }
17
- return useReferentiallyStableCallback(componentClassNameFor);
18
- }
19
- export {
20
- useClassNameFactory
21
- };
22
- //# sourceMappingURL=useClassNameFactory.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useClassNameFactory.js","sources":["../../../src/theming/useClassNameFactory.ts"],"sourcesContent":["import { NestedClassName, deduplicateClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\n\n/**\n * Hook for component class name accepting outer class name\n *\n * Returns a reusable function almost that is handy for components\n * with many sub-component parts that should inherit the root component\n * name.\n *\n * Also, product of the factory is a function that can be used outside of rules of hooks.\n *\n * @param componentClassName - Component class name\n * @param glue - String to use to glue component and sub-component suffix\n * @param prefixOverride - Context component prefix override\n * @returns\n */\nexport function useClassNameFactory(\n\tcomponentClassName: NestedClassName,\n\tglue: string | null = '-',\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\tfunction componentClassNameFor(\n\t\tsuffix: string | null | undefined = null,\n\t\tadditionalClassName: NestedClassName = null,\n\t): string {\n\t\tconst classNameSuffix: string = suffix ?? ''\n\n\t\treturn deduplicateClassName((classNameSuffix\n\t\t\t? (classNameSuffix.match(/^[a-zA-Z0-9]/)\n\t\t\t\t? componentClassNameList.map(componentClassName => `${componentClassName}${glue}${classNameSuffix}`)\n\t\t\t\t: componentClassNameList.map(componentClassName => `${componentClassName}${classNameSuffix}`)\n\t\t\t)\n\t\t\t: componentClassNameList\n\t\t).concat(\n\t\t\tflatClassNameList(additionalClassName),\n\t\t)).join(' ')\n\t}\n\n\treturn useReferentiallyStableCallback(componentClassNameFor)\n}\n"],"names":["componentClassName"],"mappings":";;;;AAmBO,SAAS,oBACf,oBACA,OAAsB,KACtB,gBACC;AACK,QAAA,gBAAgB,WAAW,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmC,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAA,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAG9D,WAAS,sBACR,SAAoC,MACpC,sBAAuC,MAC9B;AACT,UAAM,kBAA0B,UAAU;AAE1C,WAAO,sBAAsB,kBACzB,gBAAgB,MAAM,cAAc,IACpC,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,IAAI,GAAG,eAAe,EAAE,IACjG,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,eAAe,EAAE,IAE3F,wBACD;AAAA,MACD,kBAAkB,mBAAmB;AAAA,IAAA,CACrC,EAAE,KAAK,GAAG;AAAA,EACZ;AAEA,SAAO,+BAA+B,qBAAqB;AAC5D;"}
@@ -1,17 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const utilities = require("@contember/utilities");
4
- const contexts = require("./contexts.cjs");
5
- const useClassName = require("./useClassName.cjs");
6
- function useThemedClassName(componentClassName, additionalClassName, prefixOverride) {
7
- return useClassName.useClassName(
8
- componentClassName,
9
- utilities.filterThemedClassName(
10
- additionalClassName,
11
- utilities.colorSchemeClassName(contexts.useColorScheme())
12
- ),
13
- prefixOverride
14
- );
15
- }
16
- exports.useThemedClassName = useThemedClassName;
17
- //# sourceMappingURL=useThemedClassName.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useThemedClassName.cjs","sources":["../../../src/theming/useThemedClassName.ts"],"sourcesContent":["import { NestedClassName, colorSchemeClassName, filterThemedClassName } from '@contember/utilities'\nimport { useColorScheme } from './contexts'\nimport { useClassName } from './useClassName'\n\n/**\n * Hook for component class name accepting outer class name with theme-* and scheme-* class manes\n *\n * It looks for theme CSS classes in the given class name, deduplicates them and returns final theme class name with scheme CSS class set\n * @internal\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns string\n * @see useColorScheme\n *\n * @example\n * ```tsx\n * function Button({ className }: { className?: string | string[] }) {\n * \t const [contentThemeClassName, controlsThemeClassName] = useThemedClassName(className)\n *\n * \t return (\n * \t\t <div className={contentThemeClassName}>\n * \t\t\t <button className={controlsThemeClassName}>Click me</button>\n * \t\t </div>\n * \t )\n * }\n *\n * function App() {\n * \t return (\n * \t\t <Button className=\"theme-default theme-danger:hover\" />\n * \t )\n * }\n *\n * // renders:\n * // <div class=\"scheme-system theme-default-content theme-danger-content:hover\">\n * // \t<button class=\"scheme-system theme-default-controls theme-danger-controls:hover\">Click me</button>\n * // </div>\n * ```\n */\nexport function useThemedClassName(\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName,\n\tprefixOverride?: string | null | undefined,\n): string {\n\treturn useClassName(\n\t\tcomponentClassName,\n\t\tfilterThemedClassName(\n\t\t\tadditionalClassName,\n\t\t\tcolorSchemeClassName(useColorScheme()),\n\t\t),\n\t\tprefixOverride,\n\t)\n}\n"],"names":["useClassName","filterThemedClassName","colorSchemeClassName","useColorScheme"],"mappings":";;;;;AAwCgB,SAAA,mBACf,oBACA,qBACA,gBACS;AACF,SAAAA,aAAA;AAAA,IACN;AAAA,IACAC,UAAA;AAAA,MACC;AAAA,MACAC,UAAA,qBAAqBC,yBAAgB;AAAA,IACtC;AAAA,IACA;AAAA,EAAA;AAEF;;"}
@@ -1,17 +0,0 @@
1
- import { filterThemedClassName, colorSchemeClassName } from "@contember/utilities";
2
- import { useColorScheme } from "./contexts.js";
3
- import { useClassName } from "./useClassName.js";
4
- function useThemedClassName(componentClassName, additionalClassName, prefixOverride) {
5
- return useClassName(
6
- componentClassName,
7
- filterThemedClassName(
8
- additionalClassName,
9
- colorSchemeClassName(useColorScheme())
10
- ),
11
- prefixOverride
12
- );
13
- }
14
- export {
15
- useThemedClassName
16
- };
17
- //# sourceMappingURL=useThemedClassName.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useThemedClassName.js","sources":["../../../src/theming/useThemedClassName.ts"],"sourcesContent":["import { NestedClassName, colorSchemeClassName, filterThemedClassName } from '@contember/utilities'\nimport { useColorScheme } from './contexts'\nimport { useClassName } from './useClassName'\n\n/**\n * Hook for component class name accepting outer class name with theme-* and scheme-* class manes\n *\n * It looks for theme CSS classes in the given class name, deduplicates them and returns final theme class name with scheme CSS class set\n * @internal\n *\n * @param componentClassName - Component class name\n * @param additionalClassName - Additional class name\n * @param prefixOverride - Context component prefix override\n * @returns string\n * @see useColorScheme\n *\n * @example\n * ```tsx\n * function Button({ className }: { className?: string | string[] }) {\n * \t const [contentThemeClassName, controlsThemeClassName] = useThemedClassName(className)\n *\n * \t return (\n * \t\t <div className={contentThemeClassName}>\n * \t\t\t <button className={controlsThemeClassName}>Click me</button>\n * \t\t </div>\n * \t )\n * }\n *\n * function App() {\n * \t return (\n * \t\t <Button className=\"theme-default theme-danger:hover\" />\n * \t )\n * }\n *\n * // renders:\n * // <div class=\"scheme-system theme-default-content theme-danger-content:hover\">\n * // \t<button class=\"scheme-system theme-default-controls theme-danger-controls:hover\">Click me</button>\n * // </div>\n * ```\n */\nexport function useThemedClassName(\n\tcomponentClassName: NestedClassName,\n\tadditionalClassName: NestedClassName,\n\tprefixOverride?: string | null | undefined,\n): string {\n\treturn useClassName(\n\t\tcomponentClassName,\n\t\tfilterThemedClassName(\n\t\t\tadditionalClassName,\n\t\t\tcolorSchemeClassName(useColorScheme()),\n\t\t),\n\t\tprefixOverride,\n\t)\n}\n"],"names":[],"mappings":";;;AAwCgB,SAAA,mBACf,oBACA,qBACA,gBACS;AACF,SAAA;AAAA,IACN;AAAA,IACA;AAAA,MACC;AAAA,MACA,qBAAqB,gBAAgB;AAAA,IACtC;AAAA,IACA;AAAA,EAAA;AAEF;"}
@@ -1,29 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const utilities = require("@contember/utilities");
4
- const react = require("react");
5
- const GlobalClassNamePrefixContext = require("./GlobalClassNamePrefixContext.cjs");
6
- const contexts = require("./contexts.cjs");
7
- const useReferentiallyStableCallback = require("../referentiallyStable/useReferentiallyStableCallback.cjs");
8
- function useThemedClassNameFactory(componentClassName, glue = "-", prefixOverride) {
9
- const contextPrefix = react.useContext(GlobalClassNamePrefixContext.GlobalClassNamePrefixContext);
10
- const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
11
- const componentClassNameList = utilities.flatClassNameList(componentClassName).map(
12
- (componentClassName2) => `${classNamePrefix}${componentClassName2}`
13
- );
14
- const colorScheme = utilities.colorSchemeClassName(contexts.useColorScheme());
15
- function componentClassNameFor(suffix = null, additionalClassName = null) {
16
- const classNameSuffix = suffix ?? "";
17
- return utilities.deduplicateClassName((classNameSuffix ? classNameSuffix.match(/^[a-zA-Z0-9]/) ? componentClassNameList.map((componentClassName2) => `${componentClassName2}${glue}${classNameSuffix}`) : componentClassNameList.map((componentClassName2) => `${componentClassName2}${classNameSuffix}`) : componentClassNameList).concat(
18
- utilities.flatClassNameList(
19
- utilities.filterThemedClassName(
20
- additionalClassName,
21
- colorScheme
22
- )
23
- )
24
- )).join(" ");
25
- }
26
- return useReferentiallyStableCallback.useReferentiallyStableCallback(componentClassNameFor);
27
- }
28
- exports.useThemedClassNameFactory = useThemedClassNameFactory;
29
- //# sourceMappingURL=useThemedClassNameFactory.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useThemedClassNameFactory.cjs","sources":["../../../src/theming/useThemedClassNameFactory.ts"],"sourcesContent":["import { NestedClassName, colorSchemeClassName, deduplicateClassName, filterThemedClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\nimport { useColorScheme } from './contexts'\n\nexport function useThemedClassNameFactory(\n\tcomponentClassName: NestedClassName,\n\tglue: string | null = '-',\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\tconst colorScheme = colorSchemeClassName(useColorScheme())\n\n\tfunction componentClassNameFor(\n\t\tsuffix: string | null | undefined = null,\n\t\tadditionalClassName: NestedClassName = null,\n\t): string {\n\t\tconst classNameSuffix: string = suffix ?? ''\n\n\t\treturn deduplicateClassName((classNameSuffix\n\t\t\t? (classNameSuffix.match(/^[a-zA-Z0-9]/)\n\t\t\t\t? componentClassNameList.map(componentClassName => `${componentClassName}${glue}${classNameSuffix}`)\n\t\t\t\t: componentClassNameList.map(componentClassName => `${componentClassName}${classNameSuffix}`)\n\t\t\t)\n\t\t\t: componentClassNameList\n\t\t).concat(\n\t\t\tflatClassNameList(\n\t\t\t\tfilterThemedClassName(\n\t\t\t\t\tadditionalClassName,\n\t\t\t\t\tcolorScheme,\n\t\t\t\t),\n\t\t\t),\n\t\t)).join(' ')\n\t}\n\n\treturn useReferentiallyStableCallback(componentClassNameFor)\n}\n"],"names":["useContext","GlobalClassNamePrefixContext","flatClassNameList","componentClassName","colorSchemeClassName","useColorScheme","deduplicateClassName","filterThemedClassName","useReferentiallyStableCallback"],"mappings":";;;;;;;AAMO,SAAS,0BACf,oBACA,OAAsB,KACtB,gBACC;AACK,QAAA,gBAAgBA,iBAAWC,6BAAAA,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmCC,UAAAA,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAC,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAGxD,QAAA,cAAcC,UAAAA,qBAAqBC,SAAA,eAAA,CAAgB;AAEzD,WAAS,sBACR,SAAoC,MACpC,sBAAuC,MAC9B;AACT,UAAM,kBAA0B,UAAU;AAE1C,WAAOC,UAAsB,sBAAA,kBACzB,gBAAgB,MAAM,cAAc,IACpC,uBAAuB,IAAI,CAAAH,wBAAsB,GAAGA,mBAAkB,GAAG,IAAI,GAAG,eAAe,EAAE,IACjG,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,eAAe,EAAE,IAE3F,wBACD;AAAA,MACDD,UAAA;AAAA,QACCK,UAAA;AAAA,UACC;AAAA,UACA;AAAA,QACD;AAAA,MACD;AAAA,IAAA,CACA,EAAE,KAAK,GAAG;AAAA,EACZ;AAEA,SAAOC,+BAAAA,+BAA+B,qBAAqB;AAC5D;;"}
@@ -1,29 +0,0 @@
1
- import { flatClassNameList, colorSchemeClassName, deduplicateClassName, filterThemedClassName } from "@contember/utilities";
2
- import { useContext } from "react";
3
- import { GlobalClassNamePrefixContext } from "./GlobalClassNamePrefixContext.js";
4
- import { useColorScheme } from "./contexts.js";
5
- import { useReferentiallyStableCallback } from "../referentiallyStable/useReferentiallyStableCallback.js";
6
- function useThemedClassNameFactory(componentClassName, glue = "-", prefixOverride) {
7
- const contextPrefix = useContext(GlobalClassNamePrefixContext);
8
- const classNamePrefix = prefixOverride === null || prefixOverride === "" ? "" : prefixOverride || contextPrefix;
9
- const componentClassNameList = flatClassNameList(componentClassName).map(
10
- (componentClassName2) => `${classNamePrefix}${componentClassName2}`
11
- );
12
- const colorScheme = colorSchemeClassName(useColorScheme());
13
- function componentClassNameFor(suffix = null, additionalClassName = null) {
14
- const classNameSuffix = suffix ?? "";
15
- return deduplicateClassName((classNameSuffix ? classNameSuffix.match(/^[a-zA-Z0-9]/) ? componentClassNameList.map((componentClassName2) => `${componentClassName2}${glue}${classNameSuffix}`) : componentClassNameList.map((componentClassName2) => `${componentClassName2}${classNameSuffix}`) : componentClassNameList).concat(
16
- flatClassNameList(
17
- filterThemedClassName(
18
- additionalClassName,
19
- colorScheme
20
- )
21
- )
22
- )).join(" ");
23
- }
24
- return useReferentiallyStableCallback(componentClassNameFor);
25
- }
26
- export {
27
- useThemedClassNameFactory
28
- };
29
- //# sourceMappingURL=useThemedClassNameFactory.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useThemedClassNameFactory.js","sources":["../../../src/theming/useThemedClassNameFactory.ts"],"sourcesContent":["import { NestedClassName, colorSchemeClassName, deduplicateClassName, filterThemedClassName, flatClassNameList } from '@contember/utilities'\nimport { useContext } from 'react'\nimport { useReferentiallyStableCallback } from '../referentiallyStable'\nimport { GlobalClassNamePrefixContext } from './GlobalClassNamePrefixContext'\nimport { useColorScheme } from './contexts'\n\nexport function useThemedClassNameFactory(\n\tcomponentClassName: NestedClassName,\n\tglue: string | null = '-',\n\tprefixOverride?: string | null | undefined,\n) {\n\tconst contextPrefix = useContext(GlobalClassNamePrefixContext)\n\tconst classNamePrefix: string = prefixOverride === null || prefixOverride === '' ? '' : prefixOverride || contextPrefix\n\n\tconst componentClassNameList: string[] = flatClassNameList(componentClassName).map(\n\t\tcomponentClassName => `${classNamePrefix}${componentClassName}`,\n\t)\n\n\tconst colorScheme = colorSchemeClassName(useColorScheme())\n\n\tfunction componentClassNameFor(\n\t\tsuffix: string | null | undefined = null,\n\t\tadditionalClassName: NestedClassName = null,\n\t): string {\n\t\tconst classNameSuffix: string = suffix ?? ''\n\n\t\treturn deduplicateClassName((classNameSuffix\n\t\t\t? (classNameSuffix.match(/^[a-zA-Z0-9]/)\n\t\t\t\t? componentClassNameList.map(componentClassName => `${componentClassName}${glue}${classNameSuffix}`)\n\t\t\t\t: componentClassNameList.map(componentClassName => `${componentClassName}${classNameSuffix}`)\n\t\t\t)\n\t\t\t: componentClassNameList\n\t\t).concat(\n\t\t\tflatClassNameList(\n\t\t\t\tfilterThemedClassName(\n\t\t\t\t\tadditionalClassName,\n\t\t\t\t\tcolorScheme,\n\t\t\t\t),\n\t\t\t),\n\t\t)).join(' ')\n\t}\n\n\treturn useReferentiallyStableCallback(componentClassNameFor)\n}\n"],"names":["componentClassName"],"mappings":";;;;;AAMO,SAAS,0BACf,oBACA,OAAsB,KACtB,gBACC;AACK,QAAA,gBAAgB,WAAW,4BAA4B;AAC7D,QAAM,kBAA0B,mBAAmB,QAAQ,mBAAmB,KAAK,KAAK,kBAAkB;AAEpG,QAAA,yBAAmC,kBAAkB,kBAAkB,EAAE;AAAA,IAC9E,CAAAA,wBAAsB,GAAG,eAAe,GAAGA,mBAAkB;AAAA,EAAA;AAGxD,QAAA,cAAc,qBAAqB,eAAA,CAAgB;AAEzD,WAAS,sBACR,SAAoC,MACpC,sBAAuC,MAC9B;AACT,UAAM,kBAA0B,UAAU;AAE1C,WAAO,sBAAsB,kBACzB,gBAAgB,MAAM,cAAc,IACpC,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,IAAI,GAAG,eAAe,EAAE,IACjG,uBAAuB,IAAI,CAAAA,wBAAsB,GAAGA,mBAAkB,GAAG,eAAe,EAAE,IAE3F,wBACD;AAAA,MACD;AAAA,QACC;AAAA,UACC;AAAA,UACA;AAAA,QACD;AAAA,MACD;AAAA,IAAA,CACA,EAAE,KAAK,GAAG;AAAA,EACZ;AAEA,SAAO,+BAA+B,qBAAqB;AAC5D;"}
@@ -1,3 +0,0 @@
1
- import type { Context } from 'react';
2
- export declare function createNonNullableContextFactory<T>(displayName: string, initialValue?: T): [Context<T>, () => NonNullable<T>];
3
- //# sourceMappingURL=createNonNullableContextFactory.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"createNonNullableContextFactory.d.ts","sourceRoot":"","sources":["../../../src/context/createNonNullableContextFactory.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAGpC,wBAAgB,+BAA+B,CAAC,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,MAAM,WAAW,CAAC,CAAC,CAAC,CAAC,CAe5H"}
@@ -1,3 +0,0 @@
1
- import type { Context } from 'react';
2
- export declare function createOptionalContextFactory<T>(name: string, initialValue: T): [Context<T>, () => T];
3
- //# sourceMappingURL=createOptionalContextFactory.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"createOptionalContextFactory.d.ts","sourceRoot":"","sources":["../../../src/context/createOptionalContextFactory.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAGpC,wBAAgB,4BAA4B,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,CASpG"}
@@ -1,13 +0,0 @@
1
- /**
2
- * Adds CSS class during resize event to element
3
- *
4
- * - Falls back to document.body when no element is specified
5
- * - Adds CSS class to element also on the initial load
6
- * - Uses element.classList directly
7
- *
8
- * @param className - CSS class to apply during the resize event
9
- * @param timeoutToRestore - Timeout in milliseconds to wait before finally removing the CSS class
10
- * @param element - Optional HTML element to apply CSS class to
11
- */
12
- export declare function useAddClassNameDuringResize(className: string, timeoutToRestore?: number, element?: HTMLElement): void;
13
- //# sourceMappingURL=useAddClassNameDuringResize.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useAddClassNameDuringResize.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAddClassNameDuringResize.ts"],"names":[],"mappings":"AAsBA;;;;;;;;;;GAUG;AACH,wBAAgB,2BAA2B,CAC1C,SAAS,EAAE,MAAM,EACjB,gBAAgB,GAAE,MAAY,EAC9B,OAAO,CAAC,EAAE,WAAW,QAmBrB"}
@@ -1,7 +0,0 @@
1
- export declare const useCloseOnClickOutside: ({ isOpen, close, contents, outside }: {
2
- isOpen: boolean;
3
- close: () => void;
4
- contents: (Node | null)[];
5
- outside?: HTMLElement | null | undefined;
6
- }) => void;
7
- //# sourceMappingURL=useCloseOnClickOutside.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useCloseOnClickOutside.d.ts","sourceRoot":"","sources":["../../../src/hooks/useCloseOnClickOutside.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,sBAAsB;YAAoD,OAAO;WAAS,MAAM,IAAI;cAAY,CAAC,IAAI,GAAG,IAAI,CAAC,EAAE;;UAwB3I,CAAA"}
@@ -1,5 +0,0 @@
1
- export declare const useCloseOnEscape: ({ isOpen, close }: {
2
- isOpen: boolean;
3
- close: () => void;
4
- }) => void;
5
- //# sourceMappingURL=useCloseOnEscape.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useCloseOnEscape.d.ts","sourceRoot":"","sources":["../../../src/hooks/useCloseOnEscape.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,gBAAgB;YAAiC,OAAO;WAAS,MAAM,IAAI;UAevF,CAAA"}
@@ -1,4 +0,0 @@
1
- export type ContainerWidthContextType = number;
2
- export declare const ContainerWidthContext: import("react").Context<number | null | undefined>;
3
- export declare function useContainerWidth(): number;
4
- //# sourceMappingURL=useContainerWidth.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useContainerWidth.d.ts","sourceRoot":"","sources":["../../../src/hooks/useContainerWidth.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,yBAAyB,GAAG,MAAM,CAAA;AAC9C,eAAO,MAAM,qBAAqB,oDAAyE,CAAA;AAG3G,wBAAgB,iBAAiB,IAAI,MAAM,CAK1C"}
@@ -1,16 +0,0 @@
1
- import { RefObjectOrElement } from './unwrapRefValue';
2
- export type ElementSize = {
3
- height: number;
4
- width: number;
5
- };
6
- /**
7
- * Measure HTMLElement
8
- *
9
- * @param refOrElement - HTMLElement passed directly or indirectly as RefObject
10
- * @returns Size vector consisting of width and height properties
11
- */
12
- export declare function useElementSize(refOrElement: RefObjectOrElement<HTMLElement>, options?: ResizeObserverOptions, timeout?: number): {
13
- height: number | undefined;
14
- width: number | undefined;
15
- };
16
- //# sourceMappingURL=useElementSize.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useElementSize.d.ts","sourceRoot":"","sources":["../../../src/hooks/useElementSize.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,kBAAkB,EAAkB,MAAM,kBAAkB,CAAA;AAGrE,MAAM,MAAM,WAAW,GAAG;IACzB,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAC7B,YAAY,EAAE,kBAAkB,CAAC,WAAW,CAAC,EAC7C,OAAO,GAAE,qBAA0B,EACnC,OAAO,GAAE,MAAY,GACnB;IAAE,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;CAAE,CAiC3D"}
@@ -1,3 +0,0 @@
1
- import { RefObject } from 'react';
2
- export declare function useElementTopOffset(ref?: RefObject<HTMLElement>): number | undefined;
3
- //# sourceMappingURL=useElementTopOffset.d.ts.map