datocms-react-ui 0.3.17 → 0.3.21
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.
- package/dist/cjs/Button/styles.module.css.json +1 -1
- package/dist/cjs/ButtonGroup/Button/index.js +19 -0
- package/dist/cjs/ButtonGroup/Button/index.js.map +1 -0
- package/dist/cjs/ButtonGroup/Button/styles.module.css.json +1 -0
- package/dist/cjs/ButtonGroup/Group/index.js +29 -0
- package/dist/cjs/ButtonGroup/Group/index.js.map +1 -0
- package/dist/cjs/ButtonGroup/Group/styles.module.css.json +1 -0
- package/dist/cjs/ButtonGroup/index.js +8 -0
- package/dist/cjs/ButtonGroup/index.js.map +1 -0
- package/dist/cjs/Canvas/index.js +13 -25
- package/dist/cjs/Canvas/index.js.map +1 -1
- package/dist/cjs/Canvas/styles.module.css.json +1 -1
- package/dist/cjs/ContextInspector/index.js +3 -3
- package/dist/cjs/ContextInspector/index.js.map +1 -1
- package/dist/cjs/Dropdown/Dropdown.js +166 -0
- package/dist/cjs/Dropdown/Dropdown.js.map +1 -0
- package/dist/cjs/Dropdown/DropdownContext.js +9 -0
- package/dist/cjs/Dropdown/DropdownContext.js.map +1 -0
- package/dist/cjs/Dropdown/Group.js +16 -0
- package/dist/cjs/Dropdown/Group.js.map +1 -0
- package/dist/cjs/Dropdown/Menu.js +250 -0
- package/dist/cjs/Dropdown/Menu.js.map +1 -0
- package/dist/cjs/Dropdown/MenuContext.js +12 -0
- package/dist/cjs/Dropdown/MenuContext.js.map +1 -0
- package/dist/cjs/Dropdown/Option.js +100 -0
- package/dist/cjs/Dropdown/Option.js.map +1 -0
- package/dist/cjs/Dropdown/OptionAction.js +29 -0
- package/dist/cjs/Dropdown/OptionAction.js.map +1 -0
- package/dist/cjs/Dropdown/Portal.js +53 -0
- package/dist/cjs/Dropdown/Portal.js.map +1 -0
- package/dist/cjs/Dropdown/Separator.js +37 -0
- package/dist/cjs/Dropdown/Separator.js.map +1 -0
- package/dist/cjs/Dropdown/Text.js +14 -0
- package/dist/cjs/Dropdown/Text.js.map +1 -0
- package/dist/cjs/Dropdown/index.js +18 -0
- package/dist/cjs/Dropdown/index.js.map +1 -0
- package/dist/cjs/Dropdown/styles.module.css.json +1 -0
- package/dist/cjs/SidebarPanel/index.js +88 -0
- package/dist/cjs/SidebarPanel/index.js.map +1 -0
- package/dist/cjs/SidebarPanel/styles.module.css.json +1 -0
- package/dist/cjs/Spinner/index.js +64 -0
- package/dist/cjs/Spinner/index.js.map +1 -0
- package/dist/cjs/Spinner/styles.module.css.json +1 -0
- package/dist/cjs/Toolbar/Button/index.js +15 -0
- package/dist/cjs/Toolbar/Button/index.js.map +1 -0
- package/dist/cjs/Toolbar/Button/styles.module.css.json +1 -0
- package/dist/cjs/Toolbar/Stack/index.js +19 -0
- package/dist/cjs/Toolbar/Stack/index.js.map +1 -0
- package/dist/cjs/Toolbar/Stack/styles.module.css.json +1 -0
- package/dist/cjs/Toolbar/Title/index.js +15 -0
- package/dist/cjs/Toolbar/Title/index.js.map +1 -0
- package/dist/cjs/Toolbar/Title/styles.module.css.json +1 -0
- package/dist/cjs/Toolbar/Toolbar/index.js +99 -0
- package/dist/cjs/Toolbar/Toolbar/index.js.map +1 -0
- package/dist/cjs/Toolbar/Toolbar/styles.module.css.json +1 -0
- package/dist/cjs/Toolbar/index.js +12 -0
- package/dist/cjs/Toolbar/index.js.map +1 -0
- package/dist/cjs/generateStyleFromCtx/index.js +32 -0
- package/dist/cjs/generateStyleFromCtx/index.js.map +1 -0
- package/dist/cjs/icons.js +38 -0
- package/dist/cjs/icons.js.map +1 -0
- package/dist/cjs/index.js +6 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/mergeRefs/index.js +19 -0
- package/dist/cjs/mergeRefs/index.js.map +1 -0
- package/dist/cjs/useClickOutside/index.js +24 -0
- package/dist/cjs/useClickOutside/index.js.map +1 -0
- package/dist/cjs/useMediaQuery/index.js +149 -0
- package/dist/cjs/useMediaQuery/index.js.map +1 -0
- package/dist/esm/Button/styles.module.css.json +1 -1
- package/dist/esm/ButtonGroup/Button/index.d.ts +10 -0
- package/dist/esm/ButtonGroup/Button/index.js +12 -0
- package/dist/esm/ButtonGroup/Button/index.js.map +1 -0
- package/dist/esm/ButtonGroup/Button/styles.module.css.json +1 -0
- package/dist/esm/ButtonGroup/Group/index.d.ts +21 -0
- package/dist/esm/ButtonGroup/Group/index.js +22 -0
- package/dist/esm/ButtonGroup/Group/index.js.map +1 -0
- package/dist/esm/ButtonGroup/Group/styles.module.css.json +1 -0
- package/dist/esm/ButtonGroup/index.d.ts +4 -0
- package/dist/esm/ButtonGroup/index.js +3 -0
- package/dist/esm/ButtonGroup/index.js.map +1 -0
- package/dist/esm/Canvas/index.d.ts +7 -3
- package/dist/esm/Canvas/index.js +13 -26
- package/dist/esm/Canvas/index.js.map +1 -1
- package/dist/esm/Canvas/styles.module.css.json +1 -1
- package/dist/esm/ContextInspector/index.d.ts +1 -5
- package/dist/esm/ContextInspector/index.js +4 -4
- package/dist/esm/ContextInspector/index.js.map +1 -1
- package/dist/esm/Dropdown/Dropdown.d.ts +113 -0
- package/dist/esm/Dropdown/Dropdown.js +140 -0
- package/dist/esm/Dropdown/Dropdown.js.map +1 -0
- package/dist/esm/Dropdown/DropdownContext.d.ts +6 -0
- package/dist/esm/Dropdown/DropdownContext.js +6 -0
- package/dist/esm/Dropdown/DropdownContext.js.map +1 -0
- package/dist/esm/Dropdown/Group.d.ts +6 -0
- package/dist/esm/Dropdown/Group.js +9 -0
- package/dist/esm/Dropdown/Group.js.map +1 -0
- package/dist/esm/Dropdown/Menu.d.ts +6 -0
- package/dist/esm/Dropdown/Menu.js +224 -0
- package/dist/esm/Dropdown/Menu.js.map +1 -0
- package/dist/esm/Dropdown/MenuContext.d.ts +8 -0
- package/dist/esm/Dropdown/MenuContext.js +9 -0
- package/dist/esm/Dropdown/MenuContext.js.map +1 -0
- package/dist/esm/Dropdown/Option.d.ts +13 -0
- package/dist/esm/Dropdown/Option.js +74 -0
- package/dist/esm/Dropdown/Option.js.map +1 -0
- package/dist/esm/Dropdown/OptionAction.d.ts +11 -0
- package/dist/esm/Dropdown/OptionAction.js +22 -0
- package/dist/esm/Dropdown/OptionAction.js.map +1 -0
- package/dist/esm/Dropdown/Portal.d.ts +4 -0
- package/dist/esm/Dropdown/Portal.js +27 -0
- package/dist/esm/Dropdown/Portal.js.map +1 -0
- package/dist/esm/Dropdown/Separator.d.ts +2 -0
- package/dist/esm/Dropdown/Separator.js +11 -0
- package/dist/esm/Dropdown/Separator.js.map +1 -0
- package/dist/esm/Dropdown/Text.d.ts +5 -0
- package/dist/esm/Dropdown/Text.js +7 -0
- package/dist/esm/Dropdown/Text.js.map +1 -0
- package/dist/esm/Dropdown/index.d.ts +9 -0
- package/dist/esm/Dropdown/index.js +9 -0
- package/dist/esm/Dropdown/index.js.map +1 -0
- package/dist/esm/Dropdown/styles.module.css.json +1 -0
- package/dist/esm/SidebarPanel/index.d.ts +43 -0
- package/dist/esm/SidebarPanel/index.js +62 -0
- package/dist/esm/SidebarPanel/index.js.map +1 -0
- package/dist/esm/SidebarPanel/styles.module.css.json +1 -0
- package/dist/esm/Spinner/index.d.ts +27 -0
- package/dist/esm/Spinner/index.js +57 -0
- package/dist/esm/Spinner/index.js.map +1 -0
- package/dist/esm/Spinner/styles.module.css.json +1 -0
- package/dist/esm/Toolbar/Button/index.d.ts +8 -0
- package/dist/esm/Toolbar/Button/index.js +8 -0
- package/dist/esm/Toolbar/Button/index.js.map +1 -0
- package/dist/esm/Toolbar/Button/styles.module.css.json +1 -0
- package/dist/esm/Toolbar/Stack/index.d.ts +8 -0
- package/dist/esm/Toolbar/Stack/index.js +12 -0
- package/dist/esm/Toolbar/Stack/index.js.map +1 -0
- package/dist/esm/Toolbar/Stack/styles.module.css.json +1 -0
- package/dist/esm/Toolbar/Title/index.d.ts +7 -0
- package/dist/esm/Toolbar/Title/index.js +8 -0
- package/dist/esm/Toolbar/Title/index.js.map +1 -0
- package/dist/esm/Toolbar/Title/styles.module.css.json +1 -0
- package/dist/esm/Toolbar/Toolbar/index.d.ts +91 -0
- package/dist/esm/Toolbar/Toolbar/index.js +92 -0
- package/dist/esm/Toolbar/Toolbar/index.js.map +1 -0
- package/dist/esm/Toolbar/Toolbar/styles.module.css.json +1 -0
- package/dist/esm/Toolbar/index.d.ts +8 -0
- package/dist/esm/Toolbar/index.js +5 -0
- package/dist/esm/Toolbar/index.js.map +1 -0
- package/dist/esm/generateStyleFromCtx/index.d.ts +3 -0
- package/dist/esm/generateStyleFromCtx/index.js +28 -0
- package/dist/esm/generateStyleFromCtx/index.js.map +1 -0
- package/dist/esm/icons.d.ts +12 -0
- package/dist/esm/icons.js +27 -0
- package/dist/esm/icons.js.map +1 -0
- package/dist/esm/index.d.ts +6 -0
- package/dist/esm/index.js +6 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/mergeRefs/index.d.ts +2 -0
- package/dist/esm/mergeRefs/index.js +15 -0
- package/dist/esm/mergeRefs/index.js.map +1 -0
- package/dist/esm/useClickOutside/index.d.ts +2 -0
- package/dist/esm/useClickOutside/index.js +21 -0
- package/dist/esm/useClickOutside/index.js.map +1 -0
- package/dist/esm/useMediaQuery/index.d.ts +8 -0
- package/dist/esm/useMediaQuery/index.js +140 -0
- package/dist/esm/useMediaQuery/index.js.map +1 -0
- package/dist/types/ButtonGroup/Button/index.d.ts +10 -0
- package/dist/types/ButtonGroup/Group/index.d.ts +21 -0
- package/dist/types/ButtonGroup/index.d.ts +4 -0
- package/dist/types/Canvas/index.d.ts +7 -3
- package/dist/types/ContextInspector/index.d.ts +1 -5
- package/dist/types/Dropdown/Dropdown.d.ts +113 -0
- package/dist/types/Dropdown/DropdownContext.d.ts +6 -0
- package/dist/types/Dropdown/Group.d.ts +6 -0
- package/dist/types/Dropdown/Menu.d.ts +6 -0
- package/dist/types/Dropdown/MenuContext.d.ts +8 -0
- package/dist/types/Dropdown/Option.d.ts +13 -0
- package/dist/types/Dropdown/OptionAction.d.ts +11 -0
- package/dist/types/Dropdown/Portal.d.ts +4 -0
- package/dist/types/Dropdown/Separator.d.ts +2 -0
- package/dist/types/Dropdown/Text.d.ts +5 -0
- package/dist/types/Dropdown/index.d.ts +9 -0
- package/dist/types/SidebarPanel/index.d.ts +43 -0
- package/dist/types/Spinner/index.d.ts +27 -0
- package/dist/types/Toolbar/Button/index.d.ts +8 -0
- package/dist/types/Toolbar/Stack/index.d.ts +8 -0
- package/dist/types/Toolbar/Title/index.d.ts +7 -0
- package/dist/types/Toolbar/Toolbar/index.d.ts +91 -0
- package/dist/types/Toolbar/index.d.ts +8 -0
- package/dist/types/generateStyleFromCtx/index.d.ts +3 -0
- package/dist/types/icons.d.ts +12 -0
- package/dist/types/index.d.ts +6 -0
- package/dist/types/mergeRefs/index.d.ts +2 -0
- package/dist/types/useClickOutside/index.d.ts +2 -0
- package/dist/types/useMediaQuery/index.d.ts +8 -0
- package/package.json +9 -6
- package/styles.css +1 -1
- package/types.json +4656 -1895
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.useElementLayout = exports.MediaQuery = exports.useMediaQuery = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var list = {};
|
|
9
|
+
function useMediaQuery(media) {
|
|
10
|
+
var mediaQueryList = react_1.default.useMemo(function () {
|
|
11
|
+
// We have an existing mediaQueryList for media.
|
|
12
|
+
if (list[media]) {
|
|
13
|
+
return list[media].mql;
|
|
14
|
+
}
|
|
15
|
+
if (typeof window !== 'undefined') {
|
|
16
|
+
return matchMedia(media);
|
|
17
|
+
}
|
|
18
|
+
// Server: use a fallback.
|
|
19
|
+
return { matches: true, media: media };
|
|
20
|
+
}, [list, media]);
|
|
21
|
+
// Since the mediaQueryList is shared we use state to trigger re-renders.
|
|
22
|
+
// This is done with update({}) (a new object instance will force a re-rendering).
|
|
23
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
24
|
+
var _a = react_1.default.useState({}), _ = _a[0], update = _a[1];
|
|
25
|
+
react_1.default.useLayoutEffect(function () {
|
|
26
|
+
if (list[media]) {
|
|
27
|
+
list[media].notifiers.push(update);
|
|
28
|
+
}
|
|
29
|
+
else {
|
|
30
|
+
list[media] = {
|
|
31
|
+
mql: mediaQueryList,
|
|
32
|
+
notifiers: [update],
|
|
33
|
+
listener: function (mql) {
|
|
34
|
+
var match = list[mql.media];
|
|
35
|
+
if (match) {
|
|
36
|
+
match.notifiers.forEach(function (updateFn) { return updateFn({}); });
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
};
|
|
40
|
+
list[media].mql.addEventListener('change', list[media].listener);
|
|
41
|
+
}
|
|
42
|
+
return function () {
|
|
43
|
+
var notifierIndex = list[media].notifiers.indexOf(update);
|
|
44
|
+
if (notifierIndex > -1) {
|
|
45
|
+
// Remove `update`.
|
|
46
|
+
list[media].notifiers.splice(notifierIndex, 1);
|
|
47
|
+
}
|
|
48
|
+
if (list[media].notifiers.length === 0) {
|
|
49
|
+
list[media].mql.removeEventListener('change', list[media].listener);
|
|
50
|
+
delete list[media];
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
}, [list, media, mediaQueryList]);
|
|
54
|
+
return mediaQueryList;
|
|
55
|
+
}
|
|
56
|
+
exports.useMediaQuery = useMediaQuery;
|
|
57
|
+
function MediaQuery(_a) {
|
|
58
|
+
var media = _a.media, children = _a.children;
|
|
59
|
+
var mql = useMediaQuery(media);
|
|
60
|
+
return typeof children === 'function' ? children(mql) : null;
|
|
61
|
+
}
|
|
62
|
+
exports.MediaQuery = MediaQuery;
|
|
63
|
+
var DOM_LAYOUT_HANDLER_NAME = '__reactLayoutHandler';
|
|
64
|
+
var supportsBorderBox = (function () {
|
|
65
|
+
if (typeof document === 'undefined') {
|
|
66
|
+
return false;
|
|
67
|
+
}
|
|
68
|
+
var e = document.body.appendChild(document.createElement('div'));
|
|
69
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
70
|
+
var observer = new ResizeObserver(function () { });
|
|
71
|
+
try {
|
|
72
|
+
observer.observe(e, { box: 'border-box' });
|
|
73
|
+
observer.unobserve(e);
|
|
74
|
+
return false;
|
|
75
|
+
}
|
|
76
|
+
catch (error) {
|
|
77
|
+
return true;
|
|
78
|
+
}
|
|
79
|
+
finally {
|
|
80
|
+
document.body.removeChild(e);
|
|
81
|
+
}
|
|
82
|
+
})();
|
|
83
|
+
var resizeObserver = null;
|
|
84
|
+
function getResizeObserver() {
|
|
85
|
+
if (resizeObserver) {
|
|
86
|
+
return resizeObserver;
|
|
87
|
+
}
|
|
88
|
+
if (typeof ResizeObserver === 'undefined') {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
resizeObserver = new ResizeObserver(function (entries) {
|
|
92
|
+
entries.forEach(function (entry) {
|
|
93
|
+
var node = entry.target;
|
|
94
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
95
|
+
var onLayout = node[DOM_LAYOUT_HANDLER_NAME];
|
|
96
|
+
if (typeof onLayout !== 'function') {
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
if (supportsBorderBox && entry.borderBoxSize) {
|
|
100
|
+
var boxSize_1 = entry.borderBoxSize[0] || entry.borderBoxSize;
|
|
101
|
+
onLayout(function (prevRect) {
|
|
102
|
+
if (prevRect.width === boxSize_1.inlineSize &&
|
|
103
|
+
prevRect.height === boxSize_1.blockSize) {
|
|
104
|
+
return prevRect;
|
|
105
|
+
}
|
|
106
|
+
return new DOMRect(0, 0, boxSize_1.inlineSize, boxSize_1.blockSize);
|
|
107
|
+
});
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
var elRect = entry.target.getBoundingClientRect();
|
|
111
|
+
onLayout(function (prevRect) {
|
|
112
|
+
if (prevRect.width === elRect.width &&
|
|
113
|
+
prevRect.height === elRect.height) {
|
|
114
|
+
return prevRect;
|
|
115
|
+
}
|
|
116
|
+
return new DOMRect(0, 0, elRect.width, elRect.height);
|
|
117
|
+
});
|
|
118
|
+
});
|
|
119
|
+
});
|
|
120
|
+
return resizeObserver;
|
|
121
|
+
}
|
|
122
|
+
function useElementLayout(ref) {
|
|
123
|
+
var observer = getResizeObserver();
|
|
124
|
+
var _a = react_1.default.useState(new DOMRect()), rect = _a[0], setRect = _a[1];
|
|
125
|
+
react_1.default.useLayoutEffect(function () {
|
|
126
|
+
var node = ref.current;
|
|
127
|
+
if (node) {
|
|
128
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
129
|
+
node[DOM_LAYOUT_HANDLER_NAME] = setRect;
|
|
130
|
+
}
|
|
131
|
+
if (node && observer) {
|
|
132
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
133
|
+
if (typeof node[DOM_LAYOUT_HANDLER_NAME] === 'function') {
|
|
134
|
+
observer.observe(node, supportsBorderBox ? { box: 'border-box' } : undefined);
|
|
135
|
+
}
|
|
136
|
+
else {
|
|
137
|
+
observer.unobserve(node);
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
return function () {
|
|
141
|
+
if (node != null && observer != null) {
|
|
142
|
+
observer.unobserve(node);
|
|
143
|
+
}
|
|
144
|
+
};
|
|
145
|
+
}, [ref, observer]);
|
|
146
|
+
return rect;
|
|
147
|
+
}
|
|
148
|
+
exports.useElementLayout = useElementLayout;
|
|
149
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/useMediaQuery/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{ "button": "
|
|
1
|
+
{ "button": "_button_474wk_1", "disabled": "_disabled_474wk_30", "buttonType-muted": "_buttonType-muted_474wk_34", "buttonType-primary": "_buttonType-primary_474wk_50", "buttonType-negative": "_buttonType-negative_474wk_71", "buttonSize-xxs": "_buttonSize-xxs_474wk_88", "buttonSize-xs": "_buttonSize-xs_474wk_93", "buttonSize-s": "_buttonSize-s_474wk_98", "buttonSize-m": "_buttonSize-m_474wk_103", "buttonSize-l": "_buttonSize-l_474wk_108", "buttonSize-xl": "_buttonSize-xl_474wk_113", "fullWidth": "_fullWidth_474wk_118", "button__leftIcon": "_button__leftIcon_474wk_124", "button__rightIcon": "_button__rightIcon_474wk_125" }
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { CSSProperties, MouseEventHandler, ReactNode } from 'react';
|
|
2
|
+
export declare type ButtonProps = {
|
|
3
|
+
children?: ReactNode;
|
|
4
|
+
className?: string;
|
|
5
|
+
selected?: boolean;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
style?: CSSProperties;
|
|
8
|
+
onClick?: MouseEventHandler;
|
|
9
|
+
};
|
|
10
|
+
export declare function Button({ children, style, className, selected, disabled, onClick, }: ButtonProps): JSX.Element;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import classNames from 'classnames';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import s from './styles.module.css.json';
|
|
4
|
+
export function Button(_a) {
|
|
5
|
+
var _b;
|
|
6
|
+
var children = _a.children, style = _a.style, className = _a.className, selected = _a.selected, disabled = _a.disabled, onClick = _a.onClick;
|
|
7
|
+
return (React.createElement("button", { type: "button", onClick: onClick, disabled: disabled, className: classNames(s['Button'], (_b = {},
|
|
8
|
+
_b[s['Button--selected']] = selected,
|
|
9
|
+
_b[s['Button--disabled']] = disabled,
|
|
10
|
+
_b), className), style: style }, children));
|
|
11
|
+
}
|
|
12
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/ButtonGroup/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAsD,MAAM,OAAO,CAAC;AAC3E,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAWzC,MAAM,UAAU,MAAM,CAAC,EAOT;;QANZ,QAAQ,cAAA,EACR,KAAK,WAAA,EACL,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,OAAO,aAAA;IAEP,OAAO,CACL,gCACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,UAAU,CACnB,CAAC,CAAC,QAAQ,CAAC;YAET,GAAC,CAAC,CAAC,kBAAkB,CAAC,IAAG,QAAQ;YACjC,GAAC,CAAC,CAAC,kBAAkB,CAAC,IAAG,QAAQ;iBAEnC,SAAS,CACV,EACD,KAAK,EAAE,KAAK,IAEX,QAAQ,CACF,CACV,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{ "Button": "_Button_1h1w1_1", "Button--s": "_Button--s_1h1w1_32", "Button--disabled": "_Button--disabled_1h1w1_36", "Button--selected": "_Button--selected_1h1w1_45" }
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
|
+
export declare type GroupProps = {
|
|
3
|
+
children?: ReactNode;
|
|
4
|
+
className?: string;
|
|
5
|
+
style?: CSSProperties;
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* @example Basic example
|
|
9
|
+
*
|
|
10
|
+
* ```js
|
|
11
|
+
* <Canvas ctx={ctx}>
|
|
12
|
+
* <ButtonGroup>
|
|
13
|
+
* <ButtonGroupButton>First</ButtonGroupButton>
|
|
14
|
+
* <ButtonGroupButton selected>Second</ButtonGroupButton>
|
|
15
|
+
* <ButtonGroupButton>Third</ButtonGroupButton>
|
|
16
|
+
* <ButtonGroupButton disabled>Fourth</ButtonGroupButton>
|
|
17
|
+
* </ButtonGroup>
|
|
18
|
+
* </Canvas>;
|
|
19
|
+
* ```
|
|
20
|
+
*/
|
|
21
|
+
export declare function Group({ children, style, className }: GroupProps): JSX.Element;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import classNames from 'classnames';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import s from './styles.module.css.json';
|
|
4
|
+
/**
|
|
5
|
+
* @example Basic example
|
|
6
|
+
*
|
|
7
|
+
* ```js
|
|
8
|
+
* <Canvas ctx={ctx}>
|
|
9
|
+
* <ButtonGroup>
|
|
10
|
+
* <ButtonGroupButton>First</ButtonGroupButton>
|
|
11
|
+
* <ButtonGroupButton selected>Second</ButtonGroupButton>
|
|
12
|
+
* <ButtonGroupButton>Third</ButtonGroupButton>
|
|
13
|
+
* <ButtonGroupButton disabled>Fourth</ButtonGroupButton>
|
|
14
|
+
* </ButtonGroup>
|
|
15
|
+
* </Canvas>;
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
export function Group(_a) {
|
|
19
|
+
var children = _a.children, style = _a.style, className = _a.className;
|
|
20
|
+
return (React.createElement("div", { className: classNames(s['Group'], className), style: style }, children));
|
|
21
|
+
}
|
|
22
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/ButtonGroup/Group/index.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAmC,MAAM,OAAO,CAAC;AACxD,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAQzC;;;;;;;;;;;;;GAaG;AACH,MAAM,UAAU,KAAK,CAAC,EAA0C;QAAxC,QAAQ,cAAA,EAAE,KAAK,WAAA,EAAE,SAAS,eAAA;IAChD,OAAO,CACL,6BAAK,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IAC5D,QAAQ,CACL,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{ "Group": "_Group_10mj4_1" }
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ButtonGroup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,SAAS,CAAC;AAE/C,OAAO,EAAE,MAAM,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC"}
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { RenderProperties } from 'datocms-plugin-sdk';
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import { RenderMethods, RenderProperties } from 'datocms-plugin-sdk';
|
|
3
|
+
declare type BaseRenderPropertiesAndMethods = RenderProperties & RenderMethods;
|
|
4
|
+
export declare const CtxContext: React.Context<BaseRenderPropertiesAndMethods | null>;
|
|
5
|
+
export declare function useCtx<T extends BaseRenderPropertiesAndMethods>(): T;
|
|
3
6
|
export declare type CanvasProps = {
|
|
4
|
-
ctx:
|
|
7
|
+
ctx: BaseRenderPropertiesAndMethods;
|
|
5
8
|
noAutoResizer?: boolean;
|
|
6
9
|
children: ReactNode;
|
|
7
10
|
};
|
|
@@ -497,3 +500,4 @@ export declare type CanvasProps = {
|
|
|
497
500
|
* ```
|
|
498
501
|
*/
|
|
499
502
|
export declare function Canvas({ ctx, children, noAutoResizer, }: CanvasProps): JSX.Element;
|
|
503
|
+
export {};
|
package/dist/esm/Canvas/index.js
CHANGED
|
@@ -1,21 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
};
|
|
12
|
-
import React, { useEffect } from 'react';
|
|
13
|
-
import styles from './styles.module.css.json';
|
|
14
|
-
function camelToDash(str) {
|
|
15
|
-
if (str != str.toLowerCase()) {
|
|
16
|
-
str = str.replace(/[A-Z]/g, function (m) { return '-' + m.toLowerCase(); });
|
|
1
|
+
import React, { createContext, useContext, useEffect } from 'react';
|
|
2
|
+
import s from './styles.module.css.json';
|
|
3
|
+
import { generateStyleFromCtx } from '../generateStyleFromCtx';
|
|
4
|
+
import classNames from 'classnames';
|
|
5
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6
|
+
export var CtxContext = createContext(null);
|
|
7
|
+
export function useCtx() {
|
|
8
|
+
var ctx = useContext(CtxContext);
|
|
9
|
+
if (!ctx) {
|
|
10
|
+
throw new Error('useCtx requires <Canvas />!');
|
|
17
11
|
}
|
|
18
|
-
return
|
|
12
|
+
return ctx;
|
|
19
13
|
}
|
|
20
14
|
/**
|
|
21
15
|
* @example Color palette CSS variables
|
|
@@ -521,14 +515,7 @@ export function Canvas(_a) {
|
|
|
521
515
|
}
|
|
522
516
|
return undefined;
|
|
523
517
|
}, [mode, noAutoResizer]);
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
var _c;
|
|
527
|
-
var k = _a[0], v = _a[1];
|
|
528
|
-
return __assign(__assign({}, acc), (_b = {}, _b["--" + camelToDash(k)] = v, _b["--" + camelToDash(k + "RgbComponents")] = ((_c = v.match(/rgb\((\d+, \d+, \d+)\)/)) === null || _c === void 0 ? void 0 : _c[1]) || undefined, _b));
|
|
529
|
-
}, {
|
|
530
|
-
padding: ctx.bodyPadding.map(function (p) { return p + "px"; }).join(' '),
|
|
531
|
-
});
|
|
532
|
-
return (React.createElement("div", { className: styles.canvas, style: style }, children));
|
|
518
|
+
return (React.createElement(CtxContext.Provider, { value: ctx },
|
|
519
|
+
React.createElement("div", { className: classNames(s['themeVariables'], s['canvas']), style: generateStyleFromCtx(ctx) }, children)));
|
|
533
520
|
}
|
|
534
521
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Canvas/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Canvas/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAa,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM/E,OAAO,CAAC,MAAM,0BAA0B,CAAC;AACzC,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,UAAU,MAAM,YAAY,CAAC;AAIpC,8DAA8D;AAC9D,MAAM,CAAC,IAAM,UAAU,GAAG,aAAa,CACrC,IAAI,CACL,CAAC;AAEF,MAAM,UAAU,MAAM;IACpB,IAAM,GAAG,GAAG,UAAU,CAAC,UAAU,CAAC,CAAC;IAEnC,IAAI,CAAC,GAAG,EAAE;QACR,MAAM,IAAI,KAAK,CAAC,6BAA6B,CAAC,CAAC;KAChD;IAED,OAAO,GAAQ,CAAC;AAClB,CAAC;AAQD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0eG;AAEH,MAAM,UAAU,MAAM,CAAC,EAIT;QAHZ,GAAG,SAAA,EACH,QAAQ,cAAA,EACR,aAAa,mBAAA;IAEL,IAAA,IAAI,GAAM,GAAmC,KAAzC,CAA0C;IAEtD,SAAS,CAAC;QACR,IAAI,IAAI,KAAK,YAAY,IAAI,CAAC,aAAa,EAAE;YAC3C,IAAM,oBAAkB,GAAI,GAAkC,CAAC;YAC/D,oBAAkB,CAAC,gBAAgB,EAAE,CAAC;YAEtC,OAAO;gBACL,oBAAkB,CAAC,eAAe,EAAE,CAAC;YACvC,CAAC,CAAC;SACH;QAED,OAAO,SAAS,CAAC;IACnB,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC;IAE1B,OAAO,CACL,oBAAC,UAAU,CAAC,QAAQ,IAAC,KAAK,EAAE,GAAG;QAC7B,6BACE,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EACvD,KAAK,EAAE,oBAAoB,CAAC,GAAG,CAAC,IAE/B,QAAQ,CACL,CACc,CACvB,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{ "canvas": "
|
|
1
|
+
{ "themeVariables": "_themeVariables_ovgoa_1", "canvas": "_canvas_ovgoa_68" }
|
|
@@ -45,7 +45,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
45
45
|
};
|
|
46
46
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
47
47
|
import React, { useEffect, useState } from 'react';
|
|
48
|
-
import { Button } from '..';
|
|
48
|
+
import { Button, useCtx } from '..';
|
|
49
49
|
import s from './styles.module.css.json';
|
|
50
50
|
var baseUrl = 'https://github.com/datocms/plugins-sdk/blob/master/packages/sdk/src/types.ts';
|
|
51
51
|
function copyTextToClipboard(text) {
|
|
@@ -172,10 +172,10 @@ var ExpandablePane = function (_a) {
|
|
|
172
172
|
React.createElement("button", { className: s.panelHandle, onClick: function () { return setOpen(function (open) { return !open; }); } }, label),
|
|
173
173
|
open && React.createElement("div", { className: s.panelBody }, children)));
|
|
174
174
|
};
|
|
175
|
-
export function ContextInspector(
|
|
175
|
+
export function ContextInspector() {
|
|
176
176
|
var _this = this;
|
|
177
|
-
var ctx =
|
|
178
|
-
var
|
|
177
|
+
var ctx = useCtx();
|
|
178
|
+
var _a = useState(null), groups = _a[0], setGroups = _a[1];
|
|
179
179
|
useEffect(function () {
|
|
180
180
|
var runner = function () { return __awaiter(_this, void 0, void 0, function () {
|
|
181
181
|
var response, manifest, connectParameters, hook, signature, ctxParameter;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ContextInspector/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,uDAAuD;AACvD,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ContextInspector/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare type RenderTriggerCtx = {
|
|
3
|
+
open: boolean;
|
|
4
|
+
onClick: () => void;
|
|
5
|
+
};
|
|
6
|
+
export declare type DropdownProps = {
|
|
7
|
+
renderTrigger: (ctx: RenderTriggerCtx) => JSX.Element;
|
|
8
|
+
children: React.ReactNode;
|
|
9
|
+
};
|
|
10
|
+
/**
|
|
11
|
+
* @example Basic example
|
|
12
|
+
*
|
|
13
|
+
* ```js
|
|
14
|
+
* <Canvas ctx={ctx}>
|
|
15
|
+
* <Dropdown
|
|
16
|
+
* renderTrigger={({ open, onClick }) => (
|
|
17
|
+
* <Button
|
|
18
|
+
* onClick={onClick}
|
|
19
|
+
* rightIcon={open ? <CaretUpIcon /> : <CaretDownIcon />}
|
|
20
|
+
* >
|
|
21
|
+
* Options
|
|
22
|
+
* </Button>
|
|
23
|
+
* )}
|
|
24
|
+
* >
|
|
25
|
+
* <DropdownMenu>
|
|
26
|
+
* <DropdownOption onClick={() => {}}>Edit</DropdownOption>
|
|
27
|
+
* <DropdownOption disabled onClick={() => {}}>
|
|
28
|
+
* Duplicate
|
|
29
|
+
* </DropdownOption>
|
|
30
|
+
* <DropdownSeparator />
|
|
31
|
+
* <DropdownOption red onClick={() => {}}>
|
|
32
|
+
* Delete
|
|
33
|
+
* </DropdownOption>
|
|
34
|
+
* </DropdownMenu>
|
|
35
|
+
* </Dropdown>
|
|
36
|
+
* </Canvas>;
|
|
37
|
+
* ```
|
|
38
|
+
*
|
|
39
|
+
* @example Option actions
|
|
40
|
+
*
|
|
41
|
+
* ```js
|
|
42
|
+
* <Canvas ctx={ctx}>
|
|
43
|
+
* <Dropdown
|
|
44
|
+
* renderTrigger={({ open, onClick }) => (
|
|
45
|
+
* <Button
|
|
46
|
+
* onClick={onClick}
|
|
47
|
+
* rightIcon={open ? <CaretUpIcon /> : <CaretDownIcon />}
|
|
48
|
+
* >
|
|
49
|
+
* Fields
|
|
50
|
+
* </Button>
|
|
51
|
+
* )}
|
|
52
|
+
* >
|
|
53
|
+
* <DropdownMenu>
|
|
54
|
+
* <DropdownOption>
|
|
55
|
+
* First option
|
|
56
|
+
* <DropdownOptionAction icon={<PlusIcon />} onClick={() => {}} />
|
|
57
|
+
* <DropdownOptionAction
|
|
58
|
+
* red
|
|
59
|
+
* icon={<TrashIcon />}
|
|
60
|
+
* onClick={() => {}}
|
|
61
|
+
* />
|
|
62
|
+
* </DropdownOption>
|
|
63
|
+
* <DropdownOption>
|
|
64
|
+
* Second option
|
|
65
|
+
* <DropdownOptionAction icon={<PlusIcon />} onClick={() => {}} />
|
|
66
|
+
* <DropdownOptionAction
|
|
67
|
+
* red
|
|
68
|
+
* icon={<TrashIcon />}
|
|
69
|
+
* onClick={() => {}}
|
|
70
|
+
* />
|
|
71
|
+
* </DropdownOption>
|
|
72
|
+
* </DropdownMenu>
|
|
73
|
+
* </Dropdown>
|
|
74
|
+
* </Canvas>;
|
|
75
|
+
* ```
|
|
76
|
+
*
|
|
77
|
+
* @example Option groups
|
|
78
|
+
*
|
|
79
|
+
* ```js
|
|
80
|
+
* <Canvas ctx={ctx}>
|
|
81
|
+
* <Dropdown
|
|
82
|
+
* renderTrigger={({ open, onClick }) => (
|
|
83
|
+
* <Button
|
|
84
|
+
* onClick={onClick}
|
|
85
|
+
* rightIcon={open ? <CaretUpIcon /> : <CaretDownIcon />}
|
|
86
|
+
* >
|
|
87
|
+
* Fields
|
|
88
|
+
* </Button>
|
|
89
|
+
* )}
|
|
90
|
+
* >
|
|
91
|
+
* <DropdownMenu>
|
|
92
|
+
* <DropdownGroup name="Group 1">
|
|
93
|
+
* <DropdownOption>Foo</DropdownOption>
|
|
94
|
+
* <DropdownOption>Bar</DropdownOption>
|
|
95
|
+
* <DropdownOption>Qux</DropdownOption>
|
|
96
|
+
* </DropdownGroup>
|
|
97
|
+
* <DropdownGroup name="Group 2">
|
|
98
|
+
* <DropdownOption>Foo</DropdownOption>
|
|
99
|
+
* <DropdownOption>Bar</DropdownOption>
|
|
100
|
+
* <DropdownOption>Qux</DropdownOption>
|
|
101
|
+
* </DropdownGroup>
|
|
102
|
+
* <DropdownGroup name="Group 3">
|
|
103
|
+
* <DropdownOption>Foo</DropdownOption>
|
|
104
|
+
* <DropdownOption>Bar</DropdownOption>
|
|
105
|
+
* <DropdownOption>Qux</DropdownOption>
|
|
106
|
+
* </DropdownGroup>
|
|
107
|
+
* </DropdownMenu>
|
|
108
|
+
* </Dropdown>
|
|
109
|
+
* </Canvas>;
|
|
110
|
+
* ```
|
|
111
|
+
*/
|
|
112
|
+
export declare function Dropdown({ renderTrigger, children, }: DropdownProps): JSX.Element;
|
|
113
|
+
export {};
|