@chayns-components/core 5.1.1 → 5.2.0

package/lib/types/components/skeleton/index.d.ts

@@ -0,0 +1,27 @@
+import SkeletonProvider from './skeleton-provider/SkeletonProvider';
+import BoxSkeleton from './variants/box-skeleton/BoxSkeleton';
+import CircleSkeleton from './variants/circle-skeleton/CircleSkeleton';
+import { H1Skeleton, H2Skeleton, H3Skeleton, H4Skeleton, H5Skeleton, H6Skeleton } from './variants/headline-skeleton/HeadlineSkeleton';
+import TextSkeleton from './variants/text-skeleton/TextSkeleton';
+import ButtonSkeleton from './variants/button-skeleton/ButtonSkeleton';
+import BadgeSkeleton from './variants/badge-skeleton/BadgeSkeleton';
+import ListItemSkeleton from './variants/list-item-skeleton/ListItemSkeleton';
+import AccordionSkeleton from './variants/accordion-skeleton/AccordionSkeleton';
+interface SkeletonNamespace {
+    Config: typeof SkeletonProvider;
+    Box: typeof BoxSkeleton;
+    Circle: typeof CircleSkeleton;
+    H1: typeof H1Skeleton;
+    H2: typeof H2Skeleton;
+    H3: typeof H3Skeleton;
+    H4: typeof H4Skeleton;
+    H5: typeof H5Skeleton;
+    H6: typeof H6Skeleton;
+    Text: typeof TextSkeleton;
+    Button: typeof ButtonSkeleton;
+    Badge: typeof BadgeSkeleton;
+    ListItem: typeof ListItemSkeleton;
+    Accordion: typeof AccordionSkeleton;
+}
+declare const Skeleton: SkeletonNamespace;
+export default Skeleton;

package/lib/types/components/skeleton/skeleton-provider/SkeletonProvider.d.ts

@@ -0,0 +1,37 @@
+import React, { FC, ReactNode } from 'react';
+import { SkeletonAnimationType } from '../types';
+import { MotionValue } from 'motion/react';
+export interface ISkeletonContext {
+    animationType?: SkeletonAnimationType;
+    borderRadius?: number | string;
+    baseColor?: string;
+    highlightColor?: string;
+    progress?: MotionValue<number>;
+}
+export declare const SkeletonContext: React.Context<ISkeletonContext | undefined>;
+export declare const useSkeletonConfig: ({ highlightColor, baseColor, animationType, borderRadius, }: ISkeletonContext) => {
+    animationType: SkeletonAnimationType;
+    borderRadius: string | number;
+    baseColor: string;
+    highlightColor: string;
+    progress: MotionValue<number>;
+};
+export declare const useSkeletonAnimation: () => {
+    opacity: MotionValue<number>;
+    x?: undefined;
+} | {
+    x: MotionValue<string>;
+    opacity?: undefined;
+};
+export declare const useSkeletonContext: () => {
+    animationType: SkeletonAnimationType;
+    borderRadius: string | number;
+    baseColor: string;
+    highlightColor: string;
+    progress: MotionValue<number>;
+};
+export interface SkeletonProviderProps extends ISkeletonContext {
+    children: ReactNode;
+}
+declare const SkeletonProvider: FC<SkeletonProviderProps>;
+export default SkeletonProvider;

package/lib/types/components/skeleton/types.d.ts

@@ -0,0 +1,14 @@
+import { CSSProperties } from 'react';
+export declare enum SkeletonAnimationType {
+    SHIMMER = "SHIMMER",
+    PULSE = "PULSE",
+    NONE = "NONE"
+}
+export interface BaseSkeletonConfig {
+    animationType?: SkeletonAnimationType;
+    borderRadius?: number | string;
+    baseColor?: string;
+    highlightColor?: string;
+    className?: string;
+    style?: CSSProperties;
+}

package/lib/types/components/skeleton/variants/accordion-skeleton/AccordionSkeleton.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+declare const AccordionSkeleton: React.ForwardRefExoticComponent<BaseSkeletonConfig & React.RefAttributes<HTMLDivElement>>;
+export default AccordionSkeleton;

