@pushwoosh/dumb-components 1.0.0 → 1.0.2

package/ReCaptcha/hooks.js

@@ -0,0 +1,66 @@
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { RECAPTCHA_KEY, RECAPTCHA_SCRIPT_URL, RECAPTCHA_CONTAINER_ID } from './constants';
+import { asyncScriptLoad } from './helpers';
+export function useRecaptcha() {
+  var _window;
+  const promiseRef = useRef({});
+  const [isRecaptchaLoaded, setRecaptchaLoaded] = useState(!!((_window = window) !== null && _window !== void 0 && (_window = _window.grecaptcha) !== null && _window !== void 0 && _window.render));
+  const [widgetID, setWidgetID] = useState(null);
+  const [isRecaptchaReady, setRecaptchaReady] = useState(!!(isRecaptchaLoaded && widgetID));
+  const [recaptchaErrorCode, setRecaptchaErrorCode] = useState(''); // RIEXXX - ReCaptcha Internal Error
+  const [intervalID, setIntervalID] = useState(0);
+  // Load external script effect, fires once
+  useEffect(() => {
+    asyncScriptLoad(RECAPTCHA_SCRIPT_URL).catch(() => setRecaptchaErrorCode('RIE001'));
+  }, []);
+  // Set interval while library download and initialize
+  useEffect(() => {
+    const newInterval = window.setInterval(() => {
+      var _window2;
+      if ((_window2 = window) !== null && _window2 !== void 0 && (_window2 = _window2.grecaptcha) !== null && _window2 !== void 0 && _window2.render) {
+        setRecaptchaLoaded(true);
+      }
+    }, 500);
+    setIntervalID(newInterval);
+    return () => {
+      clearInterval(newInterval);
+    };
+  }, []);
+  // Render recaptcha widget when script loaded, stop interval
+  useEffect(() => {
+    if (isRecaptchaLoaded && widgetID === null) {
+      clearInterval(intervalID);
+      try {
+        const widget = window.grecaptcha.render(RECAPTCHA_CONTAINER_ID, {
+          sitekey: RECAPTCHA_KEY,
+          size: 'invisible',
+          callback: token => {
+            var _promiseRef$current;
+            return (_promiseRef$current = promiseRef.current) === null || _promiseRef$current === void 0 ? void 0 : _promiseRef$current.resolve(token);
+          }
+          // 'expired-callback': () => {},
+          // 'error-callback': () => {},
+        });
+        setWidgetID(widget);
+        setRecaptchaReady(true);
+      } catch {
+        setRecaptchaErrorCode('RIE002');
+      }
+    }
+  }, [isRecaptchaLoaded, widgetID, intervalID, promiseRef]);
+  // async function to get recaptcha token, resolves by resolveAction callback
+  const getRecaptchaToken = useCallback(async () => new Promise((resolve, reject) => {
+    try {
+      window.grecaptcha.reset(widgetID);
+      window.grecaptcha.execute(widgetID);
+      promiseRef.current.resolve = resolve;
+    } catch (error) {
+      reject(error);
+    }
+  }), [widgetID, promiseRef]);
+  return {
+    isRecaptchaReady,
+    recaptchaErrorCode,
+    getRecaptchaToken
+  };
+}

package/ReCaptcha/index.d.ts

@@ -0,0 +1,3 @@
+export { ReCaptcha } from './ReCaptcha';
+export { useRecaptcha } from './hooks';
+export { asyncScriptLoad } from './helpers';

package/ReCaptcha/index.js

@@ -0,0 +1,3 @@
+export { ReCaptcha } from './ReCaptcha';
+export { useRecaptcha } from './hooks';
+export { asyncScriptLoad } from './helpers';

package/ReCaptcha/styles.d.ts

@@ -0,0 +1 @@
+export declare const RecaptchaElement: import("styled-components").StyledComponent<"div", any, {}, never>;

package/ReCaptcha/styles.js

@@ -0,0 +1,5 @@
+import styled from 'styled-components';
+export const RecaptchaElement = styled.div.withConfig({
+  displayName: "RecaptchaElement",
+  componentId: "sc-100g1t3-0"
+})(["display:none;"]);

package/ReCaptcha/types.d.ts

@@ -0,0 +1,8 @@
+export type RecaptchaExposedApi = {
+    readonly isRecaptchaReady: boolean;
+    readonly recaptchaErrorCode: string;
+    readonly getRecaptchaToken: () => Promise<string>;
+};
+export type PromiseRef = {
+    resolve?: (token: string) => void;
+};

package/ReCaptcha/types.js

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

package/Skeleton/TextSkeleton.d.ts

