@pushwoosh/dumb-components 0.0.19 → 1.0.1

package/Radio/Radio.js

@@ -0,0 +1,37 @@
+import React, { useState } from 'react';
+import { NativeLabel, NativeRadio } from './styled';
+// eslint-disable-next-line prefer-const
+let counter = 0;
+export function Radio(props) {
+  const {
+    label,
+    id,
+    name,
+    value,
+    color,
+    isChecked,
+    isDisabled,
+    onChange,
+    onBlur
+  } = props;
+  const [localId] = useState(() => {
+    if (id) {
+      return id;
+    }
+    const newCounter = counter + 1;
+    return `radio-id-${newCounter}`;
+  });
+  return React.createElement(NativeLabel, {
+    htmlFor: localId,
+    "$color": isDisabled ? 'locked' : color
+  }, React.createElement(NativeRadio, {
+    type: "radio",
+    id: localId,
+    value: value,
+    name: name,
+    checked: isChecked,
+    disabled: isDisabled,
+    onChange: event => onChange === null || onChange === void 0 ? void 0 : onChange(event.currentTarget.value),
+    onBlur: onBlur
+  }), label && React.createElement("span", null, label));
+}

package/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export { Radio } from './Radio';
+export type { RadioProps } from './types';

package/Radio/index.js

@@ -0,0 +1 @@
+export { Radio } from './Radio';

package/Radio/maps.d.ts

@@ -0,0 +1,3 @@
+import { Color } from '@pushwoosh/kit-constants';
+import type { RadioTextColor } from './types';
+export declare const ColorMap: Record<RadioTextColor, Color>;

package/Radio/maps.js

@@ -0,0 +1,8 @@
+import { Color } from '@pushwoosh/kit-constants';
+export const ColorMap = {
+  main: Color.MAIN,
+  primary: Color.PRIMARY,
+  danger: Color.DANGER,
+  current: Color.CURRENT,
+  locked: Color.LOCKED
+};

package/Radio/styled.d.ts

@@ -0,0 +1,5 @@
+import type { RadioTextColor } from './types';
+export declare const NativeRadio: import("styled-components").StyledComponent<"input", any, {}, never>;
+export declare const NativeLabel: import("styled-components").StyledComponent<"label", any, {
+    $color?: RadioTextColor;
+}, never>;

package/Radio/styled.js

@@ -0,0 +1,13 @@
+import styled from 'styled-components';
+import { Color, Spacing, FontSize, LineHeight } from '@pushwoosh/kit-constants';
+import { ColorMap } from './maps';
+export const NativeRadio = styled.input.withConfig({
+  displayName: "NativeRadio",
+  componentId: "sc-154q01x-0"
+})(["appearance:none;-webkit-appearance:none;-moz-appearance:none;width:20px;height:20px;border:2px solid ", ";border-radius:50%;background-color:", ";transition:border 0.1s,background-color 0.1s;cursor:pointer;&:focus{outline:none;}&[type=radio]:hover{border-color:", ";}&[type=radio]:disabled{cursor:not-allowed;border-color:", ";background-color:", ";}&[type=radio]:checked{border:6px solid ", ";}&[type=radio]:checked:hover{border-color:", ";}&[type=radio]:checked:disabled{border-color:", ";background-color:", ";}"], Color.PHANTOM, Color.CLEAR, Color.PRIMARY_HOVER, Color.LOCKED, Color.FROZEN, Color.PRIMARY, Color.PRIMARY_HOVER, Color.LOCKED, Color.FROZEN);
+export const NativeLabel = styled.label.withConfig({
+  displayName: "NativeLabel",
+  componentId: "sc-154q01x-1"
+})(["display:inline-flex;align-items:center;font-size:", ";line-height:", ";user-select:none;", " & > ", "{&:not(:last-child){margin-right:", ";}}"], FontSize.REGULAR, LineHeight.REGULAR, ({
+  $color
+}) => $color && `color: ${ColorMap[$color]};`, NativeRadio, Spacing.S3);

