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

package/Animations/useReveal.js

@@ -1,10 +1,11 @@
+import { __read } from "tslib";
 import { useEffect, useRef, useState } from "react";
 export function useReveal(_a) {
     var _b = _a.direction, direction = _b === void 0 ? "left" : _b, _c = _a.offsetStartY, offsetStartY = _c === void 0 ? -2 : _c, _d = _a.offsetEndY, offsetEndY = _d === void 0 ? 0 : _d, _e = _a.offsetStartX, offsetStartX = _e === void 0 ? "all" : _e;
     var ref = useRef(null);
-    var _f = useState(0), startY = _f[0], setStartY = _f[1];
-    var _g = useState(0), endY = _g[0], setEndY = _g[1];
-    var _h = useState(0), startX = _h[0], setStartX = _h[1];
+    var _f = __read(useState(0), 2), startY = _f[0], setStartY = _f[1];
+    var _g = __read(useState(0), 2), endY = _g[0], setEndY = _g[1];
+    var _h = __read(useState(0), 2), startX = _h[0], setStartX = _h[1];
     useEffect(function () {
         if (!ref.current) {
             return;

package/Autocomplete/AutocompleteMui.js

@@ -1,8 +1,8 @@
-import { __assign, __awaiter, __generator, __rest } from "tslib";
+import { __assign, __awaiter, __generator, __read, __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import useAutocomplete from "@mui/base/useAutocomplete";
 import { useCallback, useMemo, useState } from "react";
-import isString from "@koine/utils/isString";
+import { isString } from "@koine/utils";
 import { normaliseOptions, } from "../Forms/helpers.js";
 import { InputProgress } from "../Forms/styles.js";
 import { AutocompleteInner, AutocompleteInput, AutocompleteInputArrow, AutocompleteItem, AutocompleteItemLabel, AutocompleteItemRemove, AutocompleteLabel, AutocompleteMenu, AutocompleteMenuItem, AutocompleteRoot, AutocompleteWrap, } from "./components.js";
@@ -10,8 +10,8 @@ import { normaliseAutocompleteValue } from "./helpers.js";
 export var Autocomplete = function (_a) {
     var creatable = _a.creatable, multiple = _a.multiple, autoComplete = _a.autoComplete, loadOptions = _a.loadOptions, _b = _a.options, defaultOptions = _b === void 0 ? [] : _b, defaultValue = _a.defaultValue, controlledValue = _a.value, defaultInputValue = _a.defaultInputValue, label = _a.label, placeholder = _a.placeholder, register = _a.register, setValue = _a.setValue, name = _a.name, onChange = _a.onChange, $ref = _a.$ref, children = _a.children, props = __rest(_a, ["creatable", "multiple", "autoComplete", "loadOptions", "options", "defaultValue", "value", "defaultInputValue", "label", "placeholder", "register", "setValue", "name", "onChange", "$ref", "children"]);
     var defaultOptionsMemo = useMemo(function () { return normaliseOptions(defaultOptions); }, [defaultOptions]);
-    var _c = useState(defaultOptionsMemo), options = _c[0], setOptions = _c[1];
-    var _d = useState(false), loading = _d[0], setLoading = _d[1];
+    var _c = __read(useState(defaultOptionsMemo), 2), options = _c[0], setOptions = _c[1];
+    var _d = __read(useState(false), 2), loading = _d[0], setLoading = _d[1];
     var _e = useAutocomplete({
         id: "Autocomplete",
         multiple: multiple ? true : undefined,

package/Autocomplete/helpers.js

@@ -1,5 +1,4 @@
-import isArray from "@koine/utils/isArray";
-import isString from "@koine/utils/isString";
+import { isArray, isString } from "@koine/utils";
 export function normaliseAutocompleteValue(value, asArray) {
     if (!value) {
         return asArray ? [""] : "";

package/Breadcrumbs/Breadcrumbs.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { m } from "framer-motion";
 import { MdKeyboardArrowRight as IconDelimiter } from "react-icons/md";
 import styled, { css } from "styled-components";
-import titleCase from "@koine/utils/titleCase";
+import { titleCase } from "@koine/utils";
 import { max, min } from "../styles/media.js";
 var LINK_GUTTER_X = 10;
 var Root = styled.nav(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  position: relative;\n"], ["\n  display: flex;\n  position: relative;\n"])));

package/Calendar/CalendarDaygridCell.js

@@ -1,4 +1,4 @@
-import { __assign } from "tslib";
+import { __assign, __read } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Fragment, useState } from "react";
 import { MdAdd as IconExpand, } from "react-icons/md";
@@ -10,7 +10,7 @@ var styleBtn = {
 };
 export var CalendarDaygridCell = function (_a) {
     var eventClicked = _a.eventClicked, setEventClicked = _a.setEventClicked, setEventHovered = _a.setEventHovered, view = _a.view, maxEvents = _a.maxEvents, events = _a.events, calendarsMap = _a.calendarsMap, _b = _a.Cell, Cell = _b === void 0 ? "div" : _b, _c = _a.CellOverflow, CellOverflow = _c === void 0 ? "div" : _c, _d = _a.CellEvent, CellEvent = _d === void 0 ? "div" : _d, _e = _a.CellEventBtn, CellEventBtn = _e === void 0 ? "div" : _e, _f = _a.CellEventTitle, CellEventTitle = _f === void 0 ? "span" : _f, _g = _a.CellEventStart, CellEventStart = _g === void 0 ? "span" : _g;
-    var _h = useState(false), isExpanded = _h[0], expand = _h[1];
+    var _h = __read(useState(false), 2), isExpanded = _h[0], expand = _h[1];
     var eventsWithoutPlaceholders = events.filter(function (event) { return !event.placeholder; });
     return (_jsx(Cell, { children: events.map(function (event, i) {
             if (i === maxEvents && !isExpanded) {

package/Calendar/CalendarDaygridNav.js

@@ -1,9 +1,10 @@
+import { __read } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import format from "date-fns/format";
-import { useDateLocale } from "../hooks/useDateLocale.js";
+import { useDateLocale } from "../useDateLocale.js";
 export var KoineCalendarDaygridNav = function (_a) {
     var range = _a.range, view = _a.view, todayInView = _a.todayInView, handlePrev = _a.handlePrev, handleNext = _a.handleNext, handleToday = _a.handleToday, handleView = _a.handleView, localeCode = _a.locale, _b = _a.NavRoot, NavRoot = _b === void 0 ? "nav" : _b, _c = _a.NavTitle, NavTitle = _c === void 0 ? "div" : _c, _d = _a.NavBtns, NavBtns = _d === void 0 ? "div" : _d, _e = _a.NavBtnPrev, NavBtnPrev = _e === void 0 ? "button" : _e, _f = _a.NavBtnNext, NavBtnNext = _f === void 0 ? "button" : _f, _g = _a.NavBtnToday, NavBtnToday = _g === void 0 ? "button" : _g, _h = _a.NavBtnViewMonth, NavBtnViewMonth = _h === void 0 ? "button" : _h, _j = _a.NavBtnViewWeek, NavBtnViewWeek = _j === void 0 ? "button" : _j;
-    var start = range[0], end = range[1];
+    var _k = __read(range, 2), start = _k[0], end = _k[1];
     var locale = useDateLocale(localeCode);
     var opts = { locale: locale };
     var formatted = "";

package/Calendar/CalendarDaygridTable.js

@@ -1,13 +1,13 @@
-import { __assign } from "tslib";
+import { __assign, __read } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import eachWeekOfInterval from "date-fns/eachWeekOfInterval";
 import { useEffect, useMemo, useState } from "react";
 import { useSwipeable } from "react-swipeable";
-import { useDateLocale } from "../hooks/index.js";
+import { useDateLocale } from "../useDateLocale.js";
 import { CalendarDaygridCell, } from "./CalendarDaygridCell.js";
 import { processEventsInView } from "./utils.js";
 function getView(range) {
-    var start = range[0], end = range[1];
+    var _a = __read(range, 2), start = _a[0], end = _a[1];
     var weeks = eachWeekOfInterval({ start: start, end: end }, { weekStartsOn: 1 });
     return {
         month: start.getMonth(),
@@ -24,8 +24,8 @@ export var KoineCalendarDaygridTable = function (_a) {
         CellEventTitle: CellEventTitle,
         CellEventStart: CellEventStart,
     };
-    var _l = useState(dayLabels || [0, 1, 2, 3, 4, 5, 6]), days = _l[0], setDays = _l[1];
-    var _m = useState([]), weeksEvents = _m[0], setWeeksEvents = _m[1];
+    var _l = __read(useState(dayLabels || [0, 1, 2, 3, 4, 5, 6]), 2), days = _l[0], setDays = _l[1];
+    var _m = __read(useState([]), 2), weeksEvents = _m[0], setWeeksEvents = _m[1];
     var locale = useDateLocale(localeCode);
     var _o = useMemo(function () { return getView(range); }, [range]), month = _o.month, weeks = _o.weeks;
     var swipeableHandlers = useSwipeable({

package/Calendar/CalendarLegend.js

@@ -1,8 +1,9 @@
+import { __read } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export var KoineCalendarLegend = function (_a) {
     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;
     return (_jsx(_Fragment, { children: Object.entries(calendarsMap).map(function (_a) {
-            var id = _a[0], calendar = _a[1];
+            var _b = __read(_a, 2), id = _b[0], calendar = _b[1];
             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));
         }) }));
 };

package/Calendar/calendar-api-google.js

@@ -1,9 +1,7 @@
 import { __assign, __awaiter, __generator, __rest } from "tslib";
 import differenceInDays from "date-fns/differenceInDays";
 import subDays from "date-fns/subDays";
-import arrayToLookup from "@koine/utils/arrayToLookup";
-import isString from "@koine/utils/isString";
-import isUndefined from "@koine/utils/isUndefined";
+import { arrayToLookup, isString, isUndefined } from "@koine/utils";
 import { addCalendarEvents, getEventTimestamp } from "./utils.js";
 var baseURL = "https://www.googleapis.com/calendar/v3/calendars/";
 export function getCalendarsEventsFromGoogle(_a) {

package/Calendar/useCalendar.js

@@ -1,26 +1,26 @@
-import { __assign, __awaiter, __generator } from "tslib";
+import { __assign, __awaiter, __generator, __read } from "tslib";
 import { useCallback, useEffect, useReducer, useState } from "react";
 import { getCalendarsEventsFromGoogle } from "./calendar-api-google.js";
 import { getEndDate, getNextDate, getPrevDate, getStartDate, isTodayInView, } from "./utils.js";
 export function useCalendar(_a) {
     var _this = this;
     var locale = _a.locale, apiKey = _a.apiKey, calendars = _a.calendars, initialEvents = _a.events, initialStart = _a.start, initialEnd = _a.end, _b = _a.view, initialView = _b === void 0 ? "month" : _b, _c = _a.timeZone, timeZone = _c === void 0 ? "" : _c, onError = _a.onError;
-    var _d = useState(initialView), view = _d[0], setView = _d[1];
+    var _d = __read(useState(initialView), 2), view = _d[0], setView = _d[1];
     var start = initialStart || getStartDate(new Date(), view);
     var end = initialEnd || getEndDate(start, view);
-    var _e = useState([start, end]), range = _e[0], setRange = _e[1];
-    var _f = useState(isTodayInView(start, end)), todayInView = _f[0], setTodayInView = _f[1];
-    var _g = useState(initialEvents || {}), events = _g[0], setEvents = _g[1];
-    var _h = useState(null), eventHovered = _h[0], setEventHovered = _h[1];
-    var _j = useState(null), eventClicked = _j[0], setEventClicked = _j[1];
-    var _k = useReducer(function (state, action) {
+    var _e = __read(useState([start, end]), 2), range = _e[0], setRange = _e[1];
+    var _f = __read(useState(isTodayInView(start, end)), 2), todayInView = _f[0], setTodayInView = _f[1];
+    var _g = __read(useState(initialEvents || {}), 2), events = _g[0], setEvents = _g[1];
+    var _h = __read(useState(null), 2), eventHovered = _h[0], setEventHovered = _h[1];
+    var _j = __read(useState(null), 2), eventClicked = _j[0], setEventClicked = _j[1];
+    var _k = __read(useReducer(function (state, action) {
         var _a;
         var type = action.type;
         switch (type) {
             case "events": {
                 var events_1 = action.payload;
                 return Object.entries(state).reduce(function (map, _a) {
-                    var id = _a[0], calendar = _a[1];
+                    var _b = __read(_a, 2), id = _b[0], calendar = _b[1];
                     map[id] = __assign(__assign({}, calendar), { events: events_1[id] || 0 });
                     return map;
                 }, {});
@@ -32,7 +32,7 @@ export function useCalendar(_a) {
                 }
                 else {
                     return Object.entries(state).reduce(function (map, _a) {
-                        var id = _a[0], calendar = _a[1];
+                        var _b = __read(_a, 2), id = _b[0], calendar = _b[1];
                         map[id] = __assign(__assign({}, calendar), { on: visible_1.indexOf(id) > -1 });
                         return map;
                     }, {});
@@ -44,7 +44,7 @@ export function useCalendar(_a) {
     }, calendars.reduce(function (map, calendar) {
         map[calendar.id] = __assign(__assign({}, calendar), { name: calendar.name || "", on: true, events: 0 });
         return map;
-    }, {})), calendarsMap = _k[0], updateCalendars = _k[1];
+    }, {})), 2), calendarsMap = _k[0], updateCalendars = _k[1];
     var toggleCalendarVisibility = useCallback(function (idOrIds) {
         updateCalendars({ type: "visibility", payload: idOrIds });
     }, [updateCalendars]);
@@ -84,7 +84,7 @@ export function useCalendar(_a) {
         });
     }); }, [setEvents, apiKey, timeZone, onError]);
     var handleToday = useCallback(function () {
-        var start = range[0], end = range[1];
+        var _a = __read(range, 2), start = _a[0], end = _a[1];
         var newStart = getStartDate(new Date(), view);
         var newEnd = getEndDate(newStart, view);
         setRange([newStart, newEnd]);
@@ -96,7 +96,7 @@ export function useCalendar(_a) {
     }, [view, range]);
     var handlePrev = useCallback(function () {
         setRange(function (_a) {
-            var start = _a[0];
+            var _b = __read(_a, 1), start = _b[0];
             var newStart = getPrevDate(start, view);
             var newEnd = getEndDate(newStart, view);
             return [newStart, newEnd];
@@ -106,7 +106,7 @@ export function useCalendar(_a) {
     }, [view]);
     var handleNext = useCallback(function () {
         setRange(function (_a) {
-            var start = _a[0];
+            var _b = __read(_a, 1), start = _b[0];
             var newStart = getNextDate(start, view);
             var newEnd = getEndDate(newStart, view);
             return [newStart, newEnd];
@@ -123,7 +123,7 @@ export function useCalendar(_a) {
         setEventHovered(null);
     }, [start]);
     useEffect(function () {
-        var start = range[0], end = range[1];
+        var _a = __read(range, 2), start = _a[0], end = _a[1];
         loadCalendars(calendars, start, end);
         setTodayInView(isTodayInView(start, end));
     }, [range]);

package/Details/Details.d.ts

@@ -1,5 +1,5 @@
 import type { Simplify } from "@koine/utils";
-import { type WithComponents } from "../helpers";
+import { type WithComponents } from "../extendComponent";
 export type OwnProps = React.ComponentPropsWithoutRef<"details"> & {
     open?: boolean;
     onChange?: () => any;
@@ -49,12 +49,12 @@ export declare const Summary: NonNullable<import("react").ElementType<Omit<impor
 } & Pick<OwnProps, "onChange"> & {
     children?: import("react").ReactNode;
 }>>;
-export declare const Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+export declare const Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
     $open: OwnProps["open"];
 } & Pick<OwnProps, "onChange"> & {
     children?: import("react").ReactNode;
 }>>;
-export declare const Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+export declare const Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
     $open: OwnProps["open"];
     "aria-expanded"?: React.AriaAttributes["aria-expanded"];
     "aria-label"?: React.AriaAttributes["aria-label"];
@@ -63,55 +63,22 @@ export declare const Content: NonNullable<import("react").ElementType<Omit<Omit<
 }>>;
 export declare const KoineDetails: ((props: {
     key?: import("react").Key | null | undefined;
-    id?: string | undefined;
     slot?: string | undefined;
     style?: import("react").CSSProperties | undefined;
     title?: string | undefined;
-    color?: string | undefined;
-    defaultChecked?: boolean | undefined;
-    defaultValue?: string | number | readonly string[] | undefined;
-    suppressContentEditableWarning?: boolean | undefined;
-    suppressHydrationWarning?: boolean | undefined;
-    accessKey?: string | undefined;
-    autoFocus?: boolean | undefined;
+    onDrag?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
+    onDragStart?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
+    onDragEnd?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
+    onAnimationStart?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
     className?: string | undefined;
-    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
-    contextMenu?: string | undefined;
-    dir?: string | undefined;
-    draggable?: (boolean | "true" | "false") | undefined;
-    hidden?: boolean | undefined;
+    children?: import("react").ReactNode;
+    suppressHydrationWarning?: boolean | undefined;
+    color?: string | undefined;
+    id?: string | undefined;
     lang?: string | undefined;
-    nonce?: string | undefined;
-    placeholder?: string | undefined;
-    spellCheck?: (boolean | "true" | "false") | undefined;
-    tabIndex?: number | undefined;
-    translate?: "yes" | "no" | undefined;
-    radioGroup?: string | undefined;
     role?: import("react").AriaRole | undefined;
-    about?: string | undefined;
-    content?: string | undefined;
-    datatype?: string | undefined;
-    inlist?: any;
-    prefix?: string | undefined;
-    property?: string | undefined;
-    rel?: string | undefined;
-    resource?: string | undefined;
-    rev?: string | undefined;
-    typeof?: string | undefined;
-    vocab?: string | undefined;
-    autoCapitalize?: string | undefined;
-    autoCorrect?: string | undefined;
-    autoSave?: string | undefined;
-    itemProp?: string | undefined;
-    itemScope?: boolean | undefined;
-    itemType?: string | undefined;
-    itemID?: string | undefined;
-    itemRef?: string | undefined;
-    results?: number | undefined;
-    security?: string | undefined;
-    unselectable?: "on" | "off" | undefined;
-    inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
-    is?: string | undefined;
+    tabIndex?: number | undefined;
     'aria-activedescendant'?: string | undefined;
     'aria-atomic'?: (boolean | "true" | "false") | undefined;
     'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
@@ -124,7 +91,7 @@ export declare const KoineDetails: ((props: {
     'aria-colindextext'?: string | undefined;
     'aria-colspan'?: number | undefined;
     'aria-controls'?: string | undefined;
-    'aria-current'?: boolean | "time" | "location" | "true" | "false" | "page" | "step" | "date" | undefined;
+    'aria-current'?: boolean | "time" | "step" | "true" | "false" | "page" | "location" | "date" | undefined;
     'aria-describedby'?: string | undefined;
     'aria-description'?: string | undefined;
     'aria-details'?: string | undefined;
@@ -151,7 +118,7 @@ export declare const KoineDetails: ((props: {
     'aria-posinset'?: number | undefined;
     'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
     'aria-readonly'?: (boolean | "true" | "false") | undefined;
-    'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
     'aria-required'?: (boolean | "true" | "false") | undefined;
     'aria-roledescription'?: string | undefined;
     'aria-rowcount'?: number | undefined;
@@ -165,7 +132,6 @@ export declare const KoineDetails: ((props: {
     'aria-valuemin'?: number | undefined;
     'aria-valuenow'?: number | undefined;
     'aria-valuetext'?: string | undefined;
-    children?: import("react").ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined;
@@ -261,9 +227,7 @@ export declare const KoineDetails: ((props: {
     onContextMenuCapture?: import("react").MouseEventHandler<HTMLDetailsElement> | undefined;
     onDoubleClick?: import("react").MouseEventHandler<HTMLDetailsElement> | undefined;
     onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDetailsElement> | undefined;
-    onDrag?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
-    onDragEnd?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragEndCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragEnter?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragEnterCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
@@ -273,7 +237,6 @@ export declare const KoineDetails: ((props: {
     onDragLeaveCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragOver?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragOverCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
-    onDragStart?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDragStartCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDrop?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
     onDropCapture?: import("react").DragEventHandler<HTMLDetailsElement> | undefined;
@@ -323,14 +286,51 @@ export declare const KoineDetails: ((props: {
     onScrollCapture?: import("react").UIEventHandler<HTMLDetailsElement> | undefined;
     onWheel?: import("react").WheelEventHandler<HTMLDetailsElement> | undefined;
     onWheelCapture?: import("react").WheelEventHandler<HTMLDetailsElement> | undefined;
-    onAnimationStart?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
     onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
-    onAnimationEnd?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
     onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
     onAnimationIteration?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDetailsElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLDetailsElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDetailsElement> | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    autoFocus?: boolean | undefined;
+    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    hidden?: boolean | undefined;
+    nonce?: string | undefined;
+    placeholder?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    about?: string | undefined;
+    content?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    rel?: string | undefined;
+    resource?: string | undefined;
+    rev?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCapitalize?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    is?: string | undefined;
     open?: boolean | undefined;
     onToggle?: import("react").ReactEventHandler<HTMLDetailsElement> | undefined;
     summary: null | React.ReactNode;
@@ -343,12 +343,12 @@ export declare const KoineDetails: ((props: {
     } & Pick<OwnProps, "onChange"> & {
         children?: import("react").ReactNode;
     }>>;
-    Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         $open: OwnProps["open"];
     } & Pick<OwnProps, "onChange"> & {
         children?: import("react").ReactNode;
     }>>;
-    Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         $open: OwnProps["open"];
         "aria-expanded"?: React.AriaAttributes["aria-expanded"];
         "aria-label"?: React.AriaAttributes["aria-label"];
@@ -362,12 +362,12 @@ export declare const KoineDetails: ((props: {
     } & Pick<OwnProps, "onChange"> & {
         children?: import("react").ReactNode;
     }>>;
-    Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         $open: OwnProps["open"];
     } & Pick<OwnProps, "onChange"> & {
         children?: import("react").ReactNode;
     }>>;
-    Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         $open: OwnProps["open"];
         "aria-expanded"?: React.AriaAttributes["aria-expanded"];
         "aria-label"?: React.AriaAttributes["aria-label"];
@@ -382,12 +382,12 @@ export declare const KoineDetails: ((props: {
         } & Pick<OwnProps, "onChange"> & {
             children?: import("react").ReactNode;
         }>>;
-        Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+        Body: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
             $open: OwnProps["open"];
         } & Pick<OwnProps, "onChange"> & {
             children?: import("react").ReactNode;
         }>>;
-        Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+        Content: NonNullable<import("react").ElementType<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
             $open: OwnProps["open"];
             "aria-expanded"?: React.AriaAttributes["aria-expanded"];
             "aria-label"?: React.AriaAttributes["aria-label"];

package/Details/Details.js

@@ -1,8 +1,8 @@
-import { __assign, __rest } from "tslib";
+import { __assign, __read, __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useCallback, useEffect, useId, useRef, useState, } from "react";
-import { extendComponent, } from "../helpers/index.js";
-import { useWindowSize } from "../hooks/useWindowSize.js";
+import { extendComponent, } from "../extendComponent.js";
+import { useWindowSize } from "../useWindowSize.js";
 export var Root = "details";
 export var Summary = "summary";
 export var Body = "div";
@@ -10,12 +10,12 @@ export var Content = "div";
 var DetailsWithRef = forwardRef(function Details(_a, ref) {
     var id = _a.id, propOpen = _a.open, recalc = _a.recalc, summary = _a.summary, children = _a.children, _Root = _a.Root, _Summary = _a.Summary, _Body = _a.Body, _Content = _a.Content, onChange = _a.onChange, props = __rest(_a, ["id", "open", "recalc", "summary", "children", "Root", "Summary", "Body", "Content", "onChange"]);
     var isControlled = typeof propOpen !== "undefined";
-    var _b = useState(propOpen), stateOpen = _b[0], setStateOpen = _b[1];
-    var _c = useState(0), setHeight = _c[1];
+    var _b = __read(useState(propOpen), 2), stateOpen = _b[0], setStateOpen = _b[1];
+    var _c = __read(useState(0), 2), setHeight = _c[1];
     var hash = id ? "#".concat(id) : "";
     var winSize = useWindowSize();
     var open = isControlled ? propOpen : stateOpen;
-    var overflow = useState(open ? "unset" : "hidden")[0];
+    var _d = __read(useState(open ? "unset" : "hidden"), 1), overflow = _d[0];
     var content = useRef(null);
     var defaultId = useId();
     id = id || defaultId;

package/Dialog/DialogMui.d.ts

@@ -2,7 +2,7 @@ import ModalUnstyled, { type ModalProps as ModalUnstyledProps } from "@mui/base/
 import type { MotionProps } from "framer-motion";
 import React from "react";
 import type { Simplify } from "@koine/utils";
-import { type WithComponents } from "../helpers/index.js";
+import { type WithComponents } from "../extendComponent.js";
 type ReducedModalUnstyledProps = Omit<ModalUnstyledProps, "onClose" | "BackdropComponent" | "classes" | "closeAfterTransition" | "component" | "components" | "componentsProps">;
 export type OwnProps = React.PropsWithChildren<ReducedModalUnstyledProps & {
     onClose: (event: object, reason?: string) => any;
@@ -56,13 +56,13 @@ export type Props = Simplify<WithComponents<OwnProps, Components>>;
 export type DialogProps = Props;
 export type KoineDialogProps = Props;
 export declare const Root: import("@mui/base/utils").PolymorphicComponent<import("@mui/base/Modal").ModalTypeMap<{}, "div">>;
-export declare const Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+export declare const Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
     open?: OwnProps["open"];
 }>>;
 export declare const Container: NonNullable<React.ElementType<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<OwnProps, "$scrollPaper"> & {
     children?: React.ReactNode;
 }>>;
-export declare const Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+export declare const Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
     "aria-label": string;
 } & Pick<OwnProps, "$scrollPaper"> & {
     children?: React.ReactNode;
@@ -89,13 +89,13 @@ export declare const KoineDialog: ((props: Omit<{
     mPaper?: MotionProps | undefined;
     children?: React.ReactNode;
     Root: import("@mui/base/utils").PolymorphicComponent<import("@mui/base/Modal").ModalTypeMap<{}, "div">>;
-    Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         open?: OwnProps["open"];
     }>>;
     Container: NonNullable<React.ElementType<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<OwnProps, "$scrollPaper"> & {
         children?: React.ReactNode;
     }>>;
-    Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         "aria-label": string;
     } & Pick<OwnProps, "$scrollPaper"> & {
         children?: React.ReactNode;
@@ -113,13 +113,13 @@ export declare const KoineDialog: ((props: Omit<{
     }>>;
 }, "ref"> & React.RefAttributes<HTMLDivElement>) => React.FunctionComponentElement<any>) & {
     Root: import("@mui/base/utils").PolymorphicComponent<import("@mui/base/Modal").ModalTypeMap<{}, "div">>;
-    Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         open?: OwnProps["open"];
     }>>;
     Container: NonNullable<React.ElementType<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<OwnProps, "$scrollPaper"> & {
         children?: React.ReactNode;
     }>>;
-    Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+    Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
         "aria-label": string;
     } & Pick<OwnProps, "$scrollPaper"> & {
         children?: React.ReactNode;
@@ -138,13 +138,13 @@ export declare const KoineDialog: ((props: Omit<{
 } & {
     defaultProps: {
         Root: import("@mui/base/utils").PolymorphicComponent<import("@mui/base/Modal").ModalTypeMap<{}, "div">>;
-        Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+        Backdrop: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
             open?: OwnProps["open"];
         }>>;
         Container: NonNullable<React.ElementType<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<OwnProps, "$scrollPaper"> & {
             children?: React.ReactNode;
         }>>;
-        Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & {
+        Paper: NonNullable<React.ElementType<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "style" | "onDrag" | "onDragStart" | "onDragEnd" | "onAnimationStart" | "onAnimationEnd"> & {
             "aria-label": string;
         } & Pick<OwnProps, "$scrollPaper"> & {
             children?: React.ReactNode;

package/Dialog/DialogMui.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import ModalUnstyled from "@mui/base/Modal";
 import { forwardRef, useRef } from "react";
 import { MdClear as IconClose } from "react-icons/md";
-import { extendComponent } from "../helpers/index.js";
+import { extendComponent } from "../extendComponent.js";
 export var Root = ModalUnstyled;
 export var Backdrop = "div";
 export var Container = "div";