@@ -0,0 +1,3 @@
+import { type ReactElement, type PropsWithChildren } from 'react';
+import type { TextSkeletonProps } from './types';
+export declare function TextSkeleton(props: PropsWithChildren<TextSkeletonProps>): ReactElement;

package/Skeleton/TextSkeleton.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { TextSkeletonTag } from './styles';
+export function TextSkeleton(props) {
+  const {
+    children,
+    width,
+    ...rest
+  } = props;
+  return React.createElement(TextSkeletonTag, {
+    as: width ? 'div' : 'span',
+    style: width ? {
+      width
+    } : undefined,
+    ...rest
+  }, children || '-');
+}

package/Skeleton/index.d.ts

@@ -0,0 +1,2 @@
+export { TextSkeleton } from './TextSkeleton';
+export { RectangularSkeleton, CircularSkeleton } from './styles';

package/Skeleton/index.js

@@ -0,0 +1,2 @@
+export { TextSkeleton } from './TextSkeleton';
+export { RectangularSkeleton, CircularSkeleton } from './styles';

package/Skeleton/styles.d.ts

@@ -0,0 +1,4 @@
+import type { CircularSkeletonProps, RectangularSkeletonProps, TextSkeletonProps } from './types';
+export declare const RectangularSkeleton: import("styled-components").StyledComponent<"div", any, RectangularSkeletonProps, never>;
+export declare const CircularSkeleton: import("styled-components").StyledComponent<"div", any, CircularSkeletonProps, never>;
+export declare const TextSkeletonTag: import("styled-components").StyledComponent<"div", any, TextSkeletonProps, never>;

package/Skeleton/styles.js

@@ -0,0 +1,33 @@
+import styled, { keyframes, css } from 'styled-components';
+import { toCssValue } from '@pushwoosh/kit-helpers';
+const pulseKeyframe = keyframes(["0%{opacity:1;}50%{opacity:0.4;}100%{opacity:1;}"]);
+const borderRadiusCss = css(["border-radius:", ";"], ({
+  borderRadius
+}) => typeof borderRadius === 'undefined' ? 'initial' : toCssValue(borderRadius));
+const skeletonCommonCss = css(["background-color:", ";animation:", " 1.5s ease-in-out 0.5s infinite;"], ({
+  color
+}) => color || '#ddd', pulseKeyframe);
+export const RectangularSkeleton = styled.div.withConfig({
+  displayName: "RectangularSkeleton",
+  componentId: "sc-mdyfd6-0"
+})(["width:", ";height:", ";", " ", ""], ({
+  width
+}) => toCssValue(width), ({
+  height
+}) => toCssValue(height), skeletonCommonCss, borderRadiusCss);
+export const CircularSkeleton = styled.div.withConfig({
+  displayName: "CircularSkeleton",
+  componentId: "sc-mdyfd6-1"
+})(["width:", ";height:", ";border-radius:100%;", ""], ({
+  diameter
+}) => toCssValue(diameter), ({
+  diameter
+}) => toCssValue(diameter), skeletonCommonCss);
+export const TextSkeletonTag = styled.div.withConfig({
+  displayName: "TextSkeletonTag",
+  componentId: "sc-mdyfd6-2"
+})(["", " color:", ";border-radius:4px;", ""], ({
+  width
+}) => width ? `width: ${toCssValue(width)};` : '', ({
+  color
+}) => color || '#ddd', skeletonCommonCss);

package/Skeleton/types.d.ts

@@ -0,0 +1,16 @@
+export type SkeletonBorderRadiusProps = {
+    borderRadius?: number | string;
+};
+export type SkeletonCommonProps = {
+    color?: string;
+};
+export type RectangularSkeletonProps = SkeletonCommonProps & SkeletonBorderRadiusProps & {
+    width: number | string;
+    height: number | string;
+};
+export type CircularSkeletonProps = SkeletonCommonProps & {
+    diameter: number | string;
+};
+export type TextSkeletonProps = SkeletonCommonProps & SkeletonBorderRadiusProps & {
+    width?: number | string;
+};

package/Skeleton/types.js

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

package/SortButton/SortButton.d.ts

@@ -0,0 +1,6 @@
+import { type ReactElement } from 'react';
+import type { SortButtonProps } from './types';
+export declare function SortButton(props: SortButtonProps): ReactElement;
+export declare namespace SortButton {
+    var displayName: string;
+}

package/SortButton/SortButton.js

