@koine/react 2.0.0-beta.12 → 2.0.0-beta.15

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 (576) hide show
  1. package/Alert/Alert.js +10 -0
  2. package/Alert/index.d.ts +1 -1
  3. package/Alert/index.js +1 -0
  4. package/Animations/Reveal.d.ts +1 -2
  5. package/Animations/Reveal.js +16 -0
  6. package/Animations/Underline.js +5 -0
  7. package/Animations/index.d.ts +3 -3
  8. package/Animations/index.js +3 -0
  9. package/Animations/useReveal.d.ts +0 -21
  10. package/Animations/useReveal.js +42 -0
  11. package/Autocomplete/AutocompleteDownshift.js +1 -0
  12. package/Autocomplete/AutocompleteDownshiftMultiselect.js +1 -0
  13. package/Autocomplete/AutocompleteMui.d.ts +2 -27
  14. package/Autocomplete/AutocompleteMui.js +93 -0
  15. package/Autocomplete/AutocompleteReach.js +1 -0
  16. package/Autocomplete/components.d.ts +0 -5
  17. package/Autocomplete/components.js +26 -0
  18. package/Autocomplete/helpers.d.ts +1 -1
  19. package/Autocomplete/helpers.js +17 -0
  20. package/Autocomplete/index.d.ts +2 -2
  21. package/Autocomplete/index.js +1 -0
  22. package/Bg/BgColor.d.ts +1 -20
  23. package/Bg/BgColor.js +16 -0
  24. package/Bg/BgPhoto.d.ts +1 -6
  25. package/Bg/BgPhoto.js +16 -0
  26. package/Bg/BgSvg.d.ts +0 -3
  27. package/Bg/BgSvg.js +9 -0
  28. package/Bg/index.d.ts +3 -3
  29. package/Bg/index.js +3 -0
  30. package/Breadcrumbs/Breadcrumbs.d.ts +1 -1
  31. package/Breadcrumbs/Breadcrumbs.js +27 -0
  32. package/Breadcrumbs/index.d.ts +1 -1
  33. package/Breadcrumbs/index.js +1 -0
  34. package/Buttons/Button.d.ts +0 -4
  35. package/Buttons/Button.js +10 -0
  36. package/Buttons/ButtonComposite.d.ts +3 -4
  37. package/Buttons/ButtonComposite.js +28 -0
  38. package/Buttons/ButtonFab.d.ts +1 -2
  39. package/Buttons/ButtonFab.js +6 -0
  40. package/Buttons/ButtonLink.d.ts +3 -3
  41. package/Buttons/ButtonLink.js +11 -0
  42. package/Buttons/IconButton.d.ts +1 -2
  43. package/Buttons/IconButton.js +7 -0
  44. package/Buttons/index.d.ts +5 -5
  45. package/Buttons/index.js +5 -0
  46. package/Calendar/CalendarDaygridCell.d.ts +3 -4
  47. package/Calendar/CalendarDaygridCell.js +46 -0
  48. package/Calendar/CalendarDaygridNav.d.ts +2 -2
  49. package/Calendar/CalendarDaygridNav.js +23 -0
  50. package/Calendar/CalendarDaygridTable.d.ts +3 -3
  51. package/Calendar/CalendarDaygridTable.js +45 -0
  52. package/Calendar/CalendarLegend.d.ts +2 -3
  53. package/Calendar/CalendarLegend.js +8 -0
  54. package/Calendar/calendar-api-google.d.ts +1 -9
  55. package/Calendar/calendar-api-google.js +126 -0
  56. package/Calendar/index.d.ts +6 -6
  57. package/Calendar/index.js +6 -0
  58. package/Calendar/types.d.ts +0 -19
  59. package/Calendar/types.js +1 -0
  60. package/Calendar/useCalendar.d.ts +4 -19
  61. package/Calendar/useCalendar.js +176 -0
  62. package/Calendar/utils.d.ts +1 -1
  63. package/Calendar/utils.js +185 -0
  64. package/Carousel/Carousel.js +1 -0
  65. package/Carousel/CarouselCss.d.ts +1 -23
  66. package/Carousel/CarouselCss.js +19 -0
  67. package/Carousel/index.d.ts +1 -1
  68. package/Carousel/index.js +1 -0
  69. package/Collapsable/Collapsable.js +1 -0
  70. package/Collapsable/CollapsableReach.d.ts +0 -6
  71. package/Collapsable/CollapsableReach.js +1 -0
  72. package/Collapsable/index.d.ts +1 -1
  73. package/Collapsable/index.js +1 -0
  74. package/Debug/Debug.js +9 -0
  75. package/Debug/index.d.ts +1 -1
  76. package/Debug/index.js +1 -0
  77. package/Details/Details.d.ts +0 -6
  78. package/Details/Details.js +52 -0
  79. package/Details/index.d.ts +1 -1
  80. package/Details/index.js +1 -0
  81. package/Dialog/DialogMui.d.ts +1 -3
  82. package/Dialog/DialogMui.js +39 -0
  83. package/Dialog/css/bare.d.ts +1 -2
  84. package/Dialog/css/bare.js +20 -0
  85. package/Dialog/index.d.ts +2 -2
  86. package/Dialog/index.js +1 -0
  87. package/Dialog/m/bare.js +3 -0
  88. package/Dialog/m/basic.d.ts +1 -1
  89. package/Dialog/m/basic.js +28 -0
  90. package/Dialog/m/index.d.ts +1 -2
  91. package/Dialog/m/index.js +4 -0
  92. package/Dialog/sc/bare.d.ts +2 -12
  93. package/Dialog/sc/bare.js +31 -0
  94. package/Dialog/sc/framer.d.ts +1 -2
  95. package/Dialog/sc/framer.js +16 -0
  96. package/Dialog/sc/framerMaterial.js +16 -0
  97. package/Dialog/sc/material.d.ts +1 -2
  98. package/Dialog/sc/material.js +21 -0
  99. package/Dialog/tw/bare.d.ts +2 -17
  100. package/Dialog/tw/bare.js +28 -0
  101. package/Dialog/tw/elegant.d.ts +1 -2
  102. package/Dialog/tw/elegant.js +20 -0
  103. package/Dialog/tw/framer.d.ts +1 -2
  104. package/Dialog/tw/framer.js +16 -0
  105. package/Dialog/tw/framerMaterial.js +16 -0
  106. package/Dialog/tw/material.d.ts +1 -2
  107. package/Dialog/tw/material.js +20 -0
  108. package/Editor/Editor--tiptap.js +26 -0
  109. package/Editor/components.js +10 -0
  110. package/Editor/index.d.ts +1 -1
  111. package/Editor/index.js +1 -0
  112. package/FaviconTags.d.ts +0 -10
  113. package/FaviconTags.js +6 -0
  114. package/Form/Form.d.ts +1 -14
  115. package/Form/Form.js +60 -0
  116. package/Form/index.d.ts +1 -1
  117. package/Form/index.js +1 -0
  118. package/Form/sc/bare.d.ts +1 -2
  119. package/Form/sc/bare.js +20 -0
  120. package/Forms/Checkbox/Checkbox.d.ts +1 -5
  121. package/Forms/Checkbox/Checkbox.js +15 -0
  122. package/Forms/Checkbox/index.d.ts +1 -1
  123. package/Forms/Checkbox/index.js +1 -0
  124. package/Forms/Feedback/Feedback.js +9 -0
  125. package/Forms/Feedback/index.d.ts +1 -1
  126. package/Forms/Feedback/index.js +1 -0
  127. package/Forms/Field/Field.d.ts +1 -19
  128. package/Forms/Field/Field.js +25 -0
  129. package/Forms/Field/FieldControl.d.ts +2 -14
  130. package/Forms/Field/FieldControl.js +35 -0
  131. package/Forms/Field/FieldHint.js +4 -0
  132. package/Forms/Field/index.d.ts +2 -2
  133. package/Forms/Field/index.js +2 -0
  134. package/Forms/Input/Input.d.ts +1 -2
  135. package/Forms/Input/Input.js +16 -0
  136. package/Forms/Input/index.d.ts +1 -1
  137. package/Forms/Input/index.js +1 -0
  138. package/Forms/InputGroup/InputGroup.d.ts +1 -2
  139. package/Forms/InputGroup/InputGroup.js +15 -0
  140. package/Forms/InputGroup/index.d.ts +1 -1
  141. package/Forms/InputGroup/index.js +1 -0
  142. package/Forms/Label/Label.js +6 -0
  143. package/Forms/Label/index.d.ts +1 -1
  144. package/Forms/Label/index.js +1 -0
  145. package/Forms/Password/Password.d.ts +1 -2
  146. package/Forms/Password/Password.js +17 -0
  147. package/Forms/Password/index.d.ts +1 -1
  148. package/Forms/Password/index.js +1 -0
  149. package/Forms/Radio/Radio.d.ts +1 -2
  150. package/Forms/Radio/Radio.js +25 -0
  151. package/Forms/Radio/index.d.ts +1 -1
  152. package/Forms/Radio/index.js +1 -0
  153. package/Forms/Switch/Switch.d.ts +1 -5
  154. package/Forms/Switch/Switch.js +17 -0
  155. package/Forms/Switch/index.d.ts +1 -1
  156. package/Forms/Switch/index.js +1 -0
  157. package/Forms/Textarea/Textarea.d.ts +1 -2
  158. package/Forms/Textarea/Textarea.js +12 -0
  159. package/Forms/Textarea/TextareaRich.d.ts +1 -2
  160. package/Forms/Textarea/TextareaRich.js +26 -0
  161. package/Forms/Textarea/index.d.ts +2 -2
  162. package/Forms/Textarea/index.js +2 -0
  163. package/Forms/Toggle/Toggle-tailwind.js +1 -0
  164. package/Forms/Toggle/Toggle.d.ts +0 -1
  165. package/Forms/Toggle/Toggle.js +25 -0
  166. package/Forms/Toggle/index.d.ts +1 -1
  167. package/Forms/Toggle/index.js +1 -0
  168. package/Forms/Toggle/useToggle-tailwind.js +1 -0
  169. package/Forms/Toggle/useToggle.d.ts +1 -31
  170. package/Forms/Toggle/useToggle.js +85 -0
  171. package/Forms/antispam.d.ts +0 -20
  172. package/Forms/antispam.js +31 -0
  173. package/Forms/helpers.d.ts +0 -8
  174. package/Forms/helpers.js +36 -0
  175. package/Forms/index.d.ts +15 -15
  176. package/Forms/index.js +15 -0
  177. package/Forms/styles.d.ts +0 -6
  178. package/Forms/styles.js +19 -0
  179. package/Gauge/Gauge.d.ts +0 -1
  180. package/Gauge/Gauge.js +1 -0
  181. package/Grid/Grid.d.ts +1 -10
  182. package/Grid/Grid.js +52 -0
  183. package/Grid/index.d.ts +1 -1
  184. package/Grid/index.js +1 -0
  185. package/Hamburger/Hamburger.d.ts +0 -1
  186. package/Hamburger/Hamburger.js +47 -0
  187. package/Hamburger/index.d.ts +1 -1
  188. package/Hamburger/index.js +1 -0
  189. package/Header/index.d.ts +1 -1
  190. package/Header/index.js +1 -0
  191. package/Header/useHeader.d.ts +0 -4
  192. package/Header/useHeader.js +31 -0
  193. package/Hidden/Hidden.d.ts +1 -1
  194. package/Hidden/Hidden.js +10 -0
  195. package/Hidden/index.d.ts +1 -1
  196. package/Hidden/index.js +1 -0
  197. package/Img/index.d.ts +1 -1
  198. package/Img/index.js +1 -0
  199. package/Img/sc/bare.js +4 -0
  200. package/Img/types.js +1 -0
  201. package/Link/Link.js +4 -0
  202. package/Link/LinkBlank.js +15 -0
  203. package/Link/index.d.ts +2 -2
  204. package/Link/index.js +2 -0
  205. package/Menu/Menu.js +4 -0
  206. package/Menu/MenuMui.js +1 -0
  207. package/Menu/index.d.ts +1 -1
  208. package/Menu/index.js +1 -0
  209. package/MenuItem/MenuItem.js +4 -0
  210. package/MenuItem/MenuItemMui.js +1 -0
  211. package/MenuItem/index.d.ts +1 -1
  212. package/MenuItem/index.js +1 -0
  213. package/MenuItem/useMenuItem.js +42 -0
  214. package/Meta/Meta.d.ts +0 -10
  215. package/Meta/Meta.js +6 -0
  216. package/Meta/index.d.ts +2 -2
  217. package/Meta/index.js +2 -0
  218. package/NoJs/NoJs.js +7 -0
  219. package/NoJs/index.d.ts +2 -2
  220. package/NoJs/index.js +2 -0
  221. package/Pagination/PaginationNav.d.ts +1 -9
  222. package/Pagination/PaginationNav.js +48 -0
  223. package/Pagination/PaginationResults.js +11 -0
  224. package/Pagination/index.d.ts +2 -2
  225. package/Pagination/index.js +2 -0
  226. package/Pill/Pill.js +7 -0
  227. package/Pill/index.d.ts +1 -1
  228. package/Pill/index.js +1 -0
  229. package/Progress/ProgressCircular.d.ts +1 -7
  230. package/Progress/ProgressCircular.js +12 -0
  231. package/Progress/ProgressLinear.d.ts +1 -8
  232. package/Progress/ProgressLinear.js +21 -0
  233. package/Progress/ProgressOverlay.js +23 -0
  234. package/Progress/index.d.ts +3 -3
  235. package/Progress/index.js +3 -0
  236. package/Rating/Rating.d.ts +0 -8
  237. package/Rating/Rating.js +43 -0
  238. package/Rating/index.d.ts +1 -4
  239. package/Rating/index.js +45 -0
  240. package/Select/SelectDownshift.d.ts +1 -1
  241. package/Select/SelectDownshift.js +1 -0
  242. package/Select/components.js +12 -0
  243. package/Select/index.d.ts +2 -2
  244. package/Select/index.js +1 -0
  245. package/Sidebar/Sidebar.js +23 -0
  246. package/Sidebar/index.d.ts +1 -1
  247. package/Sidebar/index.js +1 -0
  248. package/Spacing/Spacing.d.ts +1 -14
  249. package/Spacing/Spacing.js +32 -0
  250. package/Spacing/index.d.ts +1 -1
  251. package/Spacing/index.js +1 -0
  252. package/Sticky/Sticky.js +1 -0
  253. package/Sticky/StickyCss.js +6 -0
  254. package/Sticky/index.d.ts +1 -1
  255. package/Sticky/index.js +1 -0
  256. package/Tabs/TabsMui.d.ts +2 -3
  257. package/Tabs/TabsMui.js +30 -0
  258. package/Tabs/index.d.ts +1 -1
  259. package/Tabs/index.js +1 -0
  260. package/Tabs/sc/bare.d.ts +0 -5
  261. package/Tabs/sc/bare.js +1 -0
  262. package/Tabs/tw/bare.d.ts +1 -2
  263. package/Tabs/tw/bare.js +16 -0
  264. package/Tabs/tw/material.d.ts +1 -2
  265. package/Tabs/tw/material.js +18 -0
  266. package/Tabs/useTabs.d.ts +0 -22
  267. package/Tabs/useTabs.js +43 -0
  268. package/Typography/CopyPasteVisible.js +4 -0
  269. package/Typography/Native.js +14 -0
  270. package/Typography/ReadMore.d.ts +0 -2
  271. package/Typography/ReadMore.js +42 -0
  272. package/Typography/TextLoop.js +45 -0
  273. package/Typography/TypeStairs.js +42 -0
  274. package/Typography/index.d.ts +5 -5
  275. package/Typography/index.js +5 -0
  276. package/css/index.d.ts +2 -2
  277. package/css/index.js +2 -0
  278. package/helpers/classed.d.ts +0 -19
  279. package/helpers/classed.js +43 -0
  280. package/helpers/createUseMediaQueryWidth.d.ts +0 -6
  281. package/helpers/createUseMediaQueryWidth.js +39 -0
  282. package/helpers/extend-component.d.ts +0 -11
  283. package/helpers/extend-component.js +9 -0
  284. package/helpers/index.d.ts +4 -4
  285. package/helpers/index.js +4 -0
  286. package/helpers/{mergeRefs.mjs → mergeRefs.js} +4 -3
  287. package/hooks/index.d.ts +20 -20
  288. package/hooks/index.js +20 -0
  289. package/hooks/types.d.ts +0 -6
  290. package/hooks/types.js +1 -0
  291. package/hooks/useAsyncFn.d.ts +1 -4
  292. package/hooks/useAsyncFn.js +33 -0
  293. package/hooks/useDateLocale.d.ts +0 -6
  294. package/hooks/useDateLocale.js +28 -0
  295. package/hooks/useFirstMountState.d.ts +0 -3
  296. package/hooks/useFirstMountState.js +10 -0
  297. package/hooks/useFixedOffset.d.ts +0 -9
  298. package/hooks/useFixedOffset.js +45 -0
  299. package/hooks/useFocus.d.ts +0 -3
  300. package/hooks/useFocus.js +9 -0
  301. package/hooks/useInterval.d.ts +0 -5
  302. package/hooks/useInterval.js +22 -0
  303. package/hooks/useIsomorphicLayoutEffect.d.ts +0 -3
  304. package/hooks/useIsomorphicLayoutEffect.js +6 -0
  305. package/hooks/useKeyUp.js +18 -0
  306. package/hooks/useMeasure.d.ts +0 -5
  307. package/hooks/useMeasure.js +134 -0
  308. package/hooks/useMountedState.d.ts +0 -3
  309. package/hooks/useMountedState.js +13 -0
  310. package/hooks/useNavigateAway.d.ts +0 -29
  311. package/hooks/useNavigateAway.js +25 -0
  312. package/hooks/usePrevious.d.ts +0 -3
  313. package/hooks/usePrevious.js +9 -0
  314. package/hooks/{usePreviousRef.mjs → usePreviousRef.js} +2 -2
  315. package/hooks/useScrollPosition.d.ts +0 -7
  316. package/hooks/useScrollPosition.js +61 -0
  317. package/hooks/useScrollThreshold.js +26 -0
  318. package/hooks/useScrollTo.js +22 -0
  319. package/hooks/useSmoothScroll.d.ts +0 -6
  320. package/hooks/useSmoothScroll.js +33 -0
  321. package/hooks/useSpinDelay.d.ts +0 -12
  322. package/hooks/useSpinDelay.js +38 -0
  323. package/hooks/useTraceUpdate.d.ts +0 -3
  324. package/hooks/useTraceUpdate.js +18 -0
  325. package/hooks/useUpdateEffect.d.ts +0 -3
  326. package/hooks/useUpdateEffect.js +11 -0
  327. package/hooks/useWindowSize.d.ts +0 -9
  328. package/hooks/useWindowSize.js +20 -0
  329. package/index.d.ts +1 -1
  330. package/index.js +1 -0
  331. package/m/MotionProvider.d.ts +0 -32
  332. package/m/MotionProvider.js +7 -0
  333. package/m/index.d.ts +1 -6
  334. package/m/index.js +1 -0
  335. package/package.json +624 -22
  336. package/sc/index.d.ts +30 -30
  337. package/sc/index.js +30 -0
  338. package/scm/index.d.ts +29 -29
  339. package/scm/index.js +29 -0
  340. package/shared/index.d.ts +8 -8
  341. package/shared/index.js +8 -0
  342. package/styles/Body.d.ts +0 -8
  343. package/styles/Body.js +5 -0
  344. package/styles/Global.d.ts +0 -13
  345. package/styles/Global.js +5 -0
  346. package/styles/index.d.ts +7 -7
  347. package/styles/index.js +7 -0
  348. package/styles/media.d.ts +1 -50
  349. package/styles/media.js +74 -0
  350. package/styles/spacing.d.ts +1 -2
  351. package/styles/spacing.js +45 -0
  352. package/styles/styled.d.ts +0 -4
  353. package/styles/styled.js +9 -0
  354. package/styles/theme--vanilla.js +46 -0
  355. package/styles/theme.d.ts +0 -29
  356. package/styles/theme.js +30 -0
  357. package/tw/index.d.ts +2 -2
  358. package/tw/index.js +2 -0
  359. package/twm/index.d.ts +2 -2
  360. package/twm/index.js +2 -0
  361. package/types.d.ts +1 -2
  362. package/types.js +1 -0
  363. package/Alert/Alert.mjs +0 -22
  364. package/Alert/Alert.stories.mjs +0 -18
  365. package/Alert/index.mjs +0 -1
  366. package/Animations/Reveal.mjs +0 -43
  367. package/Animations/Underline.mjs +0 -15
  368. package/Animations/index.mjs +0 -3
  369. package/Animations/useReveal.mjs +0 -73
  370. package/Autocomplete/AutocompleteDownshift.mjs +0 -157
  371. package/Autocomplete/AutocompleteDownshiftMultiselect.mjs +0 -352
  372. package/Autocomplete/AutocompleteMui.mjs +0 -219
  373. package/Autocomplete/AutocompleteReach.mjs +0 -111
  374. package/Autocomplete/components.mjs +0 -87
  375. package/Autocomplete/helpers.mjs +0 -35
  376. package/Autocomplete/index.mjs +0 -4
  377. package/Bg/BgColor.mjs +0 -42
  378. package/Bg/BgPhoto.mjs +0 -71
  379. package/Bg/BgSvg.mjs +0 -22
  380. package/Bg/index.mjs +0 -3
  381. package/Breadcrumbs/Breadcrumbs.mjs +0 -91
  382. package/Breadcrumbs/index.mjs +0 -1
  383. package/Buttons/Button.mjs +0 -78
  384. package/Buttons/ButtonComposite.mjs +0 -105
  385. package/Buttons/ButtonFab.mjs +0 -8
  386. package/Buttons/ButtonLink.mjs +0 -18
  387. package/Buttons/IconButton.mjs +0 -19
  388. package/Buttons/index.mjs +0 -5
  389. package/Calendar/CalendarDaygridCell.mjs +0 -95
  390. package/Calendar/CalendarDaygridNav.mjs +0 -52
  391. package/Calendar/CalendarDaygridTable.mjs +0 -115
  392. package/Calendar/CalendarLegend.mjs +0 -29
  393. package/Calendar/calendar-api-google.mjs +0 -99
  394. package/Calendar/index.mjs +0 -6
  395. package/Calendar/types.mjs +0 -1
  396. package/Calendar/useCalendar.mjs +0 -225
  397. package/Calendar/utils.mjs +0 -209
  398. package/Carousel/Carousel.mjs +0 -377
  399. package/Carousel/CarouselCss.mjs +0 -44
  400. package/Carousel/index.mjs +0 -1
  401. package/Collapsable/Collapsable.mjs +0 -1
  402. package/Collapsable/CollapsableReach.mjs +0 -250
  403. package/Collapsable/index.mjs +0 -1
  404. package/Debug/Debug.mjs +0 -23
  405. package/Debug/index.mjs +0 -1
  406. package/Details/Details.mjs +0 -90
  407. package/Details/Details.stories.mjs +0 -21
  408. package/Details/index.mjs +0 -1
  409. package/Dialog/DialogMui.mjs +0 -105
  410. package/Dialog/DialogMui.stories.mjs +0 -20
  411. package/Dialog/css/bare.mjs +0 -19
  412. package/Dialog/css/index.stories.mjs +0 -75
  413. package/Dialog/index.mjs +0 -1
  414. package/Dialog/m/bare.mjs +0 -115
  415. package/Dialog/m/basic.mjs +0 -31
  416. package/Dialog/m/index.mjs +0 -4
  417. package/Dialog/sc/bare.mjs +0 -54
  418. package/Dialog/sc/framer.mjs +0 -16
  419. package/Dialog/sc/framerMaterial.mjs +0 -16
  420. package/Dialog/sc/index.stories.mjs +0 -48
  421. package/Dialog/sc/material.mjs +0 -41
  422. package/Dialog/tw/bare.mjs +0 -29
  423. package/Dialog/tw/elegant.mjs +0 -18
  424. package/Dialog/tw/framer.mjs +0 -16
  425. package/Dialog/tw/framerMaterial.mjs +0 -16
  426. package/Dialog/tw/index.stories.mjs +0 -83
  427. package/Dialog/tw/material.mjs +0 -18
  428. package/Editor/Editor--tiptap.mjs +0 -53
  429. package/Editor/components.mjs +0 -28
  430. package/Editor/index.mjs +0 -1
  431. package/FaviconTags.mjs +0 -64
  432. package/Form/Form.mjs +0 -95
  433. package/Form/index.mjs +0 -1
  434. package/Form/sc/bare.mjs +0 -29
  435. package/Forms/Checkbox/Checkbox.mjs +0 -36
  436. package/Forms/Checkbox/index.mjs +0 -1
  437. package/Forms/Feedback/Feedback.mjs +0 -14
  438. package/Forms/Feedback/index.mjs +0 -1
  439. package/Forms/Field/Field.mjs +0 -50
  440. package/Forms/Field/FieldControl.mjs +0 -67
  441. package/Forms/Field/FieldHint.mjs +0 -6
  442. package/Forms/Field/index.mjs +0 -2
  443. package/Forms/Input/Input.mjs +0 -36
  444. package/Forms/Input/index.mjs +0 -1
  445. package/Forms/InputGroup/InputGroup.mjs +0 -57
  446. package/Forms/InputGroup/index.mjs +0 -1
  447. package/Forms/Label/Label.mjs +0 -24
  448. package/Forms/Label/index.mjs +0 -1
  449. package/Forms/Password/Password.mjs +0 -53
  450. package/Forms/Password/index.mjs +0 -1
  451. package/Forms/Radio/Radio.mjs +0 -57
  452. package/Forms/Radio/index.mjs +0 -1
  453. package/Forms/Switch/Switch.mjs +0 -60
  454. package/Forms/Switch/index.mjs +0 -1
  455. package/Forms/Textarea/Textarea.mjs +0 -26
  456. package/Forms/Textarea/TextareaRich.mjs +0 -48
  457. package/Forms/Textarea/index.mjs +0 -2
  458. package/Forms/Toggle/Toggle-tailwind.mjs +0 -98
  459. package/Forms/Toggle/Toggle.mjs +0 -123
  460. package/Forms/Toggle/index.mjs +0 -1
  461. package/Forms/Toggle/useToggle-tailwind.mjs +0 -201
  462. package/Forms/Toggle/useToggle.mjs +0 -163
  463. package/Forms/antispam.mjs +0 -58
  464. package/Forms/helpers.mjs +0 -52
  465. package/Forms/index.mjs +0 -16
  466. package/Forms/styles.mjs +0 -61
  467. package/Gauge/Gauge.mjs +0 -101
  468. package/Grid/Grid.mjs +0 -75
  469. package/Grid/index.mjs +0 -1
  470. package/Hamburger/Hamburger.mjs +0 -79
  471. package/Hamburger/index.mjs +0 -1
  472. package/Header/index.mjs +0 -1
  473. package/Header/useHeader.mjs +0 -36
  474. package/Hidden/Hidden.mjs +0 -10
  475. package/Hidden/index.mjs +0 -1
  476. package/Img/index.mjs +0 -1
  477. package/Img/sc/bare.mjs +0 -36
  478. package/Img/types.mjs +0 -1
  479. package/Link/Link.mjs +0 -2
  480. package/Link/LinkBlank.mjs +0 -32
  481. package/Link/index.mjs +0 -2
  482. package/Menu/Menu.mjs +0 -11
  483. package/Menu/MenuMui.mjs +0 -164
  484. package/Menu/index.mjs +0 -1
  485. package/MenuItem/MenuItem.mjs +0 -20
  486. package/MenuItem/MenuItemMui.mjs +0 -31
  487. package/MenuItem/index.mjs +0 -1
  488. package/MenuItem/useMenuItem.mjs +0 -78
  489. package/Meta/Meta.mjs +0 -8
  490. package/Meta/index.mjs +0 -2
  491. package/NoJs/NoJs.mjs +0 -10
  492. package/NoJs/index.mjs +0 -2
  493. package/Pagination/PaginationNav.mjs +0 -122
  494. package/Pagination/PaginationResults.mjs +0 -34
  495. package/Pagination/index.mjs +0 -2
  496. package/Pill/Pill.mjs +0 -37
  497. package/Pill/index.mjs +0 -1
  498. package/Progress/ProgressCircular.mjs +0 -53
  499. package/Progress/ProgressLinear.mjs +0 -44
  500. package/Progress/ProgressOverlay.mjs +0 -64
  501. package/Progress/index.mjs +0 -3
  502. package/README.md +0 -1
  503. package/Rating/Rating.mjs +0 -154
  504. package/Rating/index.mjs +0 -62
  505. package/Select/SelectDownshift.mjs +0 -37
  506. package/Select/components.mjs +0 -25
  507. package/Select/index.mjs +0 -2
  508. package/Sidebar/Sidebar.mjs +0 -63
  509. package/Sidebar/index.mjs +0 -1
  510. package/Spacing/Spacing.mjs +0 -55
  511. package/Spacing/index.mjs +0 -1
  512. package/Sticky/Sticky.mjs +0 -218
  513. package/Sticky/StickyCss.mjs +0 -10
  514. package/Sticky/index.mjs +0 -1
  515. package/Tabs/TabsMui.mjs +0 -61
  516. package/Tabs/TabsMui.stories.mjs +0 -20
  517. package/Tabs/index.mjs +0 -1
  518. package/Tabs/sc/bare.mjs +0 -85
  519. package/Tabs/sc/index.stories.mjs +0 -0
  520. package/Tabs/tw/bare.mjs +0 -15
  521. package/Tabs/tw/index.stories.mjs +0 -25
  522. package/Tabs/tw/material.mjs +0 -14
  523. package/Tabs/useTabs.mjs +0 -46
  524. package/Typography/CopyPasteVisible.mjs +0 -6
  525. package/Typography/Native.mjs +0 -47
  526. package/Typography/ReadMore.mjs +0 -114
  527. package/Typography/TextLoop.mjs +0 -90
  528. package/Typography/TypeStairs.mjs +0 -61
  529. package/Typography/index.mjs +0 -5
  530. package/css/index.mjs +0 -30
  531. package/helpers/classed.mjs +0 -65
  532. package/helpers/classed.stories.mjs +0 -121
  533. package/helpers/createUseMediaQueryWidth.mjs +0 -178
  534. package/helpers/extend-component.mjs +0 -13
  535. package/helpers/index.mjs +0 -4
  536. package/hooks/index.mjs +0 -21
  537. package/hooks/types.mjs +0 -3
  538. package/hooks/useAsyncFn.mjs +0 -39
  539. package/hooks/useDateLocale.mjs +0 -37
  540. package/hooks/useFirstMountState.mjs +0 -12
  541. package/hooks/useFixedOffset.mjs +0 -56
  542. package/hooks/useFocus.mjs +0 -14
  543. package/hooks/useInterval.mjs +0 -29
  544. package/hooks/useIsomorphicLayoutEffect.mjs +0 -6
  545. package/hooks/useKeyUp.mjs +0 -21
  546. package/hooks/useMeasure.mjs +0 -174
  547. package/hooks/useMountedState.mjs +0 -15
  548. package/hooks/useNavigateAway.mjs +0 -69
  549. package/hooks/usePrevious.mjs +0 -17
  550. package/hooks/useScrollPosition.mjs +0 -70
  551. package/hooks/useScrollThreshold.mjs +0 -33
  552. package/hooks/useScrollTo.mjs +0 -20
  553. package/hooks/useSmoothScroll.mjs +0 -35
  554. package/hooks/useSpinDelay.mjs +0 -52
  555. package/hooks/useTraceUpdate.mjs +0 -23
  556. package/hooks/useUpdateEffect.mjs +0 -14
  557. package/hooks/useWindowSize.mjs +0 -32
  558. package/index.mjs +0 -4
  559. package/m/MotionProvider.mjs +0 -40
  560. package/m/index.mjs +0 -5
  561. package/sc/index.mjs +0 -31
  562. package/scm/index.mjs +0 -31
  563. package/shared/index.mjs +0 -43
  564. package/styles/Body.mjs +0 -16
  565. package/styles/Global.mjs +0 -49
  566. package/styles/index.mjs +0 -7
  567. package/styles/media.mjs +0 -151
  568. package/styles/spacing.mjs +0 -46
  569. package/styles/styled.mjs +0 -26
  570. package/styles/theme--vanilla.mjs +0 -65
  571. package/styles/theme.mjs +0 -38
  572. package/tw/index.mjs +0 -30
  573. package/twm/index.mjs +0 -30
  574. package/types.mjs +0 -1
  575. /package/m/{lite.mjs → lite.js} +0 -0
  576. /package/m/{max.mjs → max.js} +0 -0
