@hero-design/rn-work-uikit 1.2.3 → 1.3.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn-work-uikit",
-  "version": "1.2.3",
+  "version": "1.3.1",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -13,7 +13,7 @@
     "test:watch": "jest --runInBand --watch",
     "test:ci": "jest --c=jest-ci.config.js --i --logHeapUsage --coverage && cat ./coverage/lcov.info",
     "build:js": "rollup -c",
-    "build:types": "tsc --noEmit false --emitDeclarationOnly --project tsconfig.prod.json",
+    "build:types": "rollup -c rollup.config.mjs --configPlugin dts",
     "build": "yarn build:js && yarn build:types",
     "build:watch": "yarn build:js -w & yarn build:types -w",
     "publish:npm": "yarn publish --access public",
@@ -23,7 +23,7 @@
     "@emotion/native": "^11.9.3",
     "@emotion/primitives-core": "11.0.0",
     "@emotion/react": "^11.9.3",
-    "@hero-design/rn": "^8.103.2"
+    "@hero-design/rn": "^8.103.4"
   },
   "peerDependencies": {
     "@hero-design/react-native-month-year-picker": "^8.43.1",
@@ -64,6 +64,7 @@
     "@react-native/eslint-config": "0.76.9",
     "@react-native/metro-config": "0.76.9",
     "@react-native/typescript-config": "0.76.9",
+    "@rollup/plugin-alias": "^5.1.1",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.1",
     "@rollup/plugin-json": "^6.1.0",
@@ -80,6 +81,7 @@
     "@typescript-eslint/eslint-plugin": "^5.12.1",
     "@typescript-eslint/parser": "^5.12.1",
     "babel-plugin-inline-import": "^3.0.0",
+    "babel-plugin-module-resolver": "^5.0.2",
     "config-tsconfig": "8.42.5",
     "core-js": "^3.33.0",
     "eslint": "^8.56.0",
@@ -87,10 +89,10 @@
     "eslint-config-hd": "8.42.5",
     "eslint-config-prettier": "^8.5.0",
     "eslint-import-resolver-typescript": "^3.5.2",
-    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-jsx-a11y": "^6.5.1",
     "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react": "^7.37.3",
+    "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^4.3.0",
     "jest": "^29.2.1",
     "jest-environment-jsdom": "^29.2.1",
@@ -111,6 +113,7 @@
     "rollup": "^4.24.3",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-delete": "^3.0.1",
+    "rollup-plugin-dts": "^6.2.1",
     "rollup-plugin-flow": "^1.1.1",
     "rollup-plugin-visualizer": "^5.12.0",
     "ts-jest": "^29.1.1",

package/rollup.config.mjs

@@ -9,6 +9,8 @@ import { visualizer } from 'rollup-plugin-visualizer';
 import pkg from './package.json' assert { type: 'json' };
 import copy from 'rollup-plugin-copy';
 import del from 'rollup-plugin-delete';
+import alias from '@rollup/plugin-alias';
+import dts from 'rollup-plugin-dts';
 
 const extensions = ['.js', '.jsx', '.ts', '.tsx'];
 
@@ -48,6 +50,11 @@ export default [
       '@ptomasroos/react-native-multi-slider',
     ],
     plugins: [
+      alias({
+        entries: [
+          { find: '@hero-design/rn', replacement: '../rn/src/index.internal.ts' }
+        ]
+      }),
       replace({
         'process.env.NODE_ENV': JSON.stringify('production'),
       }),
@@ -59,11 +66,11 @@ export default [
       babel({ extensions, babelHelpers: 'bundled' }),
       ...(generateBuildStats
         ? [
-            visualizer({
-              filename: fileName,
-              template: bundleTemplate,
-            }),
-          ]
+          visualizer({
+            filename: fileName,
+            template: bundleTemplate,
+          }),
+        ]
         : []),
       del({ targets: ['locales', 'assets'] }),
       copy({
@@ -80,4 +87,12 @@ export default [
       }),
     ],
   },
+  {
+    input: 'src/index.ts',
+    output: {
+      file: 'types/index.d.ts',
+      format: 'es',
+    },
+    plugins: [dts()],
+  },
 ];

