@fluentui-react-native/text 0.24.20 → 0.25.0

package/lib-commonjs/index.js

@@ -1,31 +1,157 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Text = exports.textName = exports.Display = exports.LargeTitle = exports.Title3 = exports.Title2 = exports.Title1Strong = exports.Title1 = exports.Subtitle2Strong = exports.Subtitle2 = exports.Subtitle1Strong = exports.Subtitle1 = exports.Body2Strong = exports.Body2 = exports.Body1Strong = exports.Body1 = exports.Caption2 = exports.Caption1Strong = exports.Caption1 = exports.textNameV1 = exports.TextV1 = void 0;
-var Text_1 = require("./Text");
-Object.defineProperty(exports, "TextV1", { enumerable: true, get: function () { return Text_1.Text; } });
-var Text_types_1 = require("./Text.types");
-Object.defineProperty(exports, "textNameV1", { enumerable: true, get: function () { return Text_types_1.textName; } });
-var Variants_1 = require("./Variants");
-Object.defineProperty(exports, "Caption1", { enumerable: true, get: function () { return Variants_1.Caption1; } });
-Object.defineProperty(exports, "Caption1Strong", { enumerable: true, get: function () { return Variants_1.Caption1Strong; } });
-Object.defineProperty(exports, "Caption2", { enumerable: true, get: function () { return Variants_1.Caption2; } });
-Object.defineProperty(exports, "Body1", { enumerable: true, get: function () { return Variants_1.Body1; } });
-Object.defineProperty(exports, "Body1Strong", { enumerable: true, get: function () { return Variants_1.Body1Strong; } });
-Object.defineProperty(exports, "Body2", { enumerable: true, get: function () { return Variants_1.Body2; } });
-Object.defineProperty(exports, "Body2Strong", { enumerable: true, get: function () { return Variants_1.Body2Strong; } });
-Object.defineProperty(exports, "Subtitle1", { enumerable: true, get: function () { return Variants_1.Subtitle1; } });
-Object.defineProperty(exports, "Subtitle1Strong", { enumerable: true, get: function () { return Variants_1.Subtitle1Strong; } });
-Object.defineProperty(exports, "Subtitle2", { enumerable: true, get: function () { return Variants_1.Subtitle2; } });
-Object.defineProperty(exports, "Subtitle2Strong", { enumerable: true, get: function () { return Variants_1.Subtitle2Strong; } });
-Object.defineProperty(exports, "Title1", { enumerable: true, get: function () { return Variants_1.Title1; } });
-Object.defineProperty(exports, "Title1Strong", { enumerable: true, get: function () { return Variants_1.Title1Strong; } });
-Object.defineProperty(exports, "Title2", { enumerable: true, get: function () { return Variants_1.Title2; } });
-Object.defineProperty(exports, "Title3", { enumerable: true, get: function () { return Variants_1.Title3; } });
-Object.defineProperty(exports, "LargeTitle", { enumerable: true, get: function () { return Variants_1.LargeTitle; } });
-Object.defineProperty(exports, "Display", { enumerable: true, get: function () { return Variants_1.Display; } });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.Text =
+  exports.textName =
+  exports.Display =
+  exports.LargeTitle =
+  exports.Title3 =
+  exports.Title2 =
+  exports.Title1Strong =
+  exports.Title1 =
+  exports.Subtitle2Strong =
+  exports.Subtitle2 =
+  exports.Subtitle1Strong =
+  exports.Subtitle1 =
+  exports.Body2Strong =
+  exports.Body2 =
+  exports.Body1Strong =
+  exports.Body1 =
+  exports.Caption2 =
+  exports.Caption1Strong =
+  exports.Caption1 =
+  exports.textNameV1 =
+  exports.TextV1 =
+    void 0;
+const Text_1 = require('./Text');
+Object.defineProperty(exports, 'TextV1', {
+  enumerable: true,
+  get: function () {
+    return Text_1.Text;
+  },
+});
+const Text_types_1 = require('./Text.types');
+Object.defineProperty(exports, 'textNameV1', {
+  enumerable: true,
+  get: function () {
+    return Text_types_1.textName;
+  },
+});
+const Variants_1 = require('./Variants');
+Object.defineProperty(exports, 'Caption1', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Caption1;
+  },
+});
+Object.defineProperty(exports, 'Caption1Strong', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Caption1Strong;
+  },
+});
+Object.defineProperty(exports, 'Caption2', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Caption2;
+  },
+});
+Object.defineProperty(exports, 'Body1', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Body1;
+  },
+});
+Object.defineProperty(exports, 'Body1Strong', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Body1Strong;
+  },
+});
+Object.defineProperty(exports, 'Body2', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Body2;
+  },
+});
+Object.defineProperty(exports, 'Body2Strong', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Body2Strong;
+  },
+});
+Object.defineProperty(exports, 'Subtitle1', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Subtitle1;
+  },
+});
+Object.defineProperty(exports, 'Subtitle1Strong', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Subtitle1Strong;
+  },
+});
+Object.defineProperty(exports, 'Subtitle2', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Subtitle2;
+  },
+});
+Object.defineProperty(exports, 'Subtitle2Strong', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Subtitle2Strong;
+  },
+});
+Object.defineProperty(exports, 'Title1', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Title1;
+  },
+});
+Object.defineProperty(exports, 'Title1Strong', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Title1Strong;
+  },
+});
+Object.defineProperty(exports, 'Title2', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Title2;
+  },
+});
+Object.defineProperty(exports, 'Title3', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Title3;
+  },
+});
+Object.defineProperty(exports, 'LargeTitle', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.LargeTitle;
+  },
+});
+Object.defineProperty(exports, 'Display', {
+  enumerable: true,
+  get: function () {
+    return Variants_1.Display;
+  },
+});
 /* deprecated */
