@koobiq/react-components 0.0.1-beta.8 → 0.0.1

package/dist/components/Tooltip/types.d.ts

@@ -1,20 +1,35 @@
 import type { ReactNode, RefObject, ComponentRef, ReactElement, DOMAttributes } from 'react';
-import type { DataAttributeProps } from '@koobiq/react-core';
-export type TooltipPropControl = (props: DOMAttributes<HTMLElement> & {
-    ref: ((node: HTMLElement | null) => void) | null;
+import type { DataAttributeProps, FocusableElement } from '@koobiq/react-core';
+export type TooltipPropControl = (props: DOMAttributes<FocusableElement | null> & {
+    ref: ((node: FocusableElement | null) => void) | null;
 }) => ReactElement;
 export declare const tooltipPropPlacement: readonly ["bottom", "bottom start", "bottom end", "top", "top start", "top end", "start", "start top", "start bottom", "end", "end top", "end bottom"];
 export declare const tooltipPropVariant: readonly ["contrast", "contrast-fade", "error", "warning", "theme"];
 export type TooltipPropVariant = (typeof tooltipPropVariant)[number];
 export type TooltipPropPlacement = (typeof tooltipPropPlacement)[number];
+type TooltipDeprecatedProps = {
+    /**
+     * If `true`, the component is shown.
+     * @default false
+     *
+     * The "open" prop is deprecated. Use "isOpen" prop to replace it.
+     */
+    open?: boolean;
+    /**
+     * If `true`, the component is disabled.
+     * @deprecated
+     * The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
+     */
+    disabled?: boolean;
+};
 export type TooltipProps = {
     /**
      * The variant to use.
-     * @default contrast
-     * */
+     * @default 'contrast'
+     */
     variant?: TooltipPropVariant;
     /** If `true`, the component is shown. */
-    open?: boolean;
+    isOpen?: boolean;
     /** The default open state. Use when the component is not controlled. */
     defaultOpen?: boolean;
     /** Handler that is called when the overlay's open state changes. */
@@ -22,16 +37,16 @@ export type TooltipProps = {
     /**
      * If `true`, the tooltip should be disabled, independent of the trigger.
      * @default false
-     * */
-    disabled?: boolean;
+     */
+    isDisabled?: boolean;
     /** The content of the component. */
     children?: ReactNode;
     /** The render function of the control for displaying the tooltip. */
     control?: TooltipPropControl;
     /**
      * The placement of the element with respect to its anchor element.
-     * @default top
-     * */
+     * @default 'top'
+     */
     placement?: TooltipPropPlacement;
     /** The ref for the element which the popover positions itself with respect to. */
     anchorRef?: RefObject<HTMLElement | null>;
@@ -55,7 +70,7 @@ export type TooltipProps = {
     /**
      * If `true`, the arrow isn't shown.
      * @default false
-     * */
+     */
     hideArrow?: boolean;
     /**
      * The delay time for the tooltip to show up.
@@ -82,5 +97,6 @@ export type TooltipProps = {
      * @default document.body
      */
     portalContainer?: Element;
-} & DataAttributeProps;
+} & TooltipDeprecatedProps & DataAttributeProps;
 export type TooltipRef = ComponentRef<'div'>;
+export {};

package/dist/components/Typography/types.d.ts

@@ -2,7 +2,12 @@ import type { ReactNode } from 'react';
 export declare const typographyPropVariant: readonly ["display-big", "display-normal", "display-compact", "display-big-strong", "display-normal-strong", "display-compact-strong", "headline", "title", "subheading", "text-big", "text-big-strong", "text-big-medium", "text-normal", "text-normal-strong", "text-normal-medium", "text-compact", "text-compact-strong", "text-compact-medium", "caps-big", "caps-big-strong", "caps-normal", "caps-normal-strong", "caps-compact", "caps-compact-strong", "mono-big", "mono-big-strong", "mono-normal", "mono-normal-strong", "mono-compact", "mono-compact-strong", "mono-codeblock", "tabular-big", "tabular-big-strong", "tabular-normal", "tabular-normal-strong", "tabular-compact", "tabular-compact-strong", "italic-big", "italic-big-strong", "italic-normal", "italic-normal-strong", "italic-compact", "italic-compact-strong", "inherit"];
 export type TypographyPropVariant = (typeof typographyPropVariant)[number];
 export declare const typographyPropDisplay: readonly ["block", "inline", "inline-block"];
+/**
+ * @deprecated
+ * This type has been deprecated, please use `TypographyPropDisplay` instead.
+ */
 export type TypographyDisplayVariant = (typeof typographyPropDisplay)[number];
+export type TypographyPropDisplay = (typeof typographyPropDisplay)[number];
 export declare const typographyPropAlign: readonly ["start", "center", "end", "initial", "inherit"];
 export type TypographyPropAlign = (typeof typographyPropAlign)[number];
 export declare const typographyPropColor: readonly ["white", "white-secondary", "theme", "theme-secondary", "contrast", "on-contrast", "contrast-secondary", "contrast-tertiary", "error", "error-secondary", "error-tertiary", "error-less", "success", "success-less", "success-secondary", "warning", "warning-secondary", "visited", "inherit"];
@@ -10,11 +15,11 @@ export type TypographyPropColor = (typeof typographyPropColor)[number];
 export type TypographyBaseProps = {
     /**
      * The variant to use.
-     * @default text-normal
-     * */
+     * @default 'text-normal'
+     */
     variant?: TypographyPropVariant;
     /** Set the display for the component. */
-    display?: TypographyDisplayVariant;
+    display?: TypographyPropDisplay;
     /** Set the text-align on the component. */
     align?: TypographyPropAlign;
     /** Hidden overflow content will be replaced by an ellipsis. */
@@ -25,7 +30,7 @@ export type TypographyBaseProps = {
     className?: string;
     /**
      * Text color.
-     * @default contrast
-     * */
+     * @default 'contrast'
+     */
     color?: TypographyPropColor;
 };

package/dist/components/index.d.ts

@@ -24,4 +24,15 @@ export * from './Popover';
 export * from './Tooltip';
 export * from './List';
 export * from './AnimatedIcon';
+export * from './Select';
+export * from './Divider';
+export * from './Menu';
+export * from './ButtonToggleGroup';
+export * from './TagGroup';
+export * from './Table';
+export * from './Calendar';
+export * from './DateInput';
+export * from './DatePicker';
 export * from './layout';
+export { useListData, type ListData, type ListOptions, } from '@koobiq/react-primitives';
+export { useRouter, useLocale, type Locale, RouterProvider, useDateFormatter, } from '@koobiq/react-core';

package/dist/index.js

@@ -1,4 +1,6 @@
 /* empty css           */
+import { useListData } from "@koobiq/react-primitives";
+import { RouterProvider, useDateFormatter, useLocale, useRouter } from "@koobiq/react-core";
 import { Provider, defaultBreakpoints } from "./components/Provider/Provider.js";
 import { BreakpointsProvider } from "./components/Provider/BreakpointsProvider.js";
 import { ProviderContext, useProvider } from "./components/Provider/ProviderContext.js";
@@ -43,22 +45,38 @@ import { Grid } from "./components/Grid/Grid.js";
 import { GridItem } from "./components/Grid/components/GridItem/GridItem.js";
 import { SkeletonBlock } from "./components/SkeletonBlock/SkeletonBlock.js";
 import { SkeletonTypography } from "./components/SkeletonTypography/SkeletonTypography.js";
-import { DialogHeader, DialogHeader as DialogHeader2, DialogHeader as DialogHeader3, DialogHeader as DialogHeader4 } from "./components/Dialog/components/DialoglHeader.js";
-import { DialogFooter, DialogFooter as DialogFooter2, DialogFooter as DialogFooter3, DialogFooter as DialogFooter4 } from "./components/Dialog/components/DialogFooter.js";
-import { DialogContent, DialogContent as DialogContent2, DialogContent as DialogContent3, DialogContent as DialogContent4 } from "./components/Dialog/components/DialogContent.js";
 import { Modal } from "./components/Modal/Modal.js";
 import { modalPropSize } from "./components/Modal/types.js";
+import { ModalContent, ModalFooter, ModalHeader } from "./components/Modal/index.js";
 import { SidePanel } from "./components/SidePanel/SidePanel.js";
-import { sidePanelPropPosition, sidePanelPropSize } from "./components/SidePanel/types.js";
+import { sidePanelPropPlacement, sidePanelPropPosition, sidePanelPropSize } from "./components/SidePanel/types.js";
+import { SidePanelContent, SidePanelFooter, SidePanelHeader } from "./components/SidePanel/index.js";
 import { Popover } from "./components/Popover/Popover.js";
-import { popoverPropPlacement, popoverPropSize } from "./components/Popover/types.js";
+import { popoverPropPlacement, popoverPropSize, popoverPropType } from "./components/Popover/types.js";
+import { PopoverContent, PopoverFooter, PopoverHeader } from "./components/Popover/index.js";
 import { Tooltip } from "./components/Tooltip/Tooltip.js";
 import { tooltipPropPlacement, tooltipPropVariant } from "./components/Tooltip/types.js";
-import { List, ListRender } from "./components/List/List.js";
+import { Item } from "./components/Collections/Item.js";
+import { Section } from "./components/Collections/Section.js";
+import { List, ListInner } from "./components/List/List.js";
+import { ListItemText } from "./components/List/components/ListItemText/ListItemText.js";
 import { listPropSelectionMode } from "./components/List/types.js";
-import { ListItem } from "./components/List/ListItem.js";
-import { ListSection } from "./components/List/ListSection.js";
 import { AnimatedIcon } from "./components/AnimatedIcon/AnimatedIcon.js";
+import { Select } from "./components/Select/Select.js";
+import { Divider } from "./components/Divider/Divider.js";
+import { dividerPropDisplay, dividerPropOrientation } from "./components/Divider/types.js";
+import { Menu } from "./components/Menu/Menu.js";
+import { menuPropSelectionMode } from "./components/Menu/types.js";
+import { ButtonToggleGroup } from "./components/ButtonToggleGroup/ButtonToggleGroup.js";
+import { ButtonToggle } from "./components/ButtonToggleGroup/components/ButtonToggle/ButtonToggle.js";
+import { TagGroup } from "./components/TagGroup/TagGroup.js";
+import { Tag } from "./components/TagGroup/Tag.js";
+import { tagGroupPropVariant } from "./components/TagGroup/types.js";
+import { Table } from "./components/Table/Table.js";
+import { Calendar } from "./components/Calendar/Calendar.js";
+import { DateInput, DateInputRender } from "./components/DateInput/DateInput.js";
+import { dateInputPropVariant } from "./components/DateInput/types.js";
+import { DatePicker, DatePickerRender } from "./components/DatePicker/DatePicker.js";
 import { flex, flexPropAlignItems, flexPropDirection, flexPropFlex, flexPropGap, flexPropJustifyContent, flexPropOrder, flexPropWrap } from "./components/layout/flex/flex.js";
 import { spacing, spacingGap } from "./components/layout/spacing/spacing.js";
 export {
@@ -68,11 +86,16 @@ export {
   BreakpointsContext,
   BreakpointsProvider,
   Button,
+  ButtonToggle,
+  ButtonToggleGroup,
+  Calendar,
   Checkbox,
   Container,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
+  DateInput,
+  DateInputRender,
+  DatePicker,
+  DatePickerRender,
+  Divider,
   FlexBox,
   Grid,
   GridItem,
@@ -81,17 +104,19 @@ export {
   InputNumber,
   Link,
   List,
-  ListItem,
-  ListRender,
-  ListSection,
+  ListInner,
+  Item as ListItem,
+  ListItemText,
+  Section as ListSection,
+  Menu,
   Modal,
-  DialogContent2 as ModalContent,
-  DialogFooter2 as ModalFooter,
-  DialogHeader2 as ModalHeader,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
   Popover,
-  DialogContent3 as PopoverContent,
-  DialogFooter3 as PopoverFooter,
-  DialogHeader3 as PopoverHeader,
+  PopoverContent,
+  PopoverFooter,
+  PopoverHeader,
   ProgressBar,
   ProgressSpinner,
   Provider,
@@ -101,12 +126,17 @@ export {
   RadioGroupContext,
   RadioGroupDescription,
   RadioGroupLabel,
+  RouterProvider,
+  Select,
   SidePanel,
-  DialogContent4 as SidePanelContent,
-  DialogFooter4 as SidePanelFooter,
-  DialogHeader4 as SidePanelHeader,
+  SidePanelContent,
+  SidePanelFooter,
+  SidePanelHeader,
   SkeletonBlock,
   SkeletonTypography,
+  Table,
+  Tag,
+  TagGroup,
   Textarea,
   Toggle,
   Tooltip,
@@ -119,7 +149,10 @@ export {
   checkboxPropSize,
   containerMarginsProp,
   containerPositionProp,
+  dateInputPropVariant,
   defaultBreakpoints,
+  dividerPropDisplay,
+  dividerPropOrientation,
   flex,
   flexPropAlignItems,
   flexPropDirection,
@@ -134,9 +167,11 @@ export {
   inputNumberPropVariant,
   inputPropVariant,
   listPropSelectionMode,
+  menuPropSelectionMode,
   modalPropSize,
   popoverPropPlacement,
   popoverPropSize,
+  popoverPropType,
   progressBarPropVariant,
   progressSpinnerPropSize,
   progressSpinnerPropVariant,
@@ -144,10 +179,12 @@ export {
   radioGroupPropSize,
   radioPropLabelPlacement,
   radioPropSize,
+  sidePanelPropPlacement,
   sidePanelPropPosition,
   sidePanelPropSize,
   spacing,
   spacingGap,
+  tagGroupPropVariant,
   textareaPropExpand,
   textareaPropVariant,
   togglePropLabelPlacement,
@@ -159,7 +196,11 @@ export {
   typographyPropDisplay,
   typographyPropVariant,
   useBreakpoints,
+  useDateFormatter,
+  useListData,
+  useLocale,
   useMatchedBreakpoints,
   useProvider,
-  useRadioGroupState
+  useRadioGroupState,
+  useRouter
 };