@tamagui/core 1.0.1-rc.5 → 1.0.1-rc.6

package/dist/esm/helpers/ThemeManager.test.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/ThemeManager.test.tsx"],
-  "sourcesContent": ["import { getDefaultTamaguiConfig } from '@tamagui/config-default-node'\nimport { beforeAll, describe, expect, test } from 'vitest'\n\nimport { createTamagui } from '../createTamagui'\nimport { ThemeManager } from './ThemeManager'\n\nconst conf = getDefaultTamaguiConfig()\n\ndescribe('ThemeManager', () => {\n  beforeAll(() => {\n    createTamagui(conf)\n  })\n\n  test('Changes theme to dark', () => {\n    const manager = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    expect(manager.state.name).toBe('dark')\n  })\n\n  test('Given parent theme \"dark\" and child theme \"red\" to return theme \"dark_red\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(parent.state.name).toBe('dark')\n    expect(child.state.name).toBe('dark_red')\n  })\n\n  test('Given parent theme \"dark\", child theme \"red_alt2\" and component \"Button\" returns \"dark_red_alt2_Button\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n    const child2 = new ThemeManager(\n      {\n        name: 'alt2',\n        componentName: 'Button',\n      },\n      child1\n    )\n    expect(child2.state.name).toBe('dark_red_alt2_Button')\n  })\n\n  test('Given parent theme \"dark\", child theme \"red\" and component \"Button\" returns \"dark_red_Button\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n    const child2 = new ThemeManager(\n      {\n        componentName: 'Button',\n      },\n      child1\n    )\n    expect(child2.state.name).toBe('dark_red_Button')\n  })\n\n  test('Given parent theme \"dark\", child theme \"red\" and missing component \"Card\" returns \"dark_red\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n    const child2 = new ThemeManager(\n      {\n        componentName: 'Card',\n      },\n      child1\n    )\n    expect(child2.state.name).toBe('dark_red')\n  })\n\n  test('Changes \"light\" to \"dark\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      parent\n    )\n    expect(parent.state.name).toBe('light')\n    expect(child.state.name).toBe('dark')\n  })\n\n  test('Inverts \"light\" to \"dark\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        inverse: true,\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark')\n  })\n\n  test('Inverts \"light_red\" to \"dark_red\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n        inverse: true,\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n  })\n\n  test('Updates state', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const newState = parent.updateState({\n      name: 'dark',\n    })\n    expect(newState).toMatchInlineSnapshot(`\n      {\n        \"className\": \"t_dark\",\n        \"name\": \"dark\",\n        \"parentName\": \"\",\n        \"theme\": {\n          \"background\": {\n            \"isVar\": true,\n            \"key\": \"color-2\",\n            \"name\": \"background\",\n            \"val\": \"#000\",\n            \"variable\": \"\",\n          },\n          \"color\": {\n            \"isVar\": true,\n            \"key\": \"color-1\",\n            \"name\": \"color\",\n            \"val\": \"#fff\",\n            \"variable\": \"\",\n          },\n        },\n      }\n    `)\n    expect(parent.state.name).toBe('dark')\n  })\n\n  test('Returns parent on empty', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: null,\n      },\n      parent\n    )\n    expect(child).toBe(parent)\n  })\n\n  test('Resets theme', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark')\n    expect(child.parentManager).toBe(parent)\n    const child2 = new ThemeManager(\n      {\n        reset: true,\n      },\n      child\n    )\n    expect(child2.parentManager).toBe(child)\n    expect(child2.state.name).toBe('light')\n  })\n\n  test('Nested invert and reset', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      parent\n    )\n    const child2 = new ThemeManager(\n      {\n        reset: true,\n      },\n      child\n    )\n    const child3 = new ThemeManager(\n      {\n        inverse: true,\n      },\n      child2\n    )\n    expect(child3.state.name).toBe('dark')\n  })\n\n  test('Updates from null the new theme nested 3 themes', () => {\n    const a = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const b = new ThemeManager(\n      {\n        name: 'red',\n      },\n      a\n    )\n    expect(b.state.name).toBe('dark_red')\n    const c = new ThemeManager(\n      {\n        name: 'alt2',\n      },\n      b\n    )\n    expect(c.state.name).toBe('dark_red_alt2')\n  })\n\n  test('Ignored dup themes', () => {\n    const a = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const b = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      a\n    )\n    expect(b === a).toBe(true)\n  })\n\n  test('Nested component themes fallback to grandparents', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red',\n        componentName: 'Button',\n      },\n      parent\n    )\n    const child2 = new ThemeManager(\n      {\n        name: 'blue',\n      },\n      child\n    )\n    expect(child2.state.name).toBe('dark_blue')\n    const child3 = new ThemeManager(\n      {\n        componentName: 'Button',\n      },\n      child2\n    )\n    expect(child3.state.name).toBe('dark_blue_Button')\n  })\n\n  test(`Component theme with sub component that doesn't exist keeps same theme`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red',\n        componentName: 'Button',\n      },\n      parent\n    )\n    const child2 = new ThemeManager(\n      {\n        componentName: 'Spacer',\n      },\n      child\n    )\n    expect(child2).toBe(child)\n  })\n\n  test(`Doesn't find invalid parent when only passing component`, () => {\n    expect(!!conf.themes['dark_Card']).toBeTruthy()\n\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n\n    const child = new ThemeManager(\n      {\n        componentName: 'Card',\n      },\n      parent\n    )\n\n    // dont find dark_Card because dark_red is highest it should climb\n    expect(child.state.name).toBe(parent.state.name)\n  })\n\n  test(`Finds sub-theme when componentName and name are passed but componentName doesn't exist`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n\n    const child = new ThemeManager(\n      {\n        name: 'red',\n        componentName: 'Missing',\n      },\n      parent\n    )\n\n    // dont find dark_Card because dark_red is highest it should climb\n    expect(child.state.name).toBe('dark_red')\n  })\n\n  test(`Uses the full className without the light/dark prefix`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red_alt2',\n      },\n      parent\n    )\n    expect(child.state.className).toBe('t_red_alt2')\n\n    const child2 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    const child3 = new ThemeManager(\n      {\n        name: 'alt2',\n      },\n      child2\n    )\n    expect(child3.state.className).toBe('t_red_alt2')\n  })\n\n  test(`Finds component dark_red + Button`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark_red',\n        componentName: 'Button',\n      },\n      parent\n    )\n    expect(child.state.className).toBe('t_red_Button')\n    expect(child.state.name).toBe('dark_red_Button')\n  })\n\n  test(`Drops componentName if only regular name found at stronger level`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'alt1',\n        componentName: 'Button',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark_red_alt1')\n  })\n\n  test(`Component name + theme change when nested already`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'yellow',\n        componentName: 'Button',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark_yellow_Button')\n  })\n\n  test(`Component name + name finds one up when component name missing`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red_alt1',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'alt2',\n        componentName: 'Missing',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark_red_alt2')\n  })\n})\n"],
+  "sourcesContent": ["import { getDefaultTamaguiConfig } from '@tamagui/config-default-node'\nimport { beforeAll, describe, expect, test } from 'vitest'\n\nimport { createTamagui } from '../createTamagui'\nimport { ThemeManager } from './ThemeManager'\n\nconst conf = getDefaultTamaguiConfig()\n\ndescribe('ThemeManager', () => {\n  beforeAll(() => {\n    createTamagui(conf)\n  })\n\n  test('Changes theme to dark', () => {\n    const manager = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    expect(manager.state.name).toBe('dark')\n  })\n\n  test('Given parent theme \"dark\" and child theme \"red\" to return theme \"dark_red\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(parent.state.name).toBe('dark')\n    expect(child.state.name).toBe('dark_red')\n  })\n\n  test('Given parent theme \"dark\", child theme \"red_alt2\" and component \"Button\" returns \"dark_red_alt2_Button\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n    const child2 = new ThemeManager(\n      {\n        name: 'alt2',\n        componentName: 'Button',\n      },\n      child1\n    )\n    expect(child2.state.name).toBe('dark_red_alt2_Button')\n  })\n\n  test('Given parent theme \"dark\", child theme \"red\" and component \"Button\" returns \"dark_red_Button\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n    const child2 = new ThemeManager(\n      {\n        componentName: 'Button',\n      },\n      child1\n    )\n    expect(child2.state.name).toBe('dark_red_Button')\n  })\n\n  test('Given parent theme \"dark\", child theme \"red\" and missing component \"Card\" returns \"dark_red\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n    const child2 = new ThemeManager(\n      {\n        componentName: 'Card',\n      },\n      child1\n    )\n    expect(child2.state.name).toBe('dark_red')\n  })\n\n  test('Changes \"light\" to \"dark\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      parent\n    )\n    expect(parent.state.name).toBe('light')\n    expect(child.state.name).toBe('dark')\n  })\n\n  test('Inverts \"light\" to \"dark\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        inverse: true,\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark')\n  })\n\n  test('Inverts \"light_red\" to \"dark_red\"', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child1 = new ThemeManager(\n      {\n        name: 'red',\n        inverse: true,\n      },\n      parent\n    )\n    expect(child1.state.name).toBe('dark_red')\n  })\n\n  test('Updates state', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const newState = parent.updateState({\n      name: 'dark',\n    })\n    expect(newState).toMatchInlineSnapshot(`\n      {\n        \"className\": \"t_dark\",\n        \"name\": \"dark\",\n        \"parentName\": \"\",\n        \"theme\": {\n          \"background\": {\n            \"isVar\": true,\n            \"key\": \"color-2\",\n            \"name\": \"background\",\n            \"val\": \"#000\",\n            \"variable\": \"\",\n          },\n          \"color\": {\n            \"isVar\": true,\n            \"key\": \"color-1\",\n            \"name\": \"color\",\n            \"val\": \"#fff\",\n            \"variable\": \"\",\n          },\n        },\n      }\n    `)\n    expect(parent.state.name).toBe('dark')\n  })\n\n  test('Returns parent on empty', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: null,\n      },\n      parent\n    )\n    expect(child).toBe(parent)\n  })\n\n  test('Resets theme', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark')\n    expect(child.parentManager).toBe(parent)\n    const child2 = new ThemeManager(\n      {\n        reset: true,\n      },\n      child\n    )\n    expect(child2.parentManager).toBe(child)\n    expect(child2.state.name).toBe('light')\n  })\n\n  test('Nested invert and reset', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'light',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      parent\n    )\n    const child2 = new ThemeManager(\n      {\n        reset: true,\n      },\n      child\n    )\n    const child3 = new ThemeManager(\n      {\n        inverse: true,\n      },\n      child2\n    )\n    expect(child3.state.name).toBe('dark')\n  })\n\n  test('Updates from null the new theme nested 3 themes', () => {\n    const a = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const b = new ThemeManager(\n      {\n        name: 'red',\n      },\n      a\n    )\n    expect(b.state.name).toBe('dark_red')\n    const c = new ThemeManager(\n      {\n        name: 'alt2',\n      },\n      b\n    )\n    expect(c.state.name).toBe('dark_red_alt2')\n  })\n\n  test('Ignored dup themes', () => {\n    const a = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const b = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      a\n    )\n    expect(b === a).toBe(true)\n  })\n\n  test('Nested component themes fallback to grandparents', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red',\n        componentName: 'Button',\n      },\n      parent\n    )\n    const child2 = new ThemeManager(\n      {\n        name: 'blue',\n      },\n      child\n    )\n    expect(child2.state.name).toBe('dark_blue')\n    const child3 = new ThemeManager(\n      {\n        componentName: 'Button',\n      },\n      child2\n    )\n    expect(child3.state.name).toBe('dark_blue_Button')\n  })\n\n  test(`Component theme with sub component that doesn't exist keeps same theme`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red',\n        componentName: 'Button',\n      },\n      parent\n    )\n    const child2 = new ThemeManager(\n      {\n        componentName: 'Spacer',\n      },\n      child\n    )\n    expect(child2).toBe(child)\n  })\n\n  test(`Doesn't find invalid parent when only passing component`, () => {\n    expect(!!conf.themes['dark_Card']).toBeTruthy()\n\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n\n    const child = new ThemeManager(\n      {\n        componentName: 'Card',\n      },\n      parent\n    )\n\n    // dont find dark_Card because dark_red is highest it should climb\n    expect(child.state.name).toBe(parent.state.name)\n  })\n\n  test(`Finds sub-theme when componentName and name are passed but componentName doesn't exist`, () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n\n    const child = new ThemeManager(\n      {\n        name: 'red',\n        componentName: 'Missing',\n      },\n      parent\n    )\n\n    // dont find dark_Card because dark_red is highest it should climb\n    expect(child.state.name).toBe('dark_red')\n  })\n\n  test('Uses the full className without the light/dark prefix', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'red_alt2',\n      },\n      parent\n    )\n    expect(child.state.className).toBe('t_red_alt2')\n\n    const child2 = new ThemeManager(\n      {\n        name: 'red',\n      },\n      parent\n    )\n    const child3 = new ThemeManager(\n      {\n        name: 'alt2',\n      },\n      child2\n    )\n    expect(child3.state.className).toBe('t_red_alt2')\n  })\n\n  test('Finds component dark_red + Button', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'dark_red',\n        componentName: 'Button',\n      },\n      parent\n    )\n    expect(child.state.className).toBe('t_red_Button')\n    expect(child.state.name).toBe('dark_red_Button')\n  })\n\n  test('Drops componentName if only regular name found at stronger level', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'alt1',\n        componentName: 'Button',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark_red_alt1')\n  })\n\n  test('Component name + theme change when nested already', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'yellow',\n        componentName: 'Button',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark_yellow_Button')\n  })\n\n  test('Component name + name finds one up when component name missing', () => {\n    const parent = new ThemeManager(\n      {\n        name: 'dark_red_alt1',\n      },\n      'root'\n    )\n    const child = new ThemeManager(\n      {\n        name: 'alt2',\n        componentName: 'Missing',\n      },\n      parent\n    )\n    expect(child.state.name).toBe('dark_red_alt2')\n  })\n})\n"],
   "mappings": "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",
   "names": []
 }