-var Text_types_2 = require("./deprecated/Text.types");
-Object.defineProperty(exports, "textName", { enumerable: true, get: function () { return Text_types_2.textName; } });
-var Text_2 = require("./deprecated/Text");
-Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return Text_2.Text; } });
-//# sourceMappingURL=index.js.map
+const Text_types_2 = require('./deprecated/Text.types');
+Object.defineProperty(exports, 'textName', {
+  enumerable: true,
+  get: function () {
+    return Text_types_2.textName;
+  },
+});
+const Text_2 = require('./deprecated/Text');
+Object.defineProperty(exports, 'Text', {
+  enumerable: true,
+  get: function () {
+    return Text_2.Text;
+  },
+});
+//# sourceMappingURL=index.js.map

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,+BAAwC;AAA/B,8FAAA,IAAI,OAAU;AAEvB,2CAAsD;AAA7C,wGAAA,QAAQ,OAAc;AAC/B,uCAkBoB;AAjBlB,oGAAA,QAAQ,OAAA;AACR,0GAAA,cAAc,OAAA;AACd,oGAAA,QAAQ,OAAA;AACR,iGAAA,KAAK,OAAA;AACL,uGAAA,WAAW,OAAA;AACX,iGAAA,KAAK,OAAA;AACL,uGAAA,WAAW,OAAA;AACX,qGAAA,SAAS,OAAA;AACT,2GAAA,eAAe,OAAA;AACf,qGAAA,SAAS,OAAA;AACT,2GAAA,eAAe,OAAA;AACf,kGAAA,MAAM,OAAA;AACN,wGAAA,YAAY,OAAA;AACZ,kGAAA,MAAM,OAAA;AACN,kGAAA,MAAM,OAAA;AACN,sGAAA,UAAU,OAAA;AACV,mGAAA,OAAO,OAAA;AAGT,gBAAgB;AAChB,sDAAmD;AAA1C,sGAAA,QAAQ,OAAA;AAEjB,0CAAyC;AAAhC,4FAAA,IAAI,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,iCAAwC;AAA/B,8FAAA,IAAI,OAAU;AAEvB,6CAAsD;AAA7C,wGAAA,QAAQ,OAAc;AAC/B,yCAkBoB;AAjBlB,oGAAA,QAAQ,OAAA;AACR,0GAAA,cAAc,OAAA;AACd,oGAAA,QAAQ,OAAA;AACR,iGAAA,KAAK,OAAA;AACL,uGAAA,WAAW,OAAA;AACX,iGAAA,KAAK,OAAA;AACL,uGAAA,WAAW,OAAA;AACX,qGAAA,SAAS,OAAA;AACT,2GAAA,eAAe,OAAA;AACf,qGAAA,SAAS,OAAA;AACT,2GAAA,eAAe,OAAA;AACf,kGAAA,MAAM,OAAA;AACN,wGAAA,YAAY,OAAA;AACZ,kGAAA,MAAM,OAAA;AACN,kGAAA,MAAM,OAAA;AACN,sGAAA,UAAU,OAAA;AACV,mGAAA,OAAO,OAAA;AAGT,gBAAgB;AAChB,wDAAmD;AAA1C,sGAAA,QAAQ,OAAA;AAEjB,4CAAyC;AAAhC,4FAAA,IAAI,OAAA"}

