@fluentui/react-tabs 9.0.0-beta.8 → 9.0.0-beta.9

package/lib-commonjs/tab.constants.js

@@ -1,23 +1,75 @@
-"use strict";
+"use strict"; // TODO: Constants prefixed with pending should be replaced with design tokens
+// These values were taken from the design token superset figma
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.tabPendingDesignTokens = void 0; // TODO: These constants should be replaced with design tokens
+exports.tabIndicatorStrokeWidths = exports.tabIndicatorPadding = exports.pendingAnimationEasingTokens = exports.pendingAnimationDurationTokens = exports.pendingSpacingTokens = exports.pendingContentSizeTokens = void 0;
 
-exports.tabPendingDesignTokens = {
-  tabPadding: {
-    medium: '10px',
-    small: '6px'
-  },
-  indicatorThickness: '2px',
-  gap: {
-    medium: '6px',
-    small: '2px'
+const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
+
+exports.pendingContentSizeTokens = {
+  // Only body sizes are defined here currently
+  body1: {
+    fontSize: react_theme_1.tokens.fontSizeBase300,
+    fontWeight: react_theme_1.tokens.fontWeightRegular,
+    lineHeight: react_theme_1.tokens.lineHeightBase300
   },
-  contentPadding: {
-    medium: '2px',
-    small: '2px'
+  body1Strong: {
+    fontSize: react_theme_1.tokens.fontSizeBase300,
+    fontWeight: react_theme_1.tokens.fontWeightSemibold,
+    lineHeight: react_theme_1.tokens.lineHeightBase300
   }
 };
+exports.pendingSpacingTokens = {
+  none: '0',
+  xxs: '2px',
+  xs: '4px',
+  sNudge: '6px',
+  s: '8px',
+  mNudge: '10px',
+  m: '12px',
+  l: '16px',
+  xl: '20px',
+  xxl: '24px',
+  xxxl: '32px'
+};
+exports.pendingAnimationDurationTokens = {
+  ultraFast: '50ms',
+  faster: '100ms',
+  fast: '150ms',
+  normal: '200ms',
+  slow: '300ms',
+  slower: '400ms',
+  ultraSlow: '500ms'
+};
+exports.pendingAnimationEasingTokens = {
+  accelerateMax: 'cubic-bezier(1,0,1,1)',
+  accelerateMid: 'cubic-bezier(0.7,0,1,0.5)',
+  accelerateMin: 'cubic-bezier(0.8,0,1,1)',
+  declerateMax: 'cubic-bezier(0,0,0,1)',
+  decelerateMid: 'cubic-bezier(0.1,0.9,0.2,1)',
+  decelarateMin: 'cubic-bezier(0.33,0,0.1,1)',
+  maxEasyEase: 'cubic-bezier(0.8,0,0.1,1)',
+  easyEase: 'cubic-bezier(0.33,0,0.67,1)',
+  linear: 'cubic-bezier(0,0,1,1)'
+};
+/**
+ * Provides shared values between tab style hooks
+ * useTabStyles
+ * useTabAnimatedIndicator
+ */
+
+exports.tabIndicatorPadding = {
+  mediumHorizontal: exports.pendingSpacingTokens.m,
+  mediumVertical: exports.pendingSpacingTokens.s,
+  smallHorizontal: exports.pendingSpacingTokens.sNudge,
+  smallVertical: exports.pendingSpacingTokens.xs
+};
+exports.tabIndicatorStrokeWidths = {
+  mediumHorizontal: react_theme_1.tokens.strokeWidthThicker,
+  mediumVertical: react_theme_1.tokens.strokeWidthThicker,
+  smallHorizontal: react_theme_1.tokens.strokeWidthThick,
+  smallVertical: react_theme_1.tokens.strokeWidthThicker
+};
 //# sourceMappingURL=tab.constants.js.map

package/lib-commonjs/tab.constants.js.map

@@ -1 +1 @@
-{"version":3,"sources":["tab.constants.ts"],"names":[],"mappings":";;;;;yCAAA;;AACa,OAAA,CAAA,sBAAA,GAAyB;AACpC,EAAA,UAAU,EAAE;AACV,IAAA,MAAM,EAAE,MADE;AAEV,IAAA,KAAK,EAAE;AAFG,GADwB;AAKpC,EAAA,kBAAkB,EAAE,KALgB;AAMpC,EAAA,GAAG,EAAE;AAAE,IAAA,MAAM,EAAE,KAAV;AAAiB,IAAA,KAAK,EAAE;AAAxB,GAN+B;AAOpC,EAAA,cAAc,EAAE;AACd,IAAA,MAAM,EAAE,KADM;AAEd,IAAA,KAAK,EAAE;AAFO;AAPoB,CAAzB","sourcesContent":["// TODO: These constants should be replaced with design tokens\nexport const tabPendingDesignTokens = {\n  tabPadding: {\n    medium: '10px',\n    small: '6px',\n  },\n  indicatorThickness: '2px',\n  gap: { medium: '6px', small: '2px' },\n  contentPadding: {\n    medium: '2px',\n    small: '2px',\n  },\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["tab.constants.ts"],"names":[],"mappings":"cAAA;AACA;;;;;;;AAEA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAEa,OAAA,CAAA,wBAAA,GAA2B;AACtC;AACA,EAAA,KAAK,EAAE;AACL,IAAA,QAAQ,EAAE,aAAA,CAAA,MAAA,CAAO,eADZ;AAEL,IAAA,UAAU,EAAE,aAAA,CAAA,MAAA,CAAO,iBAFd;AAGL,IAAA,UAAU,EAAE,aAAA,CAAA,MAAA,CAAO;AAHd,GAF+B;AAOtC,EAAA,WAAW,EAAE;AACX,IAAA,QAAQ,EAAE,aAAA,CAAA,MAAA,CAAO,eADN;AAEX,IAAA,UAAU,EAAE,aAAA,CAAA,MAAA,CAAO,kBAFR;AAGX,IAAA,UAAU,EAAE,aAAA,CAAA,MAAA,CAAO;AAHR;AAPyB,CAA3B;AAcA,OAAA,CAAA,oBAAA,GAAuB;AAClC,EAAA,IAAI,EAAE,GAD4B;AAElC,EAAA,GAAG,EAAE,KAF6B;AAGlC,EAAA,EAAE,EAAE,KAH8B;AAIlC,EAAA,MAAM,EAAE,KAJ0B;AAKlC,EAAA,CAAC,EAAE,KAL+B;AAMlC,EAAA,MAAM,EAAE,MAN0B;AAOlC,EAAA,CAAC,EAAE,MAP+B;AAQlC,EAAA,CAAC,EAAE,MAR+B;AASlC,EAAA,EAAE,EAAE,MAT8B;AAUlC,EAAA,GAAG,EAAE,MAV6B;AAWlC,EAAA,IAAI,EAAE;AAX4B,CAAvB;AAcA,OAAA,CAAA,8BAAA,GAAiC;AAC5C,EAAA,SAAS,EAAE,MADiC;AAE5C,EAAA,MAAM,EAAE,OAFoC;AAG5C,EAAA,IAAI,EAAE,OAHsC;AAI5C,EAAA,MAAM,EAAE,OAJoC;AAK5C,EAAA,IAAI,EAAE,OALsC;AAM5C,EAAA,MAAM,EAAE,OANoC;AAO5C,EAAA,SAAS,EAAE;AAPiC,CAAjC;AAUA,OAAA,CAAA,4BAAA,GAA+B;AAC1C,EAAA,aAAa,EAAE,uBAD2B;AAE1C,EAAA,aAAa,EAAE,2BAF2B;AAG1C,EAAA,aAAa,EAAE,yBAH2B;AAI1C,EAAA,YAAY,EAAE,uBAJ4B;AAK1C,EAAA,aAAa,EAAE,6BAL2B;AAM1C,EAAA,aAAa,EAAE,4BAN2B;AAO1C,EAAA,WAAW,EAAE,2BAP6B;AAQ1C,EAAA,QAAQ,EAAE,6BARgC;AAS1C,EAAA,MAAM,EAAE;AATkC,CAA/B;AAYb;;;;AAIG;;AACU,OAAA,CAAA,mBAAA,GAAsB;AACjC,EAAA,gBAAgB,EAAE,OAAA,CAAA,oBAAA,CAAqB,CADN;AAEjC,EAAA,cAAc,EAAE,OAAA,CAAA,oBAAA,CAAqB,CAFJ;AAGjC,EAAA,eAAe,EAAE,OAAA,CAAA,oBAAA,CAAqB,MAHL;AAIjC,EAAA,aAAa,EAAE,OAAA,CAAA,oBAAA,CAAqB;AAJH,CAAtB;AAOA,OAAA,CAAA,wBAAA,GAA2B;AACtC,EAAA,gBAAgB,EAAE,aAAA,CAAA,MAAA,CAAO,kBADa;AAEtC,EAAA,cAAc,EAAE,aAAA,CAAA,MAAA,CAAO,kBAFe;AAGtC,EAAA,eAAe,EAAE,aAAA,CAAA,MAAA,CAAO,gBAHc;AAItC,EAAA,aAAa,EAAE,aAAA,CAAA,MAAA,CAAO;AAJgB,CAA3B","sourcesContent":["// TODO: Constants prefixed with pending should be replaced with design tokens\n// These values were taken from the design token superset figma\n\nimport { tokens } from '@fluentui/react-theme';\n\nexport const pendingContentSizeTokens = {\n  // Only body sizes are defined here currently\n  body1: {\n    fontSize: tokens.fontSizeBase300,\n    fontWeight: tokens.fontWeightRegular,\n    lineHeight: tokens.lineHeightBase300,\n  },\n  body1Strong: {\n    fontSize: tokens.fontSizeBase300,\n    fontWeight: tokens.fontWeightSemibold,\n    lineHeight: tokens.lineHeightBase300,\n  },\n};\n\nexport const pendingSpacingTokens = {\n  none: '0',\n  xxs: '2px',\n  xs: '4px',\n  sNudge: '6px',\n  s: '8px',\n  mNudge: '10px',\n  m: '12px',\n  l: '16px',\n  xl: '20px',\n  xxl: '24px',\n  xxxl: '32px',\n};\n\nexport const pendingAnimationDurationTokens = {\n  ultraFast: '50ms',\n  faster: '100ms',\n  fast: '150ms',\n  normal: '200ms',\n  slow: '300ms',\n  slower: '400ms',\n  ultraSlow: '500ms',\n};\n\nexport const pendingAnimationEasingTokens = {\n  accelerateMax: 'cubic-bezier(1,0,1,1)',\n  accelerateMid: 'cubic-bezier(0.7,0,1,0.5)',\n  accelerateMin: 'cubic-bezier(0.8,0,1,1)',\n  declerateMax: 'cubic-bezier(0,0,0,1)',\n  decelerateMid: 'cubic-bezier(0.1,0.9,0.2,1)',\n  decelarateMin: 'cubic-bezier(0.33,0,0.1,1)',\n  maxEasyEase: 'cubic-bezier(0.8,0,0.1,1)',\n  easyEase: 'cubic-bezier(0.33,0,0.67,1)',\n  linear: 'cubic-bezier(0,0,1,1)',\n};\n\n/**\n * Provides shared values between tab style hooks\n * useTabStyles\n * useTabAnimatedIndicator\n */\nexport const tabIndicatorPadding = {\n  mediumHorizontal: pendingSpacingTokens.m,\n  mediumVertical: pendingSpacingTokens.s,\n  smallHorizontal: pendingSpacingTokens.sNudge,\n  smallVertical: pendingSpacingTokens.xs,\n};\n\nexport const tabIndicatorStrokeWidths = {\n  mediumHorizontal: tokens.strokeWidthThicker,\n  mediumVertical: tokens.strokeWidthThicker,\n  smallHorizontal: tokens.strokeWidthThick,\n  smallVertical: tokens.strokeWidthThicker,\n};\n"],"sourceRoot":"../src/"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-tabs",
-  "version": "9.0.0-beta.8",
+  "version": "9.0.0-beta.9",
   "description": "Fluent UI React tabs components",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -27,25 +27,16 @@
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "9.0.0-beta.3",
-    "@fluentui/react-context-selector": "9.0.0-rc.5",
-    "@fluentui/scripts": "^1.0.0",
-    "@types/enzyme": "3.10.3",
-    "@types/enzyme-adapter-react-16": "1.0.3",
-    "@types/react": "16.9.42",
-    "@types/react-dom": "16.9.10",
-    "@types/react-test-renderer": "^16.0.0",
-    "enzyme": "~3.10.0",
-    "enzyme-adapter-react-16": "^1.15.0",
-    "react": "16.8.6",
-    "react-dom": "16.8.6",
-    "react-test-renderer": "^16.3.0"
+    "@fluentui/react-conformance-griffel": "9.0.0-beta.4",
+    "@fluentui/react-context-selector": "9.0.0-rc.6",
+    "@fluentui/scripts": "^1.0.0"
   },
   "dependencies": {
-    "@griffel/react": "1.0.0",
-    "@fluentui/react-tabster": "9.0.0-rc.5",
-    "@fluentui/react-theme": "9.0.0-rc.4",
-    "@fluentui/react-utilities": "9.0.0-rc.5",
+    "@griffel/react": "1.0.3",
+    "@fluentui/react-context-selector": "9.0.0-rc.6",
+    "@fluentui/react-tabster": "9.0.0-rc.6",
+    "@fluentui/react-theme": "9.0.0-rc.5",
+    "@fluentui/react-utilities": "9.0.0-rc.6",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {