react-native-skelo 0.0.5 → 0.1.0-alpha.0

package/lib/module/core/parser/expandLists.js

@@ -1,61 +0,0 @@
-import React, { isValidElement } from 'react';
-import { View } from 'react-native';
-import { getComponentName } from '../../utils/componentUtils';
-
-// List components whose rows come from `renderItem` (not JSX children).
-const LIST_TYPES = new Set(['FlatList', 'SectionList', 'VirtualizedList', 'FlashList']);
-const NOOP_SEPARATORS = {
-  highlight: () => {},
-  unhighlight: () => {},
-  updateProps: () => {}
-};
-
-// Renders `count` sample rows from a list's `renderItem` so there's something
-// to skeletonize while the real data is still loading (the rows don't exist in
-// the tree yet). Rows that throw on placeholder data are skipped.
-function renderSampleRows(list, count) {
-  const props = list.props || {};
-  const data = Array.isArray(props.data) ? props.data : [];
-  const sample = data.length > 0 ? data[0] : {};
-  const rows = [];
-  for (let i = 0; i < count; i++) {
-    try {
-      const row = props.renderItem?.({
-        item: sample,
-        index: i,
-        section: {},
-        separators: NOOP_SEPARATORS
-      });
-      if (row) {
-        rows.push(/*#__PURE__*/React.createElement(React.Fragment, {
-          key: i
-        }, row));
-      }
-    } catch {
-      // Row couldn't render with placeholder data — skip it.
-    }
-  }
-  return /*#__PURE__*/React.createElement(View, {
-    style: props.contentContainerStyle
-  }, rows);
-}
-
-// Walks a child tree and replaces FlatList/SectionList with sample rows so a
-// plain `<Skeleton><FlatList/></Skeleton>` produces a skeleton while loading.
-export function expandListPlaceholders(children, count) {
-  return React.Children.map(children, child => {
-    if (! /*#__PURE__*/isValidElement(child)) {
-      return child;
-    }
-    const name = getComponentName(child);
-    const props = child.props || {};
-    if (LIST_TYPES.has(name) && typeof props.renderItem === 'function') {
-      return renderSampleRows(child, count);
-    }
-    if (props.children) {
-      return /*#__PURE__*/React.cloneElement(child, undefined, expandListPlaceholders(props.children, count));
-    }
-    return child;
-  });
-}
-//# sourceMappingURL=expandLists.js.map

