@koine/react 1.0.12 → 1.0.13

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 (196) hide show
  1. package/Forms/Toggle/useToggle.d.ts +1 -1
  2. package/Forms/Toggle/useToggle.js +1 -1
  3. package/package.json +6 -7
  4. package/node/Alert/Alert.js +0 -14
  5. package/node/Alert/index.js +0 -4
  6. package/node/Animations/Reveal.js +0 -21
  7. package/node/Animations/Underline.js +0 -8
  8. package/node/Animations/index.js +0 -6
  9. package/node/Animations/useReveal.js +0 -75
  10. package/node/Autocomplete/AutocompleteDownshift.js +0 -161
  11. package/node/Autocomplete/AutocompleteDownshiftMultiselect.js +0 -356
  12. package/node/Autocomplete/AutocompleteMui.js +0 -180
  13. package/node/Autocomplete/AutocompleteReach.js +0 -115
  14. package/node/Autocomplete/components.js +0 -37
  15. package/node/Autocomplete/helpers.js +0 -32
  16. package/node/Autocomplete/index.js +0 -7
  17. package/node/Bg/BgColor.js +0 -25
  18. package/node/Bg/BgPhoto.js +0 -20
  19. package/node/Bg/BgSvg.js +0 -16
  20. package/node/Bg/index.js +0 -6
  21. package/node/Breadcrumbs/Breadcrumbs.js +0 -31
  22. package/node/Breadcrumbs/index.js +0 -4
  23. package/node/Buttons/Button.js +0 -17
  24. package/node/Buttons/ButtonComposite.js +0 -32
  25. package/node/Buttons/ButtonFab.js +0 -9
  26. package/node/Buttons/ButtonLink.js +0 -15
  27. package/node/Buttons/IconButton.js +0 -10
  28. package/node/Buttons/index.js +0 -8
  29. package/node/Calendar/CalendarDaygridCell.js +0 -61
  30. package/node/Calendar/CalendarDaygridNav.js +0 -28
  31. package/node/Calendar/CalendarDaygridTable.js +0 -61
  32. package/node/Calendar/CalendarLegend.js +0 -20
  33. package/node/Calendar/calendar-api-google.js +0 -131
  34. package/node/Calendar/index.js +0 -9
  35. package/node/Calendar/types.js +0 -2
  36. package/node/Calendar/useCalendar.js +0 -187
  37. package/node/Calendar/utils.js +0 -215
  38. package/node/Carousel/Carousel.js +0 -381
  39. package/node/Carousel/CarouselCss.js +0 -27
  40. package/node/Carousel/index.js +0 -4
  41. package/node/Collapsable/Collapsable.js +0 -4
  42. package/node/Collapsable/CollapsableReach.js +0 -253
  43. package/node/Collapsable/index.js +0 -5
  44. package/node/Debug/Debug.js +0 -13
  45. package/node/Debug/index.js +0 -4
  46. package/node/Details/Details.js +0 -67
  47. package/node/Details/index.js +0 -4
  48. package/node/Dialog/DialogMui.js +0 -83
  49. package/node/Dialog/css/bare.js +0 -24
  50. package/node/Dialog/index.js +0 -5
  51. package/node/Dialog/m/bare.js +0 -55
  52. package/node/Dialog/m/basic.js +0 -35
  53. package/node/Dialog/m/index.js +0 -8
  54. package/node/Dialog/sc/bare.js +0 -46
  55. package/node/Dialog/sc/framer.js +0 -19
  56. package/node/Dialog/sc/framerMaterial.js +0 -19
  57. package/node/Dialog/sc/material.js +0 -24
  58. package/node/Dialog/tw/bare.js +0 -45
  59. package/node/Dialog/tw/elegant.js +0 -23
  60. package/node/Dialog/tw/framer.js +0 -19
  61. package/node/Dialog/tw/framerMaterial.js +0 -19
  62. package/node/Dialog/tw/material.js +0 -23
  63. package/node/Editor/Editor--tiptap.js +0 -31
  64. package/node/Editor/components.js +0 -15
  65. package/node/Editor/index.js +0 -4
  66. package/node/Favicon/FaviconTags.js +0 -19
  67. package/node/Favicon/index.js +0 -4
  68. package/node/Form/Form.js +0 -65
  69. package/node/Form/index.js +0 -4
  70. package/node/Form/sc/bare.js +0 -23
  71. package/node/Forms/Checkbox/Checkbox.js +0 -21
  72. package/node/Forms/Checkbox/index.js +0 -4
  73. package/node/Forms/Feedback/Feedback.js +0 -13
  74. package/node/Forms/Feedback/index.js +0 -4
  75. package/node/Forms/Field/Field.js +0 -52
  76. package/node/Forms/Field/FieldControl.js +0 -51
  77. package/node/Forms/Field/FieldHint.js +0 -7
  78. package/node/Forms/Field/index.js +0 -5
  79. package/node/Forms/Input/Input.js +0 -20
  80. package/node/Forms/Input/index.js +0 -4
  81. package/node/Forms/InputGroup/InputGroup.js +0 -19
  82. package/node/Forms/InputGroup/index.js +0 -4
  83. package/node/Forms/Label/Label.js +0 -9
  84. package/node/Forms/Label/index.js +0 -4
  85. package/node/Forms/Password/Password.js +0 -20
  86. package/node/Forms/Password/index.js +0 -4
  87. package/node/Forms/Radio/Radio.js +0 -28
  88. package/node/Forms/Radio/index.js +0 -4
  89. package/node/Forms/Switch/Switch.js +0 -23
  90. package/node/Forms/Switch/index.js +0 -4
  91. package/node/Forms/Textarea/Textarea.js +0 -15
  92. package/node/Forms/Textarea/TextareaRich.js +0 -31
  93. package/node/Forms/Textarea/index.js +0 -5
  94. package/node/Forms/Toggle/Toggle.js +0 -37
  95. package/node/Forms/Toggle/index.js +0 -4
  96. package/node/Forms/Toggle/useToggle.js +0 -149
  97. package/node/Forms/antispam.js +0 -61
  98. package/node/Forms/helpers.js +0 -52
  99. package/node/Forms/index.js +0 -19
  100. package/node/Forms/styles.js +0 -32
  101. package/node/Gauge/Gauge.js +0 -106
  102. package/node/Grid/Grid.js +0 -56
  103. package/node/Grid/index.js +0 -4
  104. package/node/Hamburger/Hamburger.js +0 -56
  105. package/node/Hamburger/index.js +0 -4
  106. package/node/Header/index.js +0 -4
  107. package/node/Header/useHeader.js +0 -34
  108. package/node/Hidden/Hidden.js +0 -13
  109. package/node/Hidden/index.js +0 -4
  110. package/node/Img/index.js +0 -4
  111. package/node/Img/sc/bare.js +0 -42
  112. package/node/Img/types.js +0 -2
  113. package/node/Link/Link.js +0 -7
  114. package/node/Link/LinkBlank.js +0 -21
  115. package/node/Link/index.js +0 -5
  116. package/node/Menu/Menu.js +0 -7
  117. package/node/Menu/index.js +0 -4
  118. package/node/MenuItem/MenuItem.js +0 -7
  119. package/node/MenuItem/index.js +0 -4
  120. package/node/Meta/Meta.js +0 -9
  121. package/node/Meta/index.js +0 -4
  122. package/node/NoJs/NoJs.js +0 -10
  123. package/node/NoJs/index.js +0 -4
  124. package/node/Pagination/PaginationNav.js +0 -65
  125. package/node/Pagination/PaginationResults.js +0 -15
  126. package/node/Pagination/index.js +0 -5
  127. package/node/Pill/Pill.js +0 -10
  128. package/node/Pill/index.js +0 -4
  129. package/node/Progress/ProgressCircular.js +0 -19
  130. package/node/Progress/ProgressLinear.js +0 -28
  131. package/node/Progress/ProgressOverlay.js +0 -28
  132. package/node/Progress/index.js +0 -6
  133. package/node/Rating/Rating.js +0 -76
  134. package/node/Rating/index.js +0 -57
  135. package/node/Select/SelectDownshift.js +0 -41
  136. package/node/Select/components.js +0 -15
  137. package/node/Select/index.js +0 -7
  138. package/node/Sidebar/Sidebar.js +0 -27
  139. package/node/Sidebar/index.js +0 -4
  140. package/node/Spacing/Spacing.js +0 -49
  141. package/node/Spacing/index.js +0 -4
  142. package/node/Sticky/Sticky.js +0 -222
  143. package/node/Sticky/StickyCss.js +0 -10
  144. package/node/Sticky/index.js +0 -4
  145. package/node/Tabs/TabsMui.js +0 -49
  146. package/node/Tabs/index.js +0 -4
  147. package/node/Tabs/sc/bare.js +0 -87
  148. package/node/Tabs/tw/bare.js +0 -20
  149. package/node/Tabs/tw/material.js +0 -21
  150. package/node/Tabs/useTabs.js +0 -48
  151. package/node/Typography/CopyPasteVisible.js +0 -7
  152. package/node/Typography/Native.js +0 -17
  153. package/node/Typography/ReadMore.js +0 -47
  154. package/node/Typography/TextLoop.js +0 -51
  155. package/node/Typography/TypeStairs.js +0 -53
  156. package/node/Typography/index.js +0 -8
  157. package/node/css/index.js +0 -36
  158. package/node/helpers/classed.js +0 -72
  159. package/node/helpers/extend-component.js +0 -16
  160. package/node/helpers/index.js +0 -5
  161. package/node/hooks/index.js +0 -18
  162. package/node/hooks/types.js +0 -2
  163. package/node/hooks/useAsyncFn.js +0 -40
  164. package/node/hooks/useDateLocale.js +0 -42
  165. package/node/hooks/useEffectOnce.js +0 -12
  166. package/node/hooks/useFirstMountState.js +0 -16
  167. package/node/hooks/useFocus.js +0 -15
  168. package/node/hooks/useId.js +0 -12
  169. package/node/hooks/useIsomorphicLayoutEffect.js +0 -11
  170. package/node/hooks/useMount.js +0 -13
  171. package/node/hooks/useMountedState.js +0 -19
  172. package/node/hooks/usePrevious.js +0 -12
  173. package/node/hooks/useScrollPosition.js +0 -84
  174. package/node/hooks/useScrollTo.js +0 -25
  175. package/node/hooks/useTraceUpdate.js +0 -25
  176. package/node/hooks/useUpdateEffect.js +0 -18
  177. package/node/hooks/useWindowSize.js +0 -17
  178. package/node/index.js +0 -8
  179. package/node/m/MotionProvider.js +0 -43
  180. package/node/m/index.js +0 -9
  181. package/node/m/lite.js +0 -4
  182. package/node/m/max.js +0 -4
  183. package/node/sc/index.js +0 -37
  184. package/node/scm/index.js +0 -36
  185. package/node/shared/index.js +0 -11
  186. package/node/styles/Body.js +0 -16
  187. package/node/styles/Global.js +0 -21
  188. package/node/styles/index.js +0 -10
  189. package/node/styles/media.js +0 -160
  190. package/node/styles/spacing.js +0 -52
  191. package/node/styles/styled.js +0 -17
  192. package/node/styles/theme--vanilla.js +0 -61
  193. package/node/styles/theme.js +0 -45
  194. package/node/tw/index.js +0 -36
  195. package/node/twm/index.js +0 -36
  196. package/node/types.js +0 -2
