@pk-design/react-tailwind 1.1.1 → 1.1.3

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

@@ -1,4 +1,5 @@
 import type { JSX, ElementType, ComponentPropsWithoutRef } from 'react';
+import type { PolymorphicRef } from '../common-type';
 /**
  * Theme variants applied to the Button component.
  *
@@ -35,11 +36,6 @@ export type ThemedButtonClass = {
         [key in ButtonVariant]: string;
     };
 };
-/**
- * Utility: Extract the correct `ref` type for intrinsic elements
- * or custom React components.
- */
-export type PolymorphicRef<C extends ElementType> = ComponentPropsWithoutRef<C>['ref'];
 /**
  * Utility: Builds a polymorphic prop type.
  *

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

@@ -1,3 +1,2 @@
-import React from 'react';
-import type { CardProps } from './Card.types';
-export declare const Card: React.ForwardRefExoticComponent<Omit<CardProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<Element>>;
+import type { CardComponent } from './Card.types';
+export declare const Card: CardComponent;

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

@@ -1,23 +1,71 @@
-import type { ElementType } from 'react';
-import { PolymorphicProps } from '../common-type';
+import type { ComponentPropsWithoutRef, ElementType, JSX } from 'react';
+import { PolymorphicRef } from '../common-type';
 export type CardBaseProps = {
     /**
-     * Make card hoverable (adds shadow transitions)
+     * Make card hoverable (adds background transitions)
+     * @default false
      */
     hoverable?: boolean;
     /**
      * Adds border around the card
+     * @default true
      */
     bordered?: boolean;
     /**
-     * Removes default padding
+     * Make card compact
+     * @default false
      */
-    noPadding?: boolean;
+    compact?: boolean;
+};
+/**
+ * Utility: Builds a polymorphic prop type.
+ *
+ * This allows the component to accept **any HTML element** or **any custom React component**
+ * via the `as` prop while automatically inheriting the correct props.
+ *
+ * Example:
+ * ```tsx
+ * <Card as="a" href="/home" />
+ * <Card as={MyLink} to="/home" customProp />
+ * ```
+ */
+export type PolymorphicCardProps<C extends ElementType, Props = {}> = Props & {
     /**
-     * Render Card as different element or component
+     * The element or component to render.
+     *
+     * Supports:
+     * - HTML elements (e.g., `"a"`, `"div"`)
+     * - React components (e.g., `Link`, `NextLink`, `MyCustomCard`)
      *
      * @default "div"
      */
-    as?: ElementType;
-};
-export type CardProps<C extends ElementType = 'div'> = PolymorphicProps<C, CardBaseProps>;
+    as?: C;
+} & Omit<ComponentPropsWithoutRef<C>, keyof Props | 'as'>;
+/**
+ * Complete Card props,
+ * supporting **polymorphic rendering** via the `as` prop.
+ *
+ * Examples:
+ *
+ * Render as a native card:
+ * ```tsx
+ * <Card>Card content</Card>
+ * ```
+ *
+ * Render as a link:
+ * ```tsx
+ * <Card as="a" href="/pricing" target="_blank">Learn More</Card>
+ * ```
+ *
+ * Render as a custom component:
+ * ```tsx
+ * <Card as={MyCustomComponent} customProp="123">Custom card content</Card>
+ * ```
+ */
+export type CardProps<C extends ElementType = 'div'> = PolymorphicCardProps<C, CardBaseProps>;
+export interface CardComponent {
+    <C extends ElementType = 'div'>(props: CardProps<C> & {
+        ref?: PolymorphicRef<C>;
+    }): JSX.Element;
+    displayName?: string;
+}

package/dist/types/components/RangeInput/index.d.ts

@@ -1 +1,2 @@
 export * from './RangeInput';
+export * from './RangeInput.types';

package/dist/types/components/common-type.d.ts

@@ -29,4 +29,9 @@ export interface InputCustomProps {
      */
     showErrorMessage?: boolean;
 }
+/**
+ * Utility: Extract the correct `ref` type for intrinsic elements
+ * or custom React components.
+ */
+export type PolymorphicRef<C extends ElementType> = ComponentPropsWithoutRef<C>['ref'];
 export type PolymorphicProps<C extends ElementType, Props> = Props & Omit<ComponentPropsWithoutRef<C>, keyof Props | 'as'>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pk-design/react-tailwind",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "main": "dist/react-tailwind.cjs.js",
   "module": "dist/react-tailwind.es.js",
   "types": "dist/types/index.d.ts",