@kanso-labs/react-native-kanso-ui 0.3.1 → 0.5.0

package/dist/row/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","names":["StyleSheet","ResolvedTheme","withOpacity","themedStyles","RowVariant","rowStylesOf","colors","sizing","spacing","create","base","alignItems","flexDirection","gap","lg","paddingHorizontal","paddingVertical","md","list","minHeight","rowSm","main","flexGrow","flexShrink","xxs","minWidth","menu","rowXs","muted","color","onSurfaceVariant","selectedList","backgroundColor","primaryContainer","selectedMenu","tertiaryContainer","threeLine","rowLg","twoLine","rowMd","rowStyles","ring","outlineOffset","slot","justifyContent","rowContentColor","stateLayerOpacity","isDisabled","isSelected","variant","onSurface","disabledContent","onTertiaryContainer","onPrimaryContainer"],"sources":["../../src/row/styles.ts"],"sourcesContent":["import { StyleSheet } from 'react-native'\n\nimport type { ResolvedTheme } from '../theme/scope'\n\nimport { withOpacity } from '../theme/color'\nimport { themedStyles } from '../theme/styles'\n\n// The row every list and menu item draws, as web's src/row draws it: the\n// lists page's 16dp inline and 12dp block padding, 16dp between the slots\n// and the text, and a height per spec page and line count. Each height is a\n// `minHeight`, since the lines inside are set in type roles whose sizes are\n// tokens, and a larger OS text size grows the row rather than clipping it.\n\n/** Which spec page's row this is: the lists page's or the menus page's. */\ntype RowVariant = 'list' | 'menu'\n\nconst rowStylesOf = themedStyles(({ colors, sizing, spacing }: ResolvedTheme) =>\n  StyleSheet.create({\n    base: {\n      alignItems: 'center',\n      flexDirection: 'row',\n      gap: spacing.lg,\n      paddingHorizontal: spacing.lg,\n      paddingVertical: spacing.md,\n    },\n    // The lists page's one-line item.\n    list: {\n      minHeight: sizing.rowSm,\n    },\n    // The headline and the lines beside it take what the slots leave and\n    // wrap past it, so a long one never runs under the trailing slot.\n    // `minWidth: 0` is for React Native Web, where a text in a row keeps\n    // CSS's automatic minimum, the width of its longest word.\n    main: {\n      flexGrow: 1,\n      flexShrink: 1,\n      gap: spacing.xxs,\n      minWidth: 0,\n    },\n    // The menus page's item.\n    menu: {\n      minHeight: sizing.rowXs,\n    },\n    muted: {\n      color: colors.onSurfaceVariant,\n    },\n    selectedList: {\n      backgroundColor: colors.primaryContainer,\n    },\n    selectedMenu: {\n      backgroundColor: colors.tertiaryContainer,\n    },\n    // The three-line item, the only one whose slots move: they are held\n    // level with the overline rather than centred on the three lines.\n    threeLine: {\n      alignItems: 'flex-start',\n      minHeight: sizing.rowLg,\n    },\n    twoLine: {\n      minHeight: sizing.rowMd,\n    },\n  }),\n)\n\nconst rowStyles = StyleSheet.create({\n  // The focus ring, drawn inside the row as web's is, so a container that\n  // clips its rows, such as a menu's surface, leaves the whole ring showing.\n  ring: {\n    outlineOffset: -2,\n  },\n  slot: {\n    alignItems: 'center',\n    flexShrink: 0,\n    justifyContent: 'center',\n  },\n})\n\n/**\n * The colour a row's headline, slots and feedback are drawn in: on surface,\n * the selected container's own on-colour, or on surface faded to the\n * disabled content opacity, which wins over the selected one.\n */\nfunction rowContentColor(\n  { colors, stateLayerOpacity }: ResolvedTheme,\n  {\n    isDisabled = false,\n    isSelected = false,\n    variant = 'list',\n  }: {\n    readonly isDisabled?: boolean\n    readonly isSelected?: boolean\n    readonly variant?: RowVariant\n  },\n): string {\n  if (isDisabled) {\n    return withOpacity(colors.onSurface, stateLayerOpacity.disabledContent)\n  }\n  if (isSelected) {\n    return variant === 'menu'\n      ? colors.onTertiaryContainer\n      : colors.onPrimaryContainer\n  }\n  return colors.onSurface\n}\n\nexport type { RowVariant }\n\nexport { rowContentColor, rowStyles, rowStylesOf }\n"],"mappings":";;;;AAgBA,MAAMK,cAAcF,cAAc,EAAEG,QAAQC,QAAQC,cAClDR,WAAWS,OAAO;CAChBC,MAAM;EACJC,YAAY;EACZC,eAAe;EACfC,KAAKL,QAAQM;EACbC,mBAAmBP,QAAQM;EAC3BE,iBAAiBR,QAAQS;CAC3B;CAEAC,MAAM,EACJC,WAAWZ,OAAOa,MACpB;CAKAC,MAAM;EACJC,UAAU;EACVC,YAAY;EACZV,KAAKL,QAAQgB;EACbC,UAAU;CACZ;CAEAC,MAAM,EACJP,WAAWZ,OAAOoB,MACpB;CACAC,OAAO,EACLC,OAAOvB,OAAOwB,iBAChB;CACAC,cAAc,EACZC,iBAAiB1B,OAAO2B,iBAC1B;CACAC,cAAc,EACZF,iBAAiB1B,OAAO6B,kBAC1B;CAGAC,WAAW;EACTzB,YAAY;EACZQ,WAAWZ,OAAO8B;CACpB;CACAC,SAAS,EACPnB,WAAWZ,OAAOgC,MACpB;AACF,CAAC,CACH;AAEA,MAAMC,YAAYxC,WAAWS,OAAO;CAGlCgC,MAAM,EACJC,eAAe,GACjB;CACAC,MAAM;EACJhC,YAAY;EACZY,YAAY;EACZqB,gBAAgB;CAClB;AACF,CAAC;;;;;;AAOD,SAASC,gBACP,EAAEvC,QAAQwC,qBACV,EACEC,aAAa,OACbC,aAAa,OACbC,UAAU,UAMJ;CACR,IAAIF,YACF,OAAO7C,YAAYI,OAAO4C,WAAWJ,kBAAkBK,eAAe;CAExE,IAAIH,YACF,OAAOC,YAAY,SACf3C,OAAO8C,sBACP9C,OAAO+C;CAEb,OAAO/C,OAAO4C;AAChB"}