package/package.json

@@ -1,82 +1,91 @@
 {
   "name": "@fluentui-react-native/text",
-  "version": "0.24.20",
+  "version": "0.25.0",
   "description": "A cross-platform Text component using the Fluent Design System",
-  "main": "lib-commonjs/index.js",
-  "module": "lib/index.js",
-  "react-native": "src/index.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/microsoft/fluentui-react-native.git",
+    "directory": "packages/components/text"
+  },
+  "license": "MIT",
+  "author": "",
   "exports": {
     ".": {
+      "types": "./lib/index.d.ts",
       "import": "./lib/index.js",
-      "require": "./lib-commonjs/index.js",
-      "types": "./lib/index.d.ts"
+      "require": "./lib-commonjs/index.js"
     }
   },
-  "typings": "lib/index.d.ts",
+  "main": "lib-commonjs/index.js",
+  "module": "lib/index.js",
+  "types": "lib/index.d.ts",
   "scripts": {
     "build": "fluentui-scripts build",
-    "just": "fluentui-scripts",
+    "build-cjs": "tsgo --outDir lib-commonjs",
+    "build-esm": "tsgo --outDir lib --module esnext --moduleResolution bundler",
     "clean": "fluentui-scripts clean",
     "depcheck": "fluentui-scripts depcheck",
     "lint": "fluentui-scripts eslint",
-    "test": "fluentui-scripts jest",
-    "update-snapshots": "fluentui-scripts jest -u",
+    "lint-package": "fluentui-scripts lint-package",
     "prettier": "fluentui-scripts prettier",
-    "prettier-fix": "fluentui-scripts prettier --fix true"
-  },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/microsoft/fluentui-react-native.git",
-    "directory": "packages/components/text"
+    "test": "fluentui-scripts jest",
+    "update-snapshots": "fluentui-scripts jest -u"
   },
   "dependencies": {
-    "@fluentui-react-native/adapters": "0.13.5",
-    "@fluentui-react-native/framework": "0.14.16",
-    "@fluentui-react-native/interactive-hooks": "0.27.18",
-    "@fluentui-react-native/theme-tokens": "0.27.10",
-    "@fluentui-react-native/tokens": "0.23.10",
-    "@uifabricshared/foundation-compose": "1.15.16"
+    "@fluentui-react-native/adapters": "0.14.0",
+    "@fluentui-react-native/framework": "0.15.0",
+    "@fluentui-react-native/interactive-hooks": "0.28.0",
+    "@fluentui-react-native/theme-tokens": "0.28.0",
+    "@fluentui-react-native/tokens": "0.24.0",
+    "@uifabricshared/foundation-compose": "1.16.0"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",
     "@fluentui-react-native/babel-config": "0.1.1",
     "@fluentui-react-native/eslint-config-rules": "0.1.1",
+    "@fluentui-react-native/framework-base": "0.3.0",
     "@fluentui-react-native/jest-config": "0.1.1",
-    "@fluentui-react-native/scripts": "0.1.1",
+    "@fluentui-react-native/kit-config": "0.1.2",
+    "@fluentui-react-native/scripts": "0.1.2",
     "@fluentui-react-native/test-tools": "0.1.1",
-    "@react-native/babel-preset": "^0.74.0",
-    "@react-native/metro-config": "^0.74.0",
-    "@types/react": "~18.2.0",
-    "@types/react-test-renderer": "^18.2.0",
-    "react": "18.2.0",
-    "react-native": "^0.74.0",
-    "react-native-macos": "^0.74.0",
-    "react-native-windows": "^0.74.0",
-    "react-test-renderer": "18.2.0"
+    "@react-native-community/cli": "^20.0.0",
+    "@react-native-community/cli-platform-android": "^20.0.0",
+    "@react-native-community/cli-platform-ios": "^20.0.0",
+    "@react-native/babel-preset": "^0.81.0",
+    "@react-native/metro-config": "^0.81.0",
+    "@types/react": "~19.1.0",
+    "@types/react-test-renderer": "^19.1.0",
+    "react": "19.1.0",
+    "react-native": "^0.81.0",
+    "react-native-macos": "^0.81.0",
+    "react-native-windows": "^0.81.0",
+    "react-test-renderer": "19.1.0"
   },
   "peerDependencies": {
     "@office-iss/react-native-win32": "^0.74.0",
-    "react": "18.2.0",
-    "react-native": "^0.73.0 || ^0.74.0",
-    "react-native-macos": "^0.73.0 || ^0.74.0",
-    "react-native-windows": "^0.73.0 || ^0.74.0"
+    "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.0",
+    "react": "18.2.0 || 19.0.0 || 19.1.0",
+    "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0",
+    "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0",
+    "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0"
+  },
+  "peerDependenciesMeta": {
+    "@office-iss/react-native-win32": {
+      "optional": true
+    },
+    "@types/react": {
+      "optional": true
+    },
+    "react-native-macos": {
+      "optional": true
+    },
+    "react-native-windows": {
+      "optional": true
+    }
   },