package/lib/types/components/skeleton/variants/accordion-skeleton/AccordionSkeleton.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledAccordionSkeleton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/types/components/skeleton/variants/badge-skeleton/BadgeSkeleton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+interface BadgeSkeletonProps extends BaseSkeletonConfig {
+    width: number | string;
+}
+declare const BadgeSkeleton: React.ForwardRefExoticComponent<Omit<BadgeSkeletonProps, "borderRadius"> & React.RefAttributes<HTMLDivElement>>;
+export default BadgeSkeleton;

package/lib/types/components/skeleton/variants/box-skeleton/BoxSkeleton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+interface BoxSkeletonProps extends BaseSkeletonConfig {
+    height: number | string;
+    width: number | string;
+}
+declare const BoxSkeleton: React.ForwardRefExoticComponent<BoxSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export default BoxSkeleton;

package/lib/types/components/skeleton/variants/button-skeleton/ButtonSkeleton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+interface ButtonSkeletonProps extends BaseSkeletonConfig {
+    shouldRoundCorners?: boolean;
+}
+declare const ButtonSkeleton: React.ForwardRefExoticComponent<Omit<ButtonSkeletonProps, "borderRadius"> & React.RefAttributes<HTMLDivElement>>;
+export default ButtonSkeleton;

package/lib/types/components/skeleton/variants/circle-skeleton/CircleSkeleton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+interface CircleSkeletonProps extends BaseSkeletonConfig {
+    size: number;
+}
+declare const CircleSkeleton: React.ForwardRefExoticComponent<Omit<CircleSkeletonProps, "borderRadius"> & React.RefAttributes<HTMLDivElement>>;
+export default CircleSkeleton;

package/lib/types/components/skeleton/variants/headline-skeleton/HeadlineSkeleton.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+interface HeadlineSkeletonProps extends BaseSkeletonConfig {
+    width?: number | string;
+}
+export declare const H1Skeleton: React.ForwardRefExoticComponent<HeadlineSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export declare const H2Skeleton: React.ForwardRefExoticComponent<HeadlineSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export declare const H3Skeleton: React.ForwardRefExoticComponent<HeadlineSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export declare const H4Skeleton: React.ForwardRefExoticComponent<HeadlineSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export declare const H5Skeleton: React.ForwardRefExoticComponent<HeadlineSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export declare const H6Skeleton: React.ForwardRefExoticComponent<HeadlineSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/types/components/skeleton/variants/list-item-skeleton/ListItemSkeleton.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+declare const ListItemSkeleton: React.ForwardRefExoticComponent<BaseSkeletonConfig & React.RefAttributes<HTMLDivElement>>;
+export default ListItemSkeleton;

package/lib/types/components/skeleton/variants/list-item-skeleton/ListItemSkeleton.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledListItemSkeleton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledListItemSkeletonBars: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/types/components/skeleton/variants/text-skeleton/TextSkeleton.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { BaseSkeletonConfig } from '../../types';
+interface TextSkeletonProps extends BaseSkeletonConfig {
+    width?: number | string;
+    lines?: number;
+    randomWithBounds?: [number, number];
+}
+declare const TextSkeleton: React.ForwardRefExoticComponent<TextSkeletonProps & React.RefAttributes<HTMLDivElement>>;
+export default TextSkeleton;

package/lib/types/components/skeleton/variants/text-skeleton/TextSkeleton.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledTextSkeleton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/types/index.d.ts

@@ -98,3 +98,5 @@ export { uploadFile } from './utils/uploadFile';
 export type { Theme } from './components/color-scheme-provider/ColorSchemeProvider';
 export { ComboBoxSize } from './components/combobox/ComboBox.types';
 export type { IComboBoxItem as ComboBoxItem, ComboBoxTextStyles, IComboBoxItems as ComboBoxItems, ComboBoxRef, } from './components/combobox/ComboBox.types';
+export { default as Skeleton } from './components/skeleton';
+export { SkeletonAnimationType } from './components/skeleton/types';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.1.1",
+    "version": "5.2.0",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -88,5 +88,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "1fc86c2c627ea82700739c8743e5ad359ef6680b"
+    "gitHead": "82de2d58db2a74db0a79e51bf153e49da5061fd4"
 }