package/dist/theme/scope.js

@@ -1,8 +1,8 @@
 import { dark, light } from "../tokens/defaults.js";
 import { resolveTheme } from "./resolve.js";
 import { c } from "react/compiler-runtime";
-import { useColorScheme } from "react-native";
 import { createContext, use } from "react";
+import { useColorScheme } from "react-native";
 //#region src/theme/scope.ts
 const DEFAULTS = {
 	dark,

package/dist/theme-scope.d.ts

@@ -1,6 +1,6 @@
 import { KuiTheme } from "./tokens/defaults.js";
-import { View, ViewProps } from "react-native";
 import { ComponentRef, Ref } from "react";
+import { View, ViewProps } from "react-native";
 //#region src/theme-scope.d.ts
 type ThemeScopeProps = ViewProps & {
   readonly ref?: Ref<ComponentRef<typeof View>>;

package/dist/theme-scope.js

@@ -2,9 +2,9 @@ import { ScopeContext, merged, scopeFor, useScope } from "./theme/scope.js";
 import { themedStyles } from "./theme/styles.js";
 import { OverlayHost, OverlayHostContext } from "./overlay/host.js";
 import { c } from "react/compiler-runtime";
-import { StyleSheet, View } from "react-native";
 import { use } from "react";
 import { jsx } from "react/jsx-runtime";
+import { StyleSheet, View } from "react-native";
 //#region src/theme-scope.tsx
 const stylesOf = themedStyles(({ colors }) => StyleSheet.create({ pinned: { backgroundColor: colors.surface } }));
 /**

package/dist/typography/fonts.js

@@ -1,6 +1,6 @@
 import { c } from "react/compiler-runtime";
-import { Platform } from "react-native";
 import { useSyncExternalStore } from "react";
+import { Platform } from "react-native";
 //#region src/typography/fonts.ts
 let registry;
 let loading;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kanso-labs/react-native-kanso-ui",
-  "version": "0.3.1",
+  "version": "0.5.0",
   "description": "Kanso UI's Material Design components for React Native, themed through the same --kui-* design tokens as the web library",
   "keywords": [
     "react-native",
@@ -61,8 +61,8 @@
     "@commitlint/config-conventional": "21.2.3",
     "@eslint/js": "10.0.1",
     "@jest/globals": "29.7.0",
-    "@kanso-labs/kanso-ui": "0.43.4",
-    "@kanso-labs/unplugin-style-dictionary": "0.10.31",
+    "@kanso-labs/kanso-ui": "0.43.5",
+    "@kanso-labs/unplugin-style-dictionary": "0.10.33",
     "@react-native/babel-preset": "0.88.0",
     "@react-native/jest-preset": "0.88.0",
     "@rolldown/plugin-babel": "0.2.4",
@@ -76,7 +76,7 @@
     "@types/react": "19.3.0",
     "@vitest/browser-playwright": "5.0.5",
     "babel-plugin-react-compiler": "1.0.0",
-    "eslint": "10.12.0",
+    "eslint": "10.13.0",
     "eslint-plugin-oxlint": "1.88.0",
     "eslint-plugin-perfectionist": "5.12.1",
     "eslint-plugin-react-hooks": "7.1.1",
@@ -93,10 +93,10 @@
     "react": "19.3.1",
     "react-dom": "19.3.1",
     "react-native": "0.88.0",
-    "react-native-gesture-handler": "2.33.0",
+    "react-native-gesture-handler": "3.4.0",
     "react-native-reanimated": "4.7.1",
     "react-native-safe-area-context": "5.10.1",
-    "react-native-svg": "15.15.5",
+    "react-native-svg": "15.16.0",
     "react-native-web": "0.21.4",
     "react-native-worklets": "0.13.0",
     "storybook": "10.6.2",