ci-test-a

packages/cardano/rollup.config.js

@@ -7,11 +7,6 @@ export default (args) => {
   return {
     ...baseConfig,
     output: [
-      {
-        file: packageJson.main,
-        format: 'cjs',
-        sourcemap: true
-      },
       {
         file: packageJson.module,
         format: 'esm',

packages/common/rollup.config.js

@@ -11,11 +11,6 @@ export default (args) => {
         file: packageJson.main,
         format: 'cjs',
         sourcemap: true
-      },
-      {
-        file: packageJson.module,
-        format: 'esm',
-        sourcemap: true
       }
     ]
   };

packages/core/rollup.config.js

@@ -9,11 +9,6 @@ export default (args) => {
   return {
     ...baseConfig,
     output: [
-      {
-        file: packageJson.main,
-        format: 'cjs',
-        sourcemap: true
-      },
       {
         file: packageJson.module,
         format: 'esm',

packages/staking/.eslintignore

@@ -1 +1,10 @@
+.eslintrc.js
+*.d.ts
+*jest.config.js
+dist/*
+**/*.js
+apps/desktop/wdio-logs/*
+
 src/features/BrowsePools/data.json
+
+src/design-tokens/

packages/staking/.prettierignore

@@ -1,3 +1,4 @@
 dist
 build
 node_modules
+src/design-tokens

packages/staking/package.json

@@ -35,7 +35,7 @@
     "build-storybook": "NODE_OPTIONS=--openssl-legacy-provider; storybook build",
     "cleanup": "yarn exec rm -rf dist node_modules && yarn exec rm -rf ../../.cache/eslintcache",
     "dev": "NODE_OPTIONS=--openssl-legacy-provider; storybook dev -p 6006",
-    "eslint:check": "yarn run -T eslint --cache --cache-location ../../.cache/eslintcache --cache-strategy metadata --ignore-path '../../.eslintignore' '**/*.{cjs,mjs,js,ts,tsx}'",
+    "eslint:check": "yarn run -T eslint --cache --cache-location ../../.cache/eslintcache --cache-strategy metadata --ignore-path './.eslintignore' '**/*.{cjs,mjs,js,ts,tsx}'",
     "eslint:fix": "yarn eslint:check --fix",
     "lint": "echo 'Staking package runs lint in its own CI'",
     "lint:all": "yarn eslint:check && yarn prettier:check",
@@ -92,8 +92,11 @@
     "@svgr/plugin-jsx": "^8.0.1",
     "@testing-library/react-hooks": "^8.0.1",
     "@tsconfig/create-react-app": "^1.0.3",
+    "@vanilla-extract/css": "^1.10.0",
+    "@vanilla-extract/css-utils": "^0.1.3",
     "@vanilla-extract/esbuild-plugin": "^2.2.2",
     "@vanilla-extract/recipes": "^0.5.1",
+    "@vanilla-extract/sprinkles": "^1.5.1",
     "@vanilla-extract/vite-plugin": "^3.9.3",
     "@vitest/coverage-c8": "^0.31.0",
     "antd": "^4.24.10",

packages/staking/src/design-tokens

@@ -0,0 +1 @@
+../../ui/src/design-tokens

packages/staking/src/features/BrowsePools/BrowsePools.css.ts

@@ -1,4 +1,4 @@
-import { sx } from '@lace/ui';
+import { sx } from '../../design-tokens';
 
 export const browsePools = sx({
   alignItems: 'stretch',

packages/staking/src/features/BrowsePools/BrowsePoolsHeader.css.ts

@@ -1,5 +1,5 @@
-import { style } from '@lace/ui';
 import { theme } from 'features/theme';
+import { style } from '../../design-tokens';
 
 export const title = style({
   color: theme.colors.$titleColor,

packages/staking/src/features/BrowsePools/BrowsePoolsPreferencesCard/BrowsePoolsPreferencesCard.css.ts

@@ -1,5 +1,5 @@
-import { style, sx } from '@lace/ui';
 import { theme } from 'features/theme';
+import { style, sx } from '../../../design-tokens';
 
 export const textBoxLeft = style({
   borderBottomRightRadius: 0,

packages/staking/src/features/BrowsePools/PortfolioBar.css.ts

@@ -1,4 +1,4 @@
-import { style, sx } from '@lace/ui';
+import { style, sx } from '../../design-tokens';
 import { theme } from '../theme';
 const minimumScreenSize = '668px';
 

packages/staking/src/features/BrowsePools/StakePoolCard/PoolMetric/PoolMetric.css.ts

@@ -1,4 +1,4 @@
-import { style, sx } from '@lace/ui';
+import { style, sx } from '../../../../design-tokens';
 import { theme } from '../../../theme';
 
 export const metric = style({

packages/staking/src/features/BrowsePools/StakePoolCard/SkatePoolCardProgressBar/StakePoolCardProgressBar.css.ts

@@ -1,5 +1,5 @@
-import { style, sx } from '@lace/ui';
 import { recipe } from '@vanilla-extract/recipes';
+import { style, sx } from '../../../../design-tokens';
 import { theme } from '../../../theme';
 
 export const wrapper = sx({

packages/staking/src/features/BrowsePools/StakePoolCard/StakePoolCard.css.ts

@@ -1,6 +1,6 @@
-import { style, sx } from '@lace/ui';
 import { recipe } from '@vanilla-extract/recipes';
 import type { RecipeVariants } from '@vanilla-extract/recipes';
+import { style, sx } from '../../../design-tokens';
 import { theme } from '../../theme';
 import { STAKE_POOL_CARD_HEIGHT } from './constants';
 

packages/staking/src/features/BrowsePools/StakePoolsGrid/StakePoolsGrid.css.ts

@@ -1,5 +1,5 @@
-import { style, sx } from '@lace/ui';
 import { theme } from 'features/theme';
+import { style, sx } from '../../../design-tokens';
 
 // TODO use new @lace/ui Grid when available: https://input-output.atlassian.net/browse/LW-9791
 export const grid = style([

packages/staking/src/features/BrowsePools/StakePoolsList/StakePoolListCell.css.ts

@@ -1,6 +1,6 @@
-import { sx } from '@lace/ui';
 import { recipe } from '@vanilla-extract/recipes';
 import { theme } from 'features/theme';
+import { sx } from '../../../design-tokens';
 
 export const dot = recipe({
   base: [

packages/staking/src/features/BrowsePools/StakePoolsList/StakePoolsList.css.ts

@@ -1,5 +1,5 @@
-import { style } from '@lace/ui';
 import { theme } from 'features/theme';
+import { style } from '../../../design-tokens';
 
 export const selectedTitle = style({
   color: theme.colors.$titleColor,

packages/staking/src/features/BrowsePools/StakePoolsList/StakePoolsListRowSkeleton/StakePoolSkeletonCellRenderer.css.ts

@@ -1,7 +1,7 @@
-import { style, sx } from '@lace/ui';
 import { recipe } from '@vanilla-extract/recipes';
 import { theme } from 'features/theme';
 import type { RecipeVariants } from '@vanilla-extract/recipes';
+import { style, sx } from '../../../../design-tokens';
 
 export const cellPlaceholder = recipe({
   base: [

packages/staking/src/features/BrowsePools/StakePoolsList/StakePoolsListRowSkeleton/StakePoolsListRowSkeleton.css.ts

@@ -1,4 +1,4 @@
-import { style, sx, vars } from '@lace/ui';
+import { style, sx, vars } from '../../../../design-tokens';
 
 export const row = style([
   {

packages/staking/src/features/BrowsePools/StakePoolsSearchEmpty.css.ts

@@ -1,4 +1,4 @@
-import { style, sx, vars } from '@lace/ui';
+import { style, sx, vars } from '../../design-tokens';
 
 export const icon = style([
   {

packages/staking/src/features/DelegationCard/DelegationTooltip.css.ts

@@ -1,4 +1,4 @@
-import { style, sx } from '@lace/ui';
+import { style, sx } from '../../design-tokens';
 import { theme } from '../theme';
 
 export const tooltip = style([

packages/staking/src/features/Drawer/preferences/DelegationRatioSlider/DelegationRatioSlider.css.ts

@@ -1,4 +1,4 @@
-import { style, sx } from '@lace/ui';
+import { style, sx } from '../../../../design-tokens';
 import { theme } from '../../../theme';
 
 export const SliderContainer = style([

packages/staking/src/features/Drawer/preferences/NoPoolsSelected.css.ts

@@ -1,4 +1,4 @@
-import { style } from '@lace/ui';
+import { style } from '../../../design-tokens';
 import { theme } from '../../theme';
 
 export const container = style({

packages/staking/src/features/Drawer/preferences/PoolDetailsCard/PoolDetailsCard.css.ts

@@ -1,4 +1,4 @@
-import { style, sx } from '@lace/ui';
+import { style, sx } from '../../../../design-tokens';
 import { theme } from '../../../theme';
 
 export const root = style({

packages/staking/src/features/Drawer/preferences/PoolDetailsCard/PoolDetailsCardData.css.ts

@@ -1,4 +1,4 @@
-import { style } from '@lace/ui';
+import { style } from '../../../../design-tokens';
 import { theme } from '../../../theme';
 
 export const root = style({

packages/staking/src/features/Drawer/preferences/PoolDetailsCard/RatioInput.css.ts

@@ -1,4 +1,4 @@
-import { style } from '@lace/ui';
+import { style } from '../../../../design-tokens';
 import { theme } from '../../../theme';
 
 export const inputContainer = style({

packages/staking/src/features/Drawer/preferences/StepPreferencesContent.css.ts

@@ -1,4 +1,4 @@
-import { style } from '@lace/ui';
+import { style } from '../../../design-tokens';
 import { theme } from '../../theme';
 
 export const delegationCardWrapper = style({

packages/staking/src/features/activity/NoStakingActivity.css.ts

@@ -1,5 +1,5 @@
-import { style } from '@lace/ui';
 import { theme } from 'features/theme';
+import { style } from '../../design-tokens';
 
 export const sadFaceIcon = style({
   height: theme.spacing.$112,

packages/staking/src/features/overview/GetStartedSteps.css.ts

@@ -1,5 +1,5 @@
-import { vars } from '@lace/ui';
 import { style } from '@vanilla-extract/css';
+import { vars } from '../../design-tokens';
 import { theme } from '../theme';
 
 export const stepCircle = style({

packages/staking/src/features/theme/theme.css.ts

@@ -1,5 +1,14 @@
-import { elevation, fontFamily, fontSizes, fontWeights, lineHeights, opacities, radius, spacing } from '@lace/ui';
 import { createGlobalTheme, createThemeContract } from '@vanilla-extract/css';
+import {
+  elevation,
+  fontFamily,
+  fontSizes,
+  fontWeights,
+  lineHeights,
+  opacities,
+  radius,
+  spacing,
+} from '../../design-tokens';
 import { colorsContract, darkThemeColors, lightThemeColors } from './colors';
 
 const themeCommon = {

packages/staking/tsup.config.ts

@@ -16,11 +16,11 @@ const tsupConfig = defineConfig([
     esbuildPlugins: [
       // eslint-disable-next-line new-cap
       ScssModulesPlugin() as never,
-      vanillaExtractPlugin({ esbuildOptions: { loader: { '.css': 'empty' } } }),
+      vanillaExtractPlugin({ esbuildOptions: { loader: { '.css': 'empty' } }, identifiers: 'short' }),
       svgr({ icon: true, plugins: [svgrJsx] }),
     ],
     external: Object.keys(peerDependencies),
-    format: ['esm', 'cjs'],
+    format: ['cjs'],
     loader: {
       '.png': 'dataurl',
     },

packages/ui/rollup.config.js

@@ -20,7 +20,9 @@ export default () => ({
     commonjs(),
     image(),
     svgr({ icon: true }),
-    vanillaExtractPlugin(),
+    vanillaExtractPlugin({
+      identifiers: 'short',
+    }),
     copy({
       targets: [{ src: 'src/assets/icons/*', dest: 'dist/assets/icons' }],
     }),
@@ -31,11 +33,6 @@ export default () => ({
       format: 'cjs',
       sourcemap: true,
     },
-    {
-      file: packageJson.module,
-      format: 'esm',
-      sourcemap: true,
-    },
   ],
   external: [/node_modules/],
 });

yarn.lock

@@ -10851,9 +10851,11 @@ __metadata:
     "@svgr/plugin-jsx": ^8.0.1
     "@testing-library/react-hooks": ^8.0.1
     "@tsconfig/create-react-app": ^1.0.3
-    "@vanilla-extract/css": ^1.11.1
+    "@vanilla-extract/css": ^1.10.0
+    "@vanilla-extract/css-utils": ^0.1.3
     "@vanilla-extract/esbuild-plugin": ^2.2.2
     "@vanilla-extract/recipes": ^0.5.1
+    "@vanilla-extract/sprinkles": ^1.5.1
     "@vanilla-extract/vite-plugin": ^3.9.3
     "@vitest/coverage-c8": ^0.31.0
     antd: ^4.24.10
@@ -20909,25 +20911,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vanilla-extract/css@npm:^1.11.1":
-  version: 1.11.1
-  resolution: "@vanilla-extract/css@npm:1.11.1"
-  dependencies:
-    "@emotion/hash": ^0.9.0
-    "@vanilla-extract/private": ^1.0.3
-    ahocorasick: 1.0.2
-    chalk: ^4.1.1
-    css-what: ^6.1.0
-    cssesc: ^3.0.0
-    csstype: ^3.0.7
-    deep-object-diff: ^1.1.9
-    deepmerge: ^4.2.2
-    media-query-parser: ^2.0.2
-    outdent: ^0.8.0
-  checksum: 1498ced4ba1fd78f3e42567a49daac9eea15e0fa1418d39e4ba5a3e84ded66a5567733f5fa364eaf5fe9c0354124bd62a32ffd603427b76e36004ed49b55c7d2
-  languageName: node
-  linkType: hard
-
 "@vanilla-extract/css@npm:^1.14.0":
   version: 1.14.0
   resolution: "@vanilla-extract/css@npm:1.14.0"