package/Dialog/m/bare.mjs DELETED
@@ -1,115 +0,0 @@
1
- // FIXME: cannot build this
2
- import { extendComponent } from "../../helpers";
3
- const Dialog = ()=>null;
4
- export const KoineDialog = extendComponent(Dialog, {}); // import { AnimatePresence, m } from "framer-motion";
5
- // import { forwardRef, useMemo, useRef } from "react";
6
- // import { MdClear as IconClose } from "react-icons/md";
7
- // import { extendComponent } from "../../helpers";
8
- // import {
9
- // Backdrop,
10
- // Body,
11
- // Close,
12
- // Container,
13
- // Header,
14
- // type KoineDialogProps,
15
- // Paper,
16
- // Root,
17
- // } from "../DialogMui";
18
- // import { mRootStyle } from "./index";
19
- // // import { KoineDialog as _ } from "../DialogMui";
20
- // export type { KoineDialogProps } from "../DialogMui";
21
- // /**
22
- // * About nested `AnimatePresence` and animated dialogs with framer @see:
23
- // *
24
- // * - https://github.com/framer/motion/issues/478
25
- // * - https://codesandbox.io/s/clever-banzai-7km49?file=/src/Modal.js
26
- // */
27
- // const Dialog = forwardRef<HTMLDivElement, KoineDialogProps>(function Dialog(
28
- // {
29
- // children,
30
- // title,
31
- // $scrollPaper,
32
- // Root,
33
- // Backdrop,
34
- // Container,
35
- // Paper,
36
- // Close,
37
- // Header,
38
- // Body,
39
- // mBackdrop,
40
- // mPaper,
41
- // onClose,
42
- // ...props
43
- // },
44
- // ref
45
- // ) {
46
- // const BackdropMotion: KoineDialogProps["Backdrop"] = useMemo(
47
- // () => (props) =>
48
- // (
49
- // <AnimatePresence>
50
- // {/* @ts-expect-error framer props collision... */}
51
- // {props.open && <Backdrop {...mBackdrop} {...props} />}
52
- // </AnimatePresence>
53
- // ),
54
- // [Backdrop, mBackdrop]
55
- // );
56
- // // FIXME: extract this logic either in a useDialog hook or in a useclickOutside hook
57
- // // click handling is taken from
58
- // // @see https://github.com/mui/material-ui/blob/c758b6c0b30f0831110458a746690b33147c45df/packages/mui-material/src/Dialog/Dialog.js#L205-L226
59
- // const backdropClick = useRef<boolean | null>();
60
- // const handleMouseDown: React.MouseEventHandler = (event) => {
61
- // // We don't want to close the dialog when clicking the dialog content.
62
- // // Make sure the event starts and ends on the same DOM element.
63
- // backdropClick.current = event.target === event.currentTarget;
64
- // };
65
- // const handleBackdropClick: React.MouseEventHandler = (event) => {
66
- // // Ignore the events not coming from the "backdrop".
67
- // if (!backdropClick.current) {
68
- // return;
69
- // }
70
- // backdropClick.current = null;
71
- // // if (onBackdropClick) onBackdropClick(event);
72
- // if (onClose) {
73
- // onClose(event, "backdropClick");
74
- // }
75
- // };
76
- // return (
77
- // <Root
78
- // keepMounted
79
- // slots={{ backdrop: BackdropMotion }}
80
- // onClick={handleBackdropClick}
81
- // onClose={onClose}
82
- // ref={ref}
83
- // {...props}
84
- // style={mRootStyle({ open: props.open, style: props.style })}
85
- // >
86
- // <Container $scrollPaper={$scrollPaper} onMouseDown={handleMouseDown}>
87
- // <AnimatePresence>
88
- // {props.open && (
89
- // // @ts-expect-error framer props collision...
90
- // <Paper
91
- // {...mPaper}
92
- // aria-label={title || ""}
93
- // $scrollPaper={$scrollPaper}
94
- // >
95
- // {title && <Header>{title}</Header>}
96
- // <Close onClick={onClose}>
97
- // <IconClose />
98
- // </Close>
99
- // <Body>{children}</Body>
100
- // </Paper>
101
- // )}
102
- // </AnimatePresence>
103
- // </Container>
104
- // </Root>
105
- // );
106
- // });
107
- // export const KoineDialog = extendComponent(Dialog, {
108
- // Root,
109
- // Backdrop: m(Backdrop),
110
- // Container,
111
- // Paper: m(Paper),
112
- // Close,
113
- // Header,
114
- // Body,
115
- // });
@@ -1,31 +0,0 @@
1
- export * from "./index";
2
- export const dialogBackdropMotion = {
3
- initial: {
4
- opacity: 0
5
- },
6
- animate: {
7
- backdropFilter: "blur(10px)",
8
- opacity: 1
9
- },
10
- exit: {
11
- backdropFilter: "blur(0px)",
12
- opacity: 0
13
- }
14
- };
15
- export const dialogPaperMotion = {
16
- initial: {
17
- // scale: .9,
18
- translateY: -60,
19
- opacity: 0
20
- },
21
- animate: {
22
- // scale: 1,
23
- translateY: 0,
24
- opacity: 1
25
- },
26
- exit: {
27
- // scale: 0.9,
28
- translateY: 60,
29
- opacity: 0
30
- }
31
- };
@@ -1,4 +0,0 @@
1
- export const mRootStyle = (props)=>({
2
- pointerEvents: props.open ? "all" : "none",
3
- ...props.style || {}
4
- });
@@ -1,54 +0,0 @@
1
- import styled from "styled-components";
2
- import { IconButton } from "../../Buttons";
3
- import { extendComponent } from "../../helpers";
4
- import { inset0 } from "../../styles/styled";
5
- import * as _ from "../DialogMui";
6
- export const Root = styled(_.Root)`
7
- z-index: 1300;
8
- position: fixed;
9
- ${inset0}
10
- `;
11
- // export const Backdrop = (props) => {
12
- // return <div {...props} />;
13
- // }
14
- export const Backdrop = styled(_.Backdrop)`
15
- z-index: -1;
16
- position: fixed;
17
- ${inset0}
18
- backdrop-filter: blur(0px);
19
- -webkit-tap-highlight-color: transparent;
20
- `;
21
- /**
22
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
23
- */ export const Container = styled(_.Container)`
24
- height: 100%;
25
- outline: 0;
26
- ${(p)=>p.$scrollPaper ? "display: flex; justify-content: center; align-items: center;" : "overflow: hidden auto; text-align: center; &:after { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; }"}
27
- `;
28
- /**
29
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
30
- */ export const Paper = styled(_.Paper)`
31
- position: relative;
32
- ${(p)=>p.$scrollPaper ? "display: flex; flex-direction: column; max-height: calc(100%-64px);" : "display: inline-block; vertical-align: middle; text-align: initial;"}
33
- `;
34
- export const Close = styled(IconButton)`
35
- position: absolute;
36
- `;
37
- export const Header = styled(_.Header)``;
38
- /**
39
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
40
- */ export const Body = styled(_.Body)`
41
- flex: 1 1 auto;
42
- -webkit-overflow-scrolling: touch;
43
- overflow-y: auto;
44
- overflow: auto;
45
- `;
46
- export const KoineDialog = extendComponent(_.KoineDialog, {
47
- Root,
48
- Backdrop,
49
- Container,
50
- Paper,
51
- Close,
52
- Header,
53
- Body
54
- });
@@ -1,16 +0,0 @@
1
- import { m } from "framer-motion";
2
- import { extendComponent } from "../../helpers";
3
- import { KoineDialog as _ } from "../m/bare";
4
- import { dialogBackdropMotion, dialogPaperMotion } from "../m/basic";
5
- import { Backdrop, Body, Close, Container, Header, Paper, Root } from "./bare";
6
- export const KoineDialog = extendComponent(_, {
7
- Root,
8
- Backdrop: m(Backdrop),
9
- Container,
10
- Paper: m(Paper),
11
- Close,
12
- Header,
13
- Body,
14
- mBackdrop: dialogBackdropMotion,
15
- mPaper: dialogPaperMotion
16
- });
@@ -1,16 +0,0 @@
1
- import { m } from "framer-motion";
2
- import { extendComponent } from "../../helpers";
3
- import { KoineDialog as _ } from "../m/bare";
4
- import { dialogBackdropMotion, dialogPaperMotion } from "../m/basic";
5
- import { Backdrop, Body, Close, Container, Header, Paper, Root } from "./material";
6
- export const KoineDialog = extendComponent(_, {
7
- Root,
8
- Backdrop: m(Backdrop),
9
- Container,
10
- Paper: m(Paper),
11
- Close,
12
- Header,
13
- Body,
14
- mBackdrop: dialogBackdropMotion,
15
- mPaper: dialogPaperMotion
16
- });
@@ -1,48 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { StoryDialog, decoratorFramer, storyDialogArgs, storyDialogMeta } from "@koine/stories";
3
- import { KoineDialog as bareComp } from "./bare";
4
- import { KoineDialog as framerComp } from "./framer";
5
- import { KoineDialog as framerMaterialComp } from "./framerMaterial";
6
- import { KoineDialog as materialComp } from "./material";
7
- export default {
8
- title: "Base/Dialog/Styled Components",
9
- ...storyDialogMeta
10
- };
11
- const bareTemplate = (args)=>{
12
- return /*#__PURE__*/ _jsx(StoryDialog, {
13
- ...args,
14
- Dialog: bareComp
15
- });
16
- };
17
- export const bare = bareTemplate.bind({});
18
- bare.args = storyDialogArgs;
19
- const materialTemplate = (args)=>{
20
- return /*#__PURE__*/ _jsx(StoryDialog, {
21
- ...args,
22
- Dialog: materialComp
23
- });
24
- };
25
- export const material = materialTemplate.bind({});
26
- material.args = storyDialogArgs;
27
- const framerTemplate = (args)=>{
28
- return /*#__PURE__*/ _jsx(StoryDialog, {
29
- ...args,
30
- Dialog: framerComp
31
- });
32
- };
33
- export const framer = framerTemplate.bind({});
34
- framer.decorators = [
35
- decoratorFramer
36
- ];
37
- framer.args = storyDialogArgs;
38
- const framerMaterialTemplate = (args)=>{
39
- return /*#__PURE__*/ _jsx(StoryDialog, {
40
- ...args,
41
- Dialog: framerMaterialComp
42
- });
43
- };
44
- export const framerMaterial = framerMaterialTemplate.bind({});
45
- framerMaterial.decorators = [
46
- decoratorFramer
47
- ];
48
- framerMaterial.args = storyDialogArgs;
@@ -1,41 +0,0 @@
1
- import styled from "styled-components";
2
- import { extendComponent } from "../../helpers";
3
- import { KoineDialog as _ } from "./bare";
4
- export const Root = styled(_.Root)``;
5
- export const Backdrop = styled(_.Backdrop)`
6
- background: rgba(0, 0, 0, 0.5);
7
- filter: backdrop-blur(4px);
8
- `;
9
- export const Container = styled(_.Container)``;
10
- export const Paper = styled(_.Paper)`
11
- max-width: 640px;
12
- margin: 64px;
13
- border-radius: 4px;
14
- background: white;
15
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
16
- `;
17
- export const Close = styled(_.Close)`
18
- position: absolute;
19
- top: 0;
20
- right: 0;
21
- padding: 8px;
22
- font-size: 2rem;
23
- opacity: 0.5;
24
- `;
25
- export const Header = styled(_.Header)`
26
- padding: 16px;
27
- font-size: 1.25rem;
28
- `;
29
- export const Body = styled(_.Body)`
30
- padding: 16px;
31
- border-top: 1px solid rgba(0, 0, 0, 0.08);
32
- `;
33
- export const KoineDialog = extendComponent(_, {
34
- Root,
35
- Backdrop,
36
- Container,
37
- Paper,
38
- Close,
39
- Header,
40
- Body
41
- });
@@ -1,29 +0,0 @@
1
- import { classed, extendComponent } from "../../helpers";
2
- import * as _ from "../DialogMui";
3
- export const Root = classed(_.Root)`< class="dialog fixed z-[1300] inset-0`;
4
- export const Backdrop = classed(_.Backdrop)`< class="dialogBackdrop fixed -z-[1] inset-0 [-webkit-tap-highlight-color:transparent]`;
5
- /**
6
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
7
- */ export const Container = classed(_.Container)`< class="dialogContainer h-full outline-0 ${(p)=>p.$scrollPaper ? "flex justify-center items-center" : "overflow-y-auto overflow-x-hidden text-center [after:content:''] after:inline-block after:align-middle after:h-full after:w-0"}`;
8
- /**
9
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
10
- */ export const Paper = classed(_.Paper)`< class="dialogPaper relative ${(p)=>p.$scrollPaper ? "flex flex-col max-h-[calc(100%-64px)]" : "inline-block align-middle [text-align:initial]"}`;
11
- export const Close = classed(_.Close)`< class="dialogClose`;
12
- export const Header = classed(_.Header)`< class="dialogHeader`;
13
- /**
14
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
15
- * The arbitrary rule webkit-overflow-scrolling is to add iOS momentum scrolling for iOS < 13.0,
16
- * this was removed from tailiwnd 2.0 on
17
- *
18
- * @see https://github.com/tailwindlabs/tailwindcss.com/issues/483
19
- * @see https://v2.tailwindcss.com/docs/upgrading-to-v2#the-scrolling-touch-and-scrolling-auto-utilities-have-been-removed
20
- */ export const Body = classed(_.Body)`< class="dialogBody flex-1 basis-auto overflow-y-auto [-webkit-overflow-scrolling:touch]`;
21
- export const KoineDialog = extendComponent(_.KoineDialog, {
22
- Root,
23
- Backdrop,
24
- Container,
25
- Paper,
26
- Close,
27
- Header,
28
- Body
29
- });
@@ -1,18 +0,0 @@
1
- import { classed, extendComponent } from "../../helpers";
2
- import { KoineDialog as _ } from "./bare";
3
- export const Root = classed(_.Root)``;
4
- export const Backdrop = classed(_.Backdrop)`< class="bg-white/[.5] backdrop-blur-sm`;
5
- export const Container = classed(_.Container)``;
6
- export const Paper = classed(_.Paper)`< class="bg-white shadow-xl m-8 max-w-screen-sm border border-gray-400`;
7
- export const Close = classed(_.Close)`< class="absolute top-0 right-0 p-8 text-2xl opacity-20 hover:opacity-100 focus:opacity-100`;
8
- export const Header = classed(_.Header)`< class="p-8 text-2xl bold italic`;
9
- export const Body = classed(_.Body)`< class="p-8 pt-4`;
10
- export const KoineDialog = extendComponent(_, {
11
- Root,
12
- Backdrop,
13
- Container,
14
- Paper,
15
- Close,
16
- Header,
17
- Body
18
- });
@@ -1,16 +0,0 @@
1
- import { m } from "framer-motion";
2
- import { extendComponent } from "../../helpers";
3
- import { KoineDialog as _ } from "../m/bare";
4
- import { dialogBackdropMotion, dialogPaperMotion } from "../m/basic";
5
- import { Backdrop, Body, Close, Container, Header, Paper, Root } from "./bare";
6
- export const KoineDialog = extendComponent(_, {
7
- Root,
8
- Backdrop: m(Backdrop),
9
- Container,
10
- Paper: m(Paper),
11
- Close,
12
- Header,
13
- Body,
14
- mBackdrop: dialogBackdropMotion,
15
- mPaper: dialogPaperMotion
16
- });
@@ -1,16 +0,0 @@
1
- import { m } from "framer-motion";
2
- import { extendComponent } from "../../helpers";
3
- import { KoineDialog as _ } from "../m/bare";
4
- import { dialogBackdropMotion, dialogPaperMotion } from "../m/basic";
5
- import { Backdrop, Body, Close, Container, Header, Paper, Root } from "./material";
6
- export const KoineDialog = extendComponent(_, {
7
- Root,
8
- Backdrop: m(Backdrop),
9
- Container,
10
- Paper: m(Paper),
11
- Close,
12
- Header,
13
- Body,
14
- mBackdrop: dialogBackdropMotion,
15
- mPaper: dialogPaperMotion
16
- });
@@ -1,83 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { StoryDialog, decoratorFramer, storyDialogArgs, storyDialogMeta } from "@koine/stories";
3
- import { classed } from "../../helpers";
4
- import { KoineDialog as bareComp } from "./bare";
5
- import { KoineDialog as framerComp } from "./framer";
6
- import { KoineDialog as framerMaterialComp } from "./framerMaterial";
7
- import { KoineDialog as materialComp } from "./material";
8
- // import { KoineDialog as elegantComp } from "./elegant";
9
- export default {
10
- title: "Base/Dialog/Tailwind",
11
- ...storyDialogMeta
12
- };
13
- const bareTemplate = (args)=>{
14
- return /*#__PURE__*/ _jsx(StoryDialog, {
15
- ...args,
16
- Dialog: bareComp
17
- });
18
- };
19
- export const bare = bareTemplate.bind({});
20
- bare.args = storyDialogArgs;
21
- const materialTemplate = (args)=>{
22
- return /*#__PURE__*/ _jsx(StoryDialog, {
23
- ...args,
24
- Dialog: materialComp
25
- });
26
- };
27
- export const material = materialTemplate.bind({});
28
- material.args = storyDialogArgs;
29
- const framerTemplate = (args)=>{
30
- return /*#__PURE__*/ _jsx(StoryDialog, {
31
- ...args,
32
- Dialog: framerComp
33
- });
34
- };
35
- export const framer = framerTemplate.bind({});
36
- framer.decorators = [
37
- decoratorFramer
38
- ];
39
- framer.args = storyDialogArgs;
40
- const framerMaterialTemplate = (args)=>{
41
- return /*#__PURE__*/ _jsx(StoryDialog, {
42
- ...args,
43
- Dialog: framerMaterialComp
44
- });
45
- };
46
- export const framerMaterial = framerMaterialTemplate.bind({});
47
- framerMaterial.decorators = [
48
- decoratorFramer
49
- ];
50
- framerMaterial.args = storyDialogArgs;
51
- const customisedTemplate = (args)=>{
52
- return /*#__PURE__*/ _jsx(StoryDialog, {
53
- ...args,
54
- Dialog: framerComp
55
- });
56
- };
57
- export const customised = customisedTemplate.bind({});
58
- customised.decorators = [
59
- decoratorFramer
60
- ];
61
- customised.args = {
62
- ...storyDialogArgs,
63
- $scrollPaper: true,
64
- Backdrop: classed(framerComp.Backdrop)`< class="bg-sky-100/[.5]"`,
65
- Paper: classed(framerComp.Paper)`< class="shadow-2xl m-8 max-w-screen-sm bg-blue-500 text-white rounded-3xl"`,
66
- Close: classed(framerComp.Close)`< class="absolute lg:-right-8 lg:-top-8 p-4 text-4xl rounded-full bg-blue-300 hover:bg-blue-700 text-blue-800 hover:text-white"`,
67
- Header: classed(framerComp.Header)`< class="font-mono font-bold text-3xl p-12 pb-6`,
68
- Body: classed(framerComp.Body)`< class="px-12 pb-12 border-none"`,
69
- mPaper: {
70
- initial: {
71
- scale: 0.9,
72
- scaleX: 0
73
- },
74
- animate: {
75
- scale: 1,
76
- scaleX: 1
77
- },
78
- exit: {
79
- scale: 0.9,
80
- scaleX: 0
81
- }
82
- }
83
- };
@@ -1,18 +0,0 @@
1
- import { classed, extendComponent } from "../../helpers";
2
- import { KoineDialog as _ } from "./bare";
3
- export const Root = classed(_.Root)``;
4
- export const Backdrop = classed(_.Backdrop)`< class="bg-black/[.5] backdrop-blur-sm`;
5
- export const Container = classed(_.Container)``;
6
- export const Paper = classed(_.Paper)`< class="rounded bg-white shadow-xl m-8 max-w-screen-sm`;
7
- export const Close = classed(_.Close)`< class="absolute top-0 right-0 p-4 text-2xl opacity-50`;
8
- export const Header = classed(_.Header)`< class="p-4 text-xl`;
9
- export const Body = classed(_.Body)`< class="p-4 border-t border-gray-200`;
10
- export const KoineDialog = extendComponent(_, {
11
- Root,
12
- Backdrop,
13
- Container,
14
- Paper,
15
- Close,
16
- Header,
17
- Body
18
- });
@@ -1,53 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { EditorContent, useEditor } from "@tiptap/react";
3
- import StarterKit from "@tiptap/starter-kit";
4
- import { useCallback } from "react";
5
- import { EditorBarBtn, EditorBarRoot, EditorGlobalStyles, EditorIconBold, EditorIconItalic, EditorRoot } from "./components";
6
- export const EditorBar = ({ editor })=>{
7
- const handleClick = useCallback((e, type)=>{
8
- e.preventDefault();
9
- // @ts-expect-error FIXME: cannot build this
10
- editor?.chain().focus()[`toggle${type}`]().run();
11
- }, [
12
- editor
13
- ]);
14
- if (!editor) {
15
- return null;
16
- }
17
- return /*#__PURE__*/ _jsxs(EditorBarRoot, {
18
- children: [
19
- /*#__PURE__*/ _jsx(EditorBarBtn, {
20
- onClick: (e)=>handleClick(e, "Bold"),
21
- className: editor.isActive("bold") ? "is-active" : "",
22
- children: /*#__PURE__*/ _jsx(EditorIconBold, {})
23
- }),
24
- /*#__PURE__*/ _jsx(EditorBarBtn, {
25
- onClick: (e)=>handleClick(e, "Italic"),
26
- className: editor.isActive("bold") ? "is-active" : "",
27
- children: /*#__PURE__*/ _jsx(EditorIconItalic, {})
28
- })
29
- ]
30
- });
31
- };
32
- export const Editor = ({ options, ...props })=>{
33
- const editor = useEditor({
34
- extensions: [
35
- StarterKit
36
- ],
37
- content: "",
38
- ...options || {}
39
- });
40
- return /*#__PURE__*/ _jsxs(EditorRoot, {
41
- children: [
42
- /*#__PURE__*/ _jsx(EditorGlobalStyles, {}),
43
- /*#__PURE__*/ _jsx(EditorBar, {
44
- editor: editor
45
- }),
46
- /*#__PURE__*/ _jsx(EditorContent, {
47
- className: "EditorContent",
48
- editor: editor,
49
- ...props
50
- })
51
- ]
52
- });
53
- };
@@ -1,28 +0,0 @@
1
- import styled, { createGlobalStyle } from "styled-components";
2
- import { IconButton } from "../Buttons/IconButton";
3
- import { inputBorder, inputFocus, inputPadding } from "../Forms/styles";
4
- export { MdFormatBold as EditorIconBold, MdFormatItalic as EditorIconItalic } from "react-icons/md";
5
- export const EditorRoot = styled.div`
6
- ${inputBorder}
7
- ${inputFocus}
8
- `;
9
- export const EditorBarRoot = styled.div`
10
- display: flex;
11
- justify-content: flex-end;
12
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
13
- /* background: var(--grey900); */
14
- `;
15
- export const EditorBarBtn = styled(IconButton)``;
16
- export const EditorGlobalStyles = createGlobalStyle`
17
- .ProseMirror {
18
- ${inputPadding}
19
-
20
- &:focus {
21
- outline:none;
22
- }
23
-
24
- > *:first-child {
25
- margin-top: 0;
26
- }
27
- }
28
- `;
package/Editor/index.mjs DELETED
@@ -1 +0,0 @@
1
- export * from "./Editor--tiptap";
package/FaviconTags.mjs DELETED
@@ -1,64 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- /**
3
- * Favicon tags.
4
- *
5
- * This component is meant to be wrapped in a `<head>` manager component.
6
- *
7
- * These tags have been produced by [realfavicongenerator.net](https://realfavicongenerator.net/)
8
- * on _**16 Feb 2022**_.
9
- *
10
- * @see https://realfavicongenerator.net/
11
- */ export const FaviconTags = ({ name, color, safariTabColor, tileColor, themeColor })=>{
12
- return /*#__PURE__*/ _jsxs(_Fragment, {
13
- children: [
14
- /*#__PURE__*/ _jsx("link", {
15
- rel: "shortcut icon",
16
- href: "/favicon.ico",
17
- type: "image/x-icon"
18
- }),
19
- /*#__PURE__*/ _jsx("link", {
20
- rel: "apple-touch-icon",
21
- sizes: "180x180",
22
- href: "/apple-touch-icon.png"
23
- }),
24
- /*#__PURE__*/ _jsx("link", {
25
- rel: "icon",
26
- type: "image/png",
27
- sizes: "32x32",
28
- href: "/favicon-32x32.png"
29
- }),
30
- /*#__PURE__*/ _jsx("link", {
31
- rel: "icon",
32
- type: "image/png",
33
- sizes: "16x16",
34
- href: "/favicon-16x16.png"
35
- }),
36
- /*#__PURE__*/ _jsx("link", {
37
- rel: "manifest",
38
- href: "/site.webmanifest"
39
- }),
40
- /*#__PURE__*/ _jsx("link", {
41
- rel: "mask-icon",
42
- href: "/safari-pinned-tab.svg",
43
- color: safariTabColor || color
44
- }),
45
- /*#__PURE__*/ _jsx("meta", {
46
- name: "apple-mobile-web-app-title",
47
- content: name
48
- }),
49
- /*#__PURE__*/ _jsx("meta", {
50
- name: "application-name",
51
- content: name
52
- }),
53
- /*#__PURE__*/ _jsx("meta", {
54
- name: "msapplication-TileColor",
55
- content: tileColor || color
56
- }),
57
- /*#__PURE__*/ _jsx("meta", {
58
- name: "theme-color",
59
- content: themeColor || color
60
- })
61
- ]
62
- });
63
- };
64
- export default FaviconTags;