@koine/react 1.0.10 → 1.0.11

package/Tabs/sc/bare.js

@@ -0,0 +1,87 @@
+"use strict";
+// <reference types="@reach/utils/dist/declarations/src/polymorphic" />
+/**
+ * @file
+ *
+ * Here we manage only "vertical" oriented tabs for now
+ */
+// import styled from "styled-components";
+// import {
+//   Tabs as _Tabs,
+//   TabList as _TabList,
+//   Tab as _Tab,
+//   TabPanels as _TabPanels,
+//   TabPanel as _TabPanel,
+//   TabProps as _TabProps,
+//   TabsProps as _TabsProps,
+//   useTabsContext,
+// } from "@reach/tabs";
+// import { min } from "../../styles/media";
+// import { UnderlineSkewed } from "../../Animations/Underline";
+// import { btnStyleReset } from "../../Buttons/Button";
+// export const Tabs = styled(_Tabs)<TabsProps>`
+//   ${min.sm} {
+//     display: flex;
+//     ${(p) => p.$vertical && "flex-direction: column;"}
+//   }
+// `;
+// export type TabsProps = React.PropsWithChildren<_TabsProps> & {
+//   $vertical?: boolean;
+// };
+// export const TabList = styled(_TabList)`
+//   display: flex;
+//   flex-direction: column;
+//   ${min.sm} {
+//     border-right: 1px solid var(--grey800);
+//   }
+// `;
+// export const TabWrap = styled(_Tab)<TabProps & TabStyledProps>`
+//   ${btnStyleReset}
+//   position: relative;
+//   justify-content: flex-end;
+//   padding: 0.7em;
+//   margin-bottom: 1em;
+//   font-weight: bold;
+//   color: ${(p) => (p.$active ? "var(--accent200)" : "var(--grey300)")};
+//   ${min.sm} {
+//     padding-right: var(--gutter-half);
+//   }
+//   &:hover {
+//     color: ${(p) => (p.$active ? "var(--accent200)" : "var(--accent300)")};
+//   }
+// `;
+// export const TabText = styled.span<TabStyledProps>`
+//   position: relative;
+//   z-index: 1;
+// `;
+// export const TabUnderline = styled(UnderlineSkewed)<TabStyledProps>``;
+// export type TabStyledProps = {
+//   $active: boolean;
+//   $focused: boolean;
+// };
+// export type TabProps = _TabProps & {
+//   idx: number;
+// };
+// export const Tab = ({ children, ...props }: TabProps) => {
+//   const { selectedIndex, focusedIndex } = useTabsContext();
+//   const styledProps = {
+//     $active: props.idx === selectedIndex,
+//     $focused: props.idx === focusedIndex,
+//   };
+//   return (
+//     <TabWrap {...props} {...styledProps}>
+//       {styledProps.$active && (
+//         <TabUnderline {...styledProps} layoutId="Tab-underline" />
+//       )}
+//       <TabText {...styledProps}>{children}</TabText>
+//     </TabWrap>
+//   );
+// };
+// export const TabPanels = styled(_TabPanels)`
+//   flex: 1;
+// `;
+// export const TabPanel = styled(_TabPanel)`
+//   ${min.sm} {
+//     padding-left: var(--gutter-half);
+//   }
+// `;

package/Tabs/tw/bare.d.ts

