@koine/react 2.0.0-alpha.1 → 2.0.0-alpha.2
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/Alert/Alert.d.ts +1 -1
- package/Animations/Reveal.d.ts +1 -1
- package/Animations/Reveal.js +1 -1
- package/Animations/Reveal.mjs +1 -1
- package/Animations/useReveal.d.ts +1 -0
- package/Autocomplete/AutocompleteMui.d.ts +3 -3
- package/Autocomplete/AutocompleteMui.js +7 -7
- package/Autocomplete/AutocompleteMui.mjs +6 -6
- package/Bg/BgColor.d.ts +1 -1
- package/Bg/BgColor.js +1 -1
- package/Bg/BgColor.mjs +1 -1
- package/Bg/BgPhoto.d.ts +1 -1
- package/Bg/BgPhoto.js +1 -1
- package/Bg/BgPhoto.mjs +1 -1
- package/Bg/BgSvg.d.ts +1 -1
- package/Bg/BgSvg.js +1 -1
- package/Bg/BgSvg.mjs +2 -2
- package/Breadcrumbs/Breadcrumbs.d.ts +1 -1
- package/Breadcrumbs/Breadcrumbs.js +2 -2
- package/Breadcrumbs/Breadcrumbs.mjs +2 -2
- package/Buttons/ButtonComposite.d.ts +1 -1
- package/Buttons/ButtonComposite.js +1 -1
- package/Buttons/ButtonComposite.mjs +1 -1
- package/Buttons/ButtonLink.d.ts +1 -1
- package/Calendar/CalendarDaygridCell.d.ts +1 -1
- package/Calendar/CalendarDaygridCell.js +3 -3
- package/Calendar/CalendarDaygridCell.mjs +3 -3
- package/Calendar/CalendarDaygridNav.d.ts +1 -1
- package/Calendar/CalendarDaygridTable.d.ts +1 -1
- package/Calendar/CalendarDaygridTable.js +2 -11
- package/Calendar/CalendarDaygridTable.mjs +2 -11
- package/Calendar/CalendarLegend.d.ts +1 -1
- package/Calendar/CalendarLegend.js +1 -2
- package/Calendar/CalendarLegend.mjs +1 -2
- package/Calendar/useCalendar.d.ts +1 -0
- package/Carousel/CarouselCss.d.ts +1 -1
- package/Carousel/CarouselCss.js +1 -1
- package/Carousel/CarouselCss.mjs +1 -1
- package/Debug/Debug.d.ts +1 -1
- package/Details/Details.d.ts +11 -1
- package/Details/Details.js +3 -3
- package/Details/Details.mjs +3 -3
- package/Dialog/DialogMui.d.ts +54 -13
- package/Dialog/DialogMui.js +3 -3
- package/Dialog/DialogMui.mjs +2 -2
- package/Dialog/css/bare.d.ts +54 -12
- package/Dialog/m/bare.d.ts +54 -11
- package/Dialog/m/bare.js +2 -2
- package/Dialog/m/bare.mjs +2 -2
- package/Dialog/m/index.d.ts +1 -0
- package/Dialog/sc/bare.d.ts +54 -12
- package/Dialog/sc/framer.d.ts +54 -11
- package/Dialog/sc/framerMaterial.d.ts +54 -11
- package/Dialog/sc/material.d.ts +54 -12
- package/Dialog/tw/bare.d.ts +54 -12
- package/Dialog/tw/elegant.d.ts +54 -12
- package/Dialog/tw/framer.d.ts +54 -11
- package/Dialog/tw/framerMaterial.d.ts +54 -11
- package/Dialog/tw/material.d.ts +54 -12
- package/Editor/Editor--tiptap.d.ts +2 -2
- package/Editor/Editor--tiptap.js +3 -3
- package/Editor/Editor--tiptap.mjs +3 -3
- package/FaviconTags/FaviconTags.d.ts +1 -1
- package/FaviconTags/index.d.ts +1 -1
- package/FaviconTags/index.js +4 -4
- package/FaviconTags/index.mjs +1 -1
- package/Form/Form.d.ts +1 -1
- package/Form/sc/bare.d.ts +7 -7
- package/Forms/Checkbox/Checkbox.d.ts +1 -1
- package/Forms/Feedback/Feedback.d.ts +1 -1
- package/Forms/Feedback/Feedback.js +1 -1
- package/Forms/Feedback/Feedback.mjs +2 -2
- package/Forms/Field/Field.d.ts +1 -1
- package/Forms/Field/Field.js +1 -1
- package/Forms/Field/Field.mjs +1 -1
- package/Forms/Field/FieldControl.d.ts +1 -1
- package/Forms/InputGroup/InputGroup.d.ts +1 -1
- package/Forms/Password/Password.js +1 -1
- package/Forms/Password/Password.mjs +1 -1
- package/Forms/Toggle/Toggle.d.ts +2 -2
- package/Forms/Toggle/Toggle.js +2 -2
- package/Forms/Toggle/Toggle.mjs +3 -3
- package/Forms/Toggle/useToggle.d.ts +1 -1
- package/Forms/antispam.d.ts +4 -4
- package/Forms/styles.d.ts +1 -1
- package/Hamburger/Hamburger.d.ts +1 -1
- package/Hamburger/Hamburger.js +1 -1
- package/Hamburger/Hamburger.mjs +1 -1
- package/Link/LinkBlank.d.ts +2 -2
- package/MenuItem/useMenuItem.d.ts +2 -4
- package/MenuItem/useMenuItem.js +16 -14
- package/MenuItem/useMenuItem.mjs +17 -15
- package/Meta/Meta.d.ts +1 -1
- package/NoJs/NoJs.d.ts +1 -1
- package/Pagination/PaginationNav.d.ts +1 -1
- package/Pagination/PaginationNav.js +5 -5
- package/Pagination/PaginationNav.mjs +6 -6
- package/Pagination/PaginationResults.d.ts +1 -1
- package/Pagination/PaginationResults.js +1 -1
- package/Pagination/PaginationResults.mjs +2 -2
- package/Progress/ProgressCircular.d.ts +1 -1
- package/Progress/ProgressLinear.d.ts +1 -1
- package/Progress/ProgressOverlay.d.ts +1 -1
- package/Progress/ProgressOverlay.js +3 -3
- package/Progress/ProgressOverlay.mjs +4 -4
- package/Rating/Rating.d.ts +2 -2
- package/Rating/Rating.js +1 -1
- package/Rating/Rating.mjs +1 -1
- package/Sidebar/Sidebar.d.ts +1 -1
- package/Sidebar/Sidebar.js +1 -1
- package/Sidebar/Sidebar.mjs +2 -2
- package/Spacing/Spacing.d.ts +1 -1
- package/Sticky/StickyCss.d.ts +1 -1
- package/Sticky/index.d.ts +1 -1
- package/Sticky/index.js +3 -2
- package/Sticky/index.mjs +1 -1
- package/Tabs/TabsMui.d.ts +46 -41
- package/Tabs/TabsMui.js +14 -11
- package/Tabs/TabsMui.mjs +10 -7
- package/Tabs/tw/bare.d.ts +40 -36
- package/Tabs/tw/material.d.ts +52 -54
- package/Typography/ReadMore.d.ts +1 -1
- package/Typography/ReadMore.js +1 -1
- package/Typography/ReadMore.mjs +1 -1
- package/Typography/TextLoop.d.ts +2 -2
- package/Typography/TextLoop.js +3 -3
- package/Typography/TextLoop.mjs +3 -3
- package/Typography/TypeStairs.js +1 -2
- package/Typography/TypeStairs.mjs +1 -2
- package/hooks/useFocus.d.ts +1 -0
- package/m/MotionProvider.d.ts +1 -1
- package/m/MotionProvider.js +1 -2
- package/m/MotionProvider.mjs +1 -2
- package/package.json +14 -18
- package/styles/index.d.ts +7 -7
- package/styles/index.js +39 -8
- package/styles/index.mjs +7 -7
- package/styles/styled.d.ts +1 -1
- package/styles/styled.js +2 -2
- package/styles/styled.mjs +2 -2
- package/styles/theme--vanilla.d.ts +1 -1
- package/styles/theme--vanilla.js +1 -1
- package/styles/theme--vanilla.mjs +1 -2
- package/typings.d.ts +6 -6
- package/hooks/useEffectOnce.d.ts +0 -6
- package/hooks/useEffectOnce.js +0 -13
- package/hooks/useEffectOnce.mjs +0 -9
- package/hooks/useMount.d.ts +0 -5
- package/hooks/useMount.js +0 -14
- package/hooks/useMount.mjs +0 -10
package/Alert/Alert.d.ts
CHANGED
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
export type AlertProps = React.PropsWithChildren<{
|
|
3
3
|
$danger?: boolean;
|
|
4
4
|
}>;
|
|
5
|
-
export declare const Alert: ({ $danger, children, ...props }: AlertProps) => JSX.Element;
|
|
5
|
+
export declare const Alert: ({ $danger, children, ...props }: AlertProps) => import("react/jsx-runtime").JSX.Element;
|
package/Animations/Reveal.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { UseRevealOptions } from "./useReveal";
|
|
3
3
|
export type RevealProps = React.PropsWithChildren<UseRevealOptions>;
|
|
4
|
-
export declare const Reveal: ({ children, direction, offsetStartY, offsetEndY, offsetStartX, ...props }: RevealProps) => JSX.Element;
|
|
4
|
+
export declare const Reveal: ({ children, direction, offsetStartY, offsetEndY, offsetStartX, ...props }: RevealProps) => import("react/jsx-runtime").JSX.Element;
|
package/Animations/Reveal.js
CHANGED
|
@@ -16,6 +16,6 @@ var Reveal = function (_a) {
|
|
|
16
16
|
var x = (0, framer_motion_1.useSpring)(xRange, { stiffness: 400, damping: 90 });
|
|
17
17
|
var opacity = (0, framer_motion_1.useSpring)(opacityRange);
|
|
18
18
|
// console.log("start, end", startY, endY)
|
|
19
|
-
return ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, tslib_1.__assign({}, props, { ref: ref, style: prefersReducedMotion ? {} : { x: x, opacity: opacity }
|
|
19
|
+
return ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, tslib_1.__assign({}, props, { ref: ref, style: prefersReducedMotion ? {} : { x: x, opacity: opacity }, children: children })));
|
|
20
20
|
};
|
|
21
21
|
exports.Reveal = Reveal;
|
package/Animations/Reveal.mjs
CHANGED
|
@@ -13,5 +13,5 @@ export var Reveal = function (_a) {
|
|
|
13
13
|
var x = useSpring(xRange, { stiffness: 400, damping: 90 });
|
|
14
14
|
var opacity = useSpring(opacityRange);
|
|
15
15
|
// console.log("start, end", startY, endY)
|
|
16
|
-
return (_jsx(motion.div, __assign({}, props, { ref: ref, style: prefersReducedMotion ? {} : { x: x, opacity: opacity }
|
|
16
|
+
return (_jsx(motion.div, __assign({}, props, { ref: ref, style: prefersReducedMotion ? {} : { x: x, opacity: opacity }, children: children })));
|
|
17
17
|
};
|
|
@@ -20,7 +20,7 @@ export type AutocompleteProps<TOption extends AutocompleteOption, TValue extends
|
|
|
20
20
|
$ref?: React.ForwardedRef<HTMLInputElement>;
|
|
21
21
|
};
|
|
22
22
|
/**
|
|
23
|
-
* Autocomplete/autocomplete component based on [`@mui useAutocomplete hook`](https://mui.com/components/autocomplete/#useautocomplete).
|
|
23
|
+
* Autocomplete/autocomplete component based on [`@mui useAutocomplete hook`](https://mui.com/components/autocomplete/#useautocomplete/useAutocomplete).
|
|
24
24
|
*
|
|
25
25
|
* This component is design to work out of the box with [`react-hook-form`](https://react-hook-form.com/)
|
|
26
26
|
* and [`yup`](https://github.com/jquense/yup) alongside our custom `Field`
|
|
@@ -30,7 +30,7 @@ export type AutocompleteProps<TOption extends AutocompleteOption, TValue extends
|
|
|
30
30
|
* the best headless hook, small in size and behaving correctly in all scenarios.
|
|
31
31
|
* `downshift` had in fact problems treating the initial `defaultValue` which
|
|
32
32
|
* here is elegantly managed by the `isOptionEqualToValue` option passed into
|
|
33
|
-
* the `useAutocomplete`
|
|
33
|
+
* the `useAutocomplete` hoo/useAutocompletek.
|
|
34
34
|
*
|
|
35
35
|
*
|
|
36
36
|
* Validation with `yup` and `react-hook-form` example:
|
|
@@ -44,4 +44,4 @@ export type AutocompleteProps<TOption extends AutocompleteOption, TValue extends
|
|
|
44
44
|
* }).required();
|
|
45
45
|
* ```
|
|
46
46
|
*/
|
|
47
|
-
export declare const Autocomplete: <TOption extends AutocompleteOption = AutocompleteOption, TValue extends string | string[] | Option | Option[] | null = string | string[] | Option | Option[] | null>({ creatable, multiple, autoComplete, loadOptions, options: defaultOptions, defaultValue, value: controlledValue, defaultInputValue, label, placeholder, register, setValue, name, onChange, $ref, children, ...props }: AutocompleteProps<TOption, TValue>) => JSX.Element;
|
|
47
|
+
export declare const Autocomplete: <TOption extends AutocompleteOption = AutocompleteOption, TValue extends string | string[] | Option | Option[] | null = string | string[] | Option | Option[] | null>({ creatable, multiple, autoComplete, loadOptions, options: defaultOptions, defaultValue, value: controlledValue, defaultInputValue, label, placeholder, register, setValue, name, onChange, $ref, children, ...props }: AutocompleteProps<TOption, TValue>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -4,14 +4,14 @@ exports.Autocomplete = void 0;
|
|
|
4
4
|
var tslib_1 = require("tslib");
|
|
5
5
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
var react_1 = require("react");
|
|
7
|
-
var
|
|
7
|
+
var useAutocomplete_1 = tslib_1.__importDefault(require("@mui/base/useAutocomplete"));
|
|
8
8
|
var isString_1 = tslib_1.__importDefault(require("@koine/utils/isString"));
|
|
9
9
|
var helpers_1 = require("../Forms/helpers");
|
|
10
10
|
var helpers_2 = require("./helpers");
|
|
11
11
|
var components_1 = require("./components");
|
|
12
12
|
var styles_1 = require("../Forms/styles");
|
|
13
13
|
/**
|
|
14
|
-
* Autocomplete/autocomplete component based on [`@mui useAutocomplete hook`](https://mui.com/components/autocomplete/#useautocomplete).
|
|
14
|
+
* Autocomplete/autocomplete component based on [`@mui useAutocomplete hook`](https://mui.com/components/autocomplete/#useautocomplete/useAutocomplete).
|
|
15
15
|
*
|
|
16
16
|
* This component is design to work out of the box with [`react-hook-form`](https://react-hook-form.com/)
|
|
17
17
|
* and [`yup`](https://github.com/jquense/yup) alongside our custom `Field`
|
|
@@ -21,7 +21,7 @@ var styles_1 = require("../Forms/styles");
|
|
|
21
21
|
* the best headless hook, small in size and behaving correctly in all scenarios.
|
|
22
22
|
* `downshift` had in fact problems treating the initial `defaultValue` which
|
|
23
23
|
* here is elegantly managed by the `isOptionEqualToValue` option passed into
|
|
24
|
-
* the `useAutocomplete`
|
|
24
|
+
* the `useAutocomplete` hoo/useAutocompletek.
|
|
25
25
|
*
|
|
26
26
|
*
|
|
27
27
|
* Validation with `yup` and `react-hook-form` example:
|
|
@@ -65,7 +65,7 @@ var Autocomplete = function (_a) {
|
|
|
65
65
|
var defaultOptionsMemo = (0, react_1.useMemo)(function () { return (0, helpers_1.normaliseOptions)(defaultOptions); }, [defaultOptions]);
|
|
66
66
|
var _c = (0, react_1.useState)(defaultOptionsMemo), options = _c[0], setOptions = _c[1];
|
|
67
67
|
var _d = (0, react_1.useState)(false), loading = _d[0], setLoading = _d[1];
|
|
68
|
-
var _e = (0,
|
|
68
|
+
var _e = (0, useAutocomplete_1.default)({
|
|
69
69
|
id: "Autocomplete",
|
|
70
70
|
multiple: multiple ? true : undefined,
|
|
71
71
|
freeSolo: creatable ? true : undefined,
|
|
@@ -168,13 +168,13 @@ var Autocomplete = function (_a) {
|
|
|
168
168
|
// inputProps.ref.current.focus();
|
|
169
169
|
// }
|
|
170
170
|
// }, [errors, name, inputProps.ref]);
|
|
171
|
-
return ((0, jsx_runtime_1.jsxs)(components_1.AutocompleteRoot, { children: [label && ((0, jsx_runtime_1.jsx)(components_1.AutocompleteLabel, tslib_1.__assign({}, getInputLabelProps(), { children: label }))), (0, jsx_runtime_1.jsxs)(components_1.AutocompleteWrap, tslib_1.__assign({}, getRootProps(), { "data-focus": focused
|
|
171
|
+
return ((0, jsx_runtime_1.jsxs)(components_1.AutocompleteRoot, { children: [label && ((0, jsx_runtime_1.jsx)(components_1.AutocompleteLabel, tslib_1.__assign({}, getInputLabelProps(), { children: label }))), (0, jsx_runtime_1.jsxs)(components_1.AutocompleteWrap, tslib_1.__assign({}, getRootProps(), { "data-focus": focused, children: [(0, jsx_runtime_1.jsxs)(components_1.AutocompleteInner, { ref: setAnchorEl, children: [multiple &&
|
|
172
172
|
value.map(function (valueItem, index) {
|
|
173
173
|
var _a = getTagProps({ index: index }), onDelete = _a.onDelete, key = _a.key, tagProps = tslib_1.__rest(_a, ["onDelete", "key"]);
|
|
174
174
|
return ((0, jsx_runtime_1.jsxs)(components_1.AutocompleteItem, tslib_1.__assign({}, tagProps, { children: [(0, jsx_runtime_1.jsx)(components_1.AutocompleteItemLabel, { children: (0, isString_1.default)(valueItem)
|
|
175
175
|
? valueItem
|
|
176
|
-
: valueItem.Label || valueItem.label }), (0, jsx_runtime_1.jsx)(components_1.AutocompleteItemRemove,
|
|
177
|
-
}), (0, jsx_runtime_1.jsx)(components_1.AutocompleteInput, tslib_1.__assign({}, inputProps(), { placeholder: placeholder }))] })
|
|
176
|
+
: valueItem.Label || valueItem.label }), (0, jsx_runtime_1.jsx)(components_1.AutocompleteItemRemove, { onClick: onDelete, children: "\u2715" })] }), key));
|
|
177
|
+
}), (0, jsx_runtime_1.jsx)(components_1.AutocompleteInput, tslib_1.__assign({}, inputProps(), { placeholder: placeholder }))] }), !!options.length && ((0, jsx_runtime_1.jsx)(components_1.AutocompleteInputArrow, tslib_1.__assign({}, getPopupIndicatorProps(), { isOpen: popupOpen }))), loading && (0, jsx_runtime_1.jsx)(styles_1.InputProgress, {})] })), groupedOptions.length ? ((0, jsx_runtime_1.jsx)(components_1.AutocompleteMenu, tslib_1.__assign({}, getListboxProps(), { children: groupedOptions.map(function (option, index) { return ((0, jsx_runtime_1.jsx)(components_1.AutocompleteMenuItem, tslib_1.__assign({}, getOptionProps({ option: option, index: index }), { children: (0, isString_1.default)(option) ? option : option.Label || option.label }), index)); }) }))) : null, children] }));
|
|
178
178
|
// });
|
|
179
179
|
};
|
|
180
180
|
exports.Autocomplete = Autocomplete;
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import {
|
|
4
4
|
// forwardRef,
|
|
5
5
|
useCallback, useMemo, useState, } from "react";
|
|
6
|
-
import
|
|
6
|
+
import useAutocomplete from "@mui/base/useAutocomplete";
|
|
7
7
|
import isString from "@koine/utils/isString";
|
|
8
8
|
import {
|
|
9
9
|
// triggerOnChange,
|
|
@@ -14,7 +14,7 @@ import { AutocompleteRoot, AutocompleteLabel, AutocompleteWrap, AutocompleteInne
|
|
|
14
14
|
AutocompleteInput, AutocompleteInputArrow, AutocompleteMenu, AutocompleteMenuItem, } from "./components";
|
|
15
15
|
import { InputProgress } from "../Forms/styles";
|
|
16
16
|
/**
|
|
17
|
-
* Autocomplete/autocomplete component based on [`@mui useAutocomplete hook`](https://mui.com/components/autocomplete/#useautocomplete).
|
|
17
|
+
* Autocomplete/autocomplete component based on [`@mui useAutocomplete hook`](https://mui.com/components/autocomplete/#useautocomplete/useAutocomplete).
|
|
18
18
|
*
|
|
19
19
|
* This component is design to work out of the box with [`react-hook-form`](https://react-hook-form.com/)
|
|
20
20
|
* and [`yup`](https://github.com/jquense/yup) alongside our custom `Field`
|
|
@@ -24,7 +24,7 @@ import { InputProgress } from "../Forms/styles";
|
|
|
24
24
|
* the best headless hook, small in size and behaving correctly in all scenarios.
|
|
25
25
|
* `downshift` had in fact problems treating the initial `defaultValue` which
|
|
26
26
|
* here is elegantly managed by the `isOptionEqualToValue` option passed into
|
|
27
|
-
* the `useAutocomplete`
|
|
27
|
+
* the `useAutocomplete` hoo/useAutocompletek.
|
|
28
28
|
*
|
|
29
29
|
*
|
|
30
30
|
* Validation with `yup` and `react-hook-form` example:
|
|
@@ -171,12 +171,12 @@ export var Autocomplete = function (_a) {
|
|
|
171
171
|
// inputProps.ref.current.focus();
|
|
172
172
|
// }
|
|
173
173
|
// }, [errors, name, inputProps.ref]);
|
|
174
|
-
return (_jsxs(AutocompleteRoot, { children: [label && (_jsx(AutocompleteLabel, __assign({}, getInputLabelProps(), { children: label }))), _jsxs(AutocompleteWrap, __assign({}, getRootProps(), { "data-focus": focused
|
|
174
|
+
return (_jsxs(AutocompleteRoot, { children: [label && (_jsx(AutocompleteLabel, __assign({}, getInputLabelProps(), { children: label }))), _jsxs(AutocompleteWrap, __assign({}, getRootProps(), { "data-focus": focused, children: [_jsxs(AutocompleteInner, { ref: setAnchorEl, children: [multiple &&
|
|
175
175
|
value.map(function (valueItem, index) {
|
|
176
176
|
var _a = getTagProps({ index: index }), onDelete = _a.onDelete, key = _a.key, tagProps = __rest(_a, ["onDelete", "key"]);
|
|
177
177
|
return (_jsxs(AutocompleteItem, __assign({}, tagProps, { children: [_jsx(AutocompleteItemLabel, { children: isString(valueItem)
|
|
178
178
|
? valueItem
|
|
179
|
-
: valueItem.Label || valueItem.label }), _jsx(AutocompleteItemRemove,
|
|
180
|
-
}), _jsx(AutocompleteInput, __assign({}, inputProps(), { placeholder: placeholder }))] })
|
|
179
|
+
: valueItem.Label || valueItem.label }), _jsx(AutocompleteItemRemove, { onClick: onDelete, children: "\u2715" })] }), key));
|
|
180
|
+
}), _jsx(AutocompleteInput, __assign({}, inputProps(), { placeholder: placeholder }))] }), !!options.length && (_jsx(AutocompleteInputArrow, __assign({}, getPopupIndicatorProps(), { isOpen: popupOpen }))), loading && _jsx(InputProgress, {})] })), groupedOptions.length ? (_jsx(AutocompleteMenu, __assign({}, getListboxProps(), { children: groupedOptions.map(function (option, index) { return (_jsx(AutocompleteMenuItem, __assign({}, getOptionProps({ option: option, index: index }), { children: isString(option) ? option : option.Label || option.label }), index)); }) }))) : null, children] }));
|
|
181
181
|
// });
|
|
182
182
|
};
|
package/Bg/BgColor.d.ts
CHANGED
|
@@ -33,4 +33,4 @@ export type BgContainerProps = ContainerProps & {
|
|
|
33
33
|
*/
|
|
34
34
|
perspective?: number;
|
|
35
35
|
};
|
|
36
|
-
export declare const BgContainer: ({ color, skewY, rotate, scaleY, scaleX, perspective, ...containerProps }: BgContainerProps) => JSX.Element;
|
|
36
|
+
export declare const BgContainer: ({ color, skewY, rotate, scaleY, scaleX, perspective, ...containerProps }: BgContainerProps) => import("react/jsx-runtime").JSX.Element;
|
package/Bg/BgColor.js
CHANGED
|
@@ -19,7 +19,7 @@ var BgContainer = function (_a) {
|
|
|
19
19
|
if (skewY || rotate) {
|
|
20
20
|
$transform = "perspective(".concat(perspective, "vw) rotateY(").concat(rotate, "deg) skewY(").concat(skewY, "deg) scaleY(").concat(scaleY, ") scaleX(").concat(scaleX, ")");
|
|
21
21
|
}
|
|
22
|
-
return $transform ? ((0, jsx_runtime_1.jsx)(exports.BgColorSkewed,
|
|
22
|
+
return $transform ? ((0, jsx_runtime_1.jsx)(exports.BgColorSkewed, { "$bg": color, "$transform": $transform, children: (0, jsx_runtime_1.jsx)(Grid_1.Container, tslib_1.__assign({ style: { position: "relative" } }, containerProps)) })) : ((0, jsx_runtime_1.jsx)(exports.BgColor, { "$bg": color, children: (0, jsx_runtime_1.jsx)(Grid_1.Container, tslib_1.__assign({}, containerProps)) }));
|
|
23
23
|
};
|
|
24
24
|
exports.BgContainer = BgContainer;
|
|
25
25
|
var templateObject_1, templateObject_2;
|
package/Bg/BgColor.mjs
CHANGED
|
@@ -16,6 +16,6 @@ export var BgContainer = function (_a) {
|
|
|
16
16
|
if (skewY || rotate) {
|
|
17
17
|
$transform = "perspective(".concat(perspective, "vw) rotateY(").concat(rotate, "deg) skewY(").concat(skewY, "deg) scaleY(").concat(scaleY, ") scaleX(").concat(scaleX, ")");
|
|
18
18
|
}
|
|
19
|
-
return $transform ? (_jsx(BgColorSkewed,
|
|
19
|
+
return $transform ? (_jsx(BgColorSkewed, { "$bg": color, "$transform": $transform, children: _jsx(Container, __assign({ style: { position: "relative" } }, containerProps)) })) : (_jsx(BgColor, { "$bg": color, children: _jsx(Container, __assign({}, containerProps)) }));
|
|
20
20
|
};
|
|
21
21
|
var templateObject_1, templateObject_2;
|
package/Bg/BgPhoto.d.ts
CHANGED
|
@@ -10,4 +10,4 @@ export type BgPhotoProps = {
|
|
|
10
10
|
*/
|
|
11
11
|
$overlap?: number;
|
|
12
12
|
};
|
|
13
|
-
export declare const BgPhoto: ({ src, containerSize, $overlap, }: BgPhotoProps) => JSX.Element;
|
|
13
|
+
export declare const BgPhoto: ({ src, containerSize, $overlap, }: BgPhotoProps) => import("react/jsx-runtime").JSX.Element;
|
package/Bg/BgPhoto.js
CHANGED
|
@@ -14,7 +14,7 @@ var BgPhotoMask = (0, styled_components_1.default)(Grid_1.Container)(templateObj
|
|
|
14
14
|
var BgPhoto = function (_a) {
|
|
15
15
|
var src = _a.src, _b = _a.containerSize, containerSize = _b === void 0 ? "xl" : _b, _c = _a.$overlap, $overlap = _c === void 0 ? 0 : _c;
|
|
16
16
|
var styledProps = { containerSize: containerSize, $overlap: $overlap };
|
|
17
|
-
return ((0, jsx_runtime_1.jsx)(BgPhotoWrap,
|
|
17
|
+
return ((0, jsx_runtime_1.jsx)(BgPhotoWrap, { style: { backgroundImage: "url(".concat(src, ")") }, "$max": "xxl", children: (0, jsx_runtime_1.jsx)(BgPhotoMask, tslib_1.__assign({ size: containerSize }, styledProps)) }));
|
|
18
18
|
};
|
|
19
19
|
exports.BgPhoto = BgPhoto;
|
|
20
20
|
var templateObject_1, templateObject_2;
|
package/Bg/BgPhoto.mjs
CHANGED
|
@@ -11,6 +11,6 @@ var BgPhotoMask = styled(Container)(templateObject_2 || (templateObject_2 = __ma
|
|
|
11
11
|
export var BgPhoto = function (_a) {
|
|
12
12
|
var src = _a.src, _b = _a.containerSize, containerSize = _b === void 0 ? "xl" : _b, _c = _a.$overlap, $overlap = _c === void 0 ? 0 : _c;
|
|
13
13
|
var styledProps = { containerSize: containerSize, $overlap: $overlap };
|
|
14
|
-
return (_jsx(BgPhotoWrap,
|
|
14
|
+
return (_jsx(BgPhotoWrap, { style: { backgroundImage: "url(".concat(src, ")") }, "$max": "xxl", children: _jsx(BgPhotoMask, __assign({ size: containerSize }, styledProps)) }));
|
|
15
15
|
};
|
|
16
16
|
var templateObject_1, templateObject_2;
|
package/Bg/BgSvg.d.ts
CHANGED
package/Bg/BgSvg.js
CHANGED
|
@@ -10,7 +10,7 @@ var Root = styled_components_1.default.svg(templateObject_1 || (templateObject_1
|
|
|
10
10
|
*/
|
|
11
11
|
var BgSvg = function (_a) {
|
|
12
12
|
var color = _a.color;
|
|
13
|
-
return ((0, jsx_runtime_1.jsx)(Root,
|
|
13
|
+
return ((0, jsx_runtime_1.jsx)(Root, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 1200 120", preserveAspectRatio: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M1200 0L0 0 598.97 114.72 1200 0z", fill: color }) }));
|
|
14
14
|
};
|
|
15
15
|
exports.BgSvg = BgSvg;
|
|
16
16
|
var templateObject_1;
|
package/Bg/BgSvg.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { __makeTemplateObject } from "tslib";
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import styled from "styled-components";
|
|
4
4
|
var Root = styled.svg(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: fixed;\n z-index: -2;\n bottom: 0;\n transform: rotate(180deg);\n opacity: 0.9;\n"], ["\n position: fixed;\n z-index: -2;\n bottom: 0;\n transform: rotate(180deg);\n opacity: 0.9;\n"])));
|
|
@@ -7,6 +7,6 @@ var Root = styled.svg(templateObject_1 || (templateObject_1 = __makeTemplateObje
|
|
|
7
7
|
*/
|
|
8
8
|
export var BgSvg = function (_a) {
|
|
9
9
|
var color = _a.color;
|
|
10
|
-
return (_jsx(Root,
|
|
10
|
+
return (_jsx(Root, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 1200 120", preserveAspectRatio: "none", children: _jsx("path", { d: "M1200 0L0 0 598.97 114.72 1200 0z", fill: color }) }));
|
|
11
11
|
};
|
|
12
12
|
var templateObject_1;
|
|
@@ -9,5 +9,5 @@ export type KoineBreadcrumbsProps = {
|
|
|
9
9
|
type BreadcrumbsProps = KoineComponentProps<KoineBreadcrumbsProps, {
|
|
10
10
|
Link: KoineComponent;
|
|
11
11
|
}>;
|
|
12
|
-
export declare const KoineBreadcrumbs: ({ items, Link, ...props }: BreadcrumbsProps) => JSX.Element | null;
|
|
12
|
+
export declare const KoineBreadcrumbs: ({ items, Link, ...props }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
13
13
|
export {};
|
|
@@ -21,11 +21,11 @@ var KoineBreadcrumbs = function (_a) {
|
|
|
21
21
|
if (!items.length) {
|
|
22
22
|
return null;
|
|
23
23
|
}
|
|
24
|
-
return ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({}, props, { children: (0, jsx_runtime_1.jsx)(Inner, { children: items.map(function (item, idx) { return ((0, jsx_runtime_1.jsxs)(Item,
|
|
24
|
+
return ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({}, props, { children: (0, jsx_runtime_1.jsx)(Inner, { children: items.map(function (item, idx) { return ((0, jsx_runtime_1.jsxs)(Item, { initial: { opacity: 0, x: 20 }, animate: {
|
|
25
25
|
opacity: 1,
|
|
26
26
|
x: 0,
|
|
27
27
|
transition: { delay: idx * 0.2 },
|
|
28
|
-
}
|
|
28
|
+
}, children: [item.url && ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: item.url, children: (0, titleCase_1.default)(item.title) })), !item.url && (0, jsx_runtime_1.jsx)(ItemCurrent, { children: (0, titleCase_1.default)(item.title) }), idx < items.length - 1 && (0, jsx_runtime_1.jsx)(ItemSeparator, {})] }, idx)); }) }) })));
|
|
29
29
|
};
|
|
30
30
|
exports.KoineBreadcrumbs = KoineBreadcrumbs;
|
|
31
31
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
@@ -18,10 +18,10 @@ export var KoineBreadcrumbs = function (_a) {
|
|
|
18
18
|
if (!items.length) {
|
|
19
19
|
return null;
|
|
20
20
|
}
|
|
21
|
-
return (_jsx(Root, __assign({}, props, { children: _jsx(Inner, { children: items.map(function (item, idx) { return (_jsxs(Item,
|
|
21
|
+
return (_jsx(Root, __assign({}, props, { children: _jsx(Inner, { children: items.map(function (item, idx) { return (_jsxs(Item, { initial: { opacity: 0, x: 20 }, animate: {
|
|
22
22
|
opacity: 1,
|
|
23
23
|
x: 0,
|
|
24
24
|
transition: { delay: idx * 0.2 },
|
|
25
|
-
}
|
|
25
|
+
}, children: [item.url && (_jsx(ItemLink, { as: Link, href: item.url, children: titleCase(item.title) })), !item.url && _jsx(ItemCurrent, { children: titleCase(item.title) }), idx < items.length - 1 && _jsx(ItemSeparator, {})] }, idx)); }) }) })));
|
|
26
26
|
};
|
|
27
27
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
@@ -20,4 +20,4 @@ export type ButtonCompositeProps = KoineComponentProps<KoineButtonCompositeProps
|
|
|
20
20
|
Button?: KoineComponent;
|
|
21
21
|
ButtonLink?: KoineComponent;
|
|
22
22
|
}>;
|
|
23
|
-
export declare const KoineButtonComposite: ({ Icon, iconProps, textMain, textSub, textReverse, text, Button, ButtonLink, ...props }: ButtonCompositeProps) => JSX.Element;
|
|
23
|
+
export declare const KoineButtonComposite: ({ Icon, iconProps, textMain, textSub, textReverse, text, Button, ButtonLink, ...props }: ButtonCompositeProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -15,7 +15,7 @@ var Sub = styled_components_1.default.span(templateObject_5 || (templateObject_5
|
|
|
15
15
|
var Text = styled_components_1.default.span(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject([""], [""])));
|
|
16
16
|
var Inner = (0, react_1.memo)(function (_a) {
|
|
17
17
|
var textMain = _a.textMain, textSub = _a.textSub, text = _a.text, $reverse = _a.$reverse, $icon = _a.$icon;
|
|
18
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [$reverse ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [textSub && ((0, jsx_runtime_1.jsx)(Sub,
|
|
18
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [$reverse ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [textSub && ((0, jsx_runtime_1.jsx)(Sub, { "$icon": $icon, "$reverse": $reverse, children: textSub })), textMain && ((0, jsx_runtime_1.jsx)(Main, { "$icon": $icon, "$reverse": $reverse, children: textMain }))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [textMain && ((0, jsx_runtime_1.jsx)(Main, { "$icon": $icon, "$reverse": $reverse, children: textMain })), textSub && ((0, jsx_runtime_1.jsx)(Sub, { "$icon": $icon, "$reverse": $reverse, children: textSub }))] })), text && (0, jsx_runtime_1.jsx)(Text, { children: text })] }));
|
|
19
19
|
});
|
|
20
20
|
var KoineButtonComposite = function (_a) {
|
|
21
21
|
var Icon = _a.Icon, _b = _a.iconProps, iconProps = _b === void 0 ? {} : _b, textMain = _a.textMain, textSub = _a.textSub, textReverse = _a.textReverse, text = _a.text, _c = _a.Button, Button = _c === void 0 ? "button" : _c, _d = _a.ButtonLink, ButtonLink = _d === void 0 ? "a" : _d, props = tslib_1.__rest(_a, ["Icon", "iconProps", "textMain", "textSub", "textReverse", "text", "Button", "ButtonLink"]);
|
|
@@ -12,7 +12,7 @@ var Sub = styled.span(templateObject_5 || (templateObject_5 = __makeTemplateObje
|
|
|
12
12
|
var Text = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject([""], [""])));
|
|
13
13
|
var Inner = memo(function (_a) {
|
|
14
14
|
var textMain = _a.textMain, textSub = _a.textSub, text = _a.text, $reverse = _a.$reverse, $icon = _a.$icon;
|
|
15
|
-
return (_jsxs(_Fragment, { children: [$reverse ? (_jsxs(_Fragment, { children: [textSub && (_jsx(Sub,
|
|
15
|
+
return (_jsxs(_Fragment, { children: [$reverse ? (_jsxs(_Fragment, { children: [textSub && (_jsx(Sub, { "$icon": $icon, "$reverse": $reverse, children: textSub })), textMain && (_jsx(Main, { "$icon": $icon, "$reverse": $reverse, children: textMain }))] })) : (_jsxs(_Fragment, { children: [textMain && (_jsx(Main, { "$icon": $icon, "$reverse": $reverse, children: textMain })), textSub && (_jsx(Sub, { "$icon": $icon, "$reverse": $reverse, children: textSub }))] })), text && _jsx(Text, { children: text })] }));
|
|
16
16
|
});
|
|
17
17
|
export var KoineButtonComposite = function (_a) {
|
|
18
18
|
var Icon = _a.Icon, _b = _a.iconProps, iconProps = _b === void 0 ? {} : _b, textMain = _a.textMain, textSub = _a.textSub, textReverse = _a.textReverse, text = _a.text, _c = _a.Button, Button = _c === void 0 ? "button" : _c, _d = _a.ButtonLink, ButtonLink = _d === void 0 ? "a" : _d, props = __rest(_a, ["Icon", "iconProps", "textMain", "textSub", "textReverse", "text", "Button", "ButtonLink"]);
|
package/Buttons/ButtonLink.d.ts
CHANGED
|
@@ -5,4 +5,4 @@ export type KoineButtonLinkProps = KoineButtonUiProps & KoineLinkProps;
|
|
|
5
5
|
export type ButtonLinkProps = KoineComponentProps<KoineButtonLinkProps, {
|
|
6
6
|
Link?: KoineComponent;
|
|
7
7
|
}>;
|
|
8
|
-
export declare const KoineButtonLink: ({ href, Link, ...props }: React.PropsWithChildren<ButtonLinkProps>) => JSX.Element;
|
|
8
|
+
export declare const KoineButtonLink: ({ href, Link, ...props }: React.PropsWithChildren<ButtonLinkProps>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -33,4 +33,4 @@ export type CalendarDaygridCellComponents = {
|
|
|
33
33
|
CellEventStart?: KoineComponent;
|
|
34
34
|
};
|
|
35
35
|
export type CalendarDaygridCellProps = KoineComponentProps<KoineCalendarDaygridCellProps, CalendarDaygridCellComponents>;
|
|
36
|
-
export declare const CalendarDaygridCell: ({ eventClicked, setEventClicked, setEventHovered, view, maxEvents, events, calendarsMap, Cell, CellOverflow, CellEvent, CellEventBtn, CellEventTitle, CellEventStart, }: CalendarDaygridCellProps) => JSX.Element;
|
|
36
|
+
export declare const CalendarDaygridCell: ({ eventClicked, setEventClicked, setEventHovered, view, maxEvents, events, calendarsMap, Cell, CellOverflow, CellEvent, CellEventBtn, CellEventTitle, CellEventStart, }: CalendarDaygridCellProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -27,12 +27,12 @@ var CalendarDaygridCell = function (_a) {
|
|
|
27
27
|
var eventsWithoutPlaceholders = events.filter(function (event) { return !event.placeholder; });
|
|
28
28
|
return ((0, jsx_runtime_1.jsx)(Cell, { children: events.map(function (event, i) {
|
|
29
29
|
if (i === maxEvents && !isExpanded) {
|
|
30
|
-
return ((0, jsx_runtime_1.jsxs)(CellOverflow,
|
|
30
|
+
return ((0, jsx_runtime_1.jsxs)(CellOverflow, { onClick: function () { return expand(true); }, children: [(0, jsx_runtime_1.jsx)(md_1.MdAdd, {}), eventsWithoutPlaceholders.length - maxEvents] }, "overflowMessage" + i));
|
|
31
31
|
}
|
|
32
32
|
if (i > maxEvents && !isExpanded)
|
|
33
33
|
return null;
|
|
34
34
|
if (event.placeholder) {
|
|
35
|
-
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: (0, jsx_runtime_1.jsx)(CellEvent,
|
|
35
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: (0, jsx_runtime_1.jsx)(CellEvent, { "$placeholder": true, children: (0, jsx_runtime_1.jsx)(CellEventBtn, { "aria-hidden": "true", style: { visibility: "hidden" }, "$placeholder": true, children: (0, jsx_runtime_1.jsx)(CellEventTitle, { children: "\u00A0" }) }) }) }, event.key));
|
|
36
36
|
}
|
|
37
37
|
var styleEvent = {
|
|
38
38
|
zIndex: event.firstOfMulti ? 1 : 0,
|
|
@@ -55,7 +55,7 @@ var CalendarDaygridCell = function (_a) {
|
|
|
55
55
|
return setEventClicked(function (prev) {
|
|
56
56
|
return (prev === null || prev === void 0 ? void 0 : prev.uid) === event.uid ? null : event;
|
|
57
57
|
});
|
|
58
|
-
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); }
|
|
58
|
+
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); }, children: event.allDay ? ((0, jsx_runtime_1.jsx)(CellEventTitle, { children: event.title })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(CellEventStart, { children: (0, utils_1.getDisplayTime)(event.start) }), (0, jsx_runtime_1.jsx)(CellEventTitle, { children: event.title })] })) })) })) }, event.key));
|
|
59
59
|
}) }));
|
|
60
60
|
};
|
|
61
61
|
exports.CalendarDaygridCell = CalendarDaygridCell;
|
|
@@ -24,12 +24,12 @@ export var CalendarDaygridCell = function (_a) {
|
|
|
24
24
|
var eventsWithoutPlaceholders = events.filter(function (event) { return !event.placeholder; });
|
|
25
25
|
return (_jsx(Cell, { children: events.map(function (event, i) {
|
|
26
26
|
if (i === maxEvents && !isExpanded) {
|
|
27
|
-
return (_jsxs(CellOverflow,
|
|
27
|
+
return (_jsxs(CellOverflow, { onClick: function () { return expand(true); }, children: [_jsx(IconExpand, {}), eventsWithoutPlaceholders.length - maxEvents] }, "overflowMessage" + i));
|
|
28
28
|
}
|
|
29
29
|
if (i > maxEvents && !isExpanded)
|
|
30
30
|
return null;
|
|
31
31
|
if (event.placeholder) {
|
|
32
|
-
return (_jsx(Fragment, { children: _jsx(CellEvent,
|
|
32
|
+
return (_jsx(Fragment, { children: _jsx(CellEvent, { "$placeholder": true, children: _jsx(CellEventBtn, { "aria-hidden": "true", style: { visibility: "hidden" }, "$placeholder": true, children: _jsx(CellEventTitle, { children: "\u00A0" }) }) }) }, event.key));
|
|
33
33
|
}
|
|
34
34
|
var styleEvent = {
|
|
35
35
|
zIndex: event.firstOfMulti ? 1 : 0,
|
|
@@ -52,6 +52,6 @@ export var CalendarDaygridCell = function (_a) {
|
|
|
52
52
|
return setEventClicked(function (prev) {
|
|
53
53
|
return (prev === null || prev === void 0 ? void 0 : prev.uid) === event.uid ? null : event;
|
|
54
54
|
});
|
|
55
|
-
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); }
|
|
55
|
+
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); }, children: event.allDay ? (_jsx(CellEventTitle, { children: event.title })) : (_jsxs(_Fragment, { children: [_jsx(CellEventStart, { children: getDisplayTime(event.start) }), _jsx(CellEventTitle, { children: event.title })] })) })) })) }, event.key));
|
|
56
56
|
}) }));
|
|
57
57
|
};
|
|
@@ -24,4 +24,4 @@ export type CalendarDaygridNavProps = KoineComponentProps<KoineCalendarDaygridNa
|
|
|
24
24
|
NavBtnViewMonth?: KoineComponent;
|
|
25
25
|
NavBtnViewWeek?: KoineComponent;
|
|
26
26
|
}>;
|
|
27
|
-
export declare const KoineCalendarDaygridNav: ({ range, view, todayInView, handlePrev, handleNext, handleToday, handleView, locale: localeCode, NavRoot, NavTitle, NavBtns, NavBtnPrev, NavBtnNext, NavBtnToday, NavBtnViewMonth, NavBtnViewWeek, }: CalendarDaygridNavProps) => JSX.Element;
|
|
27
|
+
export declare const KoineCalendarDaygridNav: ({ range, view, todayInView, handlePrev, handleNext, handleToday, handleView, locale: localeCode, NavRoot, NavTitle, NavBtns, NavBtnPrev, NavBtnNext, NavBtnToday, NavBtnViewMonth, NavBtnViewWeek, }: CalendarDaygridNavProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -22,4 +22,4 @@ export type CalendarDaygridTableProps = KoineComponentProps<KoineCalendarDaygrid
|
|
|
22
22
|
TableBodyCellDate?: KoineComponent<CalendarDaygridTableBodyCellDateProps>;
|
|
23
23
|
TableBodyRow?: KoineComponent;
|
|
24
24
|
} & CalendarDaygridCellComponents>;
|
|
25
|
-
export declare const KoineCalendarDaygridTable: ({ locale: localeCode, handlePrev, handleNext, events, dayLabels, view, range, eventClicked, setEventClicked, eventHovered, setEventHovered, calendarsMap, maxEvents, Table, TableHead, TableHeadCell, TableBody, TableBodyRow, TableBodyCell, TableBodyCellDate, Cell, CellOverflow, CellEvent, CellEventBtn, CellEventTitle, CellEventStart, }: CalendarDaygridTableProps) => JSX.Element;
|
|
25
|
+
export declare const KoineCalendarDaygridTable: ({ locale: localeCode, handlePrev, handleNext, events, dayLabels, view, range, eventClicked, setEventClicked, eventHovered, setEventHovered, calendarsMap, maxEvents, Table, TableHead, TableHeadCell, TableBody, TableBodyRow, TableBodyCell, TableBodyCellDate, Cell, CellOverflow, CellEvent, CellEventBtn, CellEventTitle, CellEventStart, }: CalendarDaygridTableProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -46,16 +46,7 @@ var KoineCalendarDaygridTable = function (_a) {
|
|
|
46
46
|
function (i) { return locale.localize.day(i, { width: "abbreviated" }); }));
|
|
47
47
|
}
|
|
48
48
|
}, [locale, dayLabels]);
|
|
49
|
-
return ((0, jsx_runtime_1.jsxs)(Table, tslib_1.__assign({}, swipeableHandlers, { children: [(0, jsx_runtime_1.jsx)(TableHead, { children: (0, jsx_runtime_1.jsx)("tr", { children: days.map(function (day) { return ((0, jsx_runtime_1.jsx)(TableHeadCell,
|
|
50
|
-
|
|
51
|
-
setEventClicked: setEventClicked,
|
|
52
|
-
eventHovered: eventHovered,
|
|
53
|
-
setEventHovered: setEventHovered,
|
|
54
|
-
view: view,
|
|
55
|
-
maxEvents: maxEvents,
|
|
56
|
-
events: day.events,
|
|
57
|
-
timestamp: day.timestamp,
|
|
58
|
-
calendarsMap: calendarsMap,
|
|
59
|
-
}, restKoine)))] }))); }) }))); }) })] })));
|
|
49
|
+
return ((0, jsx_runtime_1.jsxs)(Table, tslib_1.__assign({}, swipeableHandlers, { children: [(0, jsx_runtime_1.jsx)(TableHead, { children: (0, jsx_runtime_1.jsx)("tr", { children: days.map(function (day) { return ((0, jsx_runtime_1.jsx)(TableHeadCell, { scope: "column", children: day }, day)); }) }) }), (0, jsx_runtime_1.jsx)(TableBody, { children: weeksEvents.map(function (week, i) { return ((0, jsx_runtime_1.jsx)(TableBodyRow, tslib_1.__assign({}, week.props, { children: week.days.map(function (day) { return ((0, jsx_runtime_1.jsxs)(TableBodyCell, tslib_1.__assign({}, day.props, { children: [(0, jsx_runtime_1.jsx)(TableBodyCellDate, tslib_1.__assign({}, day.props, { children: day.label })), day.events.length > 0 && ((0, jsx_runtime_1.jsx)(CalendarDaygridCell_1.CalendarDaygridCell, tslib_1.__assign({ eventClicked: eventClicked, setEventClicked: setEventClicked, eventHovered: eventHovered, setEventHovered: setEventHovered, view: view, maxEvents: maxEvents, events: day.events,
|
|
50
|
+
timestamp: day.timestamp, calendarsMap: calendarsMap }, restKoine)))] }))); }) }))); }) })] })));
|
|
60
51
|
};
|
|
61
52
|
exports.KoineCalendarDaygridTable = KoineCalendarDaygridTable;
|
|
@@ -43,15 +43,6 @@ export var KoineCalendarDaygridTable = function (_a) {
|
|
|
43
43
|
function (i) { return locale.localize.day(i, { width: "abbreviated" }); }));
|
|
44
44
|
}
|
|
45
45
|
}, [locale, dayLabels]);
|
|
46
|
-
return (_jsxs(Table, __assign({}, swipeableHandlers, { children: [_jsx(TableHead, { children: _jsx("tr", { children: days.map(function (day) { return (_jsx(TableHeadCell,
|
|
47
|
-
|
|
48
|
-
setEventClicked: setEventClicked,
|
|
49
|
-
eventHovered: eventHovered,
|
|
50
|
-
setEventHovered: setEventHovered,
|
|
51
|
-
view: view,
|
|
52
|
-
maxEvents: maxEvents,
|
|
53
|
-
events: day.events,
|
|
54
|
-
timestamp: day.timestamp,
|
|
55
|
-
calendarsMap: calendarsMap,
|
|
56
|
-
}, restKoine)))] }))); }) }))); }) })] })));
|
|
46
|
+
return (_jsxs(Table, __assign({}, swipeableHandlers, { children: [_jsx(TableHead, { children: _jsx("tr", { children: days.map(function (day) { return (_jsx(TableHeadCell, { scope: "column", children: day }, day)); }) }) }), _jsx(TableBody, { children: weeksEvents.map(function (week, i) { return (_jsx(TableBodyRow, __assign({}, week.props, { children: week.days.map(function (day) { return (_jsxs(TableBodyCell, __assign({}, day.props, { children: [_jsx(TableBodyCellDate, __assign({}, day.props, { children: day.label })), day.events.length > 0 && (_jsx(CalendarDaygridCell, __assign({ eventClicked: eventClicked, setEventClicked: setEventClicked, eventHovered: eventHovered, setEventHovered: setEventHovered, view: view, maxEvents: maxEvents, events: day.events,
|
|
47
|
+
timestamp: day.timestamp, calendarsMap: calendarsMap }, restKoine)))] }))); }) }))); }) })] })));
|
|
57
48
|
};
|
|
@@ -16,4 +16,4 @@ export type CalendarLegendProps = KoineComponentProps<KoineCalendarLegendProps,
|
|
|
16
16
|
LegendItemLabel?: KoineComponent;
|
|
17
17
|
LegendItemEvents?: KoineComponent;
|
|
18
18
|
}>;
|
|
19
|
-
export declare const KoineCalendarLegend: ({ calendarsMap, toggleCalendarVisibility, LegendItem, LegendItemStatus, LegendItemLabel, LegendItemEvents, }: CalendarLegendProps) => JSX.Element;
|
|
19
|
+
export declare const KoineCalendarLegend: ({ calendarsMap, toggleCalendarVisibility, LegendItem, LegendItemStatus, LegendItemLabel, LegendItemEvents, }: CalendarLegendProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.KoineCalendarLegend = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
4
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
5
|
var KoineCalendarLegend = function (_a) {
|
|
7
6
|
// const sorted = Object.entries(calendarsMap).sort((a, b) => {
|
|
@@ -14,7 +13,7 @@ var KoineCalendarLegend = function (_a) {
|
|
|
14
13
|
var _b = _a.calendarsMap, calendarsMap = _b === void 0 ? {} : _b, toggleCalendarVisibility = _a.toggleCalendarVisibility, _c = _a.LegendItem, LegendItem = _c === void 0 ? "div" : _c, _d = _a.LegendItemStatus, LegendItemStatus = _d === void 0 ? "span" : _d, _e = _a.LegendItemLabel, LegendItemLabel = _e === void 0 ? "span" : _e, _f = _a.LegendItemEvents, LegendItemEvents = _f === void 0 ? "span" : _f;
|
|
15
14
|
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Object.entries(calendarsMap).map(function (_a) {
|
|
16
15
|
var id = _a[0], calendar = _a[1];
|
|
17
|
-
return ((0, jsx_runtime_1.jsxs)(LegendItem,
|
|
16
|
+
return ((0, jsx_runtime_1.jsxs)(LegendItem, { onClick: function () { return toggleCalendarVisibility(id); }, "$color": calendar.color, "$empty": calendar.events === 0, disabled: calendar.events === 0, children: [(0, jsx_runtime_1.jsx)(LegendItemStatus, { children: calendar.on ? "\u2b24" : "\u2b58" }), (0, jsx_runtime_1.jsx)(LegendItemLabel, { children: calendar.name }), (0, jsx_runtime_1.jsx)(LegendItemEvents, { children: calendar.events })] }, "CalendarLegend." + id));
|
|
18
17
|
}) }));
|
|
19
18
|
};
|
|
20
19
|
exports.KoineCalendarLegend = KoineCalendarLegend;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { __assign } from "tslib";
|
|
2
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
2
|
export var KoineCalendarLegend = function (_a) {
|
|
4
3
|
// const sorted = Object.entries(calendarsMap).sort((a, b) => {
|
|
@@ -11,6 +10,6 @@ export var KoineCalendarLegend = function (_a) {
|
|
|
11
10
|
var _b = _a.calendarsMap, calendarsMap = _b === void 0 ? {} : _b, toggleCalendarVisibility = _a.toggleCalendarVisibility, _c = _a.LegendItem, LegendItem = _c === void 0 ? "div" : _c, _d = _a.LegendItemStatus, LegendItemStatus = _d === void 0 ? "span" : _d, _e = _a.LegendItemLabel, LegendItemLabel = _e === void 0 ? "span" : _e, _f = _a.LegendItemEvents, LegendItemEvents = _f === void 0 ? "span" : _f;
|
|
12
11
|
return (_jsx(_Fragment, { children: Object.entries(calendarsMap).map(function (_a) {
|
|
13
12
|
var id = _a[0], calendar = _a[1];
|
|
14
|
-
return (_jsxs(LegendItem,
|
|
13
|
+
return (_jsxs(LegendItem, { onClick: function () { return toggleCalendarVisibility(id); }, "$color": calendar.color, "$empty": calendar.events === 0, disabled: calendar.events === 0, children: [_jsx(LegendItemStatus, { children: calendar.on ? "\u2b24" : "\u2b58" }), _jsx(LegendItemLabel, { children: calendar.name }), _jsx(LegendItemEvents, { children: calendar.events })] }, "CalendarLegend." + id));
|
|
15
14
|
}) }));
|
|
16
15
|
};
|
|
@@ -49,4 +49,4 @@ export type CarouselCssProps = React.PropsWithChildren<KoineCarouselCssProps>;
|
|
|
49
49
|
/**
|
|
50
50
|
* For programmatic usage an example here @see https://stackoverflow.com/a/65902068/9122820
|
|
51
51
|
*/
|
|
52
|
-
export declare const KoineCarouselCss: ({ items, $gutterRow, $gutterCol, $gutter, $proportion, $snap, width, children, ...colProps }: CarouselCssProps) => JSX.Element | null;
|
|
52
|
+
export declare const KoineCarouselCss: ({ items, $gutterRow, $gutterCol, $gutter, $proportion, $snap, width, children, ...colProps }: CarouselCssProps) => import("react/jsx-runtime").JSX.Element | null;
|
package/Carousel/CarouselCss.js
CHANGED
|
@@ -20,7 +20,7 @@ var KoineCarouselCss = function (_a) {
|
|
|
20
20
|
var id = (0, react_1.useId)();
|
|
21
21
|
if (!slides)
|
|
22
22
|
return null;
|
|
23
|
-
return ((0, jsx_runtime_1.jsx)(exports.CarouselCssRow,
|
|
23
|
+
return ((0, jsx_runtime_1.jsx)(exports.CarouselCssRow, { "$noWrap": true, "$gutter": $gutterRow || $gutter, children: slides.map(function (_slide, idx) { return ((0, jsx_runtime_1.jsx)(exports.CarouselCssCol, tslib_1.__assign({}, colProps, { "$gutter": $gutterCol || $gutter, "$width": width, children: slides[idx] }), "CarouselCssCol-".concat(id, "-").concat(idx))); }) }));
|
|
24
24
|
};
|
|
25
25
|
exports.KoineCarouselCss = KoineCarouselCss;
|
|
26
26
|
var templateObject_1, templateObject_2;
|
package/Carousel/CarouselCss.mjs
CHANGED
|
@@ -17,6 +17,6 @@ export var KoineCarouselCss = function (_a) {
|
|
|
17
17
|
var id = useId();
|
|
18
18
|
if (!slides)
|
|
19
19
|
return null;
|
|
20
|
-
return (_jsx(CarouselCssRow,
|
|
20
|
+
return (_jsx(CarouselCssRow, { "$noWrap": true, "$gutter": $gutterRow || $gutter, children: slides.map(function (_slide, idx) { return (_jsx(CarouselCssCol, __assign({}, colProps, { "$gutter": $gutterCol || $gutter, "$width": width, children: slides[idx] }), "CarouselCssCol-".concat(id, "-").concat(idx))); }) }));
|
|
21
21
|
};
|
|
22
22
|
var templateObject_1, templateObject_2;
|
package/Debug/Debug.d.ts
CHANGED