package/Radio/types.d.ts

@@ -0,0 +1,12 @@
+export type RadioTextColor = 'main' | 'primary' | 'danger' | 'current' | 'locked';
+export type RadioProps = {
+    label?: string;
+    id?: string;
+    name?: string;
+    value?: string;
+    color?: RadioTextColor;
+    isChecked?: boolean;
+    isDisabled?: boolean;
+    onChange?: (checked: string | number) => void;
+    onBlur?: () => void;
+};

package/Radio/types.js

@@ -0,0 +1 @@
+export {};

package/Spinner/Spinner.d.ts

@@ -0,0 +1,3 @@
+import { type ReactElement } from 'react';
+import { type SpinnerProps } from './types';
+export declare function Spinner(props: SpinnerProps): ReactElement | null;

package/Spinner/Spinner.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { AssetsMap } from './assets';
+import { SpinnerBox, SpinnerAnimate } from './styles';
+export function Spinner(props) {
+  const {
+    boxRef,
+    size,
+    ...rest
+  } = props;
+  const Icon = AssetsMap[size];
+  if (!Icon) {
+    console.error(`[Spinner]: incorrect size: ${size}!`);
+    return null;
+  }
+  return React.createElement(SpinnerBox, {
+    ...rest,
+    size: size,
+    ref: boxRef
+  }, React.createElement(SpinnerAnimate, null, React.createElement(Icon, null)));
+}

package/Spinner/assets/index.d.ts

@@ -0,0 +1,4 @@
+export declare const AssetsMap: {
+    small: any;
+    medium: any;
+};

package/Spinner/assets/index.js

@@ -0,0 +1,6 @@
+import SpinnerMediumIcon from './spinner.medium.svg';
+import SpinnerSmallIcon from './spinner.small.svg';
+export const AssetsMap = {
+  small: SpinnerSmallIcon,
+  medium: SpinnerMediumIcon
+};

package/Spinner/assets/spinner.medium.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><circle cx="12" cy="12" r="7" stroke="#00A2FF" stroke-width="3" opacity=".2"/><path stroke="#00A2FF" stroke-linecap="round" stroke-width="3" d="M19 12a7 7 0 0 0-7-7"/></svg>

package/Spinner/assets/spinner.small.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none"><circle cx="8" cy="8" r="5" stroke="#00A2FF" stroke-width="2" opacity=".2"/><path stroke="#00A2FF" stroke-linecap="round" stroke-width="2" d="M13 8a5 5 0 0 0-5-5"/></svg>

package/Spinner/index.d.ts

@@ -0,0 +1,2 @@
+export { Spinner } from './Spinner';
+export type { SpinnerProps } from './types';

package/Spinner/index.js

@@ -0,0 +1 @@
+export { Spinner } from './Spinner';

package/Spinner/maps.d.ts

@@ -0,0 +1,5 @@
+import { UnitSize } from '@pushwoosh/kit-constants';
+export declare const SizeInPxBySpinnerSizeMap: {
+    small: UnitSize;
+    medium: UnitSize;
+};

package/Spinner/maps.js

@@ -0,0 +1,5 @@
+import { UnitSize } from '@pushwoosh/kit-constants';
+export const SizeInPxBySpinnerSizeMap = {
+  small: UnitSize.ICON_SMALL,
+  medium: UnitSize.ICON_MEDIUM
+};

package/Spinner/styles.d.ts

@@ -0,0 +1,5 @@
+import type { SpinnerProps } from './types';
+export declare const SpinnerBox: import("styled-components").StyledComponent<"div", any, {
+    size: SpinnerProps["size"];
+}, never>;
+export declare const SpinnerAnimate: import("styled-components").StyledComponent<"div", any, {}, never>;

package/Spinner/styles.js

