@react95/core 8.0.0-alpha.10 → 8.0.0-alpha.11

package/esm/Tabs/Tab.mjs

@@ -1,8 +1,8 @@
-import React__default, { forwardRef } from "react";
+import React, { forwardRef } from "react";
 import { tab } from "./Tabs.css.mjs";
 import { Frame } from "../Frame/Frame.mjs";
 const Tab = forwardRef(
-  ({ activeTab, title, ...rest }, ref) => /* @__PURE__ */ React__default.createElement(
+  ({ activeTab, title, ...rest }, ref) => /* @__PURE__ */ React.createElement(
     Frame,
     {
       ...rest,

package/esm/Tabs/Tabs.mjs

@@ -1,15 +1,15 @@
-import React__default, { forwardRef } from "react";
+import React, { forwardRef, Children, useState } from "react";
 import cn from "classnames";
 import { Tab } from "./Tab.mjs";
 import { navbar, navContainer } from "./Tabs.css.mjs";
 import { Frame } from "../Frame/Frame.mjs";
 const Tabs = forwardRef(
   ({ children, defaultActiveTab, onChange, ...rest }, ref) => {
-    const [firstTab] = React__default.Children.toArray(children);
-    const [activeTab, setActiveTab] = React__default.useState(
+    const [firstTab] = Children.toArray(children);
+    const [activeTab, setActiveTab] = useState(
       defaultActiveTab || firstTab.props.title
     );
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
       Frame,
       {
         ...rest,
@@ -17,29 +17,26 @@ const Tabs = forwardRef(
         as: "ol",
         ref
       },
-      React__default.Children.map(
-        children,
-        (child) => {
-          const { title, disabled } = child.props;
-          return /* @__PURE__ */ React__default.createElement(
-            Tab,
-            {
-              key: title,
-              ...child.props,
-              activeTab,
-              onClick: (e) => {
-                if (!disabled) {
-                  if (onChange) {
-                    onChange(title, e);
-                  }
-                  setActiveTab(title);
+      Children.map(children, (child) => {
+        const { title, disabled } = child.props;
+        return /* @__PURE__ */ React.createElement(
+          Tab,
+          {
+            key: title,
+            ...child.props,
+            activeTab,
+            onClick: (e) => {
+              if (!disabled) {
+                if (onChange) {
+                  onChange(title, e);
                 }
+                setActiveTab(title);
               }
             }
-          );
-        }
-      )
-    ), /* @__PURE__ */ React__default.createElement(Frame, { className: navContainer, width: rest.width || rest.w }, React__default.Children.map(
+          }
+        );
+      })
+    ), /* @__PURE__ */ React.createElement(Frame, { className: navContainer, width: rest.width || rest.w }, Children.map(
       children,
       (child) => child.props.title === activeTab && child.props.children
     )));

package/esm/TaskBar/Clock.mjs

@@ -1,4 +1,4 @@
-import React__default, { useState, useEffect } from "react";
+import React, { useState, useEffect } from "react";
 import { Frame } from "../Frame/Frame.mjs";
 import { Tooltip } from "../Tooltip/Tooltip.mjs";
 import { tooltip } from "./TaskBar.css.mjs";
@@ -16,7 +16,7 @@ const Clock = () => {
     });
     return () => clearInterval(interval);
   }, []);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ React.createElement(
     Frame,
     {
       boxShadow: "$in",
@@ -26,7 +26,7 @@ const Clock = () => {
       justifyContent: "center",
       alignItems: "center"
     },
-    /* @__PURE__ */ React__default.createElement(Tooltip, { className: tooltip }, timer)
+    /* @__PURE__ */ React.createElement(Tooltip, { className: tooltip }, timer)
   );
 };
 export {

package/esm/TaskBar/TaskBar.mjs

@@ -1,4 +1,4 @@
-import React__default, { forwardRef, useState, useContext } from "react";
+import React, { forwardRef, useState, useContext } from "react";
 import { ModalContext } from "../Modal/ModalContext.mjs";
 import { Frame } from "../Frame/Frame.mjs";
 import { Clock } from "./Clock.mjs";
@@ -10,7 +10,7 @@ const TaskBar = forwardRef(
     const [showList, toggleShowList] = useState(false);
     const [activeStart, toggleActiveStart] = useState(false);
     const { windows, activeWindow, setActiveWindow } = useContext(ModalContext);
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ React.createElement(
       Frame,
       {
         position: "fixed",
@@ -27,7 +27,7 @@ const TaskBar = forwardRef(
         boxShadow: "$out",
         ref
       },
-      showList && /* @__PURE__ */ React__default.createElement(
+      showList && /* @__PURE__ */ React.createElement(
         Frame,
         {
           position: "absolute",
@@ -39,11 +39,11 @@ const TaskBar = forwardRef(
         },
         list
       ),
-      /* @__PURE__ */ React__default.createElement(
+      /* @__PURE__ */ React.createElement(
         WindowButton,
         {
           small: true,
-          icon: /* @__PURE__ */ React__default.createElement(Logo, { variant: "32x32_4" }),
+          icon: /* @__PURE__ */ React.createElement(Logo, { variant: "32x32_4" }),
           active: activeStart,
           onClick: () => {
             toggleActiveStart(!activeStart);
@@ -52,8 +52,8 @@ const TaskBar = forwardRef(
         },
         "Start"
       ),
-      /* @__PURE__ */ React__default.createElement(Frame, { w: "100%", paddingLeft: "$0", ml: "$2", display: "flex" }, Object.entries(windows).map(
-        ([windowId, { icon, title, hasButton }]) => hasButton && /* @__PURE__ */ React__default.createElement(
+      /* @__PURE__ */ React.createElement(Frame, { w: "100%", paddingLeft: "$0", ml: "$2", display: "flex" }, Object.entries(windows).map(
+        ([windowId, { icon, title, hasButton }]) => hasButton && /* @__PURE__ */ React.createElement(
           WindowButton,
           {
             key: windowId,
@@ -62,10 +62,10 @@ const TaskBar = forwardRef(
             onClick: () => setActiveWindow(windowId),
             small: false
           },
-          /* @__PURE__ */ React__default.createElement("div", { className: truncate }, title)
+          /* @__PURE__ */ React.createElement("div", { className: truncate }, title)
         )
       )),
-      /* @__PURE__ */ React__default.createElement(Clock, null)
+      /* @__PURE__ */ React.createElement(Clock, null)
     );
   }
 );

package/esm/TaskBar/WindowButton.mjs

@@ -1,14 +1,14 @@
-import React__default, { forwardRef } from "react";
+import React, { forwardRef } from "react";
 import { windowsButton, icon } from "./TaskBar.css.mjs";
 const WindowButton = forwardRef(
-  ({ children, small = false, icon: icon$1, active = false, ...props }, ref) => /* @__PURE__ */ React__default.createElement(
+  ({ children, small = false, icon: icon$1, active = false, ...props }, ref) => /* @__PURE__ */ React.createElement(
     "button",
     {
       className: windowsButton({ active, small }),
       ...props,
       ref
     },
-    /* @__PURE__ */ React__default.createElement("div", { className: icon }, icon$1),
+    /* @__PURE__ */ React.createElement("div", { className: icon }, icon$1),
     children
   )
 );

package/esm/TextArea/TextArea.mjs

@@ -1,7 +1,7 @@
-import * as React from "react";
+import React, { forwardRef } from "react";
 import { Frame } from "../Frame/Frame.mjs";
 import { input } from "../Input/Input.css.mjs";
-const TextArea = React.forwardRef(
+const TextArea = forwardRef(
   (rest, ref) => /* @__PURE__ */ React.createElement(Frame, { ...rest, ref, className: input, as: "textarea" })
 );
 export {

package/esm/TitleBar/TitleBar.mjs

@@ -1,18 +1,20 @@
-import React__default from "react";
+import React, { forwardRef } from "react";
 import { Frame } from "../Frame/Frame.mjs";
 import { optionsBox, option, titleBarBackground, title } from "./TitleBar.css.mjs";
 import { button } from "../Button/Button.css.mjs";
 import cn from "classnames";
-const OptionsBox = React__default.forwardRef((rest, ref) => /* @__PURE__ */ React__default.createElement(
-  Frame,
-  {
-    ...rest,
-    ref,
-    className: cn(optionsBox, rest.className)
-  }
-));
-const Option = React__default.forwardRef(
-  (rest, ref) => /* @__PURE__ */ React__default.createElement(
+const OptionsBox = forwardRef(
+  (rest, ref) => /* @__PURE__ */ React.createElement(
+    Frame,
+    {
+      ...rest,
+      ref,
+      className: cn(optionsBox, rest.className)
+    }
+  )
+);
+const Option = forwardRef(
+  (rest, ref) => /* @__PURE__ */ React.createElement(
     Frame,
     {
       ...rest,
@@ -22,7 +24,7 @@ const Option = React__default.forwardRef(
     }
   )
 );
-const TitleBarRenderer = ({ children, title: title$1 = "UNKNOWN.EXE", icon, active = true, ...rest }, ref) => /* @__PURE__ */ React__default.createElement(
+const TitleBarRenderer = ({ children, title: title$1 = "UNKNOWN.EXE", icon, active = true, ...rest }, ref) => /* @__PURE__ */ React.createElement(
   Frame,
   {
     ...rest,
@@ -30,11 +32,11 @@ const TitleBarRenderer = ({ children, title: title$1 = "UNKNOWN.EXE", icon, acti
     ref
   },
   icon && icon,
-  /* @__PURE__ */ React__default.createElement("div", { className: title }, title$1),
+  /* @__PURE__ */ React.createElement("div", { className: title }, title$1),
   children
 );
 const TitleBar = Object.assign(
-  React__default.forwardRef(TitleBarRenderer),
+  forwardRef(TitleBarRenderer),
   {
     Option,
     OptionsBox

package/esm/Tooltip/Tooltip.mjs

@@ -1,6 +1,6 @@
-import * as React from "react";
-import { wrapper, tip } from "./Tooltip.css.mjs";
+import React, { forwardRef, useState } from "react";
 import cn from "classnames";
+import { wrapper, tip } from "./Tooltip.css.mjs";
 function formatDate(date) {
   const monthNames = [
     "January",
@@ -27,8 +27,8 @@ const TooltipRenderer = ({
   delay = 1e3,
   ...rest
 }, ref) => {
-  const [show, setShow] = React.useState(false);
-  const [delayTimer, setDelayTimer] = React.useState(0);
+  const [show, setShow] = useState(false);
+  const [delayTimer, setDelayTimer] = useState(0);
   const handleEnter = () => {
     const timer = window.setTimeout(() => {
       setShow(true);
@@ -52,7 +52,7 @@ const TooltipRenderer = ({
     children
   );
 };
-const Tooltip = React.forwardRef(
+const Tooltip = forwardRef(
   TooltipRenderer
 );
 export {

package/esm/Tree/Node.mjs

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React, { useState } from "react";
 import { MediaCd, FileText, Bat, FileFont2, FilePen, FileSettings, FileTextSettings, BatExec, FolderOpen, Folder } from "@react95/icons";
 import { node, nodeContent, folderStatus, iconContainer, label, tree, nodeRoot } from "./Tree.css.mjs";
 import { Frame } from "../Frame/Frame.mjs";
@@ -40,7 +40,7 @@ const Node = ({
   },
   ...rest
 }) => {
-  const [isOpen, setIsOpen] = React.useState(false);
+  const [isOpen, setIsOpen] = useState(false);
   const hasChildren = children.length > 0;
   const onClickHandler = (event) => {
     onClick(event, {

package/esm/Tree/Tree.mjs

@@ -1,10 +1,10 @@
-import React__default, { forwardRef } from "react";
+import React, { forwardRef } from "react";
 import { NodeRoot, Node, icons } from "./Node.mjs";
 import { tree } from "./Tree.css.mjs";
 import { Frame } from "../Frame/Frame.mjs";
 const Tree = forwardRef(
   ({ data, root, ...rest }, ref) => {
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, root && /* @__PURE__ */ React__default.createElement(NodeRoot, { ...root }), /* @__PURE__ */ React__default.createElement(Frame, { ...rest, className: tree, as: "ul", ref }, data.map((dataNode) => /* @__PURE__ */ React__default.createElement(Node, { key: dataNode.id, ...dataNode }))));
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, root && /* @__PURE__ */ React.createElement(NodeRoot, { ...root }), /* @__PURE__ */ React.createElement(Frame, { ...rest, className: tree, as: "ul", ref }, data.map((dataNode) => /* @__PURE__ */ React.createElement(Node, { key: dataNode.id, ...dataNode }))));
   }
 );
 Tree.defaultProps = {

package/esm/Video/Video.mjs

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React, { forwardRef, useState, useRef, useImperativeHandle, useEffect } from "react";
 import { Mplayer113, User4 } from "@react95/icons";
 import { videoTag, divider, countDownContainer, videoFont, currentTime, elapsedTime, controls, controlBtn, range } from "./Video.css.mjs";
 import { Frame } from "../Frame/Frame.mjs";
@@ -28,20 +28,20 @@ function parseCurrentTime(secs) {
   return [hours, minutes, seconds].map((v) => v < 10 ? `0${v}` : v).filter((v, i) => v !== "00" || i > 0).join(":");
 }
 const VideoRenderer = ({ name, src, videoProps, ...props }, ref) => {
-  const [playing, setPlaying] = React.useState(false);
-  const [loadeddata, setLoadeddata] = React.useState(false);
-  const [progress, setProgress] = React.useState(0);
-  const player = React.useRef(null);
-  const progressRef = React.useRef(null);
-  const wrapperRef = React.useRef(null);
-  const playPauseRef = React.useRef(null);
-  const stopRef = React.useRef(null);
-  const fullScreenRef = React.useRef(null);
+  const [playing, setPlaying] = useState(false);
+  const [loadeddata, setLoadeddata] = useState(false);
+  const [progress, setProgress] = useState(0);
+  const player = useRef(null);
+  const progressRef = useRef(null);
+  const wrapperRef = useRef(null);
+  const playPauseRef = useRef(null);
+  const stopRef = useRef(null);
+  const fullScreenRef = useRef(null);
   const paths = arrayFy(src);
   const [pathname] = paths;
   const normalizedName = name || pathname.replace(/^.*[\\/]/, "");
   const title = `${normalizedName}${!loadeddata ? " (Opening)" : ""}`;
-  React.useImperativeHandle(ref, () => ({
+  useImperativeHandle(ref, () => ({
     get video() {
       return player;
     },
@@ -61,7 +61,7 @@ const VideoRenderer = ({ name, src, videoProps, ...props }, ref) => {
       return fullScreenRef;
     }
   }));
-  React.useEffect(() => {
+  useEffect(() => {
     var _a, _b, _c, _d;
     (_a = player.current) == null ? void 0 : _a.addEventListener(
       "ended",
@@ -127,6 +127,7 @@ const VideoRenderer = ({ name, src, videoProps, ...props }, ref) => {
     ), /* @__PURE__ */ React.createElement("div", { className: videoFont, style: { height: 12 } }, !loadeddata && "Openning")), /* @__PURE__ */ React.createElement(Frame, { display: "flex", flexDirection: "column", w: "40%" }, /* @__PURE__ */ React.createElement("div", { className: cn(videoFont, currentTime) }, player.current && parseCurrentTime(player.current.currentTime)), /* @__PURE__ */ React.createElement("div", { className: cn(videoFont, elapsedTime) }, "time"))), /* @__PURE__ */ React.createElement("div", { className: controls }, /* @__PURE__ */ React.createElement(
       Button,
       {
+        as: "button",
         className: controlBtn,
         disabled: !loadeddata,
         onClick: () => {
@@ -200,7 +201,7 @@ const VideoRenderer = ({ name, src, videoProps, ...props }, ref) => {
     )))
   );
 };
-const Video = React.forwardRef(VideoRenderer);
+const Video = forwardRef(VideoRenderer);
 export {
   Video
 };

package/esm/Video/buttons/Fullscreen.mjs

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 const Fullscreen = (props) => /* @__PURE__ */ React.createElement(
   "svg",
   {

package/esm/Video/buttons/Pause.mjs

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 const Pause = (props) => /* @__PURE__ */ React.createElement(
   "svg",
   {

package/esm/Video/buttons/Play.mjs

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 const Play = (props) => /* @__PURE__ */ React.createElement(
   "svg",
   {

package/esm/Video/buttons/Stop.mjs

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 const Stop = (props) => /* @__PURE__ */ React.createElement(
   "svg",
   {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react95/core",
-  "version": "8.0.0-alpha.10",
+  "version": "8.0.0-alpha.11",
   "description": "Windows 95 styleguide",
   "main": "cjs/index.cjs",
   "type": "module",
@@ -55,7 +55,7 @@
     "nostalgic",
     "design-system"
   ],
-  "gitHead": "2fe5ce2a0b216ee120f3e2ad8756cc505d32b3c3",
+  "gitHead": "f6a0e8d85480ee86cab55bea9d73fbb448fa1517",
   "module": "esm/index.mjs",
   "private": false,
   "types": "types/index.d.ts"

package/types/Avatar/Avatar.d.ts

@@ -1,6 +1,9 @@
-import * as React from 'react';
+import React from 'react';
+import type { ElementType, ReactElement, ElementRef, ForwardedRef, ImgHTMLAttributes } from 'react';
 import { FrameProps } from '../Frame/Frame';
-export interface AvatarProps extends Omit<React.ImgHTMLAttributes<HTMLDivElement>, 'width' | 'color' | 'height'>, FrameProps {
+export type AvatarProps<TAs extends ElementType> = Omit<ImgHTMLAttributes<HTMLDivElement>, 'width' | 'color' | 'height'> & FrameProps<TAs> & {
     circle?: boolean;
-}
-export declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+export declare const Avatar: <TAs extends React.ElementType = "div">(props: AvatarProps<TAs> & {
+    ref?: ForwardedRef<ElementRef<TAs>>;
+}) => ReactElement;

package/types/Button/Button.d.ts

@@ -1,4 +1,7 @@
 import React from 'react';
+import type { ElementType, ReactElement, ElementRef, ForwardedRef, ButtonHTMLAttributes } from 'react';
 import { FrameProps } from '../Frame/Frame';
-export type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & FrameProps;
-export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export type ButtonProps<TAs extends ElementType> = ButtonHTMLAttributes<HTMLButtonElement> & FrameProps<TAs>;
+export declare const Button: <TAs extends React.ElementType = "button">(props: ButtonProps<TAs> & {
+    ref?: ForwardedRef<ElementRef<TAs>>;
+}) => ReactElement;

package/types/Checkbox/Checkbox.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
+import type { CSSProperties, HTMLProps } from 'react';
 export type LabelProps = {
     disabled?: boolean;
 };
 export type CheckboxProps = {
     label?: string;
     children?: string;
-    style?: React.CSSProperties;
-} & LabelProps & React.HTMLProps<HTMLInputElement>;
+    style?: CSSProperties;
+} & LabelProps & HTMLProps<HTMLInputElement>;
 export declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/types/Dropdown/Dropdown.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
+import type { HTMLProps } from 'react';
 import { FrameProps } from '../Frame/Frame';
 export type DropdownProps = {
     options?: Array<string | number>;
-} & React.HTMLProps<HTMLSelectElement> & Omit<FrameProps<'select'>, 'as'>;
+} & HTMLProps<HTMLSelectElement> & Omit<FrameProps<'select'>, 'as'>;
 export declare const Dropdown: React.ForwardRefExoticComponent<Omit<DropdownProps, "ref"> & React.RefAttributes<HTMLSelectElement>>;

package/types/Fieldset/Fieldset.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
+import type { HTMLProps } from 'react';
 import { FrameProps } from '../Frame/Frame';
 export type FieldSetProps = {
     legend?: string;
-} & React.HTMLProps<HTMLFieldSetElement> & FrameProps;
+} & HTMLProps<HTMLFieldSetElement> & Omit<FrameProps<'fieldset'>, 'as'>;
 export declare const Fieldset: React.ForwardRefExoticComponent<Omit<FieldSetProps, "ref"> & React.RefAttributes<HTMLFieldSetElement>>;

package/types/Frame/Frame.d.ts

@@ -1,10 +1,13 @@
-import React, { ComponentPropsWithRef, ElementType } from 'react';
+import React from 'react';
+import type { ComponentPropsWithRef, ElementType, Ref, ReactNode, RefAttributes } from 'react';
 import { Sprinkles } from './Frame.css';
+type FixedForwardRef = <T, P = object>(render: (props: P, ref: Ref<T>) => ReactNode) => (props: P & RefAttributes<T>) => ReactNode;
+export declare const fixedForwardRef: FixedForwardRef;
 type DistributiveOmit<T, TOmitted extends PropertyKey> = T extends any ? Omit<T, TOmitted> : never;
-export type FrameProps<TAs extends ElementType = 'div'> = {
+export type FrameProps<TAs extends ElementType> = {
     as?: TAs;
 } & DistributiveOmit<ComponentPropsWithRef<ElementType extends TAs ? 'div' : TAs>, 'as'> & Sprinkles;
-export declare const Frame: <TAs extends React.ElementType>(props: {
+export declare const Frame: <TAs extends React.ElementType = "div">(props: {
     as?: TAs | undefined;
 } & DistributiveOmit<React.ComponentPropsWithRef<React.ElementType extends TAs ? "div" : TAs>, "as"> & import("rainbow-sprinkles/dist/declarations/src/types").ChildSprinkles<{
     readonly backgroundColor: {
@@ -2247,5 +2250,5 @@ export declare const Frame: <TAs extends React.ElementType>(props: {
             default: string;
         };
     };
-}> & React.RefAttributes<any>) => React.ReactNode;
+}> & React.RefAttributes<any>) => ReactNode;
 export {};

package/types/Input/Input.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { FrameProps } from '../Frame/Frame';
 export type InputProps = Omit<FrameProps<'input'>, 'as'>;
 export declare const Input: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/types/List/List.d.ts

@@ -1,7 +1,7 @@
+import React from 'react';
 import { ListItem } from './ListItem';
 import { Divider } from './ListDivider';
 import { FrameProps } from '../Frame/Frame';
-import React from 'react';
 export type ListProps = Omit<FrameProps<'ul'>, 'as'>;
 declare const ListRenderer: React.ForwardRefExoticComponent<Omit<ListProps, "ref"> & React.RefAttributes<HTMLUListElement>>;
 export type IListProps = typeof ListRenderer & {

package/types/List/ListItem.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
+import type { ReactElement, HtmlHTMLAttributes } from 'react';
 export type ListItemProps = {
-    icon?: React.ReactElement;
-} & React.HtmlHTMLAttributes<HTMLLIElement>;
+    icon?: ReactElement;
+} & HtmlHTMLAttributes<HTMLLIElement>;
 export declare const ListItem: React.ForwardRefExoticComponent<{
     icon?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
 } & React.HtmlHTMLAttributes<HTMLLIElement> & React.RefAttributes<HTMLLIElement>>;

package/types/Modal/Modal.d.ts

@@ -1,30 +1,30 @@
 /// <reference path="../../../../../types/draggable.d.ts" />
-import * as React from 'react';
+import React, { HTMLAttributes, ReactElement, MouseEvent } from 'react';
 import { DraggableProps } from 'react-draggable';
 import { List } from '../List/List';
 import { FrameProps } from '../Frame/Frame';
 export type ModalButtons = {
     value: string;
-    onClick(event: React.MouseEvent): void;
+    onClick(event: MouseEvent): void;
 };
 export type ModalMenu = {
     name: string;
-    list: React.ReactElement<typeof List>;
+    list: ReactElement<typeof List>;
 };
 export type ModalDefaultPosition = {
     x: number;
     y: number;
 };
 export type ModalProps = {
-    icon?: React.ReactElement;
-    onClose(event: React.MouseEvent): void;
-    onHelp?(event: React.MouseEvent): void;
+    icon?: ReactElement;
+    onClose(event: MouseEvent): void;
+    onHelp?(event: MouseEvent): void;
     title: string;
     buttons?: Array<ModalButtons>;
     menu?: Array<ModalMenu>;
     defaultPosition?: DraggableProps['defaultPosition'];
     positionOffset?: DraggableProps['positionOffset'];
     hasWindowButton?: boolean;
-    buttonsAlignment?: FrameProps['justifyContent'];
-} & Omit<FrameProps, 'as'> & React.HTMLAttributes<HTMLDivElement>;
+    buttonsAlignment?: FrameProps<'div'>['justifyContent'];
+} & Omit<FrameProps<'div'>, 'as'> & HTMLAttributes<HTMLDivElement>;
 export declare const Modal: React.ForwardRefExoticComponent<Omit<ModalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/types/Modal/ModalContext.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import type { ReactElement } from 'react';
 export type Windows = {
-    icon?: React.ReactElement;
+    icon?: ReactElement;
     title: string;
     hasButton: boolean;
 };

package/types/Modal/ModalProvider.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
+import type { FC, PropsWithChildren } from 'react';
 export type ModalProviderProps = {};
-export declare const ModalProvider: React.FC<React.PropsWithChildren<ModalProviderProps>>;
+export declare const ModalProvider: FC<PropsWithChildren<ModalProviderProps>>;

package/types/ProgressBar/ProgressBar.d.ts

@@ -1,6 +1,9 @@
 import React from 'react';
+import type { ElementType, ReactElement, ElementRef, ForwardedRef } from 'react';
 import { FrameProps } from '../Frame/Frame';
-export type ProgressBarProps = {
+export type ProgressBarProps<TAs extends ElementType> = {
     percent?: number;
-} & FrameProps;
-export declare const ProgressBar: React.ForwardRefExoticComponent<Omit<ProgressBarProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+} & FrameProps<TAs>;
+export declare const ProgressBar: <TAs extends React.ElementType = "div">(props: ProgressBarProps<TAs> & {
+    ref?: ForwardedRef<ElementRef<TAs>>;
+}) => ReactElement;

package/types/RadioButton/RadioButton.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
-export type RadioButtonProps = React.InputHTMLAttributes<HTMLInputElement>;
+import type { InputHTMLAttributes } from 'react';
+export type RadioButtonProps = InputHTMLAttributes<HTMLInputElement>;
 export declare const RadioButton: React.ForwardRefExoticComponent<RadioButtonProps & React.RefAttributes<HTMLInputElement>>;

package/types/Range/Range.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { FrameProps } from '../Frame/Frame';
 export type RangeProps = Omit<FrameProps<'input'>, 'as'>;
 export declare const Range: React.ForwardRefExoticComponent<Omit<RangeProps, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/types/Tabs/Tab.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
+import type { MouseEvent, HTMLProps } from 'react';
 import { FrameProps } from '../Frame/Frame';
 export type TabProps = {
     activeTab?: string;
     title: string;
     disabled?: boolean;
-    onClick?(e: React.MouseEvent): void;
-} & React.HTMLProps<HTMLLIElement> & Omit<FrameProps<'li'>, 'as'>;
+    onClick?(e: MouseEvent): void;
+} & HTMLProps<HTMLLIElement> & Omit<FrameProps<'li'>, 'as'>;
 export declare const Tab: React.ForwardRefExoticComponent<Omit<TabProps, "ref"> & React.RefAttributes<HTMLLIElement>>;