@@ -0,0 +1,33 @@
+import React, { useCallback } from 'react';
+import { SortIcon } from '@pushwoosh/kit-icons';
+import { AVAILABLE_ACTIVE_ORDERS } from './constants';
+import { IconTypeByOrderMap, NextOrderMap, ReversedNextOrderMap } from './maps';
+import { SortButtonBox } from './styles';
+export function SortButton(props) {
+  const {
+    boxRef,
+    name,
+    order,
+    children,
+    isReversed,
+    onClick,
+    ...rest
+  } = props;
+  const handleClick = useCallback(() => {
+    onClick({
+      name,
+      order: isReversed ? ReversedNextOrderMap[order || 'none'] : NextOrderMap[order || 'none']
+    });
+  }, [name, order, isReversed, onClick]);
+  return React.createElement(SortButtonBox, {
+    ref: boxRef,
+    type: "button",
+    ...rest,
+    onClick: handleClick,
+    "$isActive": AVAILABLE_ACTIVE_ORDERS.includes(order)
+  }, React.createElement("span", null, children), React.createElement(SortIcon, {
+    size: "small",
+    type: IconTypeByOrderMap[order || 'none']
+  }));
+}
+SortButton.displayName = 'SortButton';

package/SortButton/constants.d.ts

@@ -0,0 +1,2 @@
+import type { SortButtonOrder } from './types';
+export declare const AVAILABLE_ACTIVE_ORDERS: SortButtonOrder[];

package/SortButton/constants.js

@@ -0,0 +1 @@
+export const AVAILABLE_ACTIVE_ORDERS = ['asc', 'desc'];

package/SortButton/index.d.ts

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

package/SortButton/index.js

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

package/SortButton/maps.d.ts

@@ -0,0 +1,10 @@
+import type { SortButtonOrder, SortButtonIconType } from './types';
+export declare const NextOrderMap: {
+    [key: string]: SortButtonOrder;
+};
+export declare const ReversedNextOrderMap: {
+    [key: string]: SortButtonOrder;
+};
+export declare const IconTypeByOrderMap: {
+    [key: string]: SortButtonIconType;
+};

package/SortButton/maps.js

@@ -0,0 +1,15 @@
+export const NextOrderMap = {
+  none: 'asc',
+  asc: 'desc',
+  desc: null
+};
+export const ReversedNextOrderMap = {
+  none: 'desc',
+  desc: 'asc',
+  asc: null
+};
+export const IconTypeByOrderMap = {
+  none: 'not-sorted',
+  asc: 'asc',
+  desc: 'desc'
+};

package/SortButton/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const SortButtonBox: import("styled-components").StyledComponent<"button", any, {
+    $isActive: boolean;
+}, never>;

package/SortButton/styles.js

@@ -0,0 +1,9 @@
+import styled from 'styled-components';
+import { Color, FontSize, FontWeight, LineHeight, Spacing } from '@pushwoosh/kit-constants';
+export const SortButtonBox = styled.button.withConfig({
+  displayName: "SortButtonBox",
+  componentId: "sc-dasl5x-0"
+})(["display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;padding:0;color:", ";border:none;background-color:transparent;font-size:", ";font-weight:", ";line-height:", ";text-transform:uppercase;&:hover{color:", ";}&:active{color:", ";}& span{margin:0 ", " 0 0;}"], ({
+  $isActive
+}) => $isActive ? Color.MAIN : Color.LOCKED, FontSize.HEADING5, FontWeight.MEDIUM, LineHeight.HEADING5, Color.PRIMARY_HOVER, Color.PRIMARY_PRESSED, Spacing.S1);
+SortButtonBox.displayName = 'SortButtonBox';

package/SortButton/types.d.ts

@@ -0,0 +1,14 @@
+import type { Ref } from 'react';
+export type SortButtonOrder = 'asc' | 'desc' | null;
+export type SortButtonIconType = 'asc' | 'desc' | 'not-sorted';
+export type SortButtonParams = {
+    readonly name: string;
+    readonly order: SortButtonOrder;
+};
+export type SortButtonProps = Omit<JSX.IntrinsicElements['button'], 'ref' | 'onClick'> & {
+    readonly boxRef?: Ref<HTMLButtonElement>;
+    readonly name: string;
+    readonly order: SortButtonOrder;
+    readonly isReversed?: boolean;
+    readonly onClick: (params: SortButtonParams) => void;
+};

package/SortButton/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

@@ -1,23 +1,24 @@
 import React, { useMemo } from 'react';
 import { Spacing } from '@pushwoosh/kit-constants';
 import { Horizontal } from '@pushwoosh/kit-helpers';
-import { Spinner } from '@pushwoosh/kit-spinner';
+import { Spinner } from '../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/Switch/Switch.d.ts

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