@@ -0,0 +1,20 @@
+import styled, { keyframes } from 'styled-components';
+import { Color } from '@pushwoosh/kit-constants';
+import { SizeInPxBySpinnerSizeMap } from './maps';
+const rotate = keyframes(["from{transform:rotate(0deg);}to{transform:rotate(360deg);}"]);
+export const SpinnerBox = styled.div.withConfig({
+  displayName: "SpinnerBox",
+  componentId: "sc-y39y31-0"
+})(["width:", ";height:", ";color:", ";line-height:0;user-select:none;"], ({
+  size
+}) => SizeInPxBySpinnerSizeMap[size], ({
+  size
+}) => SizeInPxBySpinnerSizeMap[size], ({
+  color
+}) => color || Color.CURRENT);
+export const SpinnerAnimate = styled.div.withConfig({
+  displayName: "SpinnerAnimate",
+  componentId: "sc-y39y31-1"
+})(["line-height:0;animation:", " 0.5s linear infinite;"], rotate);
+SpinnerBox.displayName = 'SpinnerBox';
+SpinnerAnimate.displayName = 'SpinnerAnimate';

package/Spinner/types.d.ts

@@ -0,0 +1,6 @@
+import { type Ref } from 'react';
+export interface SpinnerProps {
+    readonly boxRef?: Ref<HTMLDivElement>;
+    readonly color?: string;
+    readonly size: 'small' | 'medium';
+}

package/Spinner/types.js

@@ -0,0 +1 @@
+export {};

package/StatisticCard/StatisticCard.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
+import { type ReactElement } from 'react';
 import { type StatisticCardProps } from './types';
-export declare const StatisticCard: ({ title, value, valueSubtext, footer, active, selectable, rightSlot, width, isLoading, onClick, ...rest }: StatisticCardProps) => React.JSX.Element;
+export declare function StatisticCard(props: StatisticCardProps): ReactElement;

package/StatisticCard/StatisticCard.js

@@ -5,19 +5,20 @@ import { Spinner } from '@pushwoosh/kit-spinner';
 import { Container, RightSlotContainer, StatValue, Title } from './styles';
 import { LockedText } from '../common';
 import { formatNumberWithSpaces } from './helpers';
