@aic-kits/react 0.29.6 → 0.29.9

package/LICENSE.md

@@ -1,5 +1,5 @@
-MIT License
-
-Copyright (c) 2025
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files.
+MIT License
+
+Copyright (c) 2025
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files.

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

@@ -1,6 +1,6 @@
 import { Theme } from '../../theme';
 import { ConfigType } from './config';
-import { CustomBoxProps, CSSStyleProps, StyleProps } from './types';
+import { CustomBoxProps, CSSStyleProps, StyleProps, BoxProps } from './types';
 export declare const getThemeValue: (theme: Theme, key: keyof StyleProps, props: StyleProps) => {
     [x: string]: import('../..').WithResponsiveValue<string>;
 } | {
@@ -9,4 +9,4 @@ export declare const getThemeValue: (theme: Theme, key: keyof StyleProps, props:
 export declare const mapStylePropToThemeValue: (theme: Theme, props: StyleProps) => {};
 export declare const configKeys: Array<keyof ConfigType>;
 export declare const genBoxStyle: (theme: Theme, props: StyleProps & CSSStyleProps & CustomBoxProps) => import('styled-components').RuleSet<object>;
-export declare const StyledBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyleProps & import('../..').WithResponsive<Pick<import('react').CSSProperties, "filter" | "opacity" | "width" | "height" | "minWidth" | "maxWidth" | "minHeight" | "maxHeight" | "display" | "alignItems" | "alignContent" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "alignSelf" | "position" | "top" | "right" | "bottom" | "left" | "overflow" | "cursor" | "transition" | "transform" | "animation" | "willChange" | "pointerEvents" | "userSelect" | "resize" | "boxShadow" | "textShadow" | "backdropFilter" | "mixBlendMode" | "isolation" | "zIndex" | "marginInline" | "marginBlock" | "paddingInline" | "paddingBlock" | "whiteSpace" | "textOverflow" | "overflowY" | "overflowX">> & CustomBoxProps>> & string;
+export declare const StyledBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyleProps & import('../..').WithResponsive<Pick<import('react').CSSProperties, "filter" | "opacity" | "width" | "height" | "minWidth" | "maxWidth" | "minHeight" | "maxHeight" | "display" | "alignItems" | "alignContent" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "alignSelf" | "position" | "top" | "right" | "bottom" | "left" | "overflow" | "cursor" | "transition" | "transform" | "animation" | "willChange" | "pointerEvents" | "userSelect" | "resize" | "boxShadow" | "textShadow" | "backdropFilter" | "mixBlendMode" | "isolation" | "zIndex" | "marginInline" | "marginBlock" | "paddingInline" | "paddingBlock" | "whiteSpace" | "textOverflow" | "overflowY" | "overflowX">> & CustomBoxProps & BoxProps>> & string;

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

@@ -1,4 +1,4 @@
-import { CSSProperties, HTMLAttributes } from 'react';
+import { CSSProperties, HTMLAttributes, AnchorHTMLAttributes, ElementType } from 'react';
 import { BorderWidth, Color, Radius, Space } from '../../theme';
 import { WithResponsive, WithResponsiveValue } from '../../utils';
 import { ConfigType, CSSPropsKeyType } from './config';
@@ -37,7 +37,10 @@ export interface CustomBoxProps extends WithResponsive<{
     fh?: boolean;
 }> {
 }
-export interface BoxHTMLProps extends HTMLAttributes<HTMLDivElement> {
+/**
+ * Base props that are common to all Box variants
+ */
+export interface BaseBoxProps {
     /**
      * Box's content.
      */
@@ -51,6 +54,20 @@ export interface BoxHTMLProps extends HTMLAttributes<HTMLDivElement> {
      */
     'data-testid'?: string;
 }
-export interface BoxProps extends StyleProps, CSSStyleProps, CustomBoxProps, BoxHTMLProps {
+/**
+ * Complete Box component props (div by default, anchor optional)
+ */
+export interface BoxProps extends StyleProps, CSSStyleProps, CustomBoxProps, BaseBoxProps, Omit<HTMLAttributes<HTMLElement>, keyof BaseBoxProps>, Partial<AnchorHTMLAttributes<HTMLElement>> {
+    /**
+     * Tell `Box` to render a different underlying element (e.g. `'a'`).
+     * By default, it renders a `<div>`.
+     */
+    as?: string | ElementType;
 }
+export type BoxDivProps = Omit<BoxProps, keyof AnchorHTMLAttributes<HTMLElement>>;
+export type BoxAnchorProps = BoxProps & {
+    as: 'a';
+    href: string;
+};
+export type BoxElementProps = BoxDivProps | BoxAnchorProps;
 export {};

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

@@ -2,7 +2,7 @@ import { Icon } from '@phosphor-icons/react';
 import { default as React } from 'react';
 import { ButtonCorner, ButtonSize, ButtonVariant, Color } from '../../theme';
 import { BoxProps } from '../Box';
-interface ButtonBaseProps extends BoxProps {
+interface ButtonSpecificProps {
     /**
      * Disable state of button.
      */
@@ -57,6 +57,19 @@ interface ButtonBaseProps extends BoxProps {
      * Testing id of the component.
      */
     'data-testid'?: string;
+    /**
+     * When provided, the button will render as an anchor link (`<a>`),
+     * delegating the behavior to the underlying `Touchable` component.
+     */
+    href?: string;
+    /**
+     * Target attribute for the anchor tag (e.g., `_blank`). Only used when `href` is provided.
+     */
+    target?: string;
+    /**
+     * Rel attribute for the anchor tag (e.g., `noopener noreferrer`). Only used when `href` is provided.
+     */
+    rel?: string;
 }
 type ButtonContentProps = {
     icon: Icon;
@@ -65,5 +78,6 @@ type ButtonContentProps = {
     icon?: Icon;
     text: React.ReactNode;
 };
+type ButtonBaseProps = BoxProps & ButtonSpecificProps;
 export type ButtonProps = ButtonBaseProps & ButtonContentProps;
 export {};

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

@@ -1,6 +1,6 @@
 import { ForwardedRef } from 'react';
 import { TouchableProps } from './types';
-declare function PlainTouchable({ children, onClick, style, useScaleAnimation, useOpacityAnimation, 'data-testid': testId, ...props }: TouchableProps, ref: ForwardedRef<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+declare function PlainTouchable({ children, onClick, style, useScaleAnimation, useOpacityAnimation, href, target, rel, 'data-testid': testId, ...props }: TouchableProps, ref: ForwardedRef<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
 export declare const Touchable: (props: TouchableProps & {
     ref?: ForwardedRef<HTMLDivElement>;
 }) => ReturnType<typeof PlainTouchable>;

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

@@ -1,14 +1,14 @@
-import { default as React } from 'react';
+import { ReactNode, CSSProperties } from 'react';
 import { BoxProps } from '../Box';
-export interface TouchableProps extends React.HTMLAttributes<HTMLDivElement>, BoxProps {
+export type TouchableProps = BoxProps & {
     /**
      * Touchable's content.
      */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /**
      * Additional styles.
      */
-    style?: React.CSSProperties;
+    style?: CSSProperties;
     /**
      * Testing id of the component.
      */
@@ -23,4 +23,19 @@ export interface TouchableProps extends React.HTMLAttributes<HTMLDivElement>, Bo
      * @default true
      */
     useOpacityAnimation?: boolean;
-}
+    /**
+     * URL to navigate to when the touchable is clicked.
+     * When provided, renders as an anchor tag.
+     */
+    href?: string;
+    /**
+     * Target attribute for the anchor tag.
+     * Only used when href is provided.
+     */
+    target?: string;
+    /**
+     * Rel attribute for the anchor tag.
+     * Only used when href is provided.
+     */
+    rel?: string;
+};