package/lib/module/core/parser/expandLists.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["React","isValidElement","View","getComponentName","LIST_TYPES","Set","NOOP_SEPARATORS","highlight","unhighlight","updateProps","renderSampleRows","list","count","props","data","Array","isArray","sample","length","rows","i","row","renderItem","item","index","section","separators","push","createElement","Fragment","key","style","contentContainerStyle","expandListPlaceholders","children","Children","map","child","name","has","cloneElement","undefined"],"sourceRoot":"../../../../src","sources":["core/parser/expandLists.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,cAAc,QAAQ,OAAO;AAE7C,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,gBAAgB,QAAQ,4BAA4B;;AAE7D;AACA,MAAMC,UAAU,GAAG,IAAIC,GAAG,CAAC,CAAC,UAAU,EAAE,aAAa,EAAE,iBAAiB,EAAE,WAAW,CAAC,CAAC;AAEvF,MAAMC,eAAe,GAAG;EACtBC,SAAS,EAAEA,CAAA,KAAM,CAAC,CAAC;EACnBC,WAAW,EAAEA,CAAA,KAAM,CAAC,CAAC;EACrBC,WAAW,EAAEA,CAAA,KAAM,CAAC;AACtB,CAAC;;AAED;AACA;AACA;AACA,SAASC,gBAAgBA,CAACC,IAAkB,EAAEC,KAAa,EAAa;EACtE,MAAMC,KAAK,GAAIF,IAAI,CAACE,KAAK,IAAI,CAAC,CAS7B;EAED,MAAMC,IAAI,GAAGC,KAAK,CAACC,OAAO,CAACH,KAAK,CAACC,IAAI,CAAC,GAAGD,KAAK,CAACC,IAAI,GAAG,EAAE;EACxD,MAAMG,MAAM,GAAGH,IAAI,CAACI,MAAM,GAAG,CAAC,GAAGJ,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;EAE7C,MAAMK,IAAiB,GAAG,EAAE;EAC5B,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGR,KAAK,EAAEQ,CAAC,EAAE,EAAE;IAC9B,IAAI;MACF,MAAMC,GAAG,GAAGR,KAAK,CAACS,UAAU,GAAG;QAC7BC,IAAI,EAAEN,MAAM;QACZO,KAAK,EAAEJ,CAAC;QACRK,OAAO,EAAE,CAAC,CAAC;QACXC,UAAU,EAAEpB;MACd,CAAC,CAAC;MACF,IAAIe,GAAG,EAAE;QACPF,IAAI,CAACQ,IAAI,cAAC3B,KAAA,CAAA4B,aAAA,CAAC5B,KAAK,CAAC6B,QAAQ;UAACC,GAAG,EAAEV;QAAE,GAAEC,GAAoB,CAAC,CAAC;MAC3D;IACF,CAAC,CAAC,MAAM;MACN;IAAA;EAEJ;EAEA,oBAAOrB,KAAA,CAAA4B,aAAA,CAAC1B,IAAI;IAAC6B,KAAK,EAAElB,KAAK,CAACmB;EAA+B,GAAEb,IAAW,CAAC;AACzE;;AAEA;AACA;AACA,OAAO,SAASc,sBAAsBA,CAACC,QAAmB,EAAEtB,KAAa,EAAa;EACpF,OAAOZ,KAAK,CAACmC,QAAQ,CAACC,GAAG,CAACF,QAAQ,EAAEG,KAAK,IAAI;IAC3C,IAAI,eAACpC,cAAc,CAACoC,KAAK,CAAC,EAAE;MAC1B,OAAOA,KAAK;IACd;IAEA,MAAMC,IAAI,GAAGnC,gBAAgB,CAACkC,KAAK,CAAC;IACpC,MAAMxB,KAAK,GAAIwB,KAAK,CAACxB,KAAK,IAAI,CAAC,CAA8B;IAE7D,IACET,UAAU,CAACmC,GAAG,CAACD,IAAI,CAAC,IACpB,OAAQzB,KAAK,CAA8BS,UAAU,KAAK,UAAU,EACpE;MACA,OAAOZ,gBAAgB,CAAC2B,KAAK,EAAEzB,KAAK,CAAC;IACvC;IAEA,IAAIC,KAAK,CAACqB,QAAQ,EAAE;MAClB,oBAAOlC,KAAK,CAACwC,YAAY,CAACH,KAAK,EAAEI,SAAS,EAAER,sBAAsB,CAACpB,KAAK,CAACqB,QAAQ,EAAEtB,KAAK,CAAC,CAAC;IAC5F;IAEA,OAAOyB,KAAK;EACd,CAAC,CAAC;AACJ","ignoreList":[]}

package/lib/module/deep.js

@@ -1,11 +0,0 @@
-// Opt-in deep mode. Import once in your app entry to enable `<Skeleton deep>`:
-//
-//   import 'react-native-skelo/deep';
-//
-// This is the only module that pulls in react-reconciler, so apps that don't
-// use deep mode never bundle it. Requires `react-reconciler` to be installed.
-import { setDeepExpander } from './core/deepRegistry';
-import { expandToComponentNodes } from './core/parser/expandOffline';
-setDeepExpander(expandToComponentNodes);
-export const deepEnabled = true;
-//# sourceMappingURL=deep.js.map

package/lib/module/deep.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["setDeepExpander","expandToComponentNodes","deepEnabled"],"sourceRoot":"../../src","sources":["deep.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,eAAe,QAAQ,qBAAqB;AACrD,SAASC,sBAAsB,QAAQ,6BAA6B;AAEpED,eAAe,CAACC,sBAAsB,CAAC;AAEvC,OAAO,MAAMC,WAAW,GAAG,IAAI","ignoreList":[]}

package/lib/typescript/core/deepRegistry.d.ts

@@ -1,7 +0,0 @@
-import type { ReactElement } from 'react';
-import type { ComponentNode } from '../types';
-type DeepExpander = (element: ReactElement) => ComponentNode[] | null;
-export declare function setDeepExpander(fn: DeepExpander): void;
-export declare function getDeepExpander(): DeepExpander | null;
-export {};
-//# sourceMappingURL=deepRegistry.d.ts.map

package/lib/typescript/core/deepRegistry.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"deepRegistry.d.ts","sourceRoot":"","sources":["../../../src/core/deepRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAI9C,KAAK,YAAY,GAAG,CAAC,OAAO,EAAE,YAAY,KAAK,aAAa,EAAE,GAAG,IAAI,CAAC;AAItE,wBAAgB,eAAe,CAAC,EAAE,EAAE,YAAY,GAAG,IAAI,CAEtD;AAED,wBAAgB,eAAe,IAAI,YAAY,GAAG,IAAI,CAErD"}

package/lib/typescript/core/parser/expandLists.d.ts

