panelui-native 0.91.0 → 0.92.0

package/lib/module/components/skeleton/index.js

@@ -30,6 +30,7 @@ const RESTING_OPACITY = 0.7;
  */
 export const Skeleton = /*#__PURE__*/memo(function Skeleton({
   className,
+  style,
   label
 }) {
   const reducedMotion = useReducedMotion();
@@ -57,7 +58,7 @@ export const Skeleton = /*#__PURE__*/memo(function Skeleton({
     } : undefined,
     accessibilityElementsHidden: !announced,
     importantForAccessibility: announced ? 'auto' : 'no-hide-descendants',
-    style: animatedStyle,
+    style: [style, animatedStyle],
     className: cn('rounded-md bg-skeleton', className)
   });
 });

package/lib/module/components/skeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["memo","useEffect","Animated","cancelAnimation","useAnimatedStyle","useReducedMotion","useSharedValue","withRepeat","withTiming","cn","jsx","_jsx","PULSE_DURATION","PULSE_FLOOR","RESTING_OPACITY","Skeleton","className","label","reducedMotion","opacity","value","undefined","duration","animatedStyle","announced","View","accessibilityRole","accessibilityLabel","accessibilityState","busy","accessibilityElementsHidden","importantForAccessibility","style"],"sourceRoot":"../../../../src","sources":["components/skeleton/index.tsx"],"mappings":";;AAAA,SAASA,IAAI,EAAEC,SAAS,QAAQ,OAAO;AACvC,OAAOC,QAAQ,IACbC,eAAe,EACfC,gBAAgB,EAChBC,gBAAgB,EAChBC,cAAc,EACdC,UAAU,EACVC,UAAU,QACL,yBAAyB;AAChC,SAASC,EAAE,QAAQ,mBAAgB;;AAEnC;AAAA,SAAAC,GAAA,IAAAC,IAAA;AACA,MAAMC,cAAc,GAAG,GAAG;AAC1B;AACA,MAAMC,WAAW,GAAG,IAAI;AACxB;AACA;AACA;AACA;AACA,MAAMC,eAAe,GAAG,GAAG;AAgB3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,QAAQ,gBAAGf,IAAI,CAAC,SAASe,QAAQA,CAAC;EAC7CC,SAAS;EACTC;AACa,CAAC,EAAE;EAChB,MAAMC,aAAa,GAAGb,gBAAgB,CAAC,CAAC;EACxC,MAAMc,OAAO,GAAGb,cAAc,CAACY,aAAa,GAAGJ,eAAe,GAAG,CAAC,CAAC;EAEnEb,SAAS,CAAC,MAAM;IACd,IAAIiB,aAAa,EAAE;MACjBC,OAAO,CAACC,KAAK,GAAGN,eAAe;MAC/B,OAAOO,SAAS;IAClB;IACAF,OAAO,CAACC,KAAK,GAAG,CAAC;IACjBD,OAAO,CAACC,KAAK,GAAGb,UAAU,CACxBC,UAAU,CAACK,WAAW,EAAE;MAAES,QAAQ,EAAEV;IAAe,CAAC,CAAC,EACrD,CAAC,CAAC,EACF,IACF,CAAC;IACD,OAAO,MAAMT,eAAe,CAACgB,OAAO,CAAC;EACvC,CAAC,EAAE,CAACA,OAAO,EAAED,aAAa,CAAC,CAAC;EAE5B,MAAMK,aAAa,GAAGnB,gBAAgB,CAAC,OAAO;IAC5Ce,OAAO,EAAEA,OAAO,CAACC;EACnB,CAAC,CAAC,CAAC;EAEH,MAAMI,SAAS,GAAGP,KAAK,IAAI,IAAI;EAE/B,oBACEN,IAAA,CAACT,QAAQ,CAACuB,IAAI;IACZC,iBAAiB,EAAEF,SAAS,GAAG,aAAa,GAAGH,SAAU;IACzDM,kBAAkB,EAAEV,KAAM;IAC1BW,kBAAkB,EAAEJ,SAAS,GAAG;MAAEK,IAAI,EAAE;IAAK,CAAC,GAAGR,SAAU;IAC3DS,2BAA2B,EAAE,CAACN,SAAU;IACxCO,yBAAyB,EAAEP,SAAS,GAAG,MAAM,GAAG,qBAAsB;IACtEQ,KAAK,EAAET,aAAc;IACrBP,SAAS,EAAEP,EAAE,CAAC,wBAAwB,EAAEO,SAAS;EAAE,CACpD,CAAC;AAEN,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["memo","useEffect","Animated","cancelAnimation","useAnimatedStyle","useReducedMotion","useSharedValue","withRepeat","withTiming","cn","jsx","_jsx","PULSE_DURATION","PULSE_FLOOR","RESTING_OPACITY","Skeleton","className","style","label","reducedMotion","opacity","value","undefined","duration","animatedStyle","announced","View","accessibilityRole","accessibilityLabel","accessibilityState","busy","accessibilityElementsHidden","importantForAccessibility"],"sourceRoot":"../../../../src","sources":["components/skeleton/index.tsx"],"mappings":";;AAAA,SAASA,IAAI,EAAEC,SAAS,QAAQ,OAAO;AAEvC,OAAOC,QAAQ,IACbC,eAAe,EACfC,gBAAgB,EAChBC,gBAAgB,EAChBC,cAAc,EACdC,UAAU,EACVC,UAAU,QACL,yBAAyB;AAChC,SAASC,EAAE,QAAQ,mBAAgB;;AAEnC;AAAA,SAAAC,GAAA,IAAAC,IAAA;AACA,MAAMC,cAAc,GAAG,GAAG;AAC1B;AACA,MAAMC,WAAW,GAAG,IAAI;AACxB;AACA;AACA;AACA;AACA,MAAMC,eAAe,GAAG,GAAG;AAwB3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,QAAQ,gBAAGf,IAAI,CAAC,SAASe,QAAQA,CAAC;EAC7CC,SAAS;EACTC,KAAK;EACLC;AACa,CAAC,EAAE;EAChB,MAAMC,aAAa,GAAGd,gBAAgB,CAAC,CAAC;EACxC,MAAMe,OAAO,GAAGd,cAAc,CAACa,aAAa,GAAGL,eAAe,GAAG,CAAC,CAAC;EAEnEb,SAAS,CAAC,MAAM;IACd,IAAIkB,aAAa,EAAE;MACjBC,OAAO,CAACC,KAAK,GAAGP,eAAe;MAC/B,OAAOQ,SAAS;IAClB;IACAF,OAAO,CAACC,KAAK,GAAG,CAAC;IACjBD,OAAO,CAACC,KAAK,GAAGd,UAAU,CACxBC,UAAU,CAACK,WAAW,EAAE;MAAEU,QAAQ,EAAEX;IAAe,CAAC,CAAC,EACrD,CAAC,CAAC,EACF,IACF,CAAC;IACD,OAAO,MAAMT,eAAe,CAACiB,OAAO,CAAC;EACvC,CAAC,EAAE,CAACA,OAAO,EAAED,aAAa,CAAC,CAAC;EAE5B,MAAMK,aAAa,GAAGpB,gBAAgB,CAAC,OAAO;IAC5CgB,OAAO,EAAEA,OAAO,CAACC;EACnB,CAAC,CAAC,CAAC;EAEH,MAAMI,SAAS,GAAGP,KAAK,IAAI,IAAI;EAE/B,oBACEP,IAAA,CAACT,QAAQ,CAACwB,IAAI;IACZC,iBAAiB,EAAEF,SAAS,GAAG,aAAa,GAAGH,SAAU;IACzDM,kBAAkB,EAAEV,KAAM;IAC1BW,kBAAkB,EAAEJ,SAAS,GAAG;MAAEK,IAAI,EAAE;IAAK,CAAC,GAAGR,SAAU;IAC3DS,2BAA2B,EAAE,CAACN,SAAU;IACxCO,yBAAyB,EAAEP,SAAS,GAAG,MAAM,GAAG,qBAAsB;IACtER,KAAK,EAAE,CAACA,KAAK,EAAEO,aAAa,CAAE;IAC9BR,SAAS,EAAEP,EAAE,CAAC,wBAAwB,EAAEO,SAAS;EAAE,CACpD,CAAC;AAEN,CAAC,CAAC","ignoreList":[]}

