@pallamart/pm-core-components 2.1.0 → 2.2.1

package/dist/components/internal/avatar/pm-avatar.js

@@ -2,5 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { PallamartClassNameService } from '@pallamart/pm-design-system';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
-export const PmAvatar = React.forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Root, { ref: ref, className: PallamartClassNameService.merge('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className), ...props })));
+import { PmSkeleton } from '../skeleton/pm-skeleton.js';
+export const PmAvatar = React.forwardRef(({ className, isLoading = false, ...props }, ref) => isLoading ? (_jsx(PmSkeleton, { className: PallamartClassNameService.merge('h-10 w-10 shrink-0 rounded-full', className) })) : (_jsx(AvatarPrimitive.Root, { ref: ref, className: PallamartClassNameService.merge('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className), ...props })));
 PmAvatar.displayName = AvatarPrimitive.Root.displayName;

package/dist/components/internal/badge/pm-badge.d.ts

@@ -1,2 +1,2 @@
 import type { PmBadgeProps } from '../../../models/internal/badge/pm-badge-props.js';
-export declare const PmBadge: ({ className, variant, ...props }: PmBadgeProps) => import("react").JSX.Element;
+export declare const PmBadge: ({ className, isLoading, variant, ...props }: PmBadgeProps) => import("react").JSX.Element;

package/dist/components/internal/badge/pm-badge.js

@@ -1,6 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { PallamartClassNameService } from '@pallamart/pm-design-system';
 import { PmBadgeVariants } from '../../../constants/internal/pm-badge-variants.js';
-export const PmBadge = ({ className, variant, ...props }) => {
+import { PmSkeleton } from '../skeleton/pm-skeleton.js';
+export const PmBadge = ({ className, isLoading = false, variant, ...props }) => {
+    if (isLoading)
+        return (_jsx(PmSkeleton, { className: PallamartClassNameService.merge('h-5 w-16 rounded-full', className) }));
     return (_jsx("div", { className: PallamartClassNameService.merge(PmBadgeVariants({ variant }), className), ...props }));
 };

package/dist/components/internal/card/pm-card.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { PallamartClassNameService } from '@pallamart/pm-design-system';
-export const PmCard = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: PallamartClassNameService.merge('rounded-xl border bg-card text-card-foreground shadow', className), ...props })));
+import { PmSkeleton } from '../skeleton/pm-skeleton.js';
+export const PmCard = React.forwardRef(({ className, isLoading = false, ...props }, ref) => isLoading ? (_jsx(PmSkeleton, { className: PallamartClassNameService.merge('h-40 w-full rounded-xl', className) })) : (_jsx("div", { ref: ref, className: PallamartClassNameService.merge('rounded-xl border bg-card text-card-foreground shadow', className), ...props })));
 PmCard.displayName = 'PmCard';

package/dist/components/internal/input/pm-input.js

@@ -1,7 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { PallamartClassNameService } from '@pallamart/pm-design-system';
-export const PmInput = React.forwardRef(({ className, type, ...props }, ref) => {
+import { PmSkeleton } from '../skeleton/pm-skeleton.js';
+export const PmInput = React.forwardRef(({ className, isLoading = false, type, ...props }, ref) => {
+    if (isLoading)
+        return (_jsx(PmSkeleton, { className: PallamartClassNameService.merge('h-9 w-full rounded-md', className) }));
     return (_jsx("input", { type: type, className: PallamartClassNameService.merge('flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', className), ref: ref, ...props }));
 });
 PmInput.displayName = 'PmInput';

package/dist/components/internal/select/pm-select-trigger.js

@@ -3,5 +3,6 @@ import * as React from 'react';
 import { PallamartClassNameService } from '@pallamart/pm-design-system';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { ChevronDown } from 'lucide-react';
-export const PmSelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(SelectPrimitive.Trigger, { ref: ref, className: PallamartClassNameService.merge('flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1', className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDown, { className: 'h-4 w-4 opacity-50' }) })] })));
+import { PmSkeleton } from '../skeleton/pm-skeleton.js';
+export const PmSelectTrigger = React.forwardRef(({ className, children, isLoading = false, ...props }, ref) => isLoading ? (_jsx(PmSkeleton, { className: PallamartClassNameService.merge('h-9 w-full rounded-md', className) })) : (_jsxs(SelectPrimitive.Trigger, { ref: ref, className: PallamartClassNameService.merge('flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1', className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDown, { className: 'h-4 w-4 opacity-50' }) })] })));
 PmSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;

package/dist/components/internal/skeleton/pm-skeleton.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { PallamartClassNameService } from '@pallamart/pm-design-system';
 export const PmSkeleton = ({ className, ...props }) => {
-    return (_jsx("div", { className: PallamartClassNameService.merge('animate-pulse rounded-md bg-primary/10', className), ...props }));
+    return (_jsx("div", { className: PallamartClassNameService.merge('pm-skeleton rounded-md', className), ...props }));
 };

package/dist/models/internal/avatar/pm-avatar-props.d.ts

@@ -1,4 +1,5 @@
 import type * as React from 'react';
 import type * as AvatarPrimitive from '@radix-ui/react-avatar';
 export interface PmAvatarProps extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root> {
+    isLoading?: boolean;
 }

package/dist/models/internal/badge/pm-badge-props.d.ts

@@ -2,4 +2,5 @@ import type * as React from 'react';
 import type { VariantProps } from 'class-variance-authority';
 import type { PmBadgeVariants } from '../../../constants/internal/pm-badge-variants.js';
 export interface PmBadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof PmBadgeVariants> {
+    isLoading?: boolean;
 }

package/dist/models/internal/card/pm-card-props.d.ts

@@ -1,3 +1,4 @@
 import type * as React from 'react';
 export interface PmCardProps extends React.HTMLAttributes<HTMLDivElement> {
+    isLoading?: boolean;
 }

package/dist/models/internal/input/pm-input-props.d.ts

@@ -1,3 +1,4 @@
 import type * as React from 'react';
 export interface PmInputProps extends React.ComponentProps<'input'> {
+    isLoading?: boolean;
 }

package/dist/models/internal/select/pm-select-trigger-props.d.ts

@@ -1,4 +1,5 @@
 import type * as React from 'react';
 import type * as SelectPrimitive from '@radix-ui/react-select';
 export interface PmSelectTriggerProps extends React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger> {
+    isLoading?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pallamart/pm-core-components",
-	"version": "2.1.0",
+	"version": "2.2.1",
 	"private": false,
 	"type": "module",
 	"main": "./dist/index.js",