@@ -0,0 +1,248 @@
+/// <reference types="react" />
+import * as _ from "../TabsMui";
+export type { KoineTabsProps } from "../TabsMui";
+export declare const Root: import("react").ForwardRefExoticComponent<Pick<{
+    className?: string | undefined;
+    ref?: import("react").Ref<any> | undefined;
+}, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabsUnstyled/TabsUnstyledProps").TabsUnstyledTypeMap<{}, "div">>>>;
+export declare const List: import("react").ForwardRefExoticComponent<Pick<{
+    className?: string | undefined;
+    ref?: import("react").Ref<any> | undefined;
+}, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabsListUnstyled/TabsListUnstyledProps").TabsListUnstyledTypeMap<{}, "div">>>>;
+export declare const Tab: import("react").ForwardRefExoticComponent<Pick<{
+    className?: string | undefined;
+    ref?: import("react").Ref<any> | undefined;
+}, "className"> & import("react").RefAttributes<import("react").ForwardRefExoticComponent<Pick<import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, keyof import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps> & {
+    component?: "button" | undefined;
+} & {
+    Indicator?: import("react").ElementType<Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>>, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & Pick<{
+        selected: boolean;
+        focusVisible: boolean;
+        setFocusVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        disabled: boolean;
+        active: boolean;
+        getRootProps: (otherHandlers?: Record<string, (event: any) => void> | undefined) => {
+            role: string;
+            'aria-controls': string | null;
+            id: string | null;
+            'aria-selected': boolean;
+            disabled: boolean;
+            onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+            'aria-disabled'?: boolean | "true" | "false" | undefined;
+            tabIndex?: number | undefined;
+            type?: "button" | "reset" | "submit" | undefined;
+            onBlur: import("react").FocusEventHandler<Element>;
+            onFocus: import("react").FocusEventHandler<Element>;
+            onKeyDown: import("react").KeyboardEventHandler<Element>;
+            onKeyUp: import("react").KeyboardEventHandler<Element>;
+            onMouseDown: import("react").MouseEventHandler<Element>;
+            onMouseLeave: import("react").MouseEventHandler<Element>;
+            onMouseUp: import("react").MouseEventHandler<Element>;
+            ref: import("react").Ref<any>;
+        };
+    }, "disabled" | "selected" | "active"> & {
+        children?: import("react").ReactNode;
+    }> | undefined;
+}, "key" | "id" | "title" | "color" | "form" | "slot" | "style" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "name" | "component" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | keyof import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps | "Indicator"> & import("react").RefAttributes<unknown>>>>;
+export declare const Indicator: import("react").ForwardRefExoticComponent<Pick<{
+    className?: string | undefined;
+    ref?: import("react").Ref<any> | undefined;
+}, "className"> & import("react").RefAttributes<import("react").ElementType<Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>>, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & Pick<{
+    selected: boolean;
+    focusVisible: boolean;
+    setFocusVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    disabled: boolean;
+    active: boolean;
+    getRootProps: (otherHandlers?: Record<string, (event: any) => void> | undefined) => {
+        role: string;
+        'aria-controls': string | null;
+        id: string | null;
+        'aria-selected': boolean;
+        disabled: boolean;
+        onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+        'aria-disabled'?: boolean | "true" | "false" | undefined;
+        tabIndex?: number | undefined;
+        type?: "button" | "reset" | "submit" | undefined;
+        onBlur: import("react").FocusEventHandler<Element>;
+        onFocus: import("react").FocusEventHandler<Element>;
+        onKeyDown: import("react").KeyboardEventHandler<Element>;
+        onKeyUp: import("react").KeyboardEventHandler<Element>;
+        onMouseDown: import("react").MouseEventHandler<Element>;
+        onMouseLeave: import("react").MouseEventHandler<Element>;
+        onMouseUp: import("react").MouseEventHandler<Element>;
+        ref: import("react").Ref<any>;
+    };
+}, "disabled" | "selected" | "active"> & {
+    children?: import("react").ReactNode;
+}>>>;
+export declare const Panel: import("react").ForwardRefExoticComponent<Pick<{
+    className?: string | undefined;
+    ref?: import("react").Ref<any> | undefined;
+}, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabPanelUnstyled/TabPanelUnstyledProps").TabPanelUnstyledTypeMap<{}, "div">>>>;
+export declare const KoineTabs: ((props: Pick<import("type-fest/source/simplify").Simplify<import("../../helpers").WithComponents<_.OwnProps, _.Components>>, "key" | "value" | "id" | "title" | "color" | "slot" | "style" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "direction" | "orientation" | "selectionFollowsFocus" | keyof _.Components | "mTab"> & import("react").RefAttributes<HTMLDivElement>) => import("react").FunctionComponentElement<any>) & {
+    Root: import("react").ForwardRefExoticComponent<Pick<{
+        className?: string | undefined;
+        ref?: import("react").Ref<any> | undefined;
+    }, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabsUnstyled/TabsUnstyledProps").TabsUnstyledTypeMap<{}, "div">>>>;
+    List: import("react").ForwardRefExoticComponent<Pick<{
+        className?: string | undefined;
+        ref?: import("react").Ref<any> | undefined;
+    }, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabsListUnstyled/TabsListUnstyledProps").TabsListUnstyledTypeMap<{}, "div">>>>;
+    Tab: import("react").ForwardRefExoticComponent<Pick<{
+        className?: string | undefined;
+        ref?: import("react").Ref<any> | undefined;
+    }, "className"> & import("react").RefAttributes<import("react").ForwardRefExoticComponent<Pick<import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+    }, keyof import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps> & {
+        component?: "button" | undefined;
+    } & {
+        Indicator?: import("react").ElementType<Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>>, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & Pick<{
+            selected: boolean;
+            focusVisible: boolean;
+            setFocusVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+            disabled: boolean;
+            active: boolean;
+            getRootProps: (otherHandlers?: Record<string, (event: any) => void> | undefined) => {
+                role: string;
+                'aria-controls': string | null;
+                id: string | null;
+                'aria-selected': boolean;
+                disabled: boolean;
+                onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+                'aria-disabled'?: boolean | "true" | "false" | undefined;
+                tabIndex?: number | undefined;
+                type?: "button" | "reset" | "submit" | undefined;
+                onBlur: import("react").FocusEventHandler<Element>;
+                onFocus: import("react").FocusEventHandler<Element>;
+                onKeyDown: import("react").KeyboardEventHandler<Element>;
+                onKeyUp: import("react").KeyboardEventHandler<Element>;
+                onMouseDown: import("react").MouseEventHandler<Element>;
+                onMouseLeave: import("react").MouseEventHandler<Element>;
+                onMouseUp: import("react").MouseEventHandler<Element>;
+                ref: import("react").Ref<any>;
+            };
+        }, "disabled" | "selected" | "active"> & {
+            children?: import("react").ReactNode;
+        }> | undefined;
+    }, "key" | "id" | "title" | "color" | "form" | "slot" | "style" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "name" | "component" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | keyof import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps | "Indicator"> & import("react").RefAttributes<unknown>>>>;
+    Indicator: import("react").ForwardRefExoticComponent<Pick<{
+        className?: string | undefined;
+        ref?: import("react").Ref<any> | undefined;
+    }, "className"> & import("react").RefAttributes<import("react").ElementType<Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>>, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & Pick<{
+        selected: boolean;
+        focusVisible: boolean;
+        setFocusVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+        disabled: boolean;
+        active: boolean;
+        getRootProps: (otherHandlers?: Record<string, (event: any) => void> | undefined) => {
+            role: string;
+            'aria-controls': string | null;
+            id: string | null;
+            'aria-selected': boolean;
+            disabled: boolean;
+            onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+            'aria-disabled'?: boolean | "true" | "false" | undefined;
+            tabIndex?: number | undefined;
+            type?: "button" | "reset" | "submit" | undefined;
+            onBlur: import("react").FocusEventHandler<Element>;
+            onFocus: import("react").FocusEventHandler<Element>;
+            onKeyDown: import("react").KeyboardEventHandler<Element>;
+            onKeyUp: import("react").KeyboardEventHandler<Element>;
+            onMouseDown: import("react").MouseEventHandler<Element>;
+            onMouseLeave: import("react").MouseEventHandler<Element>;
+            onMouseUp: import("react").MouseEventHandler<Element>;
+            ref: import("react").Ref<any>;
+        };
+    }, "disabled" | "selected" | "active"> & {
+        children?: import("react").ReactNode;
+    }>>>;
+    Panel: import("react").ForwardRefExoticComponent<Pick<{
+        className?: string | undefined;
+        ref?: import("react").Ref<any> | undefined;
+    }, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabPanelUnstyled/TabPanelUnstyledProps").TabPanelUnstyledTypeMap<{}, "div">>>>;
+} & {
+    defaultProps: {
+        Root: import("react").ForwardRefExoticComponent<Pick<{
+            className?: string | undefined;
+            ref?: import("react").Ref<any> | undefined;
+        }, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabsUnstyled/TabsUnstyledProps").TabsUnstyledTypeMap<{}, "div">>>>;
+        List: import("react").ForwardRefExoticComponent<Pick<{
+            className?: string | undefined;
+            ref?: import("react").Ref<any> | undefined;
+        }, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabsListUnstyled/TabsListUnstyledProps").TabsListUnstyledTypeMap<{}, "div">>>>;
+        Tab: import("react").ForwardRefExoticComponent<Pick<{
+            className?: string | undefined;
+            ref?: import("react").Ref<any> | undefined;
+        }, "className"> & import("react").RefAttributes<import("react").ForwardRefExoticComponent<Pick<import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement>> & {
+            ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+        }, keyof import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps> & {
+            component?: "button" | undefined;
+        } & {
+            Indicator?: import("react").ElementType<Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>>, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & Pick<{
+                selected: boolean;
+                focusVisible: boolean;
+                setFocusVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+                disabled: boolean;
+                active: boolean;
+                getRootProps: (otherHandlers?: Record<string, (event: any) => void> | undefined) => {
+                    role: string;
+                    'aria-controls': string | null;
+                    id: string | null;
+                    'aria-selected': boolean;
+                    disabled: boolean;
+                    onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+                    'aria-disabled'?: boolean | "true" | "false" | undefined;
+                    tabIndex?: number | undefined;
+                    type?: "button" | "reset" | "submit" | undefined;
+                    onBlur: import("react").FocusEventHandler<Element>;
+                    onFocus: import("react").FocusEventHandler<Element>;
+                    onKeyDown: import("react").KeyboardEventHandler<Element>;
+                    onKeyUp: import("react").KeyboardEventHandler<Element>;
+                    onMouseDown: import("react").MouseEventHandler<Element>;
+                    onMouseLeave: import("react").MouseEventHandler<Element>;
+                    onMouseUp: import("react").MouseEventHandler<Element>;
+                    ref: import("react").Ref<any>;
+                };
+            }, "disabled" | "selected" | "active"> & {
+                children?: import("react").ReactNode;
+            }> | undefined;
+        }, "key" | "id" | "title" | "color" | "form" | "slot" | "style" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "name" | "component" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | keyof import("@mui/base/TabUnstyled/TabUnstyledProps").TabUnstyledOwnProps | "Indicator"> & import("react").RefAttributes<unknown>>>>;
+        Indicator: import("react").ForwardRefExoticComponent<Pick<{
+            className?: string | undefined;
+            ref?: import("react").Ref<any> | undefined;
+        }, "className"> & import("react").RefAttributes<import("react").ElementType<Omit<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "key" | keyof import("react").HTMLAttributes<HTMLSpanElement>>, "style" | "onDrag" | "onDragEnd" | "onDragStart" | "onAnimationStart" | "onAnimationEnd"> & Pick<{
+            selected: boolean;
+            focusVisible: boolean;
+            setFocusVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+            disabled: boolean;
+            active: boolean;
+            getRootProps: (otherHandlers?: Record<string, (event: any) => void> | undefined) => {
+                role: string;
+                'aria-controls': string | null;
+                id: string | null;
+                'aria-selected': boolean;
+                disabled: boolean;
+                onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+                'aria-disabled'?: boolean | "true" | "false" | undefined;
+                tabIndex?: number | undefined;
+                type?: "button" | "reset" | "submit" | undefined;
+                onBlur: import("react").FocusEventHandler<Element>;
+                onFocus: import("react").FocusEventHandler<Element>;
+                onKeyDown: import("react").KeyboardEventHandler<Element>;
+                onKeyUp: import("react").KeyboardEventHandler<Element>;
+                onMouseDown: import("react").MouseEventHandler<Element>;
+                onMouseLeave: import("react").MouseEventHandler<Element>;
+                onMouseUp: import("react").MouseEventHandler<Element>;
+                ref: import("react").Ref<any>;
+            };
+        }, "disabled" | "selected" | "active"> & {
+            children?: import("react").ReactNode;
+        }>>>;
+        Panel: import("react").ForwardRefExoticComponent<Pick<{
+            className?: string | undefined;
+            ref?: import("react").Ref<any> | undefined;
+        }, "className"> & import("react").RefAttributes<import("@mui/types").OverridableComponent<import("@mui/base/TabPanelUnstyled/TabPanelUnstyledProps").TabPanelUnstyledTypeMap<{}, "div">>>>;
+    };
+};

package/Tabs/tw/bare.js

@@ -0,0 +1,15 @@
+import { classed, extendComponent } from "../../helpers";
+// import type { ComponentsProps } from "../TabsMui";
+import * as _ from "../TabsMui";
+export const Root = classed(_.Root) `< class="tabs`;
+export const List = classed(_.List) `< class="tabsList flex`;
+export const Tab = classed(_.Tab) `< class="tabsTab inline-flex items-center justify-center [-webkit-tap-highlight-color:transparent] appearance-none select-none`;
+export const Indicator = classed(_.Indicator) `< class="tabsIndicator`;
+export const Panel = classed(_.Panel) `< class="tabsPanel`;
+export const KoineTabs = extendComponent(_.KoineTabs, {
+    Root,
+    List,
+    Tab,
+    Indicator,
+    Panel,
+});