package/src/__tests__/index-export.spec.ts

@@ -0,0 +1,64 @@
+import * as Base from '@hero-design/rn';
+import * as HD from '../index';
+import TextInput from '../components/TextInput';
+import Select from '../components/Select';
+import DatePicker from '../components/DatePicker';
+import TimePicker from '../components/TimePicker';
+import { getTheme, theme } from '../index';
+
+describe('index.ts exports', () => {
+  it('TextInput, Select, DatePicker, TimePicker should be custom rn-work-uikit versions', () => {
+    // Check that the exported components are not the same as the base ones
+    expect(HD.TextInput).not.toBe(Base.TextInput);
+    expect(HD.Select).not.toBe(Base.Select);
+    expect(HD.DatePicker).not.toBe(Base.DatePicker);
+    expect(HD.TimePicker).not.toBe(Base.TimePicker);
+  });
+
+  it('TextInput, Select, DatePicker, TimePicker should use the custom TextInput', () => {
+    // For TextInput, it's a direct export
+    expect(HD.TextInput).toBe(TextInput);
+    // For Select, DatePicker, TimePicker, check that they use the custom TextInput
+    // We can check the displayName or inspect the rendered output
+    // For DatePicker and TimePicker, check the TextInputComponent prop
+    // (We can't fully render without React Native, but we can check the implementation)
+    // These checks are mostly structural
+    expect(Select).toBe(HD.Select);
+    expect(DatePicker).toBe(HD.DatePicker);
+    expect(TimePicker).toBe(HD.TimePicker);
+  });
+});
+
+describe('Theme Export Override', () => {
+  it('should export work-specific theme with overridden textInput from index', () => {
+    // Check a few key values from the textInput override
+    expect(theme.__hd__.textInput.sizes.containerMinHeight).toBe(
+      54.92307692307692
+    );
+    expect(theme.__hd__.textInput.sizes.errorAndHelpTextContainerHeight).toBe(
+      0
+    );
+    expect(theme.__hd__.textInput.space.prefixAndInputContainerGap).toBe(
+      3.9230769230769234
+    );
+    // Check that borderWidths.container.normal is overridden
+    expect(theme.__hd__.textInput.borderWidths.container.normal).toBe(2);
+    // Check that colors.borders.default is overridden
+    expect(theme.__hd__.textInput.colors.borders.default).toBe('#e8e9ea');
+  });
+
+  it('should export work-specific getTheme function with overridden textInput', () => {
+    const workTheme = getTheme();
+    expect(workTheme.__hd__.textInput.sizes.containerMinHeight).toBe(
+      54.92307692307692
+    );
+    expect(
+      workTheme.__hd__.textInput.sizes.errorAndHelpTextContainerHeight
+    ).toBe(0);
+    expect(workTheme.__hd__.textInput.space.prefixAndInputContainerGap).toBe(
+      3.9230769230769234
+    );
+    expect(workTheme.__hd__.textInput.borderWidths.container.normal).toBe(2);
+    expect(workTheme.__hd__.textInput.colors.borders.default).toBe('#e8e9ea');
+  });
+});

package/src/__tests__/index.spec.tsx

@@ -1,22 +1,3 @@
-import React from 'react';
-import renderWithTheme from '../../testUtils/renderWithTheme';
-import { TextInput } from '..';
-
-describe('first test to ensure configure correctly', () => {
-  it('should render TextInput with props in snapshot', () => {
-    const onChangeTextSpy = jest.fn();
-    const { toJSON } = renderWithTheme(
-      <TextInput
-        placeholder="Enter text here"
-        value="test value"
-        onChangeText={onChangeTextSpy}
-        testID="text-input"
-      />
-    );
-    expect(toJSON()).toMatchSnapshot();
-  });
-});
-
 describe('Export Completeness', () => {
   it('should include all exports from @hero-design/rn', () => {
     // eslint-disable-next-line global-require, @typescript-eslint/no-var-requires