@ttoss/components 1.21.7 → 1.21.9

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 (4) hide show
  1. package/dist/esm/index.js +210 -0
  2. package/dist/index.d.ts +298 -0
  3. package/dist/index.js +233 -0
  4. package/package.json +3 -3
package/dist/esm/index.js ADDED
@@ -0,0 +1,210 @@
1
+ "use strict";
2
+ /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
3
+
4
+ // tsup.inject.js
5
+ import * as React from "react";
6
+
7
+ // src/components/Accordion/Accordion.tsx
8
+ import * as React2 from "react";
9
+ import {
10
+ AccordionItem,
11
+ AccordionItemButton,
12
+ AccordionItemHeading,
13
+ AccordionItemPanel,
14
+ Accordion as ReactAccessibleAccordion
15
+ } from "react-accessible-accordion";
16
+ import { Box, useTheme } from "@ttoss/ui";
17
+ import { css as createClassName } from "@emotion/css";
18
+ import { css as transformStyleObject } from "@theme-ui/css";
19
+ var Accordion = ({
20
+ children,
21
+ allowMultipleExpanded,
22
+ allowZeroExpanded,
23
+ preExpanded,
24
+ onChange,
25
+ ...boxProps
26
+ }) => {
27
+ const { theme } = useTheme();
28
+ const className = React2.useMemo(() => {
29
+ const styles = transformStyleObject({
30
+ ".accordion__item": {
31
+ marginBottom: 3
32
+ },
33
+ ".accordion__heading": {
34
+ padding: 2,
35
+ border: "1px solid",
36
+ borderColor: "black"
37
+ },
38
+ ".accordion__button": {},
39
+ ".accordion__panel": {
40
+ padding: 2
41
+ }
42
+ })(theme);
43
+ return createClassName(styles);
44
+ }, [theme]);
45
+ return /* @__PURE__ */ React2.createElement(Box, {
46
+ variant: "accordion",
47
+ className,
48
+ ...boxProps
49
+ }, /* @__PURE__ */ React2.createElement(ReactAccessibleAccordion, {
50
+ ...{
51
+ allowMultipleExpanded,
52
+ allowZeroExpanded,
53
+ preExpanded,
54
+ onChange
55
+ }
56
+ }, children));
57
+ };
58
+ Accordion.Item = AccordionItem;
59
+ Accordion.ItemButton = AccordionItemButton;
60
+ Accordion.ItemHeading = AccordionItemHeading;
61
+ Accordion.ItemPanel = AccordionItemPanel;
62
+
63
+ // src/components/InstallPwa/InstallPwa.tsx
64
+ import * as React3 from "react";
65
+
66
+ // src/components/InstallPwa/InstallPwaUi.tsx
67
+ import { Button, Flex, Text } from "@ttoss/ui";
68
+ var InstallPwaUi = ({ onInstall }) => {
69
+ return /* @__PURE__ */ React.createElement(Flex, {
70
+ sx: {
71
+ position: "absolute",
72
+ bottom: 4,
73
+ width: "100%",
74
+ justifyContent: "center"
75
+ }
76
+ }, /* @__PURE__ */ React.createElement(Flex, {
77
+ sx: {
78
+ backgroundColor: "background",
79
+ justifyContent: "center",
80
+ alignItems: "center",
81
+ gap: 3,
82
+ width: "auto",
83
+ border: "1px solid",
84
+ borderColor: "muted",
85
+ borderRadius: 1,
86
+ padding: 4
87
+ }
88
+ }, /* @__PURE__ */ React.createElement(Text, null, "Deseja instalar o nosso aplicativo?"), /* @__PURE__ */ React.createElement(Button, {
89
+ onClick: onInstall
90
+ }, "Instalar")));
91
+ };
92
+
93
+ // src/components/InstallPwa/InstallPwa.tsx
94
+ var InstallPwa = () => {
95
+ const [supportsPwa, setSupportsPwa] = React3.useState(false);
96
+ const [promptInstall, setPromptInstall] = React3.useState(null);
97
+ React3.useEffect(() => {
98
+ const handler = (e) => {
99
+ e.preventDefault();
100
+ setSupportsPwa(true);
101
+ setPromptInstall(e);
102
+ };
103
+ window.addEventListener("beforeinstallprompt", handler);
104
+ return () => window.removeEventListener("transitionend", handler);
105
+ }, []);
106
+ const onInstall = (e) => {
107
+ e.preventDefault();
108
+ if (!promptInstall) {
109
+ return;
110
+ }
111
+ promptInstall.prompt();
112
+ };
113
+ if (!supportsPwa) {
114
+ return null;
115
+ }
116
+ return /* @__PURE__ */ React3.createElement(InstallPwaUi, {
117
+ onInstall
118
+ });
119
+ };
120
+
121
+ // src/components/Modal/Modal.tsx
122
+ import { useResponsiveValue, useTheme as useTheme2 } from "@ttoss/ui";
123
+ import ReactModal from "react-modal";
124
+ ReactModal.defaultStyles = {
125
+ overlay: {},
126
+ content: {}
127
+ };
128
+ var Modal = (props) => {
129
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i;
130
+ const { theme } = useTheme2();
131
+ const padding = useResponsiveValue([
132
+ (_a = theme.space) == null ? void 0 : _a[2],
133
+ (_b = theme.space) == null ? void 0 : _b[3],
134
+ (_c = theme.space) == null ? void 0 : _c[4]
135
+ ]) || 0;
136
+ const style = {
137
+ overlay: {
138
+ position: "fixed",
139
+ top: 0,
140
+ left: 0,
141
+ right: 0,
142
+ bottom: 0,
143
+ backgroundColor: "rgba(255, 255, 255, 0.5)",
144
+ display: "flex",
145
+ justifyContent: "center",
146
+ alignItems: "center",
147
+ padding,
148
+ ...(_d = props.style) == null ? void 0 : _d.overlay
149
+ },
150
+ content: {
151
+ backgroundColor: ((_f = (_e = theme.rawColors) == null ? void 0 : _e.background) == null ? void 0 : _f.toString()) || "#fff",
152
+ padding,
153
+ WebkitOverflowScrolling: "touch",
154
+ overflow: "auto",
155
+ position: "relative",
156
+ top: "0px",
157
+ left: "0px",
158
+ right: "0px",
159
+ bottom: "0px",
160
+ border: "2px solid",
161
+ borderColor: ((_h = (_g = theme.rawColors) == null ? void 0 : _g.muted) == null ? void 0 : _h.toString()) || "#fff",
162
+ display: "flex",
163
+ flexDirection: "column",
164
+ alignItems: "center",
165
+ ...(_i = props.style) == null ? void 0 : _i.content
166
+ }
167
+ };
168
+ return /* @__PURE__ */ React.createElement(ReactModal, {
169
+ ...props,
170
+ style
171
+ });
172
+ };
173
+ Modal.setAppElement = ReactModal.setAppElement;
174
+
175
+ // src/components/Toast/Toast.tsx
176
+ import * as React4 from "react";
177
+ import { Box as Box2 } from "@ttoss/ui";
178
+ import {
179
+ ToastContainer as ReactToastifyToastContainer,
180
+ ToastContainerProps,
181
+ toast
182
+ } from "react-toastify";
183
+ import { injectStyle } from "react-toastify/dist/inject-style";
184
+ var ToastContainer = (props) => {
185
+ React4.useEffect(() => {
186
+ injectStyle();
187
+ }, []);
188
+ return /* @__PURE__ */ React4.createElement(Box2, {
189
+ sx: ({ colors, fonts }) => ({
190
+ "--toastify-color-light": "#fff",
191
+ "--toastify-color-dark": "#121212",
192
+ "--toastify-color-info": (colors == null ? void 0 : colors.info) || "#3498db",
193
+ "--toastify-color-success": (colors == null ? void 0 : colors.success) || "#07bc0c",
194
+ "--toastify-color-warning": "#f1c40f",
195
+ "--toastify-color-error": "#e74c3c",
196
+ "--toastify-color-progress-light": `linear-gradient(to right, ${colors == null ? void 0 : colors.primary}, ${colors == null ? void 0 : colors.secondary})`,
197
+ "--toastify-font-family": fonts.body
198
+ })
199
+ }, /* @__PURE__ */ React4.createElement(ReactToastifyToastContainer, {
200
+ ...props
201
+ }));
202
+ };
203
+ export {
204
+ Accordion,
205
+ InstallPwa,
206
+ Modal,
207
+ ToastContainer,
208
+ ToastContainerProps,
209
+ toast
210
+ };
package/dist/index.d.ts ADDED
@@ -0,0 +1,298 @@
1
+ import * as react_accessible_accordion_dist_types_helpers_DisplayName from 'react-accessible-accordion/dist/types/helpers/DisplayName';
2
+ import * as react_accessible_accordion_dist_types_components_ItemContext from 'react-accessible-accordion/dist/types/components/ItemContext';
3
+ import * as react_accessible_accordion_dist_types_helpers_types from 'react-accessible-accordion/dist/types/helpers/types';
4
+ import * as React from 'react';
5
+ import { BoxProps } from '@ttoss/ui';
6
+ import ReactModal from 'react-modal';
7
+ import { ToastContainerProps } from 'react-toastify';
8
+ export { ToastContainerProps, toast } from 'react-toastify';
9
+
10
+ declare type AccordionProps = BoxProps & {
11
+ allowMultipleExpanded?: boolean;
12
+ allowZeroExpanded?: boolean;
13
+ preExpanded?: string[];
14
+ /**
15
+ * Callback which is invoked when items are expanded or collapsed. Gets passed uuids of the currently expanded AccordionItems.
16
+ */
17
+ onChange?: (args: string[]) => void;
18
+ };
19
+ declare const Accordion: {
20
+ ({ children, allowMultipleExpanded, allowZeroExpanded, preExpanded, onChange, ...boxProps }: AccordionProps): JSX.Element;
21
+ Item: {
22
+ ({ uuid, dangerouslySetExpanded, className, activeClassName, ...rest }: react_accessible_accordion_dist_types_helpers_types.DivAttributes & {
23
+ uuid?: react_accessible_accordion_dist_types_components_ItemContext.ID | undefined;
24
+ activeClassName?: string | undefined;
25
+ dangerouslySetExpanded?: boolean | undefined;
26
+ }): JSX.Element;
27
+ displayName: react_accessible_accordion_dist_types_helpers_DisplayName.default;
28
+ };
29
+ ItemButton: React.FC<{
30
+ children?: React.ReactNode;
31
+ slot?: string | undefined;
32
+ style?: React.CSSProperties | undefined;
33
+ title?: string | undefined;
34
+ defaultChecked?: boolean | undefined;
35
+ defaultValue?: string | number | readonly string[] | undefined;
36
+ suppressContentEditableWarning?: boolean | undefined;
37
+ suppressHydrationWarning?: boolean | undefined;
38
+ accessKey?: string | undefined;
39
+ className?: string | undefined;
40
+ contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
41
+ contextMenu?: string | undefined;
42
+ dir?: string | undefined;
43
+ draggable?: (boolean | "true" | "false") | undefined;
44
+ hidden?: boolean | undefined;
45
+ lang?: string | undefined;
46
+ placeholder?: string | undefined;
47
+ spellCheck?: (boolean | "true" | "false") | undefined;
48
+ translate?: "yes" | "no" | undefined;
49
+ radioGroup?: string | undefined;
50
+ about?: string | undefined;
51
+ datatype?: string | undefined;
52
+ inlist?: any;
53
+ prefix?: string | undefined;
54
+ property?: string | undefined;
55
+ resource?: string | undefined;
56
+ typeof?: string | undefined;
57
+ vocab?: string | undefined;
58
+ autoCapitalize?: string | undefined;
59
+ autoCorrect?: string | undefined;
60
+ autoSave?: string | undefined;
61
+ color?: string | undefined;
62
+ itemProp?: string | undefined;
63
+ itemScope?: boolean | undefined;
64
+ itemType?: string | undefined;
65
+ itemID?: string | undefined;
66
+ itemRef?: string | undefined;
67
+ results?: number | undefined;
68
+ security?: string | undefined;
69
+ unselectable?: "on" | "off" | undefined;
70
+ inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
71
+ is?: string | undefined;
72
+ 'aria-activedescendant'?: string | undefined;
73
+ 'aria-atomic'?: (boolean | "true" | "false") | undefined;
74
+ 'aria-autocomplete'?: "list" | "none" | "both" | "inline" | undefined;
75
+ 'aria-busy'?: (boolean | "true" | "false") | undefined;
76
+ 'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
77
+ 'aria-colcount'?: number | undefined;
78
+ 'aria-colindex'?: number | undefined;
79
+ 'aria-colspan'?: number | undefined;
80
+ 'aria-current'?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
81
+ 'aria-describedby'?: string | undefined;
82
+ 'aria-details'?: string | undefined;
83
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
84
+ 'aria-errormessage'?: string | undefined;
85
+ 'aria-flowto'?: string | undefined;
86
+ 'aria-grabbed'?: (boolean | "true" | "false") | undefined;
87
+ 'aria-haspopup'?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
88
+ 'aria-hidden'?: (boolean | "true" | "false") | undefined;
89
+ 'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
90
+ 'aria-keyshortcuts'?: string | undefined;
91
+ 'aria-label'?: string | undefined;
92
+ 'aria-labelledby'?: string | undefined;
93
+ 'aria-level'?: number | undefined;
94
+ 'aria-live'?: "off" | "assertive" | "polite" | undefined;
95
+ 'aria-modal'?: (boolean | "true" | "false") | undefined;
96
+ 'aria-multiline'?: (boolean | "true" | "false") | undefined;
97
+ 'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
98
+ 'aria-orientation'?: "horizontal" | "vertical" | undefined;
99
+ 'aria-owns'?: string | undefined;
100
+ 'aria-placeholder'?: string | undefined;
101
+ 'aria-posinset'?: number | undefined;
102
+ 'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
103
+ 'aria-readonly'?: (boolean | "true" | "false") | undefined;
104
+ 'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
105
+ 'aria-required'?: (boolean | "true" | "false") | undefined;
106
+ 'aria-roledescription'?: string | undefined;
107
+ 'aria-rowcount'?: number | undefined;
108
+ 'aria-rowindex'?: number | undefined;
109
+ 'aria-rowspan'?: number | undefined;
110
+ 'aria-selected'?: (boolean | "true" | "false") | undefined;
111
+ 'aria-setsize'?: number | undefined;
112
+ 'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
113
+ 'aria-valuemax'?: number | undefined;
114
+ 'aria-valuemin'?: number | undefined;
115
+ 'aria-valuenow'?: number | undefined;
116
+ 'aria-valuetext'?: string | undefined;
117
+ dangerouslySetInnerHTML?: {
118
+ __html: string;
119
+ } | undefined;
120
+ onCopy?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
121
+ onCopyCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
122
+ onCut?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
123
+ onCutCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
124
+ onPaste?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
125
+ onPasteCapture?: React.ClipboardEventHandler<HTMLDivElement> | undefined;
126
+ onCompositionEnd?: React.CompositionEventHandler<HTMLDivElement> | undefined;
127
+ onCompositionEndCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
128
+ onCompositionStart?: React.CompositionEventHandler<HTMLDivElement> | undefined;
129
+ onCompositionStartCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
130
+ onCompositionUpdate?: React.CompositionEventHandler<HTMLDivElement> | undefined;
131
+ onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLDivElement> | undefined;
132
+ onFocus?: React.FocusEventHandler<HTMLDivElement> | undefined;
133
+ onFocusCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
134
+ onBlur?: React.FocusEventHandler<HTMLDivElement> | undefined;
135
+ onBlurCapture?: React.FocusEventHandler<HTMLDivElement> | undefined;
136
+ onChange?: React.FormEventHandler<HTMLDivElement> | undefined;
137
+ onChangeCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
138
+ onBeforeInput?: React.FormEventHandler<HTMLDivElement> | undefined;
139
+ onBeforeInputCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
140
+ onInput?: React.FormEventHandler<HTMLDivElement> | undefined;
141
+ onInputCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
142
+ onReset?: React.FormEventHandler<HTMLDivElement> | undefined;
143
+ onResetCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
144
+ onSubmit?: React.FormEventHandler<HTMLDivElement> | undefined;
145
+ onSubmitCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
146
+ onInvalid?: React.FormEventHandler<HTMLDivElement> | undefined;
147
+ onInvalidCapture?: React.FormEventHandler<HTMLDivElement> | undefined;
148
+ onLoad?: React.ReactEventHandler<HTMLDivElement> | undefined;
149
+ onLoadCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
150
+ onError?: React.ReactEventHandler<HTMLDivElement> | undefined;
151
+ onErrorCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
152
+ onKeyDown?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
153
+ onKeyDownCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
154
+ onKeyPress?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
155
+ onKeyPressCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
156
+ onKeyUp?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
157
+ onKeyUpCapture?: React.KeyboardEventHandler<HTMLDivElement> | undefined;
158
+ onAbort?: React.ReactEventHandler<HTMLDivElement> | undefined;
159
+ onAbortCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
160
+ onCanPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
161
+ onCanPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
162
+ onCanPlayThrough?: React.ReactEventHandler<HTMLDivElement> | undefined;
163
+ onCanPlayThroughCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
164
+ onDurationChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
165
+ onDurationChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
166
+ onEmptied?: React.ReactEventHandler<HTMLDivElement> | undefined;
167
+ onEmptiedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
168
+ onEncrypted?: React.ReactEventHandler<HTMLDivElement> | undefined;
169
+ onEncryptedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
170
+ onEnded?: React.ReactEventHandler<HTMLDivElement> | undefined;
171
+ onEndedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
172
+ onLoadedData?: React.ReactEventHandler<HTMLDivElement> | undefined;
173
+ onLoadedDataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
174
+ onLoadedMetadata?: React.ReactEventHandler<HTMLDivElement> | undefined;
175
+ onLoadedMetadataCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
176
+ onLoadStart?: React.ReactEventHandler<HTMLDivElement> | undefined;
177
+ onLoadStartCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
178
+ onPause?: React.ReactEventHandler<HTMLDivElement> | undefined;
179
+ onPauseCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
180
+ onPlay?: React.ReactEventHandler<HTMLDivElement> | undefined;
181
+ onPlayCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
182
+ onPlaying?: React.ReactEventHandler<HTMLDivElement> | undefined;
183
+ onPlayingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
184
+ onProgress?: React.ReactEventHandler<HTMLDivElement> | undefined;
185
+ onProgressCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
186
+ onRateChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
187
+ onRateChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
188
+ onSeeked?: React.ReactEventHandler<HTMLDivElement> | undefined;
189
+ onSeekedCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
190
+ onSeeking?: React.ReactEventHandler<HTMLDivElement> | undefined;
191
+ onSeekingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
192
+ onStalled?: React.ReactEventHandler<HTMLDivElement> | undefined;
193
+ onStalledCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
194
+ onSuspend?: React.ReactEventHandler<HTMLDivElement> | undefined;
195
+ onSuspendCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
196
+ onTimeUpdate?: React.ReactEventHandler<HTMLDivElement> | undefined;
197
+ onTimeUpdateCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
198
+ onVolumeChange?: React.ReactEventHandler<HTMLDivElement> | undefined;
199
+ onVolumeChangeCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
200
+ onWaiting?: React.ReactEventHandler<HTMLDivElement> | undefined;
201
+ onWaitingCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
202
+ onAuxClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
203
+ onAuxClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
204
+ onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
205
+ onClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
206
+ onContextMenu?: React.MouseEventHandler<HTMLDivElement> | undefined;
207
+ onContextMenuCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
208
+ onDoubleClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
209
+ onDoubleClickCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
210
+ onDrag?: React.DragEventHandler<HTMLDivElement> | undefined;
211
+ onDragCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
212
+ onDragEnd?: React.DragEventHandler<HTMLDivElement> | undefined;
213
+ onDragEndCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
214
+ onDragEnter?: React.DragEventHandler<HTMLDivElement> | undefined;
215
+ onDragEnterCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
216
+ onDragExit?: React.DragEventHandler<HTMLDivElement> | undefined;
217
+ onDragExitCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
218
+ onDragLeave?: React.DragEventHandler<HTMLDivElement> | undefined;
219
+ onDragLeaveCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
220
+ onDragOver?: React.DragEventHandler<HTMLDivElement> | undefined;
221
+ onDragOverCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
222
+ onDragStart?: React.DragEventHandler<HTMLDivElement> | undefined;
223
+ onDragStartCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
224
+ onDrop?: React.DragEventHandler<HTMLDivElement> | undefined;
225
+ onDropCapture?: React.DragEventHandler<HTMLDivElement> | undefined;
226
+ onMouseDown?: React.MouseEventHandler<HTMLDivElement> | undefined;
227
+ onMouseDownCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
228
+ onMouseEnter?: React.MouseEventHandler<HTMLDivElement> | undefined;
229
+ onMouseLeave?: React.MouseEventHandler<HTMLDivElement> | undefined;
230
+ onMouseMove?: React.MouseEventHandler<HTMLDivElement> | undefined;
231
+ onMouseMoveCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
232
+ onMouseOut?: React.MouseEventHandler<HTMLDivElement> | undefined;
233
+ onMouseOutCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
234
+ onMouseOver?: React.MouseEventHandler<HTMLDivElement> | undefined;
235
+ onMouseOverCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
236
+ onMouseUp?: React.MouseEventHandler<HTMLDivElement> | undefined;
237
+ onMouseUpCapture?: React.MouseEventHandler<HTMLDivElement> | undefined;
238
+ onSelect?: React.ReactEventHandler<HTMLDivElement> | undefined;
239
+ onSelectCapture?: React.ReactEventHandler<HTMLDivElement> | undefined;
240
+ onTouchCancel?: React.TouchEventHandler<HTMLDivElement> | undefined;
241
+ onTouchCancelCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
242
+ onTouchEnd?: React.TouchEventHandler<HTMLDivElement> | undefined;
243
+ onTouchEndCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
244
+ onTouchMove?: React.TouchEventHandler<HTMLDivElement> | undefined;
245
+ onTouchMoveCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
246
+ onTouchStart?: React.TouchEventHandler<HTMLDivElement> | undefined;
247
+ onTouchStartCapture?: React.TouchEventHandler<HTMLDivElement> | undefined;
248
+ onPointerDown?: React.PointerEventHandler<HTMLDivElement> | undefined;
249
+ onPointerDownCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
250
+ onPointerMove?: React.PointerEventHandler<HTMLDivElement> | undefined;
251
+ onPointerMoveCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
252
+ onPointerUp?: React.PointerEventHandler<HTMLDivElement> | undefined;
253
+ onPointerUpCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
254
+ onPointerCancel?: React.PointerEventHandler<HTMLDivElement> | undefined;
255
+ onPointerCancelCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
256
+ onPointerEnter?: React.PointerEventHandler<HTMLDivElement> | undefined;
257
+ onPointerEnterCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
258
+ onPointerLeave?: React.PointerEventHandler<HTMLDivElement> | undefined;
259
+ onPointerLeaveCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
260
+ onPointerOver?: React.PointerEventHandler<HTMLDivElement> | undefined;
261
+ onPointerOverCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
262
+ onPointerOut?: React.PointerEventHandler<HTMLDivElement> | undefined;
263
+ onPointerOutCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
264
+ onGotPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
265
+ onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
266
+ onLostPointerCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
267
+ onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLDivElement> | undefined;
268
+ onScroll?: React.UIEventHandler<HTMLDivElement> | undefined;
269
+ onScrollCapture?: React.UIEventHandler<HTMLDivElement> | undefined;
270
+ onWheel?: React.WheelEventHandler<HTMLDivElement> | undefined;
271
+ onWheelCapture?: React.WheelEventHandler<HTMLDivElement> | undefined;
272
+ onAnimationStart?: React.AnimationEventHandler<HTMLDivElement> | undefined;
273
+ onAnimationStartCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
274
+ onAnimationEnd?: React.AnimationEventHandler<HTMLDivElement> | undefined;
275
+ onAnimationEndCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
276
+ onAnimationIteration?: React.AnimationEventHandler<HTMLDivElement> | undefined;
277
+ onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
278
+ onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
279
+ onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
280
+ }>;
281
+ ItemHeading: React.FC<react_accessible_accordion_dist_types_helpers_types.DivAttributes>;
282
+ ItemPanel: ({ className, region, id, ...rest }: react_accessible_accordion_dist_types_helpers_types.DivAttributes & {
283
+ region?: boolean | undefined;
284
+ className?: string | undefined;
285
+ }) => JSX.Element;
286
+ };
287
+
288
+ declare const InstallPwa: () => JSX.Element | null;
289
+
290
+ declare type ModalProps = ReactModal.Props;
291
+ declare const Modal: {
292
+ (props: ModalProps): JSX.Element;
293
+ setAppElement: typeof ReactModal.setAppElement;
294
+ };
295
+
296
+ declare const ToastContainer: (props: ToastContainerProps) => JSX.Element;
297
+
298
+ export { Accordion, AccordionProps, InstallPwa, Modal, ModalProps, ToastContainer };
package/dist/index.js ADDED
@@ -0,0 +1,233 @@
1
+ "use strict";
2
+ /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
3
+ var __create = Object.create;
4
+ var __defProp = Object.defineProperty;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropNames = Object.getOwnPropertyNames;
7
+ var __getProtoOf = Object.getPrototypeOf;
8
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
9
+ var __export = (target, all) => {
10
+ for (var name in all)
11
+ __defProp(target, name, { get: all[name], enumerable: true });
12
+ };
13
+ var __copyProps = (to, from, except, desc) => {
14
+ if (from && typeof from === "object" || typeof from === "function") {
15
+ for (let key of __getOwnPropNames(from))
16
+ if (!__hasOwnProp.call(to, key) && key !== except)
17
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
18
+ }
19
+ return to;
20
+ };
21
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
22
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
23
+
24
+ // src/index.ts
25
+ var src_exports = {};
26
+ __export(src_exports, {
27
+ Accordion: () => Accordion,
28
+ InstallPwa: () => InstallPwa,
29
+ Modal: () => Modal,
30
+ ToastContainer: () => ToastContainer,
31
+ ToastContainerProps: () => import_react_toastify.ToastContainerProps,
32
+ toast: () => import_react_toastify.toast
33
+ });
34
+ module.exports = __toCommonJS(src_exports);
35
+
36
+ // tsup.inject.js
37
+ var React = __toESM(require("react"));
38
+
39
+ // src/components/Accordion/Accordion.tsx
40
+ var React2 = __toESM(require("react"));
41
+ var import_react_accessible_accordion = require("react-accessible-accordion");
42
+ var import_ui = require("@ttoss/ui");
43
+ var import_css = require("@emotion/css");
44
+ var import_css2 = require("@theme-ui/css");
45
+ var Accordion = ({
46
+ children,
47
+ allowMultipleExpanded,
48
+ allowZeroExpanded,
49
+ preExpanded,
50
+ onChange,
51
+ ...boxProps
52
+ }) => {
53
+ const { theme } = (0, import_ui.useTheme)();
54
+ const className = React2.useMemo(() => {
55
+ const styles = (0, import_css2.css)({
56
+ ".accordion__item": {
57
+ marginBottom: 3
58
+ },
59
+ ".accordion__heading": {
60
+ padding: 2,
61
+ border: "1px solid",
62
+ borderColor: "black"
63
+ },
64
+ ".accordion__button": {},
65
+ ".accordion__panel": {
66
+ padding: 2
67
+ }
68
+ })(theme);
69
+ return (0, import_css.css)(styles);
70
+ }, [theme]);
71
+ return /* @__PURE__ */ React2.createElement(import_ui.Box, {
72
+ variant: "accordion",
73
+ className,
74
+ ...boxProps
75
+ }, /* @__PURE__ */ React2.createElement(import_react_accessible_accordion.Accordion, {
76
+ ...{
77
+ allowMultipleExpanded,
78
+ allowZeroExpanded,
79
+ preExpanded,
80
+ onChange
81
+ }
82
+ }, children));
83
+ };
84
+ Accordion.Item = import_react_accessible_accordion.AccordionItem;
85
+ Accordion.ItemButton = import_react_accessible_accordion.AccordionItemButton;
86
+ Accordion.ItemHeading = import_react_accessible_accordion.AccordionItemHeading;
87
+ Accordion.ItemPanel = import_react_accessible_accordion.AccordionItemPanel;
88
+
89
+ // src/components/InstallPwa/InstallPwa.tsx
90
+ var React3 = __toESM(require("react"));
91
+
92
+ // src/components/InstallPwa/InstallPwaUi.tsx
93
+ var import_ui2 = require("@ttoss/ui");
94
+ var InstallPwaUi = ({ onInstall }) => {
95
+ return /* @__PURE__ */ React.createElement(import_ui2.Flex, {
96
+ sx: {
97
+ position: "absolute",
98
+ bottom: 4,
99
+ width: "100%",
100
+ justifyContent: "center"
101
+ }
102
+ }, /* @__PURE__ */ React.createElement(import_ui2.Flex, {
103
+ sx: {
104
+ backgroundColor: "background",
105
+ justifyContent: "center",
106
+ alignItems: "center",
107
+ gap: 3,
108
+ width: "auto",
109
+ border: "1px solid",
110
+ borderColor: "muted",
111
+ borderRadius: 1,
112
+ padding: 4
113
+ }
114
+ }, /* @__PURE__ */ React.createElement(import_ui2.Text, null, "Deseja instalar o nosso aplicativo?"), /* @__PURE__ */ React.createElement(import_ui2.Button, {
115
+ onClick: onInstall
116
+ }, "Instalar")));
117
+ };
118
+
119
+ // src/components/InstallPwa/InstallPwa.tsx
120
+ var InstallPwa = () => {
121
+ const [supportsPwa, setSupportsPwa] = React3.useState(false);
122
+ const [promptInstall, setPromptInstall] = React3.useState(null);
123
+ React3.useEffect(() => {
124
+ const handler = (e) => {
125
+ e.preventDefault();
126
+ setSupportsPwa(true);
127
+ setPromptInstall(e);
128
+ };
129
+ window.addEventListener("beforeinstallprompt", handler);
130
+ return () => window.removeEventListener("transitionend", handler);
131
+ }, []);
132
+ const onInstall = (e) => {
133
+ e.preventDefault();
134
+ if (!promptInstall) {
135
+ return;
136
+ }
137
+ promptInstall.prompt();
138
+ };
139
+ if (!supportsPwa) {
140
+ return null;
141
+ }
142
+ return /* @__PURE__ */ React3.createElement(InstallPwaUi, {
143
+ onInstall
144
+ });
145
+ };
146
+
147
+ // src/components/Modal/Modal.tsx
148
+ var import_ui3 = require("@ttoss/ui");
149
+ var import_react_modal = __toESM(require("react-modal"));
150
+ import_react_modal.default.defaultStyles = {
151
+ overlay: {},
152
+ content: {}
153
+ };
154
+ var Modal = (props) => {
155
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i;
156
+ const { theme } = (0, import_ui3.useTheme)();
157
+ const padding = (0, import_ui3.useResponsiveValue)([
158
+ (_a = theme.space) == null ? void 0 : _a[2],
159
+ (_b = theme.space) == null ? void 0 : _b[3],
160
+ (_c = theme.space) == null ? void 0 : _c[4]
161
+ ]) || 0;
162
+ const style = {
163
+ overlay: {
164
+ position: "fixed",
165
+ top: 0,
166
+ left: 0,
167
+ right: 0,
168
+ bottom: 0,
169
+ backgroundColor: "rgba(255, 255, 255, 0.5)",
170
+ display: "flex",
171
+ justifyContent: "center",
172
+ alignItems: "center",
173
+ padding,
174
+ ...(_d = props.style) == null ? void 0 : _d.overlay
175
+ },
176
+ content: {
177
+ backgroundColor: ((_f = (_e = theme.rawColors) == null ? void 0 : _e.background) == null ? void 0 : _f.toString()) || "#fff",
178
+ padding,
179
+ WebkitOverflowScrolling: "touch",
180
+ overflow: "auto",
181
+ position: "relative",
182
+ top: "0px",
183
+ left: "0px",
184
+ right: "0px",
185
+ bottom: "0px",
186
+ border: "2px solid",
187
+ borderColor: ((_h = (_g = theme.rawColors) == null ? void 0 : _g.muted) == null ? void 0 : _h.toString()) || "#fff",
188
+ display: "flex",
189
+ flexDirection: "column",
190
+ alignItems: "center",
191
+ ...(_i = props.style) == null ? void 0 : _i.content
192
+ }
193
+ };
194
+ return /* @__PURE__ */ React.createElement(import_react_modal.default, {
195
+ ...props,
196
+ style
197
+ });
198
+ };
199
+ Modal.setAppElement = import_react_modal.default.setAppElement;
200
+
201
+ // src/components/Toast/Toast.tsx
202
+ var React4 = __toESM(require("react"));
203
+ var import_ui4 = require("@ttoss/ui");
204
+ var import_react_toastify = require("react-toastify");
205
+ var import_inject_style = require("react-toastify/dist/inject-style");
206
+ var ToastContainer = (props) => {
207
+ React4.useEffect(() => {
208
+ (0, import_inject_style.injectStyle)();
209
+ }, []);
210
+ return /* @__PURE__ */ React4.createElement(import_ui4.Box, {
211
+ sx: ({ colors, fonts }) => ({
212
+ "--toastify-color-light": "#fff",
213
+ "--toastify-color-dark": "#121212",
214
+ "--toastify-color-info": (colors == null ? void 0 : colors.info) || "#3498db",
215
+ "--toastify-color-success": (colors == null ? void 0 : colors.success) || "#07bc0c",
216
+ "--toastify-color-warning": "#f1c40f",
217
+ "--toastify-color-error": "#e74c3c",
218
+ "--toastify-color-progress-light": `linear-gradient(to right, ${colors == null ? void 0 : colors.primary}, ${colors == null ? void 0 : colors.secondary})`,
219
+ "--toastify-font-family": fonts.body
220
+ })
221
+ }, /* @__PURE__ */ React4.createElement(import_react_toastify.ToastContainer, {
222
+ ...props
223
+ }));
224
+ };
225
+ // Annotate the CommonJS export names for ESM import in node:
226
+ 0 && (module.exports = {
227
+ Accordion,
228
+ InstallPwa,
229
+ Modal,
230
+ ToastContainer,
231
+ ToastContainerProps,
232
+ toast
233
+ });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ttoss/components",
3
- "version": "1.21.7",
3
+ "version": "1.21.9",
4
4
  "description": "React components.",
5
5
  "license": "UNLICENSED",
6
6
  "author": "ttoss",
@@ -34,7 +34,7 @@
34
34
  "devDependencies": {
35
35
  "@ttoss/config": "^1.18.3",
36
36
  "@ttoss/test-utils": "^1.16.10",
37
- "@ttoss/ui": "^1.20.4",
37
+ "@ttoss/ui": "^1.21.1",
38
38
  "@types/jest": "^28.1.5",
39
39
  "jest": "^28.1.3"
40
40
  },
@@ -45,5 +45,5 @@
45
45
  "publishConfig": {
46
46
  "access": "public"
47
47
  },
48
- "gitHead": "b9f9de9b8389be76965f125b593166f10c2171e6"
48
+ "gitHead": "3879642eff43efd073abf52595ed0efe7196946a"
49
49
  }