package/lib/typescript/src/components/skeleton/index.d.ts

@@ -1,5 +1,14 @@
+import type { ViewProps } from 'react-native';
 export interface SkeletonProps {
     className?: string;
+    /**
+     * View style for the placeholder — a dimension computed at runtime, or one no
+     * utility class expresses. Ordinary sizing belongs in `className`, and a
+     * value here wins over the class that sets the same property.
+     *
+     * The pulse owns `opacity`; setting it here has no effect.
+     */
+    style?: ViewProps['style'];
     /**
      * What is loading, for a screen reader. Setting it makes this skeleton
      * announce as a busy status; leaving it unset keeps the placeholder out of
@@ -25,5 +34,5 @@ export interface SkeletonProps {
  * stops moving does not read as hung: it is a shape where content will be, and
  * the shape says that on its own.
  */
-export declare const Skeleton: import("react").MemoExoticComponent<({ className, label, }: SkeletonProps) => import("react").JSX.Element>;
+export declare const Skeleton: import("react").MemoExoticComponent<({ className, style, label, }: SkeletonProps) => import("react").JSX.Element>;
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/skeleton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/skeleton/index.tsx"],"names":[],"mappings":"AAqBA,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;;;OAQG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,QAAQ,8DAGlB,aAAa,iCAmCd,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/skeleton/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAqB9C,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC3B;;;;;;;;OAQG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,QAAQ,qEAIlB,aAAa,iCAmCd,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "panelui-native",
-  "version": "0.91.0",
+  "version": "0.92.0",
   "description": "High-performance React Native UI components for Expo. Semantic design tokens, powered by Uniwind (Tailwind v4) and Reanimated.",
   "main": "./lib/module/index.js",
   "module": "./lib/module/index.js",

package/src/components/skeleton/index.tsx

@@ -1,4 +1,5 @@
 import { memo, useEffect } from 'react';
+import type { ViewProps } from 'react-native';
 import Animated, {
   cancelAnimation,
   useAnimatedStyle,
@@ -21,6 +22,14 @@ const RESTING_OPACITY = 0.7;
 
 export interface SkeletonProps {
   className?: string;
+  /**
+   * View style for the placeholder — a dimension computed at runtime, or one no
+   * utility class expresses. Ordinary sizing belongs in `className`, and a
+   * value here wins over the class that sets the same property.
+   *
+   * The pulse owns `opacity`; setting it here has no effect.
+   */
+  style?: ViewProps['style'];
   /**
    * What is loading, for a screen reader. Setting it makes this skeleton
    * announce as a busy status; leaving it unset keeps the placeholder out of
@@ -49,6 +58,7 @@ export interface SkeletonProps {
  */
 export const Skeleton = memo(function Skeleton({
   className,
+  style,
   label,
 }: SkeletonProps) {
   const reducedMotion = useReducedMotion();
@@ -81,7 +91,7 @@ export const Skeleton = memo(function Skeleton({
       accessibilityState={announced ? { busy: true } : undefined}
       accessibilityElementsHidden={!announced}
       importantForAccessibility={announced ? 'auto' : 'no-hide-descendants'}
-      style={animatedStyle}
+      style={[style, animatedStyle]}
       className={cn('rounded-md bg-skeleton', className)}
     />
   );