@@ -1,13 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Debug = void 0;
4
- var tslib_1 = require("tslib");
5
- var jsx_runtime_1 = require("react/jsx-runtime");
6
- var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
7
- var Root = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n background: #f4f4f4;\n border: 1px solid #ddd;\n border-left: 3px solid #f36d33;\n color: #666;\n page-break-inside: avoid;\n font-family: monospace;\n font-size: small;\n line-height: 1.6;\n margin-bottom: 1.6em;\n max-width: 100%;\n overflow: auto;\n padding: 1em 1.5em;\n display: block;\n word-wrap: break-word;\n"], ["\n background: #f4f4f4;\n border: 1px solid #ddd;\n border-left: 3px solid #f36d33;\n color: #666;\n page-break-inside: avoid;\n font-family: monospace;\n font-size: small;\n line-height: 1.6;\n margin-bottom: 1.6em;\n max-width: 100%;\n overflow: auto;\n padding: 1em 1.5em;\n display: block;\n word-wrap: break-word;\n"])));
8
- var Debug = function (_a) {
9
- var data = _a.data;
10
- return (0, jsx_runtime_1.jsx)(Root, { children: JSON.stringify(data, undefined, 2) });
11
- };
12
- exports.Debug = Debug;
13
- var templateObject_1;
@@ -1,4 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- tslib_1.__exportStar(require("./Debug"), exports);
@@ -1,67 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDetails = exports.Content = exports.Body = exports.Summary = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var jsx_runtime_1 = require("react/jsx-runtime");
6
- var react_1 = require("react");
7
- var useWindowSize_1 = require("../hooks/useWindowSize");
8
- var helpers_1 = require("../helpers");
9
- var useId_1 = require("../hooks/useId");
10
- exports.Root = "details";
11
- exports.Summary = "summary";
12
- exports.Body = "div";
13
- exports.Content = "div";
14
- /**
15
- * FIXME: it actually works even without forwardRef, check if we do need it
16
- *
17
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details
18
- */
19
- var DetailsWithRef = (0, react_1.forwardRef)(function Details(_a, ref) {
20
- var id = _a.id, propOpen = _a.open, recalc = _a.recalc, summary = _a.summary, children = _a.children, _Root = _a.Root, _Summary = _a.Summary, _Body = _a.Body, _Content = _a.Content, onChange = _a.onChange, props = tslib_1.__rest(_a, ["id", "open", "recalc", "summary", "children", "Root", "Summary", "Body", "Content", "onChange"]);
21
- var isControlled = typeof propOpen !== "undefined";
22
- var _b = (0, react_1.useState)(propOpen), stateOpen = _b[0], setStateOpen = _b[1];
23
- var _c = (0, react_1.useState)(0), height = _c[0], setHeight = _c[1];
24
- var hash = id ? "#".concat(id) : "";
25
- var winSize = (0, useWindowSize_1.useWindowSize)();
26
- var open = isControlled ? propOpen : stateOpen;
27
- var _d = (0, react_1.useState)(open ? "unset" : "hidden"), overflow = _d[0], setOverflow = _d[1];
28
- var content = (0, react_1.useRef)(null);
29
- var defaultId = (0, useId_1.useId)();
30
- id = id || defaultId;
31
- var handleClick = (0, react_1.useCallback)(function () {
32
- if (hash) {
33
- window.history.replaceState(null, "", open ? window.location.pathname + window.location.search : hash);
34
- }
35
- if (onChange) {
36
- onChange();
37
- }
38
- if (!isControlled) {
39
- setStateOpen(function (prevOpen) { return !prevOpen; });
40
- }
41
- }, [open, hash, onChange, isControlled]);
42
- (0, react_1.useEffect)(function () {
43
- if (content.current) {
44
- setHeight(Math.ceil(content.current.offsetHeight));
45
- }
46
- }, [winSize, recalc]);
47
- // deeplink on mount
48
- (0, react_1.useEffect)(function () {
49
- if (!isControlled && hash && window.location.hash === hash) {
50
- setStateOpen(true);
51
- }
52
- }, [hash, isControlled]);
53
- return ((0, jsx_runtime_1.jsxs)(exports.Root, tslib_1.__assign({}, props, { open: open || false }, { children: [(0, jsx_runtime_1.jsx)(exports.Summary, tslib_1.__assign({ "$open": open, onClick: handleClick }, { children: summary || " " })), (0, jsx_runtime_1.jsx)(exports.Body, tslib_1.__assign({ "$open": open, style: { overflow: overflow } }, { children: (0, jsx_runtime_1.jsx)(exports.Content
54
- // ref={content}
55
- , tslib_1.__assign({ "$open": open,
56
- // aria-expanded={open}
57
- // aria-label={open ? ariaCollapse : ariaExpand}
58
- style: {
59
- pointerEvents: open ? "all" : "none",
60
- } }, { children: children })) }))] })));
61
- });
62
- exports.KoineDetails = (0, helpers_1.extendComponent)(DetailsWithRef, {
63
- Root: exports.Root,
64
- Summary: exports.Summary,
65
- Body: exports.Body,
66
- Content: exports.Content,
67
- });
@@ -1,4 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- tslib_1.__exportStar(require("./Details"), exports);
@@ -1,83 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var jsx_runtime_1 = require("react/jsx-runtime");
6
- var react_1 = require("react");
7
- var ModalUnstyled_1 = tslib_1.__importDefault(require("@mui/base/ModalUnstyled"));
8
- var md_1 = require("react-icons/md");
9
- var helpers_1 = require("../helpers");
10
- exports.Root = ModalUnstyled_1.default;
11
- exports.Backdrop = "div";
12
- exports.Container = "div";
13
- exports.Paper = "div";
14
- exports.Close = "button";
15
- exports.Header = "div";
16
- exports.Body = "div";
17
- // const Dialog = ({
18
- // children,
19
- // title,
20
- // $scrollPaper,
21
- // Root: _Root,
22
- // Backdrop: _Backdrop,
23
- // Container: _Container,
24
- // Paper: _Paper,
25
- // Close: _Close,
26
- // Header: _Header,
27
- // Body: _Body,
28
- // ...props
29
- // }: KoineDialogProps) => (
30
- // <Root BackdropComponent={Backdrop} onBackdropClick={props.onClose} {...props}>
31
- // <Container $scrollPaper={$scrollPaper}>
32
- // <Paper aria-label={title || ""} $scrollPaper={$scrollPaper}>
33
- // {title && <Header>{title}</Header>}
34
- // <Close onClick={props.onClose}>
35
- // <IconClose />
36
- // </Close>
37
- // <Body>{children}</Body>
38
- // </Paper>
39
- // </Container>
40
- // </Root>
41
- // );
42
- /**
43
- *
44
- * Main differences from [Mui Dialog](https://mui.com/material-ui/react-dialog):
45
- *
46
- * - By default uses `scroll="body"` instead of paper.
47
- * - Optionally uses `framer-motion` for animations
48
- * - Uses backdrop blur by default
49
- *
50
- * FIXME: it actually works even without forwardRef, check if we do need it
51
- */
52
- var DialogWithRef = (0, react_1.forwardRef)(function Dialog(_a, ref) {
53
- var children = _a.children, title = _a.title, $scrollPaper = _a.$scrollPaper, _Root = _a.Root, _Backdrop = _a.Backdrop, _Container = _a.Container, _Paper = _a.Paper, _Close = _a.Close, _Header = _a.Header, _Body = _a.Body, onClose = _a.onClose, props = tslib_1.__rest(_a, ["children", "title", "$scrollPaper", "Root", "Backdrop", "Container", "Paper", "Close", "Header", "Body", "onClose"]);
54
- // click handling is taken from
55
- // @see https://github.com/mui/material-ui/blob/c758b6c0b30f0831110458a746690b33147c45df/packages/mui-material/src/Dialog/Dialog.js#L205-L226
56
- var backdropClick = (0, react_1.useRef)();
57
- var handleMouseDown = function (event) {
58
- // We don't want to close the dialog when clicking the dialog content.
59
- // Make sure the event starts and ends on the same DOM element.
60
- backdropClick.current = event.target === event.currentTarget;
61
- };
62
- var handleBackdropClick = function (event) {
63
- // Ignore the events not coming from the "backdrop".
64
- if (!backdropClick.current) {
65
- return;
66
- }
67
- backdropClick.current = null;
68
- // if (onBackdropClick) onBackdropClick(event);
69
- if (onClose) {
70
- onClose(event, "backdropClick");
71
- }
72
- };
73
- return ((0, jsx_runtime_1.jsx)(exports.Root, tslib_1.__assign({ BackdropComponent: exports.Backdrop, onClick: handleBackdropClick, onClose: onClose, ref: ref }, props, { children: (0, jsx_runtime_1.jsx)(exports.Container, tslib_1.__assign({ "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsxs)(exports.Paper, tslib_1.__assign({ "aria-label": title || "", "$scrollPaper": $scrollPaper }, { children: [title && (0, jsx_runtime_1.jsx)(exports.Header, { children: title }), (0, jsx_runtime_1.jsx)(exports.Close, tslib_1.__assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) })), (0, jsx_runtime_1.jsx)(exports.Body, { children: children })] })) })) })));
74
- });
75
- exports.KoineDialog = (0, helpers_1.extendComponent)(DialogWithRef, {
76
- Root: exports.Root,
77
- Backdrop: exports.Backdrop,
78
- Container: exports.Container,
79
- Paper: exports.Paper,
80
- Close: exports.Close,
81
- Header: exports.Header,
82
- Body: exports.Body,
83
- });
@@ -1,24 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var helpers_1 = require("../../helpers");
6
- var _ = tslib_1.__importStar(require("../DialogMui"));
7
- // export type { KoineDialogProps } from "../DialogMui";
8
- exports.Root = (0, helpers_1.classed)(_.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["dialog"], ["dialog"])));
9
- exports.Backdrop = (0, helpers_1.classed)(_.Backdrop)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["dialogBackdrop"], ["dialogBackdrop"])));
10
- exports.Container = (0, helpers_1.classed)(_.Container)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["dialogContainer"], ["dialogContainer"])));
11
- exports.Paper = (0, helpers_1.classed)(_.Paper)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["dialogPaper"], ["dialogPaper"])));
12
- exports.Close = (0, helpers_1.classed)(_.Close)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\"dialogClose"], ["\"dialogClose"])));
13
- exports.Header = (0, helpers_1.classed)(_.Header)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["dialogHeader"], ["dialogHeader"])));
14
- exports.Body = (0, helpers_1.classed)(_.Body)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["dialogBody"], ["dialogBody"])));
15
- exports.KoineDialog = (0, helpers_1.extendComponent)(_.KoineDialog, {
16
- Root: exports.Root,
17
- Backdrop: exports.Backdrop,
18
- Container: exports.Container,
19
- Paper: exports.Paper,
20
- Close: exports.Close,
21
- Header: exports.Header,
22
- Body: exports.Body,
23
- });
24
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -1,5 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = void 0;
4
- var DialogMui_1 = require("./DialogMui");
5
- Object.defineProperty(exports, "KoineDialog", { enumerable: true, get: function () { return DialogMui_1.KoineDialog; } });
@@ -1,55 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = void 0;
4
- var tslib_1 = require("tslib");
5
- var jsx_runtime_1 = require("react/jsx-runtime");
6
- var react_1 = require("react");
7
- var md_1 = require("react-icons/md");
8
- var framer_motion_1 = require("framer-motion");
9
- var helpers_1 = require("../../helpers");
10
- var index_1 = require("./index");
11
- var DialogMui_1 = require("../DialogMui");
12
- /**
13
- * About nested `AnimatePresence` and animated dialogs with framer @see:
14
- *
15
- * - https://github.com/framer/motion/issues/478
16
- * - https://codesandbox.io/s/clever-banzai-7km49?file=/src/Modal.js
17
- */
18
- var Dialog = (0, react_1.forwardRef)(function Dialog(_a, ref) {
19
- var children = _a.children, title = _a.title, $scrollPaper = _a.$scrollPaper, Root = _a.Root, Backdrop = _a.Backdrop, Container = _a.Container, Paper = _a.Paper, Close = _a.Close, Header = _a.Header, Body = _a.Body, mBackdrop = _a.mBackdrop, mPaper = _a.mPaper, onClose = _a.onClose, props = tslib_1.__rest(_a, ["children", "title", "$scrollPaper", "Root", "Backdrop", "Container", "Paper", "Close", "Header", "Body", "mBackdrop", "mPaper", "onClose"]);
20
- var BackdropMotion = (0, react_1.useMemo)(function () { return function (props) {
21
- return ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: props.open && (0, jsx_runtime_1.jsx)(Backdrop, tslib_1.__assign({}, mBackdrop, props)) }));
22
- }; }, [Backdrop, mBackdrop]);
23
- // FIXME: extract this logic either in a useDialog hook or in a useclickOutside hook
24
- // click handling is taken from
25
- // @see https://github.com/mui/material-ui/blob/c758b6c0b30f0831110458a746690b33147c45df/packages/mui-material/src/Dialog/Dialog.js#L205-L226
26
- var backdropClick = (0, react_1.useRef)();
27
- var handleMouseDown = function (event) {
28
- // We don't want to close the dialog when clicking the dialog content.
29
- // Make sure the event starts and ends on the same DOM element.
30
- backdropClick.current = event.target === event.currentTarget;
31
- };
32
- var handleBackdropClick = function (event) {
33
- // Ignore the events not coming from the "backdrop".
34
- if (!backdropClick.current) {
35
- return;
36
- }
37
- backdropClick.current = null;
38
- // if (onBackdropClick) onBackdropClick(event);
39
- if (onClose) {
40
- onClose(event, "backdropClick");
41
- }
42
- };
43
- return ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({ keepMounted: true, BackdropComponent: BackdropMotion, onClick: handleBackdropClick, onClose: onClose, ref: ref }, props, { style: (0, index_1.mRootStyle)(props) }, { children: (0, jsx_runtime_1.jsx)(Container, tslib_1.__assign({ "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: props.open && (
44
- // @ts-expect-error framer props collision...
45
- (0, jsx_runtime_1.jsxs)(Paper, tslib_1.__assign({}, mPaper, { "aria-label": title || "", "$scrollPaper": $scrollPaper }, { children: [title && (0, jsx_runtime_1.jsx)(Header, { children: title }), (0, jsx_runtime_1.jsx)(Close, tslib_1.__assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) })), (0, jsx_runtime_1.jsx)(Body, { children: children })] }))) }) })) })));
46
- });
47
- exports.KoineDialog = (0, helpers_1.extendComponent)(Dialog, {
48
- Root: DialogMui_1.Root,
49
- Backdrop: (0, framer_motion_1.m)(DialogMui_1.Backdrop),
50
- Container: DialogMui_1.Container,
51
- Paper: (0, framer_motion_1.m)(DialogMui_1.Paper),
52
- Close: DialogMui_1.Close,
53
- Header: DialogMui_1.Header,
54
- Body: DialogMui_1.Body,
55
- });
@@ -1,35 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.dialogPaperMotion = exports.dialogBackdropMotion = void 0;
4
- var tslib_1 = require("tslib");
5
- tslib_1.__exportStar(require("./index"), exports);
6
- exports.dialogBackdropMotion = {
7
- initial: {
8
- opacity: 0,
9
- },
10
- animate: {
11
- backdropFilter: "blur(10px)",
12
- opacity: 1,
13
- },
14
- exit: {
15
- backdropFilter: "blur(0px)",
16
- opacity: 0,
17
- },
18
- };
19
- exports.dialogPaperMotion = {
20
- initial: {
21
- // scale: .9,
22
- translateY: -60,
23
- opacity: 0,
24
- },
25
- animate: {
26
- // scale: 1,
27
- translateY: 0,
28
- opacity: 1,
29
- },
30
- exit: {
31
- // scale: 0.9,
32
- translateY: 60,
33
- opacity: 0,
34
- },
35
- };
@@ -1,8 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.mRootStyle = void 0;
4
- var tslib_1 = require("tslib");
5
- var mRootStyle = function (props) {
6
- return (tslib_1.__assign({ pointerEvents: props.open ? "all" : "none" }, (props.style || {})));
7
- };
8
- exports.mRootStyle = mRootStyle;
@@ -1,46 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
6
- var helpers_1 = require("../../helpers");
7
- var styled_1 = require("../../styles/styled");
8
- var Buttons_1 = require("../../Buttons");
9
- var _ = tslib_1.__importStar(require("../DialogMui"));
10
- exports.Root = (0, styled_components_1.default)(_.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n z-index: 1300;\n position: fixed;\n ", "\n"], ["\n z-index: 1300;\n position: fixed;\n ", "\n"])), styled_1.inset0);
11
- // export const Backdrop = (props) => {
12
- // return <div {...props} />;
13
- // }
14
- exports.Backdrop = (0, styled_components_1.default)(_.Backdrop)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n z-index: -1;\n position: fixed;\n ", "\n backdrop-filter: blur(0px);\n -webkit-tap-highlight-color: transparent;\n"], ["\n z-index: -1;\n position: fixed;\n ", "\n backdrop-filter: blur(0px);\n -webkit-tap-highlight-color: transparent;\n"])), styled_1.inset0);
15
- /**
16
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
17
- */
18
- exports.Container = (0, styled_components_1.default)(_.Container)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n height: 100%;\n outline: 0;\n ", "\n"], ["\n height: 100%;\n outline: 0;\n ", "\n"])), function (p) {
19
- return p.$scrollPaper
20
- ? "display: flex; justify-content: center; align-items: center;"
21
- : "overflow: hidden auto; text-align: center; &:after { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; }";
22
- });
23
- /**
24
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
25
- */
26
- exports.Paper = (0, styled_components_1.default)(_.Paper)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), function (p) {
27
- return p.$scrollPaper
28
- ? "display: flex; flex-direction: column; max-height: calc(100%-64px);"
29
- : "display: inline-block; vertical-align: middle; text-align: initial;";
30
- });
31
- exports.Close = (0, styled_components_1.default)(Buttons_1.IconButton)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n position: absolute;\n"], ["\n position: absolute;\n"])));
32
- exports.Header = (0, styled_components_1.default)(_.Header)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject([""], [""])));
33
- /**
34
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
35
- */
36
- exports.Body = (0, styled_components_1.default)(_.Body)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n flex: 1 1 auto;\n -webkit-overflow-scrolling: touch;\n overflow-y: auto;\n overflow: auto;\n"], ["\n flex: 1 1 auto;\n -webkit-overflow-scrolling: touch;\n overflow-y: auto;\n overflow: auto;\n"])));
37
- exports.KoineDialog = (0, helpers_1.extendComponent)(_.KoineDialog, {
38
- Root: exports.Root,
39
- Backdrop: exports.Backdrop,
40
- Container: exports.Container,
41
- Paper: exports.Paper,
42
- Close: exports.Close,
43
- Header: exports.Header,
44
- Body: exports.Body,
45
- });
46
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -1,19 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = void 0;
4
- var framer_motion_1 = require("framer-motion");
5
- var helpers_1 = require("../../helpers");
6
- var basic_1 = require("../m/basic");
7
- var bare_1 = require("../m/bare");
8
- var bare_2 = require("./bare");
9
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
10
- Root: bare_2.Root,
11
- Backdrop: (0, framer_motion_1.m)(bare_2.Backdrop),
12
- Container: bare_2.Container,
13
- Paper: (0, framer_motion_1.m)(bare_2.Paper),
14
- Close: bare_2.Close,
15
- Header: bare_2.Header,
16
- Body: bare_2.Body,
17
- mBackdrop: basic_1.dialogBackdropMotion,
18
- mPaper: basic_1.dialogPaperMotion,
19
- });
@@ -1,19 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = void 0;
4
- var framer_motion_1 = require("framer-motion");
5
- var helpers_1 = require("../../helpers");
6
- var basic_1 = require("../m/basic");
7
- var bare_1 = require("../m/bare");
8
- var material_1 = require("./material");
9
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
10
- Root: material_1.Root,
11
- Backdrop: (0, framer_motion_1.m)(material_1.Backdrop),
12
- Container: material_1.Container,
13
- Paper: (0, framer_motion_1.m)(material_1.Paper),
14
- Close: material_1.Close,
15
- Header: material_1.Header,
16
- Body: material_1.Body,
17
- mBackdrop: basic_1.dialogBackdropMotion,
18
- mPaper: basic_1.dialogPaperMotion,
19
- });
@@ -1,24 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
6
- var helpers_1 = require("../../helpers");
7
- var bare_1 = require("./bare");
8
- exports.Root = (0, styled_components_1.default)(bare_1.KoineDialog.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
9
- exports.Backdrop = (0, styled_components_1.default)(bare_1.KoineDialog.Backdrop)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n background: rgba(0, 0, 0, 0.5);\n filter: backdrop-blur(4px);\n"], ["\n background: rgba(0, 0, 0, 0.5);\n filter: backdrop-blur(4px);\n"])));
10
- exports.Container = (0, styled_components_1.default)(bare_1.KoineDialog.Container)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
11
- exports.Paper = (0, styled_components_1.default)(bare_1.KoineDialog.Paper)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n max-width: 640px;\n margin: 64px;\n border-radius: 4px;\n background: white;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);\n"], ["\n max-width: 640px;\n margin: 64px;\n border-radius: 4px;\n background: white;\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);\n"])));
12
- exports.Close = (0, styled_components_1.default)(bare_1.KoineDialog.Close)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n padding: 8px;\n font-size: 2rem;\n opacity: 0.5;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n padding: 8px;\n font-size: 2rem;\n opacity: 0.5;\n"])));
13
- exports.Header = (0, styled_components_1.default)(bare_1.KoineDialog.Header)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n padding: 16px;\n font-size: 1.25rem;\n"], ["\n padding: 16px;\n font-size: 1.25rem;\n"])));
14
- exports.Body = (0, styled_components_1.default)(bare_1.KoineDialog.Body)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n padding: 16px;\n border-top: 1px solid rgba(0, 0, 0, 0.08);\n"], ["\n padding: 16px;\n border-top: 1px solid rgba(0, 0, 0, 0.08);\n"])));
15
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
16
- Root: exports.Root,
17
- Backdrop: exports.Backdrop,
18
- Container: exports.Container,
19
- Paper: exports.Paper,
20
- Close: exports.Close,
21
- Header: exports.Header,
22
- Body: exports.Body,
23
- });
24
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -1,45 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var helpers_1 = require("../../helpers");
6
- var _ = tslib_1.__importStar(require("../DialogMui"));
7
- exports.Root = (0, helpers_1.classed)(_.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["< class=\"dialog fixed z-[1300] inset-0"], ["< class=\"dialog fixed z-[1300] inset-0"])));
8
- exports.Backdrop = (0, helpers_1.classed)(_.Backdrop)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["< class=\"dialogBackdrop fixed -z-[1] inset-0 [-webkit-tap-highlight-color:transparent]"], ["< class=\"dialogBackdrop fixed -z-[1] inset-0 [-webkit-tap-highlight-color:transparent]"])));
9
- /**
10
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L64-L85
11
- */
12
- exports.Container = (0, helpers_1.classed)(_.Container)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["< class=\"dialogContainer h-full outline-0 ", ""], ["< class=\"dialogContainer h-full outline-0 ", ""])), function (p) {
13
- return p.$scrollPaper
14
- ? "flex justify-center items-center"
15
- : "overflow-y-auto overflow-x-hidden text-center [after:content:''] after:inline-block after:align-middle after:h-full after:w-0";
16
- });
17
- /**
18
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Dialog/Dialog.js#L104-L157
19
- */
20
- exports.Paper = (0, helpers_1.classed)(_.Paper)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["< class=\"dialogPaper relative ", ""], ["< class=\"dialogPaper relative ", ""])), function (p) {
21
- return p.$scrollPaper
22
- ? "flex flex-col max-h-[calc(100%-64px)]"
23
- : "inline-block align-middle [text-align:initial]";
24
- });
25
- exports.Close = (0, helpers_1.classed)(_.Close)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["< class=\"dialogClose"], ["< class=\"dialogClose"])));
26
- exports.Header = (0, helpers_1.classed)(_.Header)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["< class=\"dialogHeader"], ["< class=\"dialogHeader"])));
27
- /**
28
- * @see https://github.com/mui/material-ui/blob/master/packages/mui-material/src/DialogContent/DialogContent.js#L29-L44
29
- * The arbitrary rule webkit-overflow-scrolling is to add iOS momentum scrolling for iOS < 13.0,
30
- * this was removed from tailiwnd 2.0 on
31
- *
32
- * @see https://github.com/tailwindlabs/tailwindcss.com/issues/483
33
- * @see https://v2.tailwindcss.com/docs/upgrading-to-v2#the-scrolling-touch-and-scrolling-auto-utilities-have-been-removed
34
- */
35
- exports.Body = (0, helpers_1.classed)(_.Body)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["< class=\"dialogBody flex-1 basis-auto overflow-y-auto [-webkit-overflow-scrolling:touch]"], ["< class=\"dialogBody flex-1 basis-auto overflow-y-auto [-webkit-overflow-scrolling:touch]"])));
36
- exports.KoineDialog = (0, helpers_1.extendComponent)(_.KoineDialog, {
37
- Root: exports.Root,
38
- Backdrop: exports.Backdrop,
39
- Container: exports.Container,
40
- Paper: exports.Paper,
41
- Close: exports.Close,
42
- Header: exports.Header,
43
- Body: exports.Body,
44
- });
45
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -1,23 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var helpers_1 = require("../../helpers");
6
- var bare_1 = require("./bare");
7
- exports.Root = (0, helpers_1.classed)(bare_1.KoineDialog.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
8
- exports.Backdrop = (0, helpers_1.classed)(bare_1.KoineDialog.Backdrop)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["< class=\"bg-white/[.5] backdrop-blur-sm"], ["< class=\"bg-white/[.5] backdrop-blur-sm"])));
9
- exports.Container = (0, helpers_1.classed)(bare_1.KoineDialog.Container)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
10
- exports.Paper = (0, helpers_1.classed)(bare_1.KoineDialog.Paper)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["< class=\"bg-white shadow-xl m-8 max-w-screen-sm border border-gray-400"], ["< class=\"bg-white shadow-xl m-8 max-w-screen-sm border border-gray-400"])));
11
- exports.Close = (0, helpers_1.classed)(bare_1.KoineDialog.Close)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["< class=\"absolute top-0 right-0 p-8 text-2xl opacity-20 hover:opacity-100 focus:opacity-100"], ["< class=\"absolute top-0 right-0 p-8 text-2xl opacity-20 hover:opacity-100 focus:opacity-100"])));
12
- exports.Header = (0, helpers_1.classed)(bare_1.KoineDialog.Header)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["< class=\"p-8 text-2xl bold italic"], ["< class=\"p-8 text-2xl bold italic"])));
13
- exports.Body = (0, helpers_1.classed)(bare_1.KoineDialog.Body)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["< class=\"p-8 pt-4"], ["< class=\"p-8 pt-4"])));
14
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
15
- Root: exports.Root,
16
- Backdrop: exports.Backdrop,
17
- Container: exports.Container,
18
- Paper: exports.Paper,
19
- Close: exports.Close,
20
- Header: exports.Header,
21
- Body: exports.Body,
22
- });
23
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -1,19 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = void 0;
4
- var framer_motion_1 = require("framer-motion");
5
- var helpers_1 = require("../../helpers");
6
- var basic_1 = require("../m/basic");
7
- var bare_1 = require("../m/bare");
8
- var bare_2 = require("./bare");
9
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
10
- Root: bare_2.Root,
11
- Backdrop: (0, framer_motion_1.m)(bare_2.Backdrop),
12
- Container: bare_2.Container,
13
- Paper: (0, framer_motion_1.m)(bare_2.Paper),
14
- Close: bare_2.Close,
15
- Header: bare_2.Header,
16
- Body: bare_2.Body,
17
- mBackdrop: basic_1.dialogBackdropMotion,
18
- mPaper: basic_1.dialogPaperMotion,
19
- });
@@ -1,19 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = void 0;
4
- var framer_motion_1 = require("framer-motion");
5
- var helpers_1 = require("../../helpers");
6
- var basic_1 = require("../m/basic");
7
- var bare_1 = require("../m/bare");
8
- var material_1 = require("./material");
9
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
10
- Root: material_1.Root,
11
- Backdrop: (0, framer_motion_1.m)(material_1.Backdrop),
12
- Container: material_1.Container,
13
- Paper: (0, framer_motion_1.m)(material_1.Paper),
14
- Close: material_1.Close,
15
- Header: material_1.Header,
16
- Body: material_1.Body,
17
- mBackdrop: basic_1.dialogBackdropMotion,
18
- mPaper: basic_1.dialogPaperMotion,
19
- });
@@ -1,23 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.KoineDialog = exports.Body = exports.Header = exports.Close = exports.Paper = exports.Container = exports.Backdrop = exports.Root = void 0;
4
- var tslib_1 = require("tslib");
5
- var helpers_1 = require("../../helpers");
6
- var bare_1 = require("./bare");
7
- exports.Root = (0, helpers_1.classed)(bare_1.KoineDialog.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
8
- exports.Backdrop = (0, helpers_1.classed)(bare_1.KoineDialog.Backdrop)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["< class=\"bg-black/[.5] backdrop-blur-sm"], ["< class=\"bg-black/[.5] backdrop-blur-sm"])));
9
- exports.Container = (0, helpers_1.classed)(bare_1.KoineDialog.Container)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
10
- exports.Paper = (0, helpers_1.classed)(bare_1.KoineDialog.Paper)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["< class=\"rounded bg-white shadow-xl m-8 max-w-screen-sm"], ["< class=\"rounded bg-white shadow-xl m-8 max-w-screen-sm"])));
11
- exports.Close = (0, helpers_1.classed)(bare_1.KoineDialog.Close)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["< class=\"absolute top-0 right-0 p-4 text-2xl opacity-50"], ["< class=\"absolute top-0 right-0 p-4 text-2xl opacity-50"])));
12
- exports.Header = (0, helpers_1.classed)(bare_1.KoineDialog.Header)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["< class=\"p-4 text-xl"], ["< class=\"p-4 text-xl"])));
13
- exports.Body = (0, helpers_1.classed)(bare_1.KoineDialog.Body)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["< class=\"p-4 border-t border-gray-200"], ["< class=\"p-4 border-t border-gray-200"])));
14
- exports.KoineDialog = (0, helpers_1.extendComponent)(bare_1.KoineDialog, {
15
- Root: exports.Root,
16
- Backdrop: exports.Backdrop,
17
- Container: exports.Container,
18
- Paper: exports.Paper,
19
- Close: exports.Close,
20
- Header: exports.Header,
21
- Body: exports.Body,
22
- });
23
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
@@ -1,31 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.Editor = exports.EditorBar = void 0;
4
- var tslib_1 = require("tslib");
5
- var jsx_runtime_1 = require("react/jsx-runtime");
6
- var react_1 = require("react");
7
- var react_2 = require("@tiptap/react");
8
- var starter_kit_1 = tslib_1.__importDefault(require("@tiptap/starter-kit"));
9
- var components_1 = require("./components");
10
- var EditorBar = function (_a) {
11
- var editor = _a.editor;
12
- var handleClick = (0, react_1.useCallback)(function (e, type) {
13
- e.preventDefault();
14
- editor === null || editor === void 0 ? void 0 : editor.chain().focus()["toggle".concat(type)]().run();
15
- }, [editor]);
16
- if (!editor) {
17
- return null;
18
- }
19
- return ((0, jsx_runtime_1.jsxs)(components_1.EditorBarRoot, { children: [(0, jsx_runtime_1.jsx)(components_1.EditorBarBtn, tslib_1.__assign({ onClick: function (e) {
20
- return handleClick(e, "Bold");
21
- }, className: editor.isActive("bold") ? "is-active" : "" }, { children: (0, jsx_runtime_1.jsx)(components_1.EditorIconBold, {}) })), (0, jsx_runtime_1.jsx)(components_1.EditorBarBtn, tslib_1.__assign({ onClick: function (e) {
22
- return handleClick(e, "Italic");
23
- }, className: editor.isActive("bold") ? "is-active" : "" }, { children: (0, jsx_runtime_1.jsx)(components_1.EditorIconItalic, {}) }))] }));
24
- };
25
- exports.EditorBar = EditorBar;
26
- var Editor = function (_a) {
27
- var options = _a.options, props = tslib_1.__rest(_a, ["options"]);
28
- var editor = (0, react_2.useEditor)(tslib_1.__assign({ extensions: [starter_kit_1.default], content: "" }, (options || {})));
29
- return ((0, jsx_runtime_1.jsxs)(components_1.EditorRoot, { children: [(0, jsx_runtime_1.jsx)(components_1.EditorGlobalStyles, {}), (0, jsx_runtime_1.jsx)(exports.EditorBar, { editor: editor }), (0, jsx_runtime_1.jsx)(react_2.EditorContent, tslib_1.__assign({ className: "EditorContent", editor: editor }, props))] }));
30
- };
31
- exports.Editor = Editor;
@@ -1,15 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.EditorGlobalStyles = exports.EditorBarBtn = exports.EditorBarRoot = exports.EditorRoot = exports.EditorIconItalic = exports.EditorIconBold = void 0;
4
- var tslib_1 = require("tslib");
5
- var styled_components_1 = tslib_1.__importStar(require("styled-components"));
6
- var IconButton_1 = require("../Buttons/IconButton");
7
- var styles_1 = require("../Forms/styles");
8
- var md_1 = require("react-icons/md");
9
- Object.defineProperty(exports, "EditorIconBold", { enumerable: true, get: function () { return md_1.MdFormatBold; } });
10
- Object.defineProperty(exports, "EditorIconItalic", { enumerable: true, get: function () { return md_1.MdFormatItalic; } });
11
- exports.EditorRoot = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), styles_1.inputBorder, styles_1.inputFocus);
12
- exports.EditorBarRoot = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n display: flex;\n justify-content: flex-end;\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n /* background: var(--grey900); */\n"], ["\n display: flex;\n justify-content: flex-end;\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n /* background: var(--grey900); */\n"])));
13
- exports.EditorBarBtn = (0, styled_components_1.default)(IconButton_1.IconButton)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
14
- exports.EditorGlobalStyles = (0, styled_components_1.createGlobalStyle)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n .ProseMirror {\n ", "\n \n &:focus {\n outline:none;\n }\n\n > *:first-child {\n margin-top: 0;\n }\n }\n"], ["\n .ProseMirror {\n ", "\n \n &:focus {\n outline:none;\n }\n\n > *:first-child {\n margin-top: 0;\n }\n }\n"])), styles_1.inputPadding);
15
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
@@ -1,4 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- var tslib_1 = require("tslib");
4
- tslib_1.__exportStar(require("./Editor--tiptap"), exports);