-  "author": "",
-  "license": "MIT",
   "rnx-kit": {
     "kitType": "library",
     "alignDeps": {
-      "presets": [
-        "microsoft/react-native"
-      ],
-      "requirements": {
-        "development": [
-          "react-native@0.74"
-        ],
-        "production": [
-          "react-native@0.73 || 0.74"
-        ]
-      },
       "capabilities": [
         "babel-preset-react-native",
         "core",
@@ -85,19 +94,11 @@
         "core-macos",
         "core-windows",
         "react",
-        "react-test-renderer"
+        "react-test-renderer",
+        "tools-core",
+        "tools-jest"
       ]
-    }
-  },
-  "peerDependenciesMeta": {
-    "@office-iss/react-native-win32": {
-      "optional": true
     },
-    "react-native-macos": {
-      "optional": true
-    },
-    "react-native-windows": {
-      "optional": true
-    }
+    "extends": "@fluentui-react-native/kit-config"
   }
-}
+}

package/src/Text.tsx

@@ -1,10 +1,9 @@
-/** @jsxRuntime classic */
-/** @jsx withSlots */
+/** @jsxImportSource @fluentui-react-native/framework-base */
 import React from 'react';
 import { I18nManager, Platform, Text as RNText } from 'react-native';
 
 import type { UseTokens, FontWeightValue } from '@fluentui-react-native/framework';