package/Switch/Switch.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Container, Box, Circle, Label } from './styles';
+export function Switch(props) {
+  const {
+    labelPosition = 'right',
+    enabled = false,
+    isDisabled = false,
+    children,
+    onChange
+  } = props;
+  return React.createElement(Container, {
+    labelPosition: labelPosition
+  }, React.createElement(Box, {
+    enabled: enabled,
+    isDisabled: isDisabled,
+    onClick: onChange
+  }, React.createElement(Circle, {
+    enabled: enabled,
+    isDisabled: isDisabled
+  })), children && React.createElement(Label, {
+    labelPosition: labelPosition
+  }, children));
+}

package/Switch/index.d.ts

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

package/Switch/index.js

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

package/Switch/styles.d.ts

@@ -0,0 +1,5 @@
+import type { AlignProps, ComponentProps } from './types';
+export declare const Container: import("styled-components").StyledComponent<"div", any, AlignProps, never>;
+export declare const Box: import("styled-components").StyledComponent<"div", any, ComponentProps, never>;
+export declare const Circle: import("styled-components").StyledComponent<"div", any, ComponentProps, never>;
+export declare const Label: import("styled-components").StyledComponent<"div", any, AlignProps, never>;

package/Switch/styles.js

@@ -0,0 +1,62 @@
+import styled, { css } from 'styled-components';
+import { Spacing, Color, FontSize, FontWeight } from '@pushwoosh/kit-constants';
+const defineColorBackgroundBox = css(["", ""], props => {
+  if (props.isDisabled && !props.enabled) {
+    return Color.CLEAR;
+  }
+  if (props.isDisabled && props.enabled) {
+    return Color.LOCKED;
+  }
+  if (props.enabled) {
+    return Color.PRIMARY_HOVER;
+  }
+  return Color.CLEAR;
+});
+const defineColorBorderBox = css(["", ""], props => {
+  if (props.isDisabled) {
+    return Color.LOCKED;
+  }
+  if (props.enabled) {
+    return Color.PRIMARY_HOVER;
+  }
+  return Color.PHANTOM;
+});
+const defineColorCircle = css(["", ""], props => {
+  if (props.isDisabled && props.enabled) {
+    return Color.CLEAR;
+  }
+  if (props.isDisabled && !props.enabled) {
+    return Color.LOCKED;
+  }
+  if (!props.isDisabled && props.enabled) {
+    return Color.CLEAR;
+  }
+  return Color.MAIN;
+});
+const cssActive = css(["&:active{background:", ";border:2px solid ", ";}"], Color.PRIMARY_HOVER, Color.PRIMARY_PRESSED);
+export const Container = styled.div.withConfig({
+  displayName: "Container",
+  componentId: "sc-csdrg2-0"
+})(["display:flex;align-items:center;flex-direction:", ";"], ({
+  labelPosition
+}) => labelPosition === 'left' ? 'row-reverse' : 'row');
+export const Box = styled.div.attrs({
+  tabIndex: '0'
+}).withConfig({
+  displayName: "Box",
+  componentId: "sc-csdrg2-1"
+})(["display:flex;align-items:center;justify-content:", ";width:36px;height:20px;border:2px solid ", ";border-radius:10px;background-color:", ";outline:none;cursor:pointer;", ""], ({
+  enabled
+}) => enabled ? 'flex-end' : 'flex-start', defineColorBorderBox, defineColorBackgroundBox, ({
+  isDisabled
+}) => isDisabled ? '' : cssActive);
+export const Circle = styled.div.withConfig({
+  displayName: "Circle",
+  componentId: "sc-csdrg2-2"
+})(["margin:0 ", ";width:12px;height:12px;background:", ";border-radius:50%;"], Spacing.S0, defineColorCircle);
+export const Label = styled.div.withConfig({
+  displayName: "Label",
+  componentId: "sc-csdrg2-3"
+})(["display:flex;align-items:center;margin-left:", ";color:", ";font-size:", ";font-weight:", ";margin:", ";"], Spacing.S3, Color.MAIN, FontSize.REGULAR, FontWeight.MEDIUM, ({
+  labelPosition
+}) => labelPosition === 'left' ? `0 ${Spacing.S3} 0` : `0  0 0 ${Spacing.S3}`);

package/Switch/types.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+export interface TProps {
+    labelPosition?: 'left' | 'right';
+    enabled?: boolean;
+    isDisabled?: boolean;
+    children?: ReactNode;
+    onChange: () => void;
+}
+export interface AlignProps {
+    labelPosition?: string;
+}
+export interface ComponentProps {
+    enabled: boolean;
+    isDisabled?: boolean;
+}

package/Switch/types.js

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

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 {};