@xsolla/xui-core 0.74.0 → 0.75.0

package/index.js.flow

@@ -0,0 +1,1992 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+* @flow
+ */
+
+
+
+import React from 'react';
+declare var background: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var content: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var border: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var overlay: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var layer: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var control: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var darkTheme: undefined: /* NO PRINT IMPLEMENTED: ObjectLiteralExpression */ any
+;declare var colors: {
+dark: {
+background: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},...
+},
+content: {
+primary: string,
+secondary: string,
+tertiary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},
+on: {
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+static: {
+light: string,
+dark: string,...
+},...
+},
+border: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+overlay: {
+mono: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+layer: {
+scrim: string,
+float: string,...
+},
+control: {
+brand: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderPress: string,
+borderDisable: string,
+text: {
+primary: string,
+secondary: string,
+disable: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+brandExtra: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+alert: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+mono: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+input: {
+bg: string,
+bgHover: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderDisable: string,
+text: string,
+textDisable: string,
+placeholder: string,...
+},
+focus: {
+bg: string,...
+},
+check: {
+bg: string,
+bgHover: string,
+bgDisable: string,...
+},
+faint: {
+bg: string,
+bgHover: string,
+border: string,
+borderHover: string,...
+},
+switch: {
+bg: string,
+bgHover: string,...
+},
+segmented: {
+bg: string,
+bgHover: string,
+bgActive: string,
+textActive: string,...
+},
+text: {
+primary: string,
+secondary: string,
+faint: string,
+disable: string,...
+},
+link: {
+primary: string,
+primaryHover: string,
+secondary: string,
+secondaryHover: string,...
+},...
+},...
+},
+light: {
+background: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},...
+},
+content: {
+primary: string,
+secondary: string,
+tertiary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},
+on: {
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+static: {
+light: string,
+dark: string,...
+},...
+},
+border: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+overlay: {
+mono: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+layer: {
+scrim: string,
+float: string,...
+},
+control: {
+brand: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderPress: string,
+borderDisable: string,
+text: {
+primary: string,
+secondary: string,
+disable: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+brandExtra: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+alert: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+mono: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+input: {
+bg: string,
+bgHover: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderDisable: string,
+text: string,
+textDisable: string,
+placeholder: string,...
+},
+focus: {
+bg: string,...
+},
+check: {
+bg: string,
+bgHover: string,
+bgDisable: string,...
+},
+faint: {
+bg: string,
+bgHover: string,
+border: string,
+borderHover: string,...
+},
+switch: {
+bg: string,
+bgHover: string,...
+},
+segmented: {
+bg: string,
+bgHover: string,
+bgActive: string,
+textActive: string,...
+},
+text: {
+primary: string,
+secondary: string,
+faint: string,
+disable: string,...
+},
+link: {
+primary: string,
+primaryHover: string,
+secondary: string,
+secondaryHover: string,...
+},...
+},...
+},...
+};declare type ThemeColors = typeof darkTheme;declare var spacing: {
+xs: number,
+s: number,
+m: number,
+l: number,
+xl: number,...
+};declare var radius: {
+button: number,
+card: number,
+input: number,
+tagSmall: number,
+tagLarge: number,
+avatarSmall: number,
+avatarLarge: number,
+avatarCircle: number,...
+};declare var shadow: {
+active: string,
+surface: string,
+surfaceHover: string,
+popover: string,
+modal: string,...
+};declare var fonts: {
+primary: string,...
+};declare var typography: {
+button: {
+fontFamily: string,
+fontWeight: string,...
+},...
+};declare var isWeb: boolean;declare var isNative: boolean;declare var isIOS: boolean;declare var isAndroid: boolean;declare type ThemeMode = "dark" | "light";declare var themeConfig: (
+mode?: ThemeMode) => {
+colors: {
+background: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},...
+},
+content: {
+primary: string,
+secondary: string,
+tertiary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},
+on: {
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+static: {
+light: string,
+dark: string,...
+},...
+},
+border: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+overlay: {
+mono: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+layer: {
+scrim: string,
+float: string,...
+},
+control: {
+brand: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderPress: string,
+borderDisable: string,
+text: {
+primary: string,
+secondary: string,
+disable: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+brandExtra: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+alert: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+mono: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+input: {
+bg: string,
+bgHover: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderDisable: string,
+text: string,
+textDisable: string,
+placeholder: string,...
+},
+focus: {
+bg: string,...
+},
+check: {
+bg: string,
+bgHover: string,
+bgDisable: string,...
+},
+faint: {
+bg: string,
+bgHover: string,
+border: string,
+borderHover: string,...
+},
+switch: {
+bg: string,
+bgHover: string,...
+},
+segmented: {
+bg: string,
+bgHover: string,
+bgActive: string,
+textActive: string,...
+},
+text: {
+primary: string,
+secondary: string,
+faint: string,
+disable: string,...
+},
+link: {
+primary: string,
+primaryHover: string,
+secondary: string,
+secondaryHover: string,...
+},...
+},...
+} | {
+background: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},...
+},
+content: {
+primary: string,
+secondary: string,
+tertiary: string,
+inverse: string,
+brand: {
+primary: string,
+secondary: string,...
+},
+brandExtra: {
+primary: string,
+secondary: string,...
+},
+success: {
+primary: string,
+secondary: string,...
+},
+warning: {
+primary: string,
+secondary: string,...
+},
+alert: {
+primary: string,
+secondary: string,...
+},
+neutral: {
+primary: string,
+secondary: string,...
+},
+on: {
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+static: {
+light: string,
+dark: string,...
+},...
+},
+border: {
+primary: string,
+secondary: string,
+inverse: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+overlay: {
+mono: string,
+brand: string,
+brandExtra: string,
+success: string,
+warning: string,
+alert: string,
+neutral: string,...
+},
+layer: {
+scrim: string,
+float: string,...
+},
+control: {
+brand: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderPress: string,
+borderDisable: string,
+text: {
+primary: string,
+secondary: string,
+disable: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+brandExtra: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+alert: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+mono: {
+primary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},
+secondary: {
+bg: string,
+bgHover: string,
+bgPress: string,
+border: string,
+borderHover: string,
+borderPress: string,
+text: {
+primary: string,
+secondary: string,...
+},...
+},...
+},
+input: {
+bg: string,
+bgHover: string,
+bgDisable: string,
+border: string,
+borderHover: string,
+borderDisable: string,
+text: string,
+textDisable: string,
+placeholder: string,...
+},
+focus: {
+bg: string,...
+},
+check: {
+bg: string,
+bgHover: string,
+bgDisable: string,...
+},
+faint: {
+bg: string,
+bgHover: string,
+border: string,
+borderHover: string,...
+},
+switch: {
+bg: string,
+bgHover: string,...
+},
+segmented: {
+bg: string,
+bgHover: string,
+bgActive: string,
+textActive: string,...
+},
+text: {
+primary: string,
+secondary: string,
+faint: string,
+disable: string,...
+},
+link: {
+primary: string,
+primaryHover: string,
+secondary: string,
+secondaryHover: string,...
+},...
+},...
+},
+spacing: {
+xs: number,
+s: number,
+m: number,
+l: number,
+xl: number,...
+},
+radius: {
+button: number,
+card: number,
+input: number,
+tagSmall: number,
+tagLarge: number,
+avatarSmall: number,
+avatarLarge: number,
+avatarCircle: number,...
+},
+shadow: {
+active: string,
+surface: string,
+surfaceHover: string,
+popover: string,
+modal: string,...
+},
+fonts: {
+primary: string,...
+},
+typography: {
+primary: string,...
+},
+sizing: {
+button: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+iconContainerSize: number,
+iconPadding: number,
+loadingPadding: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+iconContainerSize: number,
+iconPadding: number,
+loadingPadding: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+iconContainerSize: number,
+iconPadding: number,
+loadingPadding: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+iconContainerSize: number,
+iconPadding: number,
+loadingPadding: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+iconContainerSize: number,
+iconPadding: number,
+loadingPadding: number,...
+},
+flexButton: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+borderRadius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+borderRadius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+borderRadius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+borderRadius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+spinnerSize: number,
+iconSize: number,
+borderRadius: number,...
+},
+checkbox: (
+size: "xl" | "lg" | "md" | "sm") => {
+size: number,
+fontSize: number,
+descriptionFontSize: number,
+labelGap: number,
+textGap: number,
+borderRadius: number,...
+} | {
+size: number,
+fontSize: number,
+descriptionFontSize: number,
+labelGap: number,
+textGap: number,
+borderRadius: number,...
+} | {
+size: number,
+fontSize: number,
+descriptionFontSize: number,
+labelGap: number,
+textGap: number,
+borderRadius: number,...
+} | {
+size: number,
+fontSize: number,
+descriptionFontSize: number,
+labelGap: number,
+textGap: number,
+borderRadius: number,...
+},
+radio: (
+size: "xl" | "lg" | "md" | "sm") => {
+size: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+borderWidth: number,...
+} | {
+size: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+borderWidth: number,...
+} | {
+size: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+borderWidth: number,...
+} | {
+size: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+borderWidth: number,...
+},
+input: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+height: number,
+paddingVertical: number,
+paddingHorizontal: number,
+fontSize: number,
+iconSize: number,
+radius: number,
+borderWidth: number,
+fieldGap: number,...
+}
+| {
+height: number,
+paddingVertical: number,
+paddingHorizontal: number,
+fontSize: number,
+iconSize: number,
+radius: number,
+borderWidth: number,
+fieldGap: number,...
+}
+| {
+height: number,
+paddingVertical: number,
+paddingHorizontal: number,
+fontSize: number,
+iconSize: number,
+radius: number,
+borderWidth: number,
+fieldGap: number,...
+}
+| {
+height: number,
+paddingVertical: number,
+paddingHorizontal: number,
+fontSize: number,
+iconSize: number,
+radius: number,
+borderWidth: number,
+fieldGap: number,...
+}
+| {
+height: number,
+paddingVertical: number,
+paddingHorizontal: number,
+fontSize: number,
+iconSize: number,
+radius: number,
+borderWidth: number,
+fieldGap: number,...
+},
+inputPin: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+size: number,
+gap: number,
+fontSize: number,
+radius: number,
+borderWidth: number,...
+}
+| {
+size: number,
+gap: number,
+fontSize: number,
+radius: number,
+borderWidth: number,...
+}
+| {
+size: number,
+gap: number,
+fontSize: number,
+radius: number,
+borderWidth: number,...
+}
+| {
+size: number,
+gap: number,
+fontSize: number,
+radius: number,
+borderWidth: number,...
+}
+| {
+size: number,
+gap: number,
+fontSize: number,
+radius: number,
+borderWidth: number,...
+},
+textarea: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+height: number,
+padding: number,
+fontSize: number,
+iconSize: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+iconSize: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+iconSize: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+iconSize: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+iconSize: number,...
+},
+switch: (
+size: "xl" | "lg" | "md" | "sm") => {
+width: number,
+height: number,
+knobSize: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+frameBorderRadius: number,
+knobBorderRadius: number,...
+} | {
+width: number,
+height: number,
+knobSize: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+frameBorderRadius: number,
+knobBorderRadius: number,...
+} | {
+width: number,
+height: number,
+knobSize: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+frameBorderRadius: number,
+knobBorderRadius: number,...
+} | {
+width: number,
+height: number,
+knobSize: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+descriptionLineHeight: number,
+labelGap: number,
+textGap: number,
+frameBorderRadius: number,
+knobBorderRadius: number,...
+},
+avatar: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+size: number,
+fontSize: number,
+iconSize: number,
+badgeSize: number,
+badgeOffsetCircle: {
+right: number,
+top: number,...
+},
+badgeOffsetSquare: {
+right: number,
+top: number,...
+},
+borderRadiusSquare: number,
+borderRadiusCircle: number,...
+}
+| {
+size: number,
+fontSize: number,
+iconSize: number,
+badgeSize: number,
+badgeOffsetCircle: {
+right: number,
+top: number,...
+},
+badgeOffsetSquare: {
+right: number,
+top: number,...
+},
+borderRadiusSquare: number,
+borderRadiusCircle: number,...
+}
+| {
+size: number,
+fontSize: number,
+iconSize: number,
+badgeSize: number,
+badgeOffsetCircle: {
+right: number,
+top: number,...
+},
+badgeOffsetSquare: {
+right: number,
+top: number,...
+},
+borderRadiusSquare: number,
+borderRadiusCircle: number,...
+}
+| {
+size: number,
+fontSize: number,
+iconSize: number,
+badgeSize: number,
+badgeOffsetCircle: {
+right: number,
+top: number,...
+},
+badgeOffsetSquare: {
+right: number,
+top: number,...
+},
+borderRadiusSquare: number,
+borderRadiusCircle: number,...
+}
+| {
+size: number,
+fontSize: number,
+iconSize: number,
+badgeSize: number,
+badgeOffsetCircle: {
+right: number,
+top: number,...
+},
+badgeOffsetSquare: {
+right: number,
+top: number,...
+},
+borderRadiusSquare: number,
+borderRadiusCircle: number,...
+},
+tag: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+height: number,
+padding: number,
+fontSize: number,
+gap: number,
+iconSize: number,
+radius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+gap: number,
+iconSize: number,
+radius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+gap: number,
+iconSize: number,
+radius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+gap: number,
+iconSize: number,
+radius: number,...
+}
+| {
+height: number,
+padding: number,
+fontSize: number,
+gap: number,
+iconSize: number,
+radius: number,...
+},
+divider: (
+size: "lg" | "md" | "sm") => {
+height: number,
+fontSize: number,
+lineWeight: number,...
+} | {
+height: number,
+fontSize: number,
+lineWeight: number,...
+} | {
+height: number,
+fontSize: number,
+lineWeight: number,...
+},
+spinner: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+size: number,
+strokeWidth: number,...
+}
+| {
+size: number,
+strokeWidth: number,...
+}
+| {
+size: number,
+strokeWidth: number,...
+}
+| {
+size: number,
+strokeWidth: number,...
+}
+| {
+size: number,
+strokeWidth: number,...
+},
+tabs: (
+size: "xl" | "lg" | "md" | "sm") => {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+paddingHorizontal: number,...
+} | {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+paddingHorizontal: number,...
+} | {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+paddingHorizontal: number,...
+} | {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+paddingHorizontal: number,...
+},
+segmented: (
+size: "xl" | "lg" | "md" | "sm") => {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+padding: number,...
+} | {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+padding: number,...
+} | {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+padding: number,...
+} | {
+height: number,
+fontSize: number,
+iconSize: number,
+gap: number,
+padding: number,...
+},
+tabsSegmented: (
+size: "xl" | "lg" | "md" | "sm") => {
+height: number,
+containerPadding: number,
+containerRadius: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+itemRadius: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+gap: number,...
+} | {
+height: number,
+containerPadding: number,
+containerRadius: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+itemRadius: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+gap: number,...
+} | {
+height: number,
+containerPadding: number,
+containerRadius: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+itemRadius: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+gap: number,...
+} | {
+height: number,
+containerPadding: number,
+containerRadius: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+itemRadius: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+gap: number,...
+},
+badge: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+size: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+padding: number,...
+}
+| {
+size: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+padding: number,...
+}
+| {
+size: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+padding: number,...
+}
+| {
+size: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+padding: number,...
+}
+| {
+size: number,
+fontSize: number,
+lineHeight: number,
+iconSize: number,
+padding: number,...
+},
+notification: (
+type: "toast" | "inline") => {
+width: number,
+paddingHorizontal: number,
+paddingVertical: number,
+gap: number,
+titleSize: number,
+messageSize: number,
+iconSize: number,
+iconWrapperSize: number,
+radius: number,...
+} | {
+width: string,
+paddingHorizontal: number,
+paddingVertical: number,
+gap: number,
+titleSize: number,
+messageSize: number,
+iconSize: number,
+iconWrapperSize: number,
+radius: number,...
+},
+progress: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs"
+| "xxs") => {
+height: number,
+labelSize: number,
+helperSize: number,
+gap: number,...
+}
+| {
+height: number,
+labelSize: number,
+helperSize: number,
+gap: number,...
+}
+| {
+height: number,
+labelSize: number,
+helperSize: number,
+gap: number,...
+}
+| {
+height: number,
+labelSize: number,
+helperSize: number,
+gap: number,...
+}
+| {
+height: number,
+labelSize: number,
+helperSize: number,
+gap: number,...
+}
+| {
+height: number,
+labelSize: number,
+helperSize: number,
+gap: number,...
+},
+supportingText: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs") => {
+fontSize: number,
+lineHeight: string,
+gap: number,
+iconSize: number,...
+}
+| {
+fontSize: number,
+lineHeight: string,
+gap: number,
+iconSize: number,...
+}
+| {
+fontSize: number,
+lineHeight: string,
+gap: number,
+iconSize: number,...
+}
+| {
+fontSize: number,
+lineHeight: string,
+gap: number,
+iconSize: number,...
+}
+| {
+fontSize: number,
+lineHeight: string,
+gap: number,
+iconSize: number,...
+},
+iconWrapper: (
+size: "xl"
+| "lg"
+| "md"
+| "sm"
+| "xs"
+| "xxs") => {
+size: number,
+iconSize: number,
+fontSize: number,...
+}
+| {
+size: number,
+iconSize: number,
+fontSize: number,...
+}
+| {
+size: number,
+iconSize: number,
+fontSize: number,...
+}
+| {
+size: number,
+iconSize: number,
+fontSize: number,...
+}
+| {
+size: number,
+iconSize: number,
+fontSize: number,...
+}
+| {
+size: number,
+iconSize: number,
+fontSize: number,...
+},
+stepper: (
+size: "md" | "sm") => {
+iconSize: number,
+titleSize: number,
+descSize: number,
+gap: number,
+currentTitleSize: number,
+currentDescSize: number,
+currentPadding: number,
+tailSize: number,...
+} | {
+iconSize: number,
+titleSize: number,
+descSize: number,
+gap: number,
+currentTitleSize: number,
+currentDescSize: number,
+currentPadding: number,
+tailSize: number,...
+},
+contextMenu: (
+size: "xl" | "lg" | "md" | "sm") => {
+paddingVertical: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+iconSize: number,
+gap: number,
+minWidth: number,
+searchPaddingHorizontal: number,
+searchPaddingVertical: number,
+searchGap: number,
+searchFontSize: number,
+searchLineHeight: number,
+searchIconSize: number,...
+} | {
+paddingVertical: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+iconSize: number,
+gap: number,
+minWidth: number,
+searchPaddingHorizontal: number,
+searchPaddingVertical: number,
+searchGap: number,
+searchFontSize: number,
+searchLineHeight: number,
+searchIconSize: number,...
+} | {
+paddingVertical: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+iconSize: number,
+gap: number,
+minWidth: number,
+searchPaddingHorizontal: number,
+searchPaddingVertical: number,
+searchGap: number,
+searchFontSize: number,
+searchLineHeight: number,
+searchIconSize: number,...
+} | {
+paddingVertical: number,
+itemPaddingHorizontal: number,
+itemPaddingVertical: number,
+fontSize: number,
+lineHeight: number,
+descriptionFontSize: number,
+iconSize: number,
+gap: number,
+minWidth: number,
+searchPaddingHorizontal: number,
+searchPaddingVertical: number,
+searchGap: number,
+searchFontSize: number,
+searchLineHeight: number,
+searchIconSize: number,...
+},...
+},...
+};declare interface DesignSystemContextType {
+mode: ThemeMode,
+setMode: (mode: ThemeMode) => void,
+theme: $Call<<R>((...args: any[]) => R) => R, typeof themeConfig>,
+} declare var XUIProvider: React.FC<{
+children: React.ReactNode,
+initialMode?: ThemeMode,...
+}>;declare var useDesignSystem: () => DesignSystemContextType;declare var useId: () => string;
+/**
+ * Context for the current modal's ID.
+ * Used by portal-based components (tooltips, dropdowns) to mark their content
+ * as belonging to a modal, preventing click-outside from closing the modal.
+ */
+declare var ModalIdContext: React.Context<string | null>;
+/**
+ * Returns the current modal's ID for use with portal content.
+ * Apply as `data-modal-id={modalId}` to portal containers.
+ * Returns null if not inside a modal.
+ */
+declare var useModalId: () => string | null;export type {
+          ThemeColors,ThemeMode
+        }
+declare export {
+          ModalIdContext,XUIProvider,colors,fonts,isAndroid,isIOS,isNative,isWeb,radius,shadow,spacing,themeConfig,typography,useDesignSystem,useId,useModalId
+        }