@@ -1,3 +0,0 @@
-import type { ReactNode } from 'react';
-export declare function expandListPlaceholders(children: ReactNode, count: number): ReactNode;
-//# sourceMappingURL=expandLists.d.ts.map

package/lib/typescript/core/parser/expandLists.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"expandLists.d.ts","sourceRoot":"","sources":["../../../../src/core/parser/expandLists.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAqDrD,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,CAsBpF"}

package/lib/typescript/deep.d.ts

@@ -1,2 +0,0 @@
-export declare const deepEnabled = true;
-//# sourceMappingURL=deep.d.ts.map

package/lib/typescript/deep.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"deep.d.ts","sourceRoot":"","sources":["../../src/deep.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,WAAW,OAAO,CAAC"}

package/src/core/deepRegistry.ts

@@ -1,16 +0,0 @@
-import type { ReactElement } from 'react';
-import type { ComponentNode } from '../types';
-
-// Deep expansion is opt-in so the core bundle never depends on react-reconciler.
-// `react-native-skelo/deep` registers the expander; Skeleton reads it here.
-type DeepExpander = (element: ReactElement) => ComponentNode[] | null;
-
-let expander: DeepExpander | null = null;
-
-export function setDeepExpander(fn: DeepExpander): void {
-  expander = fn;
-}
-
-export function getDeepExpander(): DeepExpander | null {
-  return expander;
-}

package/src/core/parser/expandLists.tsx

@@ -1,77 +0,0 @@
-import React, { isValidElement } from 'react';
-import type { ReactElement, ReactNode } from 'react';
-import { View } from 'react-native';
-import { getComponentName } from '../../utils/componentUtils';
-
-// List components whose rows come from `renderItem` (not JSX children).
-const LIST_TYPES = new Set(['FlatList', 'SectionList', 'VirtualizedList', 'FlashList']);
-
-const NOOP_SEPARATORS = {
-  highlight: () => {},
-  unhighlight: () => {},
-  updateProps: () => {},
-};
-
-// Renders `count` sample rows from a list's `renderItem` so there's something
-// to skeletonize while the real data is still loading (the rows don't exist in
-// the tree yet). Rows that throw on placeholder data are skipped.
-function renderSampleRows(list: ReactElement, count: number): ReactNode {
-  const props = (list.props || {}) as {
-    renderItem?: (info: {
-      item: unknown;
-      index: number;
-      section?: unknown;
-      separators: typeof NOOP_SEPARATORS;
-    }) => ReactNode;
-    data?: unknown[];
-    contentContainerStyle?: unknown;
-  };
-
-  const data = Array.isArray(props.data) ? props.data : [];
-  const sample = data.length > 0 ? data[0] : {};
-
-  const rows: ReactNode[] = [];
-  for (let i = 0; i < count; i++) {
-    try {
-      const row = props.renderItem?.({
-        item: sample,
-        index: i,
-        section: {},
-        separators: NOOP_SEPARATORS,
-      });
-      if (row) {
-        rows.push(<React.Fragment key={i}>{row}</React.Fragment>);
-      }
-    } catch {
-      // Row couldn't render with placeholder data — skip it.
-    }
-  }
-
-  return <View style={props.contentContainerStyle as never}>{rows}</View>;
-}
-
-// Walks a child tree and replaces FlatList/SectionList with sample rows so a
-// plain `<Skeleton><FlatList/></Skeleton>` produces a skeleton while loading.
-export function expandListPlaceholders(children: ReactNode, count: number): ReactNode {
-  return React.Children.map(children, child => {
-    if (!isValidElement(child)) {
-      return child;
-    }
-
-    const name = getComponentName(child);
-    const props = (child.props || {}) as { children?: ReactNode };
-
-    if (
-      LIST_TYPES.has(name) &&
-      typeof (props as { renderItem?: unknown }).renderItem === 'function'
-    ) {
-      return renderSampleRows(child, count);
-    }
-
-    if (props.children) {
-      return React.cloneElement(child, undefined, expandListPlaceholders(props.children, count));
-    }
-
-    return child;
-  });
-}

package/src/deep.ts

@@ -1,12 +0,0 @@
-// Opt-in deep mode. Import once in your app entry to enable `<Skeleton deep>`:
-//
-//   import 'react-native-skelo/deep';
-//
-// This is the only module that pulls in react-reconciler, so apps that don't
-// use deep mode never bundle it. Requires `react-reconciler` to be installed.
-import { setDeepExpander } from './core/deepRegistry';
-import { expandToComponentNodes } from './core/parser/expandOffline';
-
-setDeepExpander(expandToComponentNodes);
-
-export const deepEnabled = true;