@aic-kits/react 0.10.4 → 0.12.0

package/dist/components/Box/config.d.ts

@@ -465,7 +465,7 @@ declare const config: {
         readonly scale: "colors";
     };
 };
-export declare const cssPropsKey: readonly ["alignContent", "alignItems", "alignSelf", "display", "flex", "flexBasis", "flexDirection", "flexGrow", "flexShrink", "flexWrap", "justifyContent", "position", "top", "right", "bottom", "left", "overflow", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "opacity", "cursor", "transition", "transform", "animation", "willChange", "pointerEvents", "userSelect", "resize", "boxShadow", "textShadow", "filter", "backdropFilter", "mixBlendMode", "isolation", "zIndex", "marginInline", "marginBlock", "paddingInline", "paddingBlock"];
+export declare const cssPropsKey: readonly ["alignContent", "alignItems", "alignSelf", "display", "flex", "flexBasis", "flexDirection", "flexGrow", "flexShrink", "flexWrap", "justifyContent", "position", "top", "right", "bottom", "left", "overflow", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "opacity", "cursor", "transition", "transform", "animation", "willChange", "pointerEvents", "userSelect", "resize", "boxShadow", "textShadow", "filter", "backdropFilter", "mixBlendMode", "isolation", "zIndex", "marginInline", "marginBlock", "paddingInline", "paddingBlock", "willChange"];
 export declare const customBoxPropsKey: readonly ["absoluteFill", "fullWidth", "fullHeight", "fw", "fh"];
 export type ColorPropsKeyType = keyof typeof colors;
 export type SpacePropsKeyType = keyof typeof spaces;

package/dist/components/Carousel/CarouselItem.d.ts

@@ -1,10 +1,13 @@
 import { default as React } from 'react';
+import { Size } from '../../theme';
 import { CarouselRenderItemInfo } from './types';
 interface CarouselItemProps<T> {
     item: T;
     index: number;
     isFocused: boolean;
     renderItem: (info: CarouselRenderItemInfo<T>) => React.ReactNode;
+    itemsPerView: number;
+    itemWidth?: Size | string | number;
 }