-export const StatisticCard = ({
-  title,
-  value,
-  valueSubtext,
-  footer,
-  active,
-  selectable,
-  rightSlot,
-  width,
-  isLoading,
-  onClick,
-  ...rest
-}) => {
+export function StatisticCard(props) {
+  const {
+    title,
+    value,
+    valueSubtext,
+    footer,
+    active,
+    selectable,
+    rightSlot,
+    width,
+    isLoading,
+    onClick,
+    ...rest
+  } = props;
   const statisticValue = useMemo(() => {
     if (isLoading) {
       return React.createElement(Spinner, {
@@ -45,4 +46,4 @@ export const StatisticCard = ({
   }, rightSlot), statisticValue, footer && React.createElement(LockedText, {
     "$small": true
   }, footer));
-};
+}

package/Tabs/{tab/tab.d.ts → components/Tab/Tab.d.ts}

@@ -1,7 +1,7 @@
 import React from 'react';
 export declare const Tab: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref" | "onClick"> & Readonly<{
-    code: import("..").TabCode;
-    onActivate?: (code: import("..").TabCode) => void;
+    code: import("../..").TabCode;
+    onActivate?: (code: import("../..").TabCode) => void;
     isDisabled?: boolean;
     isNew?: boolean;
     icon?: React.ReactNode;

package/Tabs/{tab/tab.js → components/Tab/Tab.js}

@@ -1,6 +1,6 @@
 import React, { forwardRef } from 'react';
-import { TabBase } from '../tab-base';
-import { useTabsContext } from '../tabs.context';
+import { TabBase } from '../TabBase';
+import { useTabsContext } from '../../context';
 export const Tab = forwardRef((props, ref) => {
   const {
     code,

package/Tabs/components/Tab/index.d.ts

@@ -0,0 +1 @@
+export { Tab } from './Tab';

package/Tabs/components/Tab/index.js

@@ -0,0 +1 @@
+export { Tab } from './Tab';

package/Tabs/{tab/tab.types.d.ts → components/Tab/types.d.ts}

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import type { TabCode } from '../tabs.types';
+import type { TabCode } from '../../types';
 export type TabProps = Omit<JSX.IntrinsicElements['div'], 'ref' | 'onClick'> & Readonly<{
     code: TabCode;
     onActivate?: (code: TabCode) => void;

package/Tabs/components/Tab/types.js

@@ -0,0 +1 @@
+export {};

package/Tabs/{tab-bar/tab-bar.js → components/TabBar/TabBar.js}

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react';
 import { H4 } from '@pushwoosh/kit-typography';
-import { TabBarTitleBox, TabBarContainer } from './tab-bar.styles';
-import { TabBarScrollableFrame } from '../tabs-list-slide-frame';
+import { TabBarTitleBox, TabBarContainer } from './styles';
+import { TabBarScrollableFrame } from '../TabBarScrollableFrame';
 export const TabBar = forwardRef((props, ref) => {
   const {
     children,

package/Tabs/components/TabBar/index.d.ts

@@ -0,0 +1 @@
+export { TabBar } from './TabBar';

package/Tabs/components/TabBar/index.js

@@ -0,0 +1 @@
+export { TabBar } from './TabBar';

package/Tabs/{tab-bar/tab-bar.styles.js → components/TabBar/styles.js}

@@ -2,11 +2,11 @@ import styled from 'styled-components';
 import { Color, Spacing } from '@pushwoosh/kit-constants';
 export const TabBarContainer = styled.div.withConfig({
   displayName: "TabBarContainer",
-  componentId: "sc-1z0lfzo-0"
+  componentId: "sc-pu8yhh-0"
 })(["position:relative;display:grid;grid-template-columns:", ";width:100%;height:40px;background:", ";border-radius:8px;padding:", ";overflow:hidden;"], ({
   hasTitle
 }) => hasTitle ? 'max-content 1fr' : '1fr', Color.SOFT_LIGHT, Spacing.S1);
 export const TabBarTitleBox = styled.div.withConfig({
   displayName: "TabBarTitleBox",
-  componentId: "sc-1z0lfzo-1"
+  componentId: "sc-pu8yhh-1"
 })(["display:flex;align-items:center;position:relative;padding:0 ", " 0 ", ";"], Spacing.S4, Spacing.S5);

package/Tabs/components/TabBar/types.js

@@ -0,0 +1 @@
+export {};

package/Tabs/{tabs-list-slide-frame/tabs-list-slide-frame.d.ts → components/TabBarScrollableFrame/TabBarScrollableFrame.d.ts}

@@ -1,3 +1,3 @@
 import React from 'react';
-import { type TabsListSlideFrameProps } from './tabs-list-slide-frame.types';
+import type { TabsListSlideFrameProps } from './types';
 export declare const TabBarScrollableFrame: React.ForwardRefExoticComponent<TabsListSlideFrameProps & React.RefAttributes<HTMLDivElement>>;

package/Tabs/{tabs-list-slide-frame/tabs-list-slide-frame.js → components/TabBarScrollableFrame/TabBarScrollableFrame.js}

@@ -1,8 +1,8 @@
 import debounce from 'lodash/debounce';
 import React, { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
 import { ChevronIcon } from '@pushwoosh/kit-icons';
-import { TabBarContent, TabBarFrame, TabBarArrowContainer, TabBarWindow } from './tabs-list-slide-frame.styles';
-import { widthObserver } from '../tabs.helpers';
+import { TabBarContent, TabBarFrame, TabBarArrowContainer, TabBarWindow } from './styles';
+import { widthObserver } from '../../helpers';
 export const TabBarScrollableFrame = forwardRef(({
   children,
   ...props

package/Tabs/components/TabBarScrollableFrame/index.d.ts

@@ -0,0 +1 @@
+export { TabBarScrollableFrame } from './TabBarScrollableFrame';

package/Tabs/components/TabBarScrollableFrame/index.js

@@ -0,0 +1 @@
+export { TabBarScrollableFrame } from './TabBarScrollableFrame';

package/Tabs/{tabs-list-slide-frame/tabs-list-slide-frame.styles.js → components/TabBarScrollableFrame/styles.js}

@@ -2,25 +2,25 @@ import styled from 'styled-components';
 import { Color, Shadow, ShapeRadius, Spacing } from '@pushwoosh/kit-constants';
 export const TabBarArrowContainer = styled.div.withConfig({
   displayName: "TabBarArrowContainer",
-  componentId: "sc-u8lb05-0"
+  componentId: "sc-1sonok9-0"
 })(["position:absolute;top:0;", ":0;display:flex;align-items:center;height:32px;cursor:pointer;color:", ";background-color:", ";box-shadow:", ";border-radius:", ";padding:", " ", ";&:hover{color:", ";}"], ({
   $right
 }) => $right ? 'right' : 'left', Color.MAIN, Color.CLEAR, Shadow.SMALL, ShapeRadius.CONTROL, Spacing.S3, Spacing.S1, Color.PRIMARY_HOVER);
 export const TabBarWindow = styled.div.withConfig({
   displayName: "TabBarWindow",
-  componentId: "sc-u8lb05-1"
+  componentId: "sc-1sonok9-1"
 })(["position:relative;height:32px;width:100%;"]);
 export const TabsListContentBase = styled.div.withConfig({
   displayName: "TabsListContentBase",
-  componentId: "sc-u8lb05-2"
+  componentId: "sc-1sonok9-2"
 })(["position:absolute;top:0;display:flex;align-items:center;transition:left .4s ease-in;"]);
 export const TabBarContent = styled(TabsListContentBase).withConfig({
   displayName: "TabBarContent",
-  componentId: "sc-u8lb05-3"
+  componentId: "sc-1sonok9-3"
 })(["left:", "px;gap:", ";"], ({
   left
 }) => left, Spacing.S1);
 export const TabBarFrame = styled.div.withConfig({
   displayName: "TabBarFrame",
-  componentId: "sc-u8lb05-4"
+  componentId: "sc-1sonok9-4"
 })(["position:relative;width:100%;"]);

package/Tabs/components/TabBarScrollableFrame/types.js

@@ -0,0 +1 @@
+export {};

package/Tabs/{tab-base/tab-base.js → components/TabBase/TabBase.js}

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import { TabIconBox, TabRedDot, TabBody, TabButtonLabel } from './tab-base.styles';
+import { TabIconBox, TabRedDot, TabBody, TabButtonLabel } from './styles';
 export const TabBase = forwardRef((props, ref) => {
   const {
     isActive,

package/Tabs/components/TabBase/index.d.ts

@@ -0,0 +1 @@
+export { TabBase } from './TabBase';

package/Tabs/components/TabBase/index.js

@@ -0,0 +1 @@
+export { TabBase } from './TabBase';

package/Tabs/{tab-base/tab-base.styles.js → components/TabBase/styles.js}

@@ -4,7 +4,7 @@ import { H4 } from '@pushwoosh/kit-typography';
 const tabBodyHover = css(["&:hover{color:", ";background-color:", ";}"], Color.PRIMARY_HOVER, Color.BRIGHT_LIGHT);
 export const TabBody = styled.div.withConfig({
   displayName: "TabBody",
-  componentId: "sc-1vksurj-0"
+  componentId: "sc-133yrgu-0"
 })(["display:flex;justify-content:center;align-items:center;position:relative;padding:", " ", " ", " ", ";background-color:", ";border-radius:", ";box-shadow:", ";cursor:", ";user-select:none;white-space:nowrap;color:", ";", ""], Spacing.S2, ({
   $hasIcon
 }) => $hasIcon ? Spacing.S4 : Spacing.S5, Spacing.S2, Spacing.S5, ({
@@ -27,15 +27,15 @@ export const TabBody = styled.div.withConfig({
 }) => !$isActive && !$isDisabled && tabBodyHover);
 export const TabRedDot = styled.div.withConfig({
   displayName: "TabRedDot",
-  componentId: "sc-1vksurj-1"
+  componentId: "sc-133yrgu-1"
 })(["width:4px;height:20px;position:relative;&::before{content:\"\";background-color:", ";position:absolute;top:0;left:0;width:4px;height:4px;border-radius:4px;}"], Color.DANGER);
 export const TabButtonLabel = styled(H4).withConfig({
   displayName: "TabButtonLabel",
-  componentId: "sc-1vksurj-2"
+  componentId: "sc-133yrgu-2"
 })(["opacity:", ";"], ({
   $isActive
 }) => $isActive ? 1 : 0.8);
 export const TabIconBox = styled.div.withConfig({
   displayName: "TabIconBox",
-  componentId: "sc-1vksurj-3"
+  componentId: "sc-133yrgu-3"
 })(["margin-left:", ";"], Spacing.S1);

package/Tabs/components/TabBase/types.js

@@ -0,0 +1 @@
+export {};

package/Tabs/{tab-panel/tab-panel.d.ts → components/TabPanel/TabPanel.d.ts}

@@ -1,3 +1,3 @@
 import { type FC } from 'react';
-import type { TabPanelProps } from './tab-panel.types';
+import type { TabPanelProps } from './types';
 export declare const TabPanel: FC<TabPanelProps>;

package/Tabs/{tab-panel/tab-panel.js → components/TabPanel/TabPanel.js}

@@ -1,6 +1,6 @@
 import React from 'react';
 import { TabPanelContainer } from './styles';
-import { useTabsContext } from '../tabs.context';
+import { useTabsContext } from '../../context';
 export const TabPanel = props => {
   const {
     code,

package/Tabs/components/TabPanel/index.d.ts

@@ -0,0 +1 @@
+export { TabPanel } from './TabPanel';

package/Tabs/components/TabPanel/index.js

@@ -0,0 +1 @@
+export { TabPanel } from './TabPanel';

package/Tabs/{tab-panel → components/TabPanel}/styles.js

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
 export const TabPanelContainer = styled.div.withConfig({
   displayName: "TabPanelContainer",
-  componentId: "sc-1kewjsc-0"
+  componentId: "sc-2k9ddn-0"
 })(["overflow:auto;flex:1;"]);

package/Tabs/{tab-panel/tab-panel.types.d.ts → components/TabPanel/types.d.ts}

@@ -1,5 +1,5 @@
 import type { PropsWithChildren } from 'react';
-import type { TabCode } from '../tabs.types';
+import type { TabCode } from '../../types';
 export type TabPanelProps = PropsWithChildren<Readonly<{
     code: TabCode;
 }>>;

package/Tabs/components/TabPanel/types.js

@@ -0,0 +1 @@
+export {};

package/Tabs/{tabs/tabs.d.ts → components/Tabs/Tabs.d.ts}

@@ -1,3 +1,3 @@
 import { type ReactElement } from 'react';
-import type { TabsProps } from './tabs.types';
+import type { TabsProps } from './types';
 export declare function Tabs(props: TabsProps): ReactElement;

package/Tabs/{tabs/tabs.js → components/Tabs/Tabs.js}

@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
 import { TabsContainer } from './styles';
-import { TabContext } from '../tabs.context';
+import { TabContext } from '../../context';
 export function Tabs(props) {
   const {
     activeCode: activeTabCode,

package/Tabs/components/Tabs/index.d.ts

@@ -0,0 +1 @@
+export { Tabs } from './Tabs';

package/Tabs/components/Tabs/index.js

@@ -0,0 +1 @@
+export { Tabs } from './Tabs';

package/Tabs/{tabs → components/Tabs}/styles.js

@@ -2,5 +2,5 @@ import styled from 'styled-components';
 import { Spacing } from '@pushwoosh/kit-constants';
 export const TabsContainer = styled.div.withConfig({
   displayName: "TabsContainer",
-  componentId: "sc-1z082s8-0"
+  componentId: "sc-1pr0dun-0"
 })(["display:flex;flex-direction:column;gap:", ";width:100%;height:100%;"], Spacing.S5);

package/Tabs/{tabs/tabs.types.d.ts → components/Tabs/types.d.ts}

@@ -1,5 +1,5 @@
 import type { PropsWithChildren } from 'react';
-import { type TabCode } from '../tabs.types';
+import { type TabCode } from '../../types';
 export type TabsProps = PropsWithChildren<Readonly<{
     activeCode: TabCode;
     onChange: (code: TabCode) => void;

package/Tabs/components/Tabs/types.js

@@ -0,0 +1 @@
+export {};

package/Tabs/{tabs.context.d.ts → context.d.ts}

@@ -1,4 +1,4 @@
 import React from 'react';
-import type { TabContextType } from './tabs.types';
+import type { TabContextType } from './types';
 export declare const TabContext: React.Context<TabContextType>;
 export declare function useTabsContext(): TabContextType;

package/Tabs/index.d.ts

@@ -1,5 +1,5 @@
-export * from './tabs.types';
-export * from './tab';
-export * from './tabs';
-export * from './tab-bar';
-export * from './tab-panel';
+export { Tab } from './components/Tab';
+export { TabBar } from './components/TabBar';
+export { TabPanel } from './components/TabPanel';
+export { Tabs } from './components/Tabs';
+export type { TabCode } from './types';

package/Tabs/index.js

@@ -1,5 +1,4 @@
-export * from './tabs.types';
-export * from './tab';
-export * from './tabs';
-export * from './tab-bar';
-export * from './tab-panel';
+export { Tab } from './components/Tab';
+export { TabBar } from './components/TabBar';
+export { TabPanel } from './components/TabPanel';
+export { Tabs } from './components/Tabs';

package/Tabs/types.js

@@ -0,0 +1 @@
+export {};

package/Tooltip/Tooltip.d.ts

@@ -0,0 +1,3 @@
+import { type ReactElement } from 'react';
+import type { TooltipProps } from './types';
+export declare function Tooltip(props: TooltipProps): ReactElement;

package/Tooltip/Tooltip.js

@@ -0,0 +1,47 @@
+import React from 'react';
+import { TooltipPositionToArrowOffsetMap, TooltipPositionToTippyOffsetMap, TooltipPositionToTippyPlacementMap } from './maps';
+import { TooltipBox } from './styles';
+export function Tooltip(props) {
+  const {
+    position = 'top-start',
+    arrowOffset = TooltipPositionToArrowOffsetMap[position],
+    offset = TooltipPositionToTippyOffsetMap[position],
+    maxWidth = 240,
+    zIndex = 999999,
+    isDisabled,
+    isVisible,
+    ...rest
+  } = props;
+  return React.createElement(TooltipBox, {
+    animation: false,
+    delay: 0,
+    duration: 0,
+    disabled: isDisabled,
+    maxWidth: maxWidth,
+    zIndex: zIndex,
+    placement: TooltipPositionToTippyPlacementMap[position],
+    visible: isVisible,
+    "$position": position,
+    "$arrowOffset": arrowOffset,
+    popperOptions: {
+      strategy: 'fixed',
+      modifiers: [{
+        name: 'offset',
+        options: {
+          offset
+        }
+      }, {
+        name: 'flip',
+        options: {
+          fallbackPlacements: []
+        }
+      }, {
+        name: 'preventOverflow',
+        options: {
+          mainAxis: false
+        }
+      }]
+    },
+    ...rest
+  });
+}

package/Tooltip/index.d.ts

@@ -0,0 +1,2 @@
+export { Tooltip } from './Tooltip';
+export type { TooltipPosition } from './types';

package/Tooltip/index.js

@@ -0,0 +1 @@
+export { Tooltip } from './Tooltip';