package/dist/esm/helpers/createMediaStyle.js

@@ -3,7 +3,7 @@ const MEDIA_SEP = "_";
 let prefixes = null;
 let selectors = null;
 const createMediaStyle = ({ property, identifier, rules }, mediaKey, mediaQueries, negate) => {
-  if (!prefixes || !selectors) {
+  if (!(prefixes && selectors)) {
     const mediaKeys = Object.keys(mediaQueries);
     prefixes = Object.fromEntries(
       mediaKeys.map((key, index) => [key, new Array(index + 1).fill(":root").join("")])

package/dist/esm/helpers/createMediaStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/createMediaStyle.ts"],
-  "sourcesContent": ["import { StyleObject } from '@tamagui/helpers'\n\nimport { mediaObjectToString } from '../hooks/useMedia'\nimport { MediaQueries } from '../types'\nimport { PartialStyleObject } from './insertStyleRule'\n\n// TODO have this be used by extractMediaStyle in tamagui static\n// not synced to static/constants for now\nexport const MEDIA_SEP = '_'\n\nlet prefixes: Record<string, string> | null = null\nlet selectors: Record<string, string> | null = null\n\nexport const createMediaStyle = (\n  { property, identifier, rules }: StyleObject,\n  mediaKey: string,\n  mediaQueries: MediaQueries,\n  negate?: boolean\n): PartialStyleObject => {\n  if (!prefixes || !selectors) {\n    // TODO move this into useMedia calc once there and unify w getMediaImportance\n    const mediaKeys = Object.keys(mediaQueries)\n    prefixes = Object.fromEntries(\n      mediaKeys.map((key, index) => [key, new Array(index + 1).fill(':root').join('')])\n    )\n    selectors = Object.fromEntries(\n      mediaKeys.map((key) => [key, mediaObjectToString(mediaQueries[key])])\n    )\n  }\n  const precendencePrefix = prefixes[mediaKey]\n  const mediaSelector = selectors[mediaKey]\n  const negKey = negate ? '0' : ''\n  const ogPrefix = identifier.slice(0, identifier.indexOf('-') + 1)\n  const nextIdentifier = `${identifier.replace(\n    ogPrefix,\n    `${ogPrefix}${MEDIA_SEP}${mediaKey}${negKey}${MEDIA_SEP}`\n  )}`\n  const screenStr = negate ? 'not all and' : ''\n  const mediaQuery = `${screenStr} ${mediaSelector}`\n  const styleInner = rules.map((rule) => rule.replace(identifier, nextIdentifier)).join(';')\n  // combines media queries if they already exist\n  let styleRule = ''\n  if (styleInner.includes('@media')) {\n    // combine\n    styleRule = styleInner.replace('{', ` and ${mediaQuery} {`)\n  } else {\n    styleRule = `@media ${mediaQuery} { ${precendencePrefix} ${styleInner} }`\n  }\n  styleRule = styleRule.replace(';}', ' !important;}')\n  return {\n    property,\n    rules: [styleRule],\n    identifier: nextIdentifier,\n  }\n}\n"],
-  "mappings": "AAEA,SAAS,2BAA2B;AAM7B,MAAM,YAAY;AAEzB,IAAI,WAA0C;AAC9C,IAAI,YAA2C;AAExC,MAAM,mBAAmB,CAC9B,EAAE,UAAU,YAAY,MAAM,GAC9B,UACA,cACA,WACuB;AACvB,MAAI,CAAC,YAAY,CAAC,WAAW;AAE3B,UAAM,YAAY,OAAO,KAAK,YAAY;AAC1C,eAAW,OAAO;AAAA,MAChB,UAAU,IAAI,CAAC,KAAK,UAAU,CAAC,KAAK,IAAI,MAAM,QAAQ,CAAC,EAAE,KAAK,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;AAAA,IAClF;AACA,gBAAY,OAAO;AAAA,MACjB,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK,oBAAoB,aAAa,IAAI,CAAC,CAAC;AAAA,IACtE;AAAA,EACF;AACA,QAAM,oBAAoB,SAAS;AACnC,QAAM,gBAAgB,UAAU;AAChC,QAAM,SAAS,SAAS,MAAM;AAC9B,QAAM,WAAW,WAAW,MAAM,GAAG,WAAW,QAAQ,GAAG,IAAI,CAAC;AAChE,QAAM,iBAAiB,GAAG,WAAW;AAAA,IACnC;AAAA,IACA,GAAG,WAAW,YAAY,WAAW,SAAS;AAAA,EAChD;AACA,QAAM,YAAY,SAAS,gBAAgB;AAC3C,QAAM,aAAa,GAAG,aAAa;AACnC,QAAM,aAAa,MAAM,IAAI,CAAC,SAAS,KAAK,QAAQ,YAAY,cAAc,CAAC,EAAE,KAAK,GAAG;AAEzF,MAAI,YAAY;AAChB,MAAI,WAAW,SAAS,QAAQ,GAAG;AAEjC,gBAAY,WAAW,QAAQ,KAAK,QAAQ,cAAc;AAAA,EAC5D,OAAO;AACL,gBAAY,UAAU,gBAAgB,qBAAqB;AAAA,EAC7D;AACA,cAAY,UAAU,QAAQ,MAAM,eAAe;AACnD,SAAO;AAAA,IACL;AAAA,IACA,OAAO,CAAC,SAAS;AAAA,IACjB,YAAY;AAAA,EACd;AACF;",
+  "sourcesContent": ["import { StyleObject } from '@tamagui/helpers'\n\nimport { mediaObjectToString } from '../hooks/useMedia'\nimport { MediaQueries } from '../types'\nimport { PartialStyleObject } from './insertStyleRule'\n\n// TODO have this be used by extractMediaStyle in tamagui static\n// not synced to static/constants for now\nexport const MEDIA_SEP = '_'\n\nlet prefixes: Record<string, string> | null = null\nlet selectors: Record<string, string> | null = null\n\nexport const createMediaStyle = (\n  { property, identifier, rules }: StyleObject,\n  mediaKey: string,\n  mediaQueries: MediaQueries,\n  negate?: boolean\n): PartialStyleObject => {\n  if (!(prefixes && selectors)) {\n    // TODO move this into useMedia calc once there and unify w getMediaImportance\n    const mediaKeys = Object.keys(mediaQueries)\n    prefixes = Object.fromEntries(\n      mediaKeys.map((key, index) => [key, new Array(index + 1).fill(':root').join('')])\n    )\n    selectors = Object.fromEntries(\n      mediaKeys.map((key) => [key, mediaObjectToString(mediaQueries[key])])\n    )\n  }\n  const precendencePrefix = prefixes[mediaKey]\n  const mediaSelector = selectors[mediaKey]\n  const negKey = negate ? '0' : ''\n  const ogPrefix = identifier.slice(0, identifier.indexOf('-') + 1)\n  const nextIdentifier = `${identifier.replace(\n    ogPrefix,\n    `${ogPrefix}${MEDIA_SEP}${mediaKey}${negKey}${MEDIA_SEP}`\n  )}`\n  const screenStr = negate ? 'not all and' : ''\n  const mediaQuery = `${screenStr} ${mediaSelector}`\n  const styleInner = rules\n    .map((rule) => rule.replace(identifier, nextIdentifier))\n    .join(';')\n  // combines media queries if they already exist\n  let styleRule = ''\n  if (styleInner.includes('@media')) {\n    // combine\n    styleRule = styleInner.replace('{', ` and ${mediaQuery} {`)\n  } else {\n    styleRule = `@media ${mediaQuery} { ${precendencePrefix} ${styleInner} }`\n  }\n  styleRule = styleRule.replace(';}', ' !important;}')\n  return {\n    property,\n    rules: [styleRule],\n    identifier: nextIdentifier,\n  }\n}\n"],
+  "mappings": "AAEA,SAAS,2BAA2B;AAM7B,MAAM,YAAY;AAEzB,IAAI,WAA0C;AAC9C,IAAI,YAA2C;AAExC,MAAM,mBAAmB,CAC9B,EAAE,UAAU,YAAY,MAAM,GAC9B,UACA,cACA,WACuB;AACvB,MAAI,EAAE,YAAY,YAAY;AAE5B,UAAM,YAAY,OAAO,KAAK,YAAY;AAC1C,eAAW,OAAO;AAAA,MAChB,UAAU,IAAI,CAAC,KAAK,UAAU,CAAC,KAAK,IAAI,MAAM,QAAQ,CAAC,EAAE,KAAK,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;AAAA,IAClF;AACA,gBAAY,OAAO;AAAA,MACjB,UAAU,IAAI,CAAC,QAAQ,CAAC,KAAK,oBAAoB,aAAa,IAAI,CAAC,CAAC;AAAA,IACtE;AAAA,EACF;AACA,QAAM,oBAAoB,SAAS;AACnC,QAAM,gBAAgB,UAAU;AAChC,QAAM,SAAS,SAAS,MAAM;AAC9B,QAAM,WAAW,WAAW,MAAM,GAAG,WAAW,QAAQ,GAAG,IAAI,CAAC;AAChE,QAAM,iBAAiB,GAAG,WAAW;AAAA,IACnC;AAAA,IACA,GAAG,WAAW,YAAY,WAAW,SAAS;AAAA,EAChD;AACA,QAAM,YAAY,SAAS,gBAAgB;AAC3C,QAAM,aAAa,GAAG,aAAa;AACnC,QAAM,aAAa,MAChB,IAAI,CAAC,SAAS,KAAK,QAAQ,YAAY,cAAc,CAAC,EACtD,KAAK,GAAG;AAEX,MAAI,YAAY;AAChB,MAAI,WAAW,SAAS,QAAQ,GAAG;AAEjC,gBAAY,WAAW,QAAQ,KAAK,QAAQ,cAAc;AAAA,EAC5D,OAAO;AACL,gBAAY,UAAU,gBAAgB,qBAAqB;AAAA,EAC7D;AACA,cAAY,UAAU,QAAQ,MAAM,eAAe;AACnD,SAAO;AAAA,IACL;AAAA,IACA,OAAO,CAAC,SAAS;AAAA,IACjB,YAAY;AAAA,EACd;AACF;",
   "names": []
 }

package/dist/esm/helpers/createPropMapper.js

@@ -67,7 +67,7 @@ const createPropMapper = (staticConfig) => {
 };
 const resolveVariants = (key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, languageContext, avoidDefaultProps = false, debug) => {
   var _a;
-  const variant = variants && variants[key];
+  const variant = variants == null ? void 0 : variants[key];
   if (!variant || value === void 0) {
     return;
   }
@@ -191,7 +191,16 @@ const resolveTokensAndVariants = (key, value, props, defaultProps, theme, varian
         );
       }
     } else if (typeof val === "string") {
-      const fVal = val[0] === "$" ? getToken(fKey, val, conf, theme, fontFamily, languageContext, returnVariablesAs, debug) : val;
+      const fVal = val[0] === "$" ? getToken(
+        fKey,
+        val,
+        conf,
+        theme,
+        fontFamily,
+        languageContext,
+        returnVariablesAs,
+        debug
+      ) : val;
       res[fKey] = fVal;
     } else {
       if (isObj(val)) {
@@ -304,7 +313,7 @@ const getToken = (key, value, conf, theme, fontFamily = "$body", languageContext
   }
   if (hasSet) {
     if (process.env.NODE_ENV === "development" && isDevTools && debug === "verbose") {
-      console.log(`   \uFE52 propMapper getToken`, key, valOrVar, theme);
+      console.log("   \uFE52 propMapper getToken", key, valOrVar, theme);
     }
     return resolveVariableValue(key, valOrVar, resolveAs);
   }

package/dist/esm/helpers/createPropMapper.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/createPropMapper.ts"],
-  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { Variable, getVariableValue, isVariable } from '../createVariable'\nimport {\n  DebugProp,\n  GenericVariantDefinitions,\n  PropMapper,\n  SplitStyleState,\n  StaticConfigParsed,\n  TamaguiInternalConfig,\n  VariantSpreadFunction,\n} from '../types'\nimport { LanguageContextType } from '../views/FontLanguage.types'\nimport { expandStyle } from './expandStyle'\nimport { expandStyles } from './expandStyles'\nimport { getFontsForLanguage, getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\nimport { mergeProps } from './mergeProps'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both' | 'non-color-value'\n\nexport const getReturnVariablesAs = (props: any, state: Partial<SplitStyleState>) => {\n  return !!props.animation || state.resolveVariablesAs === 'value'\n    ? isWeb\n      ? 'non-color-value'\n      : 'value'\n    : 'auto'\n}\n\nexport const createPropMapper = (staticConfig: StaticConfigParsed) => {\n  const variants = staticConfig.variants || {}\n\n  // temp remove classnames\n  const defaultProps = mergeProps(staticConfig.defaultProps || {}, {}, false)[0]\n\n  let conf: TamaguiInternalConfig\n\n  const mapper: PropMapper = (\n    key,\n    value,\n    theme,\n    propsIn,\n    state,\n    languageContext,\n    avoidDefaultProps = false,\n    debug\n  ) => {\n    conf ||= getConfig()\n\n    const props = state.fallbackProps || propsIn\n    const returnVariablesAs = getReturnVariablesAs(props, state)\n\n    // handled here because we need to resolve this off tokens, its the only one-off like this\n    const fontFamily =\n      props[conf.inverseShorthands.fontFamily] ||\n      props.fontFamily ||\n      defaultProps.fontFamily ||\n      propsIn.fontFamily ||\n      '$body'\n\n    const variantValue = resolveVariants(\n      key,\n      value,\n      props,\n      defaultProps,\n      theme,\n      variants,\n      fontFamily,\n      conf,\n      returnVariablesAs,\n      staticConfig,\n      '',\n      languageContext,\n      avoidDefaultProps,\n      debug\n    )\n\n    if (variantValue) {\n      return variantValue\n    }\n\n    let shouldReturn = value !== undefined && value !== null\n\n    // handle shorthands\n    if (key in conf.shorthands) {\n      shouldReturn = true\n      key = conf.shorthands[key]\n    }\n\n    if (value) {\n      if (value[0] === '$') {\n        value = getToken(\n          key,\n          value,\n          conf,\n          theme,\n          fontFamily,\n          languageContext,\n          returnVariablesAs,\n          debug\n        )\n      } else if (isVariable(value)) {\n        value = resolveVariableValue(key, value, returnVariablesAs)\n      }\n    }\n\n    if (shouldReturn) {\n      return expandStyle(key, value) || [[key, value]]\n    }\n  }\n\n  return mapper\n}\n\ntype StyleResolver = (\n  key: string,\n  value: any,\n  props: Record<string, any>,\n  defaultProps: any,\n  theme: any,\n  variants: GenericVariantDefinitions,\n  fontFamily: string,\n  conf: TamaguiInternalConfig,\n  returnVariablesAs: 'auto' | 'value' | 'non-color-value',\n  staticConfig: StaticConfigParsed,\n  parentVariantKey: string,\n  languageContext?: LanguageContextType,\n  avoidDefaultProps?: boolean,\n  debug?: DebugProp\n) => any\n\nconst resolveVariants: StyleResolver = (\n  key,\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  languageContext,\n  avoidDefaultProps = false,\n  debug\n) => {\n  const variant = variants && variants[key]\n  if (!variant || value === undefined) {\n    return\n  }\n\n  let variantValue = getVariantDefinition(variant, key, value, conf)\n\n  if (!variantValue) {\n    // variant at key exists, but no matching variant value, return nothing\n    if (process.env.NODE_ENV === 'development') {\n      if (staticConfig.validStyles?.[key]) {\n        return null\n      }\n      if (value === false) {\n        // don't warn on missing false values, common to only use true\n        return null\n      }\n      const name = staticConfig.componentName || '[UnnamedComponent]'\n      // eslint-disable-next-line no-console\n      console.warn(\n        `No variant found: ${name} has variant \"${key}\", but no matching value \"${value}\"`\n      )\n    }\n    return\n  }\n\n  if (typeof variantValue === 'function') {\n    const fn = variantValue as VariantSpreadFunction<any>\n    variantValue = fn(\n      value,\n      getVariantExtras(props, languageContext, theme, defaultProps, avoidDefaultProps)\n    )\n  }\n\n  let fontFamilyResult: any\n\n  if (isObj(variantValue)) {\n    const fontFamilyUpdate =\n      variantValue.fontFamily || variantValue[conf.inverseShorthands.fontFamily]\n\n    if (fontFamilyUpdate) {\n      fontFamilyResult = getFontFamilyFromNameOrVariable(fontFamilyUpdate, conf)\n    }\n\n    variantValue = resolveTokensAndVariants(\n      key,\n      variantValue,\n      props,\n      defaultProps,\n      theme,\n      variants,\n      fontFamilyResult || fontFamily,\n      conf,\n      returnVariablesAs,\n      staticConfig,\n      parentVariantKey,\n      languageContext,\n      avoidDefaultProps,\n      debug\n    )\n  }\n\n  if (variantValue) {\n    const next = Object.entries(expandStyles(variantValue))\n\n    // store any changed font family (only support variables for now)\n    if (fontFamilyResult && fontFamilyResult[0] === '$') {\n      fontFamilyCache.set(next, getVariableValue(fontFamilyResult))\n    }\n\n    return next\n  }\n}\n\n// handles finding and resolving the fontFamily to the token name\n// this is used as `font_[name]` in className for nice css variable support\nexport function getFontFamilyFromNameOrVariable(input: any, conf: TamaguiInternalConfig) {\n  if (isVariable(input)) {\n    const val = variableToFontNameCache.get(input)\n    if (val) {\n      return val\n    } else {\n      for (const key in conf.fontsParsed) {\n        const familyVariable = conf.fontsParsed[key].family\n        if (isVariable(familyVariable)) {\n          variableToFontNameCache.set(familyVariable, key)\n          if (familyVariable === input) {\n            return key\n          }\n        }\n      }\n    }\n  } else if (typeof input === 'string') {\n    if (input?.[0] === '$') {\n      return input\n    } else {\n      // this could be mapped back to\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.log('[tamagui] should map back', input)\n      }\n    }\n  }\n}\n\nconst variableToFontNameCache = new WeakMap<Variable, string>()\n\n// special helper for special font family\nconst fontFamilyCache = new WeakMap()\nexport const getPropMappedFontFamily = (expanded?: any) => {\n  return expanded && fontFamilyCache.get(expanded)\n}\n\nconst resolveTokensAndVariants: StyleResolver = (\n  key, // we dont use key assume value is object instead\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  languageContext,\n  avoidDefaultProps,\n  debug\n) => {\n  const res = {}\n  for (const rKey in value) {\n    const fKey = conf.shorthands[rKey] || rKey\n    const val = value[rKey]\n\n    if (isVariable(val)) {\n      res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n    } else if (variants[fKey]) {\n      // avoids infinite loop if variant is matching a style prop\n      // eg: { variants: { flex: { true: { flex: 2 } } } }\n      if (parentVariantKey === key) {\n        res[fKey] = val\n      } else {\n        Object.assign(\n          res,\n          Object.fromEntries(\n            resolveVariants(\n              fKey,\n              val,\n              props,\n              defaultProps,\n              theme,\n              variants,\n              fontFamily,\n              conf,\n              returnVariablesAs,\n              staticConfig,\n              key,\n              languageContext,\n              avoidDefaultProps,\n              debug\n            )\n          )\n        )\n      }\n    } else if (typeof val === 'string') {\n      const fVal =\n        val[0] === '$'\n          ? getToken(fKey, val, conf, theme, fontFamily, languageContext, returnVariablesAs, debug)\n          : val\n      res[fKey] = fVal\n    } else {\n      if (isObj(val)) {\n        // sub-objects: media queries, pseudos, shadowOffset\n        res[fKey] = resolveTokensAndVariants(\n          fKey,\n          val,\n          props,\n          defaultProps,\n          theme,\n          variants,\n          fontFamily,\n          conf,\n          returnVariablesAs,\n          staticConfig,\n          key,\n          languageContext,\n          avoidDefaultProps,\n          debug\n        )\n      } else {\n        // nullish values cant be tokens, need no extra parsing\n        res[fKey] = val\n      }\n    }\n    if (process.env.NODE_ENV === 'development') {\n      if (debug) {\n        if (res[fKey]?.[0] === '$') {\n          // eslint-disable-next-line no-console\n          console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey], theme)\n        }\n      }\n    }\n  }\n\n  return res\n}\n\n// goes through specificity finding best matching variant function\nfunction getVariantDefinition(variant: any, key: string, value: any, conf: TamaguiInternalConfig) {\n  if (typeof variant === 'function') {\n    return variant\n  }\n  if (variant[value]) {\n    return variant[value]\n  }\n  const { tokensParsed } = conf\n  if (variant['...size'] && value in tokensParsed.size) {\n    return variant['...size']\n  }\n  if (variant['...color'] && value in tokensParsed.color) {\n    return variant['...color']\n  }\n  if (variant['...radius'] && value in tokensParsed.radius) {\n    return variant['...radius']\n  }\n  if (variant['...space'] && value in tokensParsed.space) {\n    return variant['...space']\n  }\n  if (variant['...zIndex'] && value in tokensParsed.zIndex) {\n    return variant['...zIndex']\n  }\n  let fn: any\n  if (typeof value === 'number') {\n    fn = variant[':number']\n  } else if (typeof value === 'string') {\n    fn = variant[':string']\n  } else if (value === true || value === false) {\n    fn = variant[':boolean']\n  }\n  // fallback to catch all or size\n  return fn || variant['...'] || variant['...size']\n}\n\nconst fontShorthand = {\n  fontSize: 'size',\n  fontWeight: 'weight',\n}\n\nconst getToken = (\n  key: string,\n  value: string,\n  conf: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: string | undefined = '$body',\n  languageContext?: LanguageContextType,\n  resolveAs?: ResolveVariableTypes,\n  debug?: DebugProp\n) => {\n  const tokensParsed = conf.tokensParsed\n  const fontsParsed = languageContext\n    ? getFontsForLanguage(conf.fontsParsed, languageContext)\n    : conf.fontsParsed\n  let valOrVar: any\n  let hasSet = false\n  if (value in theme) {\n    valOrVar = theme[value]\n    hasSet = true\n  } else {\n    switch (key) {\n      case 'fontFamily':\n        valOrVar = fontsParsed[value]?.family || value\n        hasSet = true\n        break\n      case 'fontSize':\n      case 'lineHeight':\n      case 'letterSpacing':\n      case 'fontWeight':\n        valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n        hasSet = true\n        break\n    }\n    for (const cat in tokenCategories) {\n      if (key in tokenCategories[cat]) {\n        const res = tokensParsed[cat][value]\n        if (res) {\n          valOrVar = res\n          hasSet = true\n        }\n      }\n    }\n    if (!hasSet) {\n      const spaceVar = tokensParsed.space[value]\n      if (spaceVar) {\n        valOrVar = spaceVar\n        hasSet = true\n      }\n    }\n  }\n\n  if (hasSet) {\n    if (process.env.NODE_ENV === 'development' && isDevTools && debug === 'verbose') {\n      // eslint-disable-next-line no-console\n      console.log(`   \uFE52 propMapper getToken`, key, valOrVar, theme)\n    }\n    return resolveVariableValue(key, valOrVar, resolveAs)\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    if (value && value[0] === '$') {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `\u26A0\uFE0F You passed the value \"${value}\" to the style property \"${key}\", but there's no theme or token with the key \"${value}\". Using theme \"${theme.name}\".\n\nSet the debug prop to true to see more detailed debug information.`\n      )\n      if (debug) {\n        if (isDevTools) {\n          // eslint-disable-next-line no-console\n          console.log('Looked in:', { theme, tokensParsed, fontsParsed })\n        }\n      }\n      return null\n    }\n  }\n  return value\n}\n\nfunction resolveVariableValue(\n  key: string,\n  valOrVar: Variable | any,\n  resolveAs: ResolveVariableTypes = 'auto'\n) {\n  if (isVariable(valOrVar)) {\n    if (resolveAs === 'variable') {\n      return valOrVar\n    }\n    if (resolveAs === 'non-color-value') {\n      if (isWeb) {\n        if (key in tokenCategories.color) {\n          return valOrVar.variable\n        }\n      }\n      return valOrVar.val\n    }\n    if (!isWeb || resolveAs === 'value') {\n      return valOrVar.val\n    }\n    return valOrVar.variable\n  }\n  return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n  radius: {\n    borderRadius: true,\n    borderTopLeftRadius: true,\n    borderTopRightRadius: true,\n    borderBottomLeftRadius: true,\n    borderBottomRightRadius: true,\n  },\n  size: {\n    width: true,\n    height: true,\n    minWidth: true,\n    minHeight: true,\n    maxWidth: true,\n    maxHeight: true,\n  },\n  color: {\n    color: true,\n    backgroundColor: true,\n    borderColor: true,\n    borderBottomColor: true,\n    borderTopColor: true,\n    borderLeftColor: true,\n    borderRightColor: true,\n  },\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { Variable, getVariableValue, isVariable } from '../createVariable'\nimport {\n  DebugProp,\n  GenericVariantDefinitions,\n  PropMapper,\n  SplitStyleState,\n  StaticConfigParsed,\n  TamaguiInternalConfig,\n  VariantSpreadFunction,\n} from '../types'\nimport { LanguageContextType } from '../views/FontLanguage.types'\nimport { expandStyle } from './expandStyle'\nimport { expandStyles } from './expandStyles'\nimport { getFontsForLanguage, getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\nimport { mergeProps } from './mergeProps'\n\nexport type ResolveVariableTypes =\n  | 'auto'\n  | 'value'\n  | 'variable'\n  | 'both'\n  | 'non-color-value'\n\nexport const getReturnVariablesAs = (props: any, state: Partial<SplitStyleState>) => {\n  return !!props.animation || state.resolveVariablesAs === 'value'\n    ? isWeb\n      ? 'non-color-value'\n      : 'value'\n    : 'auto'\n}\n\nexport const createPropMapper = (staticConfig: StaticConfigParsed) => {\n  const variants = staticConfig.variants || {}\n\n  // temp remove classnames\n  const defaultProps = mergeProps(staticConfig.defaultProps || {}, {}, false)[0]\n\n  let conf: TamaguiInternalConfig\n\n  const mapper: PropMapper = (\n    key,\n    value,\n    theme,\n    propsIn,\n    state,\n    languageContext,\n    avoidDefaultProps = false,\n    debug\n  ) => {\n    conf ||= getConfig()\n\n    const props = state.fallbackProps || propsIn\n    const returnVariablesAs = getReturnVariablesAs(props, state)\n\n    // handled here because we need to resolve this off tokens, its the only one-off like this\n    const fontFamily =\n      props[conf.inverseShorthands.fontFamily] ||\n      props.fontFamily ||\n      defaultProps.fontFamily ||\n      propsIn.fontFamily ||\n      '$body'\n\n    const variantValue = resolveVariants(\n      key,\n      value,\n      props,\n      defaultProps,\n      theme,\n      variants,\n      fontFamily,\n      conf,\n      returnVariablesAs,\n      staticConfig,\n      '',\n      languageContext,\n      avoidDefaultProps,\n      debug\n    )\n\n    if (variantValue) {\n      return variantValue\n    }\n\n    let shouldReturn = value !== undefined && value !== null\n\n    // handle shorthands\n    if (key in conf.shorthands) {\n      shouldReturn = true\n      key = conf.shorthands[key]\n    }\n\n    if (value) {\n      if (value[0] === '$') {\n        value = getToken(\n          key,\n          value,\n          conf,\n          theme,\n          fontFamily,\n          languageContext,\n          returnVariablesAs,\n          debug\n        )\n      } else if (isVariable(value)) {\n        value = resolveVariableValue(key, value, returnVariablesAs)\n      }\n    }\n\n    if (shouldReturn) {\n      return expandStyle(key, value) || [[key, value]]\n    }\n  }\n\n  return mapper\n}\n\ntype StyleResolver = (\n  key: string,\n  value: any,\n  props: Record<string, any>,\n  defaultProps: any,\n  theme: any,\n  variants: GenericVariantDefinitions,\n  fontFamily: string,\n  conf: TamaguiInternalConfig,\n  returnVariablesAs: 'auto' | 'value' | 'non-color-value',\n  staticConfig: StaticConfigParsed,\n  parentVariantKey: string,\n  languageContext?: LanguageContextType,\n  avoidDefaultProps?: boolean,\n  debug?: DebugProp\n) => any\n\nconst resolveVariants: StyleResolver = (\n  key,\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  languageContext,\n  avoidDefaultProps = false,\n  debug\n) => {\n  const variant = variants?.[key]\n  if (!variant || value === undefined) {\n    return\n  }\n\n  let variantValue = getVariantDefinition(variant, key, value, conf)\n\n  if (!variantValue) {\n    // variant at key exists, but no matching variant value, return nothing\n    if (process.env.NODE_ENV === 'development') {\n      if (staticConfig.validStyles?.[key]) {\n        return null\n      }\n      if (value === false) {\n        // don't warn on missing false values, common to only use true\n        return null\n      }\n      const name = staticConfig.componentName || '[UnnamedComponent]'\n      // eslint-disable-next-line no-console\n      console.warn(\n        `No variant found: ${name} has variant \"${key}\", but no matching value \"${value}\"`\n      )\n    }\n    return\n  }\n\n  if (typeof variantValue === 'function') {\n    const fn = variantValue as VariantSpreadFunction<any>\n    variantValue = fn(\n      value,\n      getVariantExtras(props, languageContext, theme, defaultProps, avoidDefaultProps)\n    )\n  }\n\n  let fontFamilyResult: any\n\n  if (isObj(variantValue)) {\n    const fontFamilyUpdate =\n      variantValue.fontFamily || variantValue[conf.inverseShorthands.fontFamily]\n\n    if (fontFamilyUpdate) {\n      fontFamilyResult = getFontFamilyFromNameOrVariable(fontFamilyUpdate, conf)\n    }\n\n    variantValue = resolveTokensAndVariants(\n      key,\n      variantValue,\n      props,\n      defaultProps,\n      theme,\n      variants,\n      fontFamilyResult || fontFamily,\n      conf,\n      returnVariablesAs,\n      staticConfig,\n      parentVariantKey,\n      languageContext,\n      avoidDefaultProps,\n      debug\n    )\n  }\n\n  if (variantValue) {\n    const next = Object.entries(expandStyles(variantValue))\n\n    // store any changed font family (only support variables for now)\n    if (fontFamilyResult && fontFamilyResult[0] === '$') {\n      fontFamilyCache.set(next, getVariableValue(fontFamilyResult))\n    }\n\n    return next\n  }\n}\n\n// handles finding and resolving the fontFamily to the token name\n// this is used as `font_[name]` in className for nice css variable support\nexport function getFontFamilyFromNameOrVariable(input: any, conf: TamaguiInternalConfig) {\n  if (isVariable(input)) {\n    const val = variableToFontNameCache.get(input)\n    if (val) {\n      return val\n    } else {\n      for (const key in conf.fontsParsed) {\n        const familyVariable = conf.fontsParsed[key].family\n        if (isVariable(familyVariable)) {\n          variableToFontNameCache.set(familyVariable, key)\n          if (familyVariable === input) {\n            return key\n          }\n        }\n      }\n    }\n  } else if (typeof input === 'string') {\n    if (input?.[0] === '$') {\n      return input\n    } else {\n      // this could be mapped back to\n      if (process.env.NODE_ENV === 'development') {\n        // eslint-disable-next-line no-console\n        console.log('[tamagui] should map back', input)\n      }\n    }\n  }\n}\n\nconst variableToFontNameCache = new WeakMap<Variable, string>()\n\n// special helper for special font family\nconst fontFamilyCache = new WeakMap()\nexport const getPropMappedFontFamily = (expanded?: any) => {\n  return expanded && fontFamilyCache.get(expanded)\n}\n\nconst resolveTokensAndVariants: StyleResolver = (\n  key, // we dont use key assume value is object instead\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  languageContext,\n  avoidDefaultProps,\n  debug\n) => {\n  const res = {}\n  for (const rKey in value) {\n    const fKey = conf.shorthands[rKey] || rKey\n    const val = value[rKey]\n\n    if (isVariable(val)) {\n      res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n    } else if (variants[fKey]) {\n      // avoids infinite loop if variant is matching a style prop\n      // eg: { variants: { flex: { true: { flex: 2 } } } }\n      if (parentVariantKey === key) {\n        res[fKey] = val\n      } else {\n        Object.assign(\n          res,\n          Object.fromEntries(\n            resolveVariants(\n              fKey,\n              val,\n              props,\n              defaultProps,\n              theme,\n              variants,\n              fontFamily,\n              conf,\n              returnVariablesAs,\n              staticConfig,\n              key,\n              languageContext,\n              avoidDefaultProps,\n              debug\n            )\n          )\n        )\n      }\n    } else if (typeof val === 'string') {\n      const fVal =\n        val[0] === '$'\n          ? getToken(\n              fKey,\n              val,\n              conf,\n              theme,\n              fontFamily,\n              languageContext,\n              returnVariablesAs,\n              debug\n            )\n          : val\n      res[fKey] = fVal\n    } else {\n      if (isObj(val)) {\n        // sub-objects: media queries, pseudos, shadowOffset\n        res[fKey] = resolveTokensAndVariants(\n          fKey,\n          val,\n          props,\n          defaultProps,\n          theme,\n          variants,\n          fontFamily,\n          conf,\n          returnVariablesAs,\n          staticConfig,\n          key,\n          languageContext,\n          avoidDefaultProps,\n          debug\n        )\n      } else {\n        // nullish values cant be tokens, need no extra parsing\n        res[fKey] = val\n      }\n    }\n    if (process.env.NODE_ENV === 'development') {\n      if (debug) {\n        if (res[fKey]?.[0] === '$') {\n          // eslint-disable-next-line no-console\n          console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey], theme)\n        }\n      }\n    }\n  }\n\n  return res\n}\n\n// goes through specificity finding best matching variant function\nfunction getVariantDefinition(\n  variant: any,\n  key: string,\n  value: any,\n  conf: TamaguiInternalConfig\n) {\n  if (typeof variant === 'function') {\n    return variant\n  }\n  if (variant[value]) {\n    return variant[value]\n  }\n  const { tokensParsed } = conf\n  if (variant['...size'] && value in tokensParsed.size) {\n    return variant['...size']\n  }\n  if (variant['...color'] && value in tokensParsed.color) {\n    return variant['...color']\n  }\n  if (variant['...radius'] && value in tokensParsed.radius) {\n    return variant['...radius']\n  }\n  if (variant['...space'] && value in tokensParsed.space) {\n    return variant['...space']\n  }\n  if (variant['...zIndex'] && value in tokensParsed.zIndex) {\n    return variant['...zIndex']\n  }\n  let fn: any\n  if (typeof value === 'number') {\n    fn = variant[':number']\n  } else if (typeof value === 'string') {\n    fn = variant[':string']\n  } else if (value === true || value === false) {\n    fn = variant[':boolean']\n  }\n  // fallback to catch all or size\n  return fn || variant['...'] || variant['...size']\n}\n\nconst fontShorthand = {\n  fontSize: 'size',\n  fontWeight: 'weight',\n}\n\nconst getToken = (\n  key: string,\n  value: string,\n  conf: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: string | undefined = '$body',\n  languageContext?: LanguageContextType,\n  resolveAs?: ResolveVariableTypes,\n  debug?: DebugProp\n) => {\n  const tokensParsed = conf.tokensParsed\n  const fontsParsed = languageContext\n    ? getFontsForLanguage(conf.fontsParsed, languageContext)\n    : conf.fontsParsed\n  let valOrVar: any\n  let hasSet = false\n  if (value in theme) {\n    valOrVar = theme[value]\n    hasSet = true\n  } else {\n    switch (key) {\n      case 'fontFamily':\n        valOrVar = fontsParsed[value]?.family || value\n        hasSet = true\n        break\n      case 'fontSize':\n      case 'lineHeight':\n      case 'letterSpacing':\n      case 'fontWeight':\n        valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n        hasSet = true\n        break\n    }\n    for (const cat in tokenCategories) {\n      if (key in tokenCategories[cat]) {\n        const res = tokensParsed[cat][value]\n        if (res) {\n          valOrVar = res\n          hasSet = true\n        }\n      }\n    }\n    if (!hasSet) {\n      const spaceVar = tokensParsed.space[value]\n      if (spaceVar) {\n        valOrVar = spaceVar\n        hasSet = true\n      }\n    }\n  }\n\n  if (hasSet) {\n    if (process.env.NODE_ENV === 'development' && isDevTools && debug === 'verbose') {\n      // eslint-disable-next-line no-console\n      console.log('   \uFE52 propMapper getToken', key, valOrVar, theme)\n    }\n    return resolveVariableValue(key, valOrVar, resolveAs)\n  }\n\n  if (process.env.NODE_ENV === 'development') {\n    if (value && value[0] === '$') {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `\u26A0\uFE0F You passed the value \"${value}\" to the style property \"${key}\", but there's no theme or token with the key \"${value}\". Using theme \"${theme.name}\".\n\nSet the debug prop to true to see more detailed debug information.`\n      )\n      if (debug) {\n        if (isDevTools) {\n          // eslint-disable-next-line no-console\n          console.log('Looked in:', { theme, tokensParsed, fontsParsed })\n        }\n      }\n      return null\n    }\n  }\n  return value\n}\n\nfunction resolveVariableValue(\n  key: string,\n  valOrVar: Variable | any,\n  resolveAs: ResolveVariableTypes = 'auto'\n) {\n  if (isVariable(valOrVar)) {\n    if (resolveAs === 'variable') {\n      return valOrVar\n    }\n    if (resolveAs === 'non-color-value') {\n      if (isWeb) {\n        if (key in tokenCategories.color) {\n          return valOrVar.variable\n        }\n      }\n      return valOrVar.val\n    }\n    if (!isWeb || resolveAs === 'value') {\n      return valOrVar.val\n    }\n    return valOrVar.variable\n  }\n  return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n  radius: {\n    borderRadius: true,\n    borderTopLeftRadius: true,\n    borderTopRightRadius: true,\n    borderBottomLeftRadius: true,\n    borderBottomRightRadius: true,\n  },\n  size: {\n    width: true,\n    height: true,\n    minWidth: true,\n    minHeight: true,\n    maxWidth: true,\n    maxHeight: true,\n  },\n  color: {\n    color: true,\n    backgroundColor: true,\n    borderColor: true,\n    borderBottomColor: true,\n    borderTopColor: true,\n    borderLeftColor: true,\n    borderRightColor: true,\n  },\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/helpers/createProxy.js

@@ -2,7 +2,7 @@ function createProxy(target, handler) {
   if (process.env.NODE_ENV === "development") {
     if (typeof target !== "object" || !target) {
       console.warn(
-        `Invalid object given for proxy:`,
+        "Invalid object given for proxy:",
         target,
         `
   

package/dist/esm/helpers/createProxy.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/createProxy.ts"],
-  "sourcesContent": ["export function createProxy<A extends object>(target: A, handler: ProxyHandler<A>) {\n  if (process.env.NODE_ENV === 'development') {\n    if (typeof target !== 'object' || !target) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `Invalid object given for proxy:`,\n        target,\n        `\n  \n  This can be due to a missing theme or configuration given to Tamagui.`,\n        new Error().stack\n      )\n    }\n  }\n  return new Proxy(target || {}, handler)\n}\n"],
+  "sourcesContent": ["export function createProxy<A extends object>(target: A, handler: ProxyHandler<A>) {\n  if (process.env.NODE_ENV === 'development') {\n    if (typeof target !== 'object' || !target) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        'Invalid object given for proxy:',\n        target,\n        `\n  \n  This can be due to a missing theme or configuration given to Tamagui.`,\n        new Error().stack\n      )\n    }\n  }\n  return new Proxy(target || {}, handler)\n}\n"],
   "mappings": "AAAO,SAAS,YAA8B,QAAW,SAA0B;AACjF,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,OAAO,WAAW,YAAY,CAAC,QAAQ;AAEzC,cAAQ;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA;AAAA;AAAA,QAGA,IAAI,MAAM,EAAE;AAAA,MACd;AAAA,IACF;AAAA,EACF;AACA,SAAO,IAAI,MAAM,UAAU,CAAC,GAAG,OAAO;AACxC;",
   "names": []
 }

package/dist/esm/helpers/expandStyle.js

@@ -40,14 +40,24 @@ function expandStyle(key, value) {
   }
 }
 const STYLE_SHORT_FORM_EXPANSIONS = {
-  borderColor: ["borderTopColor", "borderRightColor", "borderBottomColor", "borderLeftColor"],
+  borderColor: [
+    "borderTopColor",
+    "borderRightColor",
+    "borderBottomColor",
+    "borderLeftColor"
+  ],
   borderRadius: [
     "borderTopLeftRadius",
     "borderTopRightRadius",
     "borderBottomRightRadius",
     "borderBottomLeftRadius"
   ],
-  borderWidth: ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
+  borderWidth: [
+    "borderTopWidth",
+    "borderRightWidth",
+    "borderBottomWidth",
+    "borderLeftWidth"
+  ],
   margin: ["marginTop", "marginRight", "marginBottom", "marginLeft"],
   marginHorizontal: ["marginRight", "marginLeft"],
   marginVertical: ["marginTop", "marginBottom"],
@@ -56,7 +66,12 @@ const STYLE_SHORT_FORM_EXPANSIONS = {
   paddingHorizontal: ["paddingRight", "paddingLeft"],
   paddingVertical: ["paddingTop", "paddingBottom"],
   ...isWeb && {
-    borderStyle: ["borderTopStyle", "borderRightStyle", "borderBottomStyle", "borderLeftStyle"],
+    borderStyle: [
+      "borderTopStyle",
+      "borderRightStyle",
+      "borderBottomStyle",
+      "borderLeftStyle"
+    ],
     overflow: ["overflowX", "overflowY"]
   }
 };

package/dist/esm/helpers/expandStyle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/expandStyle.ts"],
-  "sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nexport function expandStyle(key: string, value: any) {\n  if (process.env.TAMAGUI_TARGET === 'web') {\n    if (key === 'flex') {\n      // The 'flex' property value in React Native must be a positive integer,\n      // 0, or -1.\n      if (value <= -1) {\n        return [\n          ['flexGrow', 0],\n          ['flexShrink', 1],\n          ['flexBasis', 'auto'],\n        ]\n      }\n      // normalizing to better align with native\n      // see spec for flex shorthand https://developer.mozilla.org/en-US/docs/Web/CSS/flex\n      if (value >= 0) {\n        return [\n          ['flexGrow', value],\n          ['flexShrink', 1],\n        ]\n      }\n      return\n    }\n\n    // web only\n    switch (key) {\n      case 'aspectRatio': {\n        return [[key, value.toString()]]\n      }\n\n      case 'textAlignVertical': {\n        return [['verticalAlign', value === 'center' ? 'middle' : value]]\n      }\n\n      case 'textDecorationLine': {\n        return [['textDecorationLine', value]]\n      }\n\n      case 'writingDirection': {\n        return [['direction', value]]\n      }\n    }\n  }\n\n  const longKey = STYLE_SHORT_FORM_EXPANSIONS[key]\n  if (longKey) {\n    return longKey.map((key) => {\n      return [key, value]\n    })\n  }\n}\n\nconst STYLE_SHORT_FORM_EXPANSIONS: Record<string, string[]> = {\n  borderColor: ['borderTopColor', 'borderRightColor', 'borderBottomColor', 'borderLeftColor'],\n  borderRadius: [\n    'borderTopLeftRadius',\n    'borderTopRightRadius',\n    'borderBottomRightRadius',\n    'borderBottomLeftRadius',\n  ],\n  borderWidth: ['borderTopWidth', 'borderRightWidth', 'borderBottomWidth', 'borderLeftWidth'],\n  margin: ['marginTop', 'marginRight', 'marginBottom', 'marginLeft'],\n  marginHorizontal: ['marginRight', 'marginLeft'],\n  marginVertical: ['marginTop', 'marginBottom'],\n  overscrollBehavior: ['overscrollBehaviorX', 'overscrollBehaviorY'],\n  padding: ['paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft'],\n  paddingHorizontal: ['paddingRight', 'paddingLeft'],\n  paddingVertical: ['paddingTop', 'paddingBottom'],\n  ...(isWeb && {\n    // react-native only supports borderStyle\n    borderStyle: ['borderTopStyle', 'borderRightStyle', 'borderBottomStyle', 'borderLeftStyle'],\n    // react-native doesn't support X / Y\n    overflow: ['overflowX', 'overflowY'],\n  }),\n}\n"],
-  "mappings": "AAKA,SAAS,aAAa;AAEf,SAAS,YAAY,KAAa,OAAY;AACnD,MAAI,QAAQ,IAAI,mBAAmB,OAAO;AACxC,QAAI,QAAQ,QAAQ;AAGlB,UAAI,SAAS,IAAI;AACf,eAAO;AAAA,UACL,CAAC,YAAY,CAAC;AAAA,UACd,CAAC,cAAc,CAAC;AAAA,UAChB,CAAC,aAAa,MAAM;AAAA,QACtB;AAAA,MACF;AAGA,UAAI,SAAS,GAAG;AACd,eAAO;AAAA,UACL,CAAC,YAAY,KAAK;AAAA,UAClB,CAAC,cAAc,CAAC;AAAA,QAClB;AAAA,MACF;AACA;AAAA,IACF;AAGA,YAAQ;AAAA,WACD,eAAe;AAClB,eAAO,CAAC,CAAC,KAAK,MAAM,SAAS,CAAC,CAAC;AAAA,MACjC;AAAA,WAEK,qBAAqB;AACxB,eAAO,CAAC,CAAC,iBAAiB,UAAU,WAAW,WAAW,KAAK,CAAC;AAAA,MAClE;AAAA,WAEK,sBAAsB;AACzB,eAAO,CAAC,CAAC,sBAAsB,KAAK,CAAC;AAAA,MACvC;AAAA,WAEK,oBAAoB;AACvB,eAAO,CAAC,CAAC,aAAa,KAAK,CAAC;AAAA,MAC9B;AAAA;AAAA,EAEJ;AAEA,QAAM,UAAU,4BAA4B;AAC5C,MAAI,SAAS;AACX,WAAO,QAAQ,IAAI,CAACA,SAAQ;AAC1B,aAAO,CAACA,MAAK,KAAK;AAAA,IACpB,CAAC;AAAA,EACH;AACF;AAEA,MAAM,8BAAwD;AAAA,EAC5D,aAAa,CAAC,kBAAkB,oBAAoB,qBAAqB,iBAAiB;AAAA,EAC1F,cAAc;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,aAAa,CAAC,kBAAkB,oBAAoB,qBAAqB,iBAAiB;AAAA,EAC1F,QAAQ,CAAC,aAAa,eAAe,gBAAgB,YAAY;AAAA,EACjE,kBAAkB,CAAC,eAAe,YAAY;AAAA,EAC9C,gBAAgB,CAAC,aAAa,cAAc;AAAA,EAC5C,oBAAoB,CAAC,uBAAuB,qBAAqB;AAAA,EACjE,SAAS,CAAC,cAAc,gBAAgB,iBAAiB,aAAa;AAAA,EACtE,mBAAmB,CAAC,gBAAgB,aAAa;AAAA,EACjD,iBAAiB,CAAC,cAAc,eAAe;AAAA,EAC/C,GAAI,SAAS;AAAA,IAEX,aAAa,CAAC,kBAAkB,oBAAoB,qBAAqB,iBAAiB;AAAA,IAE1F,UAAU,CAAC,aAAa,WAAW;AAAA,EACrC;AACF;",
+  "sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '@tamagui/constants'\n\nexport function expandStyle(key: string, value: any) {\n  if (process.env.TAMAGUI_TARGET === 'web') {\n    if (key === 'flex') {\n      // The 'flex' property value in React Native must be a positive integer,\n      // 0, or -1.\n      if (value <= -1) {\n        return [\n          ['flexGrow', 0],\n          ['flexShrink', 1],\n          ['flexBasis', 'auto'],\n        ]\n      }\n      // normalizing to better align with native\n      // see spec for flex shorthand https://developer.mozilla.org/en-US/docs/Web/CSS/flex\n      if (value >= 0) {\n        return [\n          ['flexGrow', value],\n          ['flexShrink', 1],\n        ]\n      }\n      return\n    }\n\n    // web only\n    switch (key) {\n      case 'aspectRatio': {\n        return [[key, value.toString()]]\n      }\n\n      case 'textAlignVertical': {\n        return [['verticalAlign', value === 'center' ? 'middle' : value]]\n      }\n\n      case 'textDecorationLine': {\n        return [['textDecorationLine', value]]\n      }\n\n      case 'writingDirection': {\n        return [['direction', value]]\n      }\n    }\n  }\n\n  const longKey = STYLE_SHORT_FORM_EXPANSIONS[key]\n  if (longKey) {\n    return longKey.map((key) => {\n      return [key, value]\n    })\n  }\n}\n\nconst STYLE_SHORT_FORM_EXPANSIONS: Record<string, string[]> = {\n  borderColor: [\n    'borderTopColor',\n    'borderRightColor',\n    'borderBottomColor',\n    'borderLeftColor',\n  ],\n  borderRadius: [\n    'borderTopLeftRadius',\n    'borderTopRightRadius',\n    'borderBottomRightRadius',\n    'borderBottomLeftRadius',\n  ],\n  borderWidth: [\n    'borderTopWidth',\n    'borderRightWidth',\n    'borderBottomWidth',\n    'borderLeftWidth',\n  ],\n  margin: ['marginTop', 'marginRight', 'marginBottom', 'marginLeft'],\n  marginHorizontal: ['marginRight', 'marginLeft'],\n  marginVertical: ['marginTop', 'marginBottom'],\n  overscrollBehavior: ['overscrollBehaviorX', 'overscrollBehaviorY'],\n  padding: ['paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft'],\n  paddingHorizontal: ['paddingRight', 'paddingLeft'],\n  paddingVertical: ['paddingTop', 'paddingBottom'],\n  ...(isWeb && {\n    // react-native only supports borderStyle\n    borderStyle: [\n      'borderTopStyle',\n      'borderRightStyle',\n      'borderBottomStyle',\n      'borderLeftStyle',\n    ],\n    // react-native doesn't support X / Y\n    overflow: ['overflowX', 'overflowY'],\n  }),\n}\n"],
+  "mappings": "AAKA,SAAS,aAAa;AAEf,SAAS,YAAY,KAAa,OAAY;AACnD,MAAI,QAAQ,IAAI,mBAAmB,OAAO;AACxC,QAAI,QAAQ,QAAQ;AAGlB,UAAI,SAAS,IAAI;AACf,eAAO;AAAA,UACL,CAAC,YAAY,CAAC;AAAA,UACd,CAAC,cAAc,CAAC;AAAA,UAChB,CAAC,aAAa,MAAM;AAAA,QACtB;AAAA,MACF;AAGA,UAAI,SAAS,GAAG;AACd,eAAO;AAAA,UACL,CAAC,YAAY,KAAK;AAAA,UAClB,CAAC,cAAc,CAAC;AAAA,QAClB;AAAA,MACF;AACA;AAAA,IACF;AAGA,YAAQ;AAAA,WACD,eAAe;AAClB,eAAO,CAAC,CAAC,KAAK,MAAM,SAAS,CAAC,CAAC;AAAA,MACjC;AAAA,WAEK,qBAAqB;AACxB,eAAO,CAAC,CAAC,iBAAiB,UAAU,WAAW,WAAW,KAAK,CAAC;AAAA,MAClE;AAAA,WAEK,sBAAsB;AACzB,eAAO,CAAC,CAAC,sBAAsB,KAAK,CAAC;AAAA,MACvC;AAAA,WAEK,oBAAoB;AACvB,eAAO,CAAC,CAAC,aAAa,KAAK,CAAC;AAAA,MAC9B;AAAA;AAAA,EAEJ;AAEA,QAAM,UAAU,4BAA4B;AAC5C,MAAI,SAAS;AACX,WAAO,QAAQ,IAAI,CAACA,SAAQ;AAC1B,aAAO,CAACA,MAAK,KAAK;AAAA,IACpB,CAAC;AAAA,EACH;AACF;AAEA,MAAM,8BAAwD;AAAA,EAC5D,aAAa;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,cAAc;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,aAAa;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,QAAQ,CAAC,aAAa,eAAe,gBAAgB,YAAY;AAAA,EACjE,kBAAkB,CAAC,eAAe,YAAY;AAAA,EAC9C,gBAAgB,CAAC,aAAa,cAAc;AAAA,EAC5C,oBAAoB,CAAC,uBAAuB,qBAAqB;AAAA,EACjE,SAAS,CAAC,cAAc,gBAAgB,iBAAiB,aAAa;AAAA,EACtE,mBAAmB,CAAC,gBAAgB,aAAa;AAAA,EACjD,iBAAiB,CAAC,cAAc,eAAe;AAAA,EAC/C,GAAI,SAAS;AAAA,IAEX,aAAa;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IAEA,UAAU,CAAC,aAAa,WAAW;AAAA,EACrC;AACF;",
   "names": ["key"]
 }

package/dist/esm/helpers/extendStaticConfig.js

@@ -2,7 +2,7 @@ import { stylePropsView } from "@tamagui/helpers";
 import { createPropMapper } from "./createPropMapper";
 import { mergeProps } from "./mergeProps";
 function extendStaticConfig(config, parent) {
-  if (!parent || !("staticConfig" in parent)) {
+  if (!(parent && "staticConfig" in parent)) {
     return parseStaticConfig(config);
   }
   const parentStaticConf = parent.staticConfig;

package/dist/esm/helpers/extendStaticConfig.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/extendStaticConfig.ts"],
-  "sourcesContent": ["import { stylePropsView } from '@tamagui/helpers'\n\nimport { StaticConfig, StaticConfigParsed, StylableComponent } from '../types'\nimport { createPropMapper } from './createPropMapper'\nimport { mergeProps } from './mergeProps'\n\nexport function extendStaticConfig(config: Partial<StaticConfig>, parent?: StylableComponent) {\n  if (!parent || !('staticConfig' in parent)) {\n    return parseStaticConfig(config)\n  }\n\n  const parentStaticConf = parent.staticConfig as StaticConfig\n  const variants = {\n    ...parentStaticConf.variants,\n  }\n\n  // merge variants... can we type this?\n  if (config.variants) {\n    for (const key in config.variants) {\n      if (variants[key]) {\n        variants[key] = {\n          ...variants[key],\n          ...config.variants[key],\n        }\n      } else {\n        variants[key] = config.variants[key]\n      }\n    }\n  }\n\n  // include our own\n  const parentNames = [...(parentStaticConf.parentNames || [])]\n  if (parentStaticConf.componentName) {\n    parentNames.push(parentStaticConf.componentName)\n  }\n\n  const deoptProps = config.deoptProps || new Set<string>()\n  // deoptProps.add('style')\n\n  return parseStaticConfig({\n    ...parentStaticConf,\n    ...config,\n    deoptProps,\n    variants,\n    parentNames,\n    validStyles: config.validStyles\n      ? {\n          ...parentStaticConf.validStyles,\n          ...config.validStyles,\n        }\n      : parentStaticConf.validStyles || stylePropsView,\n    defaultProps: mergeProps(\n      {\n        ...parentStaticConf.defaultProps,\n        ...parentStaticConf.defaultVariants,\n      },\n      {\n        ...config.defaultProps,\n        ...config.defaultVariants,\n      }\n    )[0],\n  })\n}\n\nexport const parseStaticConfig = (config: Partial<StaticConfig>): StaticConfigParsed => {\n  const parsed = {\n    defaultProps: {},\n    ...config,\n    parsed: true,\n  } as const\n  return {\n    ...parsed,\n    propMapper: createPropMapper(parsed as StaticConfigParsed),\n  }\n}\n"],
-  "mappings": "AAAA,SAAS,sBAAsB;AAG/B,SAAS,wBAAwB;AACjC,SAAS,kBAAkB;AAEpB,SAAS,mBAAmB,QAA+B,QAA4B;AAC5F,MAAI,CAAC,UAAU,EAAE,kBAAkB,SAAS;AAC1C,WAAO,kBAAkB,MAAM;AAAA,EACjC;AAEA,QAAM,mBAAmB,OAAO;AAChC,QAAM,WAAW;AAAA,IACf,GAAG,iBAAiB;AAAA,EACtB;AAGA,MAAI,OAAO,UAAU;AACnB,eAAW,OAAO,OAAO,UAAU;AACjC,UAAI,SAAS,MAAM;AACjB,iBAAS,OAAO;AAAA,UACd,GAAG,SAAS;AAAA,UACZ,GAAG,OAAO,SAAS;AAAA,QACrB;AAAA,MACF,OAAO;AACL,iBAAS,OAAO,OAAO,SAAS;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAGA,QAAM,cAAc,CAAC,GAAI,iBAAiB,eAAe,CAAC,CAAE;AAC5D,MAAI,iBAAiB,eAAe;AAClC,gBAAY,KAAK,iBAAiB,aAAa;AAAA,EACjD;AAEA,QAAM,aAAa,OAAO,cAAc,oBAAI,IAAY;AAGxD,SAAO,kBAAkB;AAAA,IACvB,GAAG;AAAA,IACH,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa,OAAO,cAChB;AAAA,MACE,GAAG,iBAAiB;AAAA,MACpB,GAAG,OAAO;AAAA,IACZ,IACA,iBAAiB,eAAe;AAAA,IACpC,cAAc;AAAA,MACZ;AAAA,QACE,GAAG,iBAAiB;AAAA,QACpB,GAAG,iBAAiB;AAAA,MACtB;AAAA,MACA;AAAA,QACE,GAAG,OAAO;AAAA,QACV,GAAG,OAAO;AAAA,MACZ;AAAA,IACF,EAAE;AAAA,EACJ,CAAC;AACH;AAEO,MAAM,oBAAoB,CAAC,WAAsD;AACtF,QAAM,SAAS;AAAA,IACb,cAAc,CAAC;AAAA,IACf,GAAG;AAAA,IACH,QAAQ;AAAA,EACV;AACA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,YAAY,iBAAiB,MAA4B;AAAA,EAC3D;AACF;",
+  "sourcesContent": ["import { stylePropsView } from '@tamagui/helpers'\n\nimport { StaticConfig, StaticConfigParsed, StylableComponent } from '../types'\nimport { createPropMapper } from './createPropMapper'\nimport { mergeProps } from './mergeProps'\n\nexport function extendStaticConfig(\n  config: Partial<StaticConfig>,\n  parent?: StylableComponent\n) {\n  if (!(parent && 'staticConfig' in parent)) {\n    return parseStaticConfig(config)\n  }\n\n  const parentStaticConf = parent.staticConfig as StaticConfig\n  const variants = {\n    ...parentStaticConf.variants,\n  }\n\n  // merge variants... can we type this?\n  if (config.variants) {\n    for (const key in config.variants) {\n      if (variants[key]) {\n        variants[key] = {\n          ...variants[key],\n          ...config.variants[key],\n        }\n      } else {\n        variants[key] = config.variants[key]\n      }\n    }\n  }\n\n  // include our own\n  const parentNames = [...(parentStaticConf.parentNames || [])]\n  if (parentStaticConf.componentName) {\n    parentNames.push(parentStaticConf.componentName)\n  }\n\n  const deoptProps = config.deoptProps || new Set<string>()\n  // deoptProps.add('style')\n\n  return parseStaticConfig({\n    ...parentStaticConf,\n    ...config,\n    deoptProps,\n    variants,\n    parentNames,\n    validStyles: config.validStyles\n      ? {\n          ...parentStaticConf.validStyles,\n          ...config.validStyles,\n        }\n      : parentStaticConf.validStyles || stylePropsView,\n    defaultProps: mergeProps(\n      {\n        ...parentStaticConf.defaultProps,\n        ...parentStaticConf.defaultVariants,\n      },\n      {\n        ...config.defaultProps,\n        ...config.defaultVariants,\n      }\n    )[0],\n  })\n}\n\nexport const parseStaticConfig = (config: Partial<StaticConfig>): StaticConfigParsed => {\n  const parsed = {\n    defaultProps: {},\n    ...config,\n    parsed: true,\n  } as const\n  return {\n    ...parsed,\n    propMapper: createPropMapper(parsed as StaticConfigParsed),\n  }\n}\n"],
+  "mappings": "AAAA,SAAS,sBAAsB;AAG/B,SAAS,wBAAwB;AACjC,SAAS,kBAAkB;AAEpB,SAAS,mBACd,QACA,QACA;AACA,MAAI,EAAE,UAAU,kBAAkB,SAAS;AACzC,WAAO,kBAAkB,MAAM;AAAA,EACjC;AAEA,QAAM,mBAAmB,OAAO;AAChC,QAAM,WAAW;AAAA,IACf,GAAG,iBAAiB;AAAA,EACtB;AAGA,MAAI,OAAO,UAAU;AACnB,eAAW,OAAO,OAAO,UAAU;AACjC,UAAI,SAAS,MAAM;AACjB,iBAAS,OAAO;AAAA,UACd,GAAG,SAAS;AAAA,UACZ,GAAG,OAAO,SAAS;AAAA,QACrB;AAAA,MACF,OAAO;AACL,iBAAS,OAAO,OAAO,SAAS;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAGA,QAAM,cAAc,CAAC,GAAI,iBAAiB,eAAe,CAAC,CAAE;AAC5D,MAAI,iBAAiB,eAAe;AAClC,gBAAY,KAAK,iBAAiB,aAAa;AAAA,EACjD;AAEA,QAAM,aAAa,OAAO,cAAc,oBAAI,IAAY;AAGxD,SAAO,kBAAkB;AAAA,IACvB,GAAG;AAAA,IACH,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa,OAAO,cAChB;AAAA,MACE,GAAG,iBAAiB;AAAA,MACpB,GAAG,OAAO;AAAA,IACZ,IACA,iBAAiB,eAAe;AAAA,IACpC,cAAc;AAAA,MACZ;AAAA,QACE,GAAG,iBAAiB;AAAA,QACpB,GAAG,iBAAiB;AAAA,MACtB;AAAA,MACA;AAAA,QACE,GAAG,OAAO;AAAA,QACV,GAAG,OAAO;AAAA,MACZ;AAAA,IACF,EAAE;AAAA,EACJ,CAAC;AACH;AAEO,MAAM,oBAAoB,CAAC,WAAsD;AACtF,QAAM,SAAS;AAAA,IACb,cAAc,CAAC;AAAA,IACf,GAAG;AAAA,IACH,QAAQ;AAAA,EACV;AACA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,YAAY,iBAAiB,MAA4B;AAAA,EAC3D;AACF;",
   "names": []
 }

package/dist/esm/helpers/getExpandedShorthands.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/getExpandedShorthands.ts"],
-  "sourcesContent": ["import { getConfig } from '../config'\nimport { Shorthands } from '../types'\n\nexport function getExpandedShorthands<A extends Object>(props: A): Omit<A, keyof Shorthands> {\n  const shorthands = getConfig().shorthands\n  if (!shorthands) {\n    return props\n  }\n  const res: A = {} as any\n  for (const key in props) {\n    // @ts-ignore\n    res[shorthands[key] || key] = props[key]\n  }\n  return res\n}\n"],
-  "mappings": "AAAA,SAAS,iBAAiB;AAGnB,SAAS,sBAAwC,OAAqC;AAC3F,QAAM,aAAa,UAAU,EAAE;AAC/B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AACA,QAAM,MAAS,CAAC;AAChB,aAAW,OAAO,OAAO;AAEvB,QAAI,WAAW,QAAQ,OAAO,MAAM;AAAA,EACtC;AACA,SAAO;AACT;",
+  "sourcesContent": ["import { getConfig } from '../config'\nimport { Shorthands } from '../types'\n\nexport function getExpandedShorthands<A extends Object>(\n  props: A\n): Omit<A, keyof Shorthands> {\n  const shorthands = getConfig().shorthands\n  if (!shorthands) {\n    return props\n  }\n  const res: A = {} as any\n  for (const key in props) {\n    // @ts-ignore\n    res[shorthands[key] || key] = props[key]\n  }\n  return res\n}\n"],
+  "mappings": "AAAA,SAAS,iBAAiB;AAGnB,SAAS,sBACd,OAC2B;AAC3B,QAAM,aAAa,UAAU,EAAE;AAC/B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AACA,QAAM,MAAS,CAAC;AAChB,aAAW,OAAO,OAAO;AAEvB,QAAI,WAAW,QAAQ,OAAO,MAAM;AAAA,EACtC;AACA,SAAO;AACT;",
   "names": []
 }

package/dist/esm/helpers/getSize.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/getSize.ts"],
-  "sourcesContent": ["import { getTokens } from '../config'\nimport { SizeTokens, SpaceTokens } from '../types'\n\nexport const getSize = (size?: SizeTokens | undefined, shift = 0, bounds = [0]) => {\n  return stepTokenUpOrDown(getTokens(true).size, size, shift, bounds)\n}\n\nexport const stepTokenUpOrDown = (\n  tokens: Object,\n  current?: SizeTokens | SpaceTokens | string,\n  shift = 0,\n  bounds = [0]\n) => {\n  const sizeNames = Object.keys(tokens)\n  const currentKeyNum = (typeof current === 'string' ? current.replace('$', '') : current) || '4'\n  const nextKeyName = `$${+currentKeyNum + shift}`\n  const min = bounds[0] ?? 0\n  const max = bounds[1] ?? sizeNames.length - 1\n  const index = Math.min(max, Math.max(min, sizeNames.indexOf(nextKeyName)))\n  const key = sizeNames[index]\n  return tokens[key] || tokens['$4']\n}\n"],
-  "mappings": "AAAA,SAAS,iBAAiB;AAGnB,MAAM,UAAU,CAAC,MAA+B,QAAQ,GAAG,SAAS,CAAC,CAAC,MAAM;AACjF,SAAO,kBAAkB,UAAU,IAAI,EAAE,MAAM,MAAM,OAAO,MAAM;AACpE;AAEO,MAAM,oBAAoB,CAC/B,QACA,SACA,QAAQ,GACR,SAAS,CAAC,CAAC,MACR;AACH,QAAM,YAAY,OAAO,KAAK,MAAM;AACpC,QAAM,iBAAiB,OAAO,YAAY,WAAW,QAAQ,QAAQ,KAAK,EAAE,IAAI,YAAY;AAC5F,QAAM,cAAc,IAAI,CAAC,gBAAgB;AACzC,QAAM,MAAM,OAAO,MAAM;AACzB,QAAM,MAAM,OAAO,MAAM,UAAU,SAAS;AAC5C,QAAM,QAAQ,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,UAAU,QAAQ,WAAW,CAAC,CAAC;AACzE,QAAM,MAAM,UAAU;AACtB,SAAO,OAAO,QAAQ,OAAO;AAC/B;",
+  "sourcesContent": ["import { getTokens } from '../config'\nimport { SizeTokens, SpaceTokens } from '../types'\n\nexport const getSize = (size?: SizeTokens | undefined, shift = 0, bounds = [0]) => {\n  return stepTokenUpOrDown(getTokens(true).size, size, shift, bounds)\n}\n\nexport const stepTokenUpOrDown = (\n  tokens: Object,\n  current?: SizeTokens | SpaceTokens | string,\n  shift = 0,\n  bounds = [0]\n) => {\n  const sizeNames = Object.keys(tokens)\n  const currentKeyNum =\n    (typeof current === 'string' ? current.replace('$', '') : current) || '4'\n  const nextKeyName = `$${+currentKeyNum + shift}`\n  const min = bounds[0] ?? 0\n  const max = bounds[1] ?? sizeNames.length - 1\n  const index = Math.min(max, Math.max(min, sizeNames.indexOf(nextKeyName)))\n  const key = sizeNames[index]\n  return tokens[key] || tokens['$4']\n}\n"],
+  "mappings": "AAAA,SAAS,iBAAiB;AAGnB,MAAM,UAAU,CAAC,MAA+B,QAAQ,GAAG,SAAS,CAAC,CAAC,MAAM;AACjF,SAAO,kBAAkB,UAAU,IAAI,EAAE,MAAM,MAAM,OAAO,MAAM;AACpE;AAEO,MAAM,oBAAoB,CAC/B,QACA,SACA,QAAQ,GACR,SAAS,CAAC,CAAC,MACR;AACH,QAAM,YAAY,OAAO,KAAK,MAAM;AACpC,QAAM,iBACH,OAAO,YAAY,WAAW,QAAQ,QAAQ,KAAK,EAAE,IAAI,YAAY;AACxE,QAAM,cAAc,IAAI,CAAC,gBAAgB;AACzC,QAAM,MAAM,OAAO,MAAM;AACzB,QAAM,MAAM,OAAO,MAAM,UAAU,SAAS;AAC5C,QAAM,QAAQ,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,UAAU,QAAQ,WAAW,CAAC,CAAC;AACzE,QAAM,MAAM,UAAU;AACtB,SAAO,OAAO,QAAQ,OAAO;AAC/B;",
   "names": []
 }

package/dist/esm/helpers/getSplitStyles.js

@@ -1,4 +1,10 @@
-import { isClient, isRSC, isServer, isWeb, useIsomorphicLayoutEffect } from "@tamagui/constants";
+import {
+  isClient,
+  isRSC,
+  isServer,
+  isWeb,
+  useIsomorphicLayoutEffect
+} from "@tamagui/constants";
 import {
   stylePropsText,
   stylePropsTransform,
@@ -163,7 +169,7 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
     languageContext
   };
   if (process.env.NODE_ENV === "development" && debug === "verbose") {
-    console.groupCollapsed(`getSplitStyles`);
+    console.groupCollapsed("getSplitStyles");
     console.log(staticConfig, { shouldDoClasses, state, IS_STATIC });
     console.groupEnd();
   }
@@ -192,7 +198,7 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
         mergeClassName(transforms, classNames, fullKey, cn, isMediaOrPseudo);
       } else {
         if (cn) {
-          className += " " + cn;
+          className += ` ${cn}`;
         }
       }
     }
@@ -362,7 +368,7 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
     }
     let isMedia = isMediaKey(keyInit);
     let isPseudo = validPseudoKeys[keyInit];
-    if (!isMedia && !isPseudo && !(variants == null ? void 0 : variants[keyInit]) && !validStyleProps[keyInit] && !shorthands[keyInit]) {
+    if (!(isMedia || isPseudo || (variants == null ? void 0 : variants[keyInit]) || validStyleProps[keyInit] || shorthands[keyInit])) {
       if (isWeb && keyInit.includes("ccessibility")) {
         continue;
       }
@@ -373,13 +379,24 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
     if (process.env.NODE_ENV === "development" && debug === "verbose") {
       console.groupCollapsed("  \u{1F539} styles", keyInit, valInit);
     }
-    const expanded = isMedia || isPseudo ? [[keyInit, valInit]] : propMapper(keyInit, valInit, theme, props, state, languageContext, void 0, debug);
+    const expanded = isMedia || isPseudo ? [[keyInit, valInit]] : propMapper(
+      keyInit,
+      valInit,
+      theme,
+      props,
+      state,
+      languageContext,
+      void 0,
+      debug
+    );
     if (!fontFamily) {
       fontFamily = getPropMappedFontFamily(expanded);
     }
     if (process.env.NODE_ENV === "development" && debug === "verbose") {
       if (!isServer && isWeb) {
-        console.log("expanded", expanded, "\nusedKeys", usedKeys, "\ncurrent", { ...style });
+        console.log("expanded", expanded, "\nusedKeys", usedKeys, "\ncurrent", {
+          ...style
+        });
       }
       console.groupEnd();
     }
@@ -401,7 +418,13 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
       if (isPseudo) {
         if (!val)
           continue;
-        const pseudoStyleObject = getSubStyle(styleState, key, val, true, state.noClassNames);
+        const pseudoStyleObject = getSubStyle(
+          styleState,
+          key,
+          val,
+          true,
+          state.noClassNames
+        );
         const descriptor = pseudoDescriptors[key];
         const isEnter = descriptor.name === "enter";
         const isExit = descriptor.name === "exit";
@@ -469,7 +492,13 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
         );
         const mediaKeyShort = key.slice(1);
         if (process.env.NODE_ENV === "development" && debug === "verbose") {
-          console.log(`  \u{1F4FA} ${key}`, mediaState[mediaKeyShort], { key, mediaStyle, props, shouldDoClasses, mediaState: { ...mediaState } });
+          console.log(`  \u{1F4FA} ${key}`, mediaState[mediaKeyShort], {
+            key,
+            mediaStyle,
+            props,
+            shouldDoClasses,
+            mediaState: { ...mediaState }
+          });
         }
         if ("space" in mediaStyle) {
           hasMedia = "space";
@@ -494,14 +523,24 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
           }
         } else if (mediaState[mediaKeyShort]) {
           for (const subKey in mediaStyle) {
-            const importance = getMediaImportanceIfMoreImportant(mediaKeyShort, subKey, usedKeys);
+            const importance = getMediaImportanceIfMoreImportant(
+              mediaKeyShort,
+              subKey,
+              usedKeys
+            );
             if (importance === null)
               continue;
             if (subKey === "space") {
               space = valInit.space;
               continue;
             }
-            mergeMediaByImportance(style, mediaKeyShort, subKey, mediaStyle[subKey], usedKeys);
+            mergeMediaByImportance(
+              style,
+              mediaKeyShort,
+              subKey,
+              mediaStyle[subKey],
+              usedKeys
+            );
             if (key === "fontFamily") {
               fontFamily = mediaStyle[key];
             }
@@ -521,7 +560,7 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
         mergeStyle(styleState, key, val);
         continue;
       }
-      if (!variants || !(key in variants)) {
+      if (!(variants && key in variants)) {
         if (!skipProps[key]) {
           viewProps[key] = val;
           usedKeys[key] = 1;
@@ -535,7 +574,11 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
   }
   if (flatTransforms) {
     if (process.env.NODE_ENV === "development" && debug) {
-      console.log(`Merging flat transforms, transform before`, [...style.transform || []], flatTransforms);
+      console.log(
+        "Merging flat transforms, transform before",
+        [...style.transform || []],
+        flatTransforms
+      );
     }
     mergeTransforms(style, flatTransforms, true);
   }
@@ -612,7 +655,14 @@ const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, la
   if (process.env.NODE_ENV === "development" && debug === "verbose") {
     if (isDevTools) {
       console.groupCollapsed("  \u{1F539} styles =>");
-      const logs = { transforms, viewProps, state, rulesToInsert, parentSplitStyles, flatTransforms };
+      const logs = {
+        transforms,
+        viewProps,
+        state,
+        rulesToInsert,
+        parentSplitStyles,
+        flatTransforms
+      };
       for (const key in { ...result, ...logs }) {
         console.log(key, logs[key]);
       }