-export declare function CarouselItem<T>({ item, index, isFocused, renderItem, }: CarouselItemProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function CarouselItem<T>({ item, index, isFocused, renderItem, itemsPerView, itemWidth, }: CarouselItemProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Carousel/CarouselItems.d.ts

@@ -1,10 +1,11 @@
 import { Space } from '../../theme';
 import { CarouselProps } from './types';
 export declare const scrollAnimation: import('styled-components/dist/models/Keyframes').default;
-interface CarouselItemsProps<T> extends Pick<CarouselProps<T>, 'autoScroll' | 'itemSpacing' | 'items' | 'renderItem' | 'keyExtractor'> {
+interface CarouselItemsProps<T> extends Pick<CarouselProps<T>, 'autoScroll' | 'itemSpacing' | 'items' | 'renderItem' | 'keyExtractor' | 'itemsPerView'> {
     itemSpacing: Space | undefined;
+    itemWidth: number | undefined;
     itemsWrapperRef: React.RefObject<HTMLDivElement | null>;
     activeIndex: number;
 }
-export declare function CarouselItems<T>({ itemSpacing, itemsWrapperRef, items, renderItem, keyExtractor, autoScroll, activeIndex, }: CarouselItemsProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function CarouselItems<T>({ itemSpacing, itemsWrapperRef, items, renderItem, keyExtractor, autoScroll, activeIndex, itemsPerView, itemWidth, }: CarouselItemsProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Carousel/index.d.ts

@@ -1,2 +1,2 @@
 import { CarouselProps } from './types';
-export declare function Carousel<T>({ items, renderItem, showPagination, showNavigation, autoPlay, autoScroll, initialIndex, onIndexChange, keyExtractor, itemSpacing, ...rest }: CarouselProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function Carousel<T>({ items, renderItem, showPagination, showNavigation, autoPlay, autoScroll, initialIndex, onIndexChange, keyExtractor, itemSpacing, itemsPerView, itemWidth, ...rest }: CarouselProps<T>): import("react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-import { Space } from '../../theme';
+import { Size, Space } from '../../theme';
 import { BoxProps } from '../Box';
 export interface CarouselRenderItemInfo<T> {
     item: T;
@@ -59,4 +59,16 @@ export interface CarouselProps<T = any> extends BoxProps {
      * Optional item spacing.
      */
     itemSpacing?: Space;
+    /**
+     * Number of items to display per view.
+     * Has no effect when `autoScroll` is enabled.
+     * @default 1
+     */
+    itemsPerView?: number;
+    /**
+     * Fixed width in pixels (e.g. '100px') or Size for each carousel item.
+     * If not provided, items will stretch to fill the container width divided by `itemsPerView`.
+     * Has no effect when `autoScroll` is enabled.
+     */
+    itemWidth?: Size | string | number;
 }

package/dist/components/Carousel/utils.d.ts

@@ -0,0 +1,2 @@
+import { Size, Theme } from '../../theme';
+export declare const getItemWidthNumericValue: (theme: Theme, itemWidth: Size | string | number | undefined) => number | undefined;

package/dist/components/Tag/StyledTag.d.ts

@@ -0,0 +1,29 @@
+import { Color, FontSize, Radius, Size, Space, TagSize, TagVariant, Theme } from '../../theme';
+export declare const getTagTextColor: (theme: Theme, color: Color, textColor?: Color, variant?: TagVariant) => string;
+export interface StyledTagProps {
+    $variant: TagVariant;
+    $color: Color;
+    $textColor?: Color;
+    $size: TagSize;
+    $radius: Radius | string;
+    $paddingVertical: Space;
+    $paddingHorizontal: Space;
+    $fontSize: FontSize;
+    $gap: Space;
+    $iconSize: Size;
+}
+export declare const StyledTagContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('..').BoxProps & {
+    ref?: import('react').ForwardedRef<HTMLDivElement>;
+}, StyledTagProps>> & string & Omit<(props: import('..').BoxProps & {
+    ref?: import('react').ForwardedRef<HTMLDivElement>;
+}) => ReturnType<({ children, style, "data-testid": testId, ...otherProps }: import('..').BoxProps, ref: import('react').ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element>, keyof import('react').Component<any, {}, any>>;
+export declare const StyledTagText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('..').TextProps & {
+    useRichText?: boolean;
+}, {
+    $color: Color;
+    $textColor?: Color;
+    $variant: TagVariant;
+    $fontSize: FontSize;
+}>> & string & Omit<(props: import('..').TextProps & {
+    useRichText?: boolean;
+}) => import("react/jsx-runtime").JSX.Element, keyof import('react').Component<any, {}, any>>;

package/dist/components/Tag/index.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { TagProps } from './types';
+export declare const Tag: React.FC<TagProps>;

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

@@ -0,0 +1,55 @@
+import { Icon } from '@phosphor-icons/react';
+import { Color, Radius, TagSize, TagVariant } from '../../theme';
+import { BoxProps } from '../Box';
+export interface TagProps extends BoxProps {
+    /**
+     * The variant style of the tag.
+     * 'solid': Filled background.
+     * 'outlined': Transparent background with border.
+     * @default 'solid'
+     */
+    variant?: TagVariant;
+    /**
+     * The base color scheme of the tag. Affects background/border and potentially text color.
+     * @default 'primary'
+     */
+    color?: Color;
+    /**
+     * The explicit color for the tag text. Overrides default logic based on variant/color.
+     */
+    textColor?: Color;
+    /**
+     * The size of the tag, affecting padding and font size.
+     * @default 'md'
+     */
+    size?: TagSize;
+    /**
+     * The border radius of the tag. Can use theme keys or specific pixel values.
+     * @default 'full'
+     */
+    radius?: Radius;
+    /**
+     * Icon to display before the main children.
+     */
+    icon?: Icon;
+    /**
+     * Icon to display after the main children.
+     */
+    rightIcon?: Icon;
+    /**
+     * Optional content to display before the main children, like an icon.
+     */
+    leftElement?: React.ReactNode;
+    /**
+     * Optional content to display after the main children, like a close button.
+     */
+    rightElement?: React.ReactNode;
+    /**
+     * The main content of the tag.
+     */
+    children: React.ReactNode;
+    /**
+     * Testing ID
+     */
+    'data-testid'?: string;
+}

package/dist/components/index.d.ts

@@ -13,3 +13,4 @@ export * from './Touchable';
 export * from './Vimeo';
 export * from './Carousel';
 export * from './Accordion';
+export * from './Tag';