-import { fontStyles, withSlots, useFluentTheme, mergeStyles, compressible, patchTokens } from '@fluentui-react-native/framework';
+import { fontStyles, useFluentTheme, mergeStyles, compressible, patchTokens } from '@fluentui-react-native/framework';
 import { useKeyProps } from '@fluentui-react-native/interactive-hooks';
 import { globalTokens } from '@fluentui-react-native/theme-tokens';
 
@@ -117,15 +116,15 @@ export const Text = compressible<TextProps, TextTokens>((props: TextProps, useTo
     };
   }
 
-  const isWinPlatform = Platform.OS === (('win32' as any) || 'windows');
+  const isWin32Platform = Platform.OS === ('win32' as any);
   const filteredProps = {
-    onKeyUp: isWinPlatform ? onKeyUp : undefined,
-    keyUpEvents: isWinPlatform ? keyUpEvents : undefined,
+    onKeyUp: isWin32Platform ? onKeyUp : undefined,
+    keyUpEvents: isWin32Platform ? keyUpEvents : undefined,
     validKeysUp: undefined,
-    onKeyDown: isWinPlatform ? onKeyDown : undefined,
-    keyDownEvents: isWinPlatform ? keyDownEvents : undefined,
+    onKeyDown: isWin32Platform ? onKeyDown : undefined,
+    keyDownEvents: isWin32Platform ? keyDownEvents : undefined,
     validKeysDown: undefined,
-    onAccessibilityTap: isWinPlatform ? onAccTap : undefined,
+    onAccessibilityTap: isWin32Platform ? onAccTap : undefined,
   };
 
   // return a continuation function that allows this text to be compressed

package/src/__tests__/Text.test.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { act } from 'react';
 
 import * as renderer from 'react-test-renderer';
 
@@ -6,13 +6,19 @@ import { Text } from '../Text';
 
 describe('Text component tests', () => {
   it('Text default', () => {
-    const tree = renderer.create(<Text>Text default</Text>).toJSON();
-    expect(tree).toMatchSnapshot();
+    let component: renderer.ReactTestRenderer;
+    act(() => {
+      component = renderer.create(<Text>Text default</Text>);
+    });
+    expect(component!.toJSON()).toMatchSnapshot();
   });
 
   it('Text all props', () => {
-    const tree = renderer.create(<Text variant="bodyStandard">All props</Text>).toJSON();
-    expect(tree).toMatchSnapshot();
+    let component: renderer.ReactTestRenderer;
+    act(() => {
+      component = renderer.create(<Text variant="bodyStandard">All props</Text>);
+    });
+    expect(component!.toJSON()).toMatchSnapshot();
   });
 
   it('Text all tokens', () => {
@@ -21,8 +27,11 @@ describe('Text component tests', () => {
       fontWeight: '900',
       fontSize: 20,
     });
-    const tree = renderer.create(<BoldText>All tokens</BoldText>).toJSON();
-    expect(tree).toMatchSnapshot();
+    let component: renderer.ReactTestRenderer;
+    act(() => {
+      component = renderer.create(<BoldText>All tokens</BoldText>);
+    });
+    expect(component!.toJSON()).toMatchSnapshot();
   });
 
   it('Text variants render correctly with style', () => {
@@ -30,11 +39,14 @@ describe('Text component tests', () => {
       marginBottom: 8,
       marginTop: 4,
     };
-    const tree = renderer.create(
-      <Text variant="heroLargeSemibold" color="blue" style={style}>
-        Header Text
-      </Text>,
-    );
-    expect(tree).toMatchSnapshot();
+    let component: renderer.ReactTestRenderer;
+    act(() => {
+      component = renderer.create(
+        <Text variant="heroLargeSemibold" color="blue" style={style}>
+          Header Text
+        </Text>,
+      );
+    });
+    expect(component!.toJSON()).toMatchSnapshot();
   });
 });