@uzum-tech/ui 2.3.8 → 3.0.0-alpha.0

package/es/_internal/button-v3/styles/_common.d.ts

@@ -0,0 +1,19 @@
+declare const _default: {
+    heightSmall: string;
+    heightMedium: string;
+    heightLarge: string;
+    paddingSmall: string;
+    paddingMedium: string;
+    paddingLarge: string;
+    borderRadiusSmall: string;
+    borderRadiusMedium: string;
+    borderRadiusLarge: string;
+    iconSizeSmall: string;
+    iconSizeMedium: string;
+    iconSizeLarge: string;
+    iconMargin: string;
+    borderWidth: string;
+    focusRingWidth: string;
+    spinnerStrokeWidth: string;
+};
+export default _default;

package/es/_internal/button-v3/styles/_common.mjs

@@ -0,0 +1,18 @@
+export default {
+  heightSmall: '36px',
+  heightMedium: '48px',
+  heightLarge: '56px',
+  paddingSmall: '0 12px',
+  paddingMedium: '0 16px',
+  paddingLarge: '0 24px',
+  borderRadiusSmall: '8px',
+  borderRadiusMedium: '12px',
+  borderRadiusLarge: '16px',
+  iconSizeSmall: '16px',
+  iconSizeMedium: '20px',
+  iconSizeLarge: '24px',
+  iconMargin: '8px',
+  borderWidth: '1px',
+  focusRingWidth: '2px',
+  spinnerStrokeWidth: '3.7px'
+};

package/es/_internal/button-v3/styles/dark.d.ts

@@ -0,0 +1,3 @@
+import type { ButtonV3Theme } from './light';
+declare const buttonV3Dark: ButtonV3Theme;
+export default buttonV3Dark;

package/es/_internal/button-v3/styles/dark.mjs

@@ -0,0 +1,8 @@
+import { commonDark } from "../../../_styles/common/index.mjs";
+import { self } from "./light.mjs";
+const buttonV3Dark = {
+  name: 'ButtonV3',
+  common: commonDark,
+  self
+};
+export default buttonV3Dark;

package/es/_internal/button-v3/styles/index.d.ts

@@ -0,0 +1,3 @@
+export { default as buttonV3Dark } from './dark';
+export { default as buttonV3Light } from './light';
+export type { ButtonV3Theme, ButtonV3ThemeVars } from './light';

package/es/_internal/button-v3/styles/index.mjs

@@ -0,0 +1,2 @@
+export { default as buttonV3Dark } from "./dark.mjs";
+export { default as buttonV3Light } from "./light.mjs";

package/es/_internal/button-v3/styles/light.d.ts

@@ -0,0 +1,81 @@
+import type { Theme } from '../../../_mixins';
+import type { ThemeCommonVars } from '../../../_styles/common';
+export declare function self(vars: ThemeCommonVars): {
+    fontFamily: string;
+    fontSize: string;
+    lineHeight: string;
+    fontWeight: string;
+    letterSpacing: string;
+    pressedOverlayColor: string;
+    focusRingColor: string;
+    textColorDisabled: string;
+    colorPrimary: string;
+    colorPrimaryHover: string;
+    textColorPrimary: string;
+    textColorPrimaryHover: string;
+    borderColorPrimary: string;
+    colorPrimaryDisabled: string;
+    borderColorPrimaryDisabled: string;
+    colorPrimaryNegative: string;
+    colorPrimaryNegativeHover: string;
+    textColorPrimaryNegative: string;
+    textColorPrimaryNegativeHover: string;
+    borderColorPrimaryNegative: string;
+    colorPrimaryNegativeDisabled: string;
+    borderColorPrimaryNegativeDisabled: string;
+    colorSecondary: string;
+    colorSecondaryHover: string;
+    textColorSecondary: string;
+    textColorSecondaryHover: string;
+    borderColorSecondary: string;
+    colorSecondaryDisabled: string;
+    borderColorSecondaryDisabled: string;
+    colorTertiary: string;
+    colorTertiaryHover: string;
+    textColorTertiary: string;
+    textColorTertiaryHover: string;
+    borderColorTertiary: string;
+    colorTertiaryDisabled: string;
+    borderColorTertiaryDisabled: string;
+    colorTertiaryNegative: string;
+    colorTertiaryNegativeHover: string;
+    textColorTertiaryNegative: string;
+    textColorTertiaryNegativeHover: string;
+    borderColorTertiaryNegative: string;
+    colorTertiaryNegativeDisabled: string;
+    borderColorTertiaryNegativeDisabled: string;
+    colorGhost: string;
+    colorGhostHover: string;
+    textColorGhost: string;
+    textColorGhostHover: string;
+    borderColorGhost: string;
+    colorGhostDisabled: string;
+    borderColorGhostDisabled: string;
+    colorGhostNegative: string;
+    colorGhostNegativeHover: string;
+    textColorGhostNegative: string;
+    textColorGhostNegativeHover: string;
+    borderColorGhostNegative: string;
+    colorGhostNegativeDisabled: string;
+    borderColorGhostNegativeDisabled: string;
+    heightSmall: string;
+    heightMedium: string;
+    heightLarge: string;
+    paddingSmall: string;
+    paddingMedium: string;
+    paddingLarge: string;
+    borderRadiusSmall: string;
+    borderRadiusMedium: string;
+    borderRadiusLarge: string;
+    iconSizeSmall: string;
+    iconSizeMedium: string;
+    iconSizeLarge: string;
+    iconMargin: string;
+    borderWidth: string;
+    focusRingWidth: string;
+    spinnerStrokeWidth: string;
+};
+declare const buttonV3Light: Theme<'ButtonV3', ButtonV3ThemeVars>;
+export default buttonV3Light;
+export type ButtonV3ThemeVars = ReturnType<typeof self>;
+export type ButtonV3Theme = typeof buttonV3Light;

package/es/_internal/button-v3/styles/light.mjs

@@ -0,0 +1,91 @@
+import { commonLight } from "../../../_styles/common/index.mjs";
+import commonVariables from "./_common.mjs";
+const TRANSPARENT = 'transparent';
+export function self(vars) {
+  const {
+    fontFamilyWixMadeforDisplay,
+    fontBodyMedium,
+    lineHeightBodyMedium,
+    fontWeightStrong,
+    textPrimary,
+    staticBlack,
+    staticWhite,
+    accentBrand,
+    accentBrandHover,
+    accentError,
+    accentErrorHover,
+    accentErrorSubtle,
+    accentNeutral,
+    accentNeutralHover,
+    accentBorder,
+    accentFocusRing,
+    accentDisabled,
+    accentDisabledContent,
+    accentPressedOverlay
+  } = vars;
+  return Object.assign(Object.assign({}, commonVariables), {
+    fontFamily: fontFamilyWixMadeforDisplay,
+    fontSize: fontBodyMedium,
+    lineHeight: lineHeightBodyMedium,
+    fontWeight: fontWeightStrong,
+    letterSpacing: '0.1px',
+    pressedOverlayColor: accentPressedOverlay,
+    focusRingColor: accentFocusRing,
+    textColorDisabled: accentDisabledContent,
+    colorPrimary: accentBrand,
+    colorPrimaryHover: accentBrandHover,
+    textColorPrimary: staticWhite,
+    textColorPrimaryHover: staticWhite,
+    borderColorPrimary: TRANSPARENT,
+    colorPrimaryDisabled: accentDisabled,
+    borderColorPrimaryDisabled: TRANSPARENT,
+    colorPrimaryNegative: accentError,
+    colorPrimaryNegativeHover: accentErrorHover,
+    textColorPrimaryNegative: staticWhite,
+    textColorPrimaryNegativeHover: staticWhite,
+    borderColorPrimaryNegative: TRANSPARENT,
+    colorPrimaryNegativeDisabled: accentDisabled,
+    borderColorPrimaryNegativeDisabled: TRANSPARENT,
+    colorSecondary: accentNeutral,
+    colorSecondaryHover: accentNeutralHover,
+    textColorSecondary: staticBlack,
+    textColorSecondaryHover: staticBlack,
+    borderColorSecondary: accentBorder,
+    colorSecondaryDisabled: accentDisabled,
+    borderColorSecondaryDisabled: accentNeutral,
+    colorTertiary: TRANSPARENT,
+    colorTertiaryHover: accentNeutral,
+    textColorTertiary: textPrimary,
+    textColorTertiaryHover: staticBlack,
+    borderColorTertiary: TRANSPARENT,
+    colorTertiaryDisabled: TRANSPARENT,
+    borderColorTertiaryDisabled: TRANSPARENT,
+    colorTertiaryNegative: TRANSPARENT,
+    colorTertiaryNegativeHover: accentErrorSubtle,
+    textColorTertiaryNegative: accentError,
+    textColorTertiaryNegativeHover: accentError,
+    borderColorTertiaryNegative: TRANSPARENT,
+    colorTertiaryNegativeDisabled: TRANSPARENT,
+    borderColorTertiaryNegativeDisabled: TRANSPARENT,
+    colorGhost: TRANSPARENT,
+    colorGhostHover: TRANSPARENT,
+    textColorGhost: accentBrand,
+    textColorGhostHover: accentBrandHover,
+    borderColorGhost: TRANSPARENT,
+    colorGhostDisabled: TRANSPARENT,
+    borderColorGhostDisabled: TRANSPARENT,
+    colorGhostNegative: TRANSPARENT,
+    colorGhostNegativeHover: TRANSPARENT,
+    textColorGhostNegative: accentError,
+    textColorGhostNegativeHover: accentErrorHover,
+    borderColorGhostNegative: TRANSPARENT,
+    colorGhostNegativeDisabled: TRANSPARENT,
+    borderColorGhostNegativeDisabled: TRANSPARENT
+  });
+}
+const buttonV3Light = {
+  name: 'ButtonV3',
+  common: commonLight,
+  self
+};
+export default buttonV3Light;

package/es/_internal/index.d.ts

@@ -1,4 +1,6 @@
 export { default as UBaseAccountOption } from './account-option';
+export { buttonV3Props, InternalUButtonV3 } from './button-v3';
+export type * from './button-v3';
 export { checkboxBaseProps, checkboxGroupInjectionKey, useCheckbox } from './checkbox';
 export type { CheckboxBaseProps, CheckboxInst, OnUpdateChecked, OnUpdateCheckedImpl, UseCheckbox } from './checkbox';
 export { default as UBaseClear } from './clear';

package/es/_internal/index.mjs

@@ -1,4 +1,5 @@
 export { default as UBaseAccountOption } from "./account-option/index.mjs";
+export { buttonV3Props, InternalUButtonV3 } from "./button-v3/index.mjs";
 export { checkboxBaseProps, checkboxGroupInjectionKey, useCheckbox } from "./checkbox/index.mjs";
 export { default as UBaseClear } from "./clear/index.mjs";
 export { UBaseClose } from "./close/index.mjs";

package/es/_styles/common/dark.mjs

@@ -34,6 +34,18 @@ const derived = Object.assign(Object.assign({
   brandQuinary300: '#F19EDA',
   brandQuinary600: '#EA3E68',
   brandQuinary100: '#FAD6D9',
+  accentBrand: '#7000FF',
+  accentBrandHover: '#5D46A6',
+  accentError: '#F24835',
+  accentErrorHover: '#A82C1E',
+  accentErrorSubtle: '#FFFFFF',
+  accentNeutral: '#F3F4F6',
+  accentNeutralHover: '#E8EAED',
+  accentFocusRing: '#CDD1D5',
+  accentBorder: '#DDE0E3',
+  accentDisabled: '#DDE0E3',
+  accentDisabledContent: '#B2B8BC',
+  accentPressedOverlay: 'rgba(0, 0, 0, 0.12)',
   surfacePrimary: '#101010',
   surfaceSecondary: '#1D1D1D',
   containerPrimary: '#1D1D1D',

package/es/_styles/common/light.d.ts

@@ -31,6 +31,18 @@ declare const derived: {
     brandQuinary300: string;
     brandQuinary600: string;
     brandQuinary100: string;
+    accentBrand: string;
+    accentBrandHover: string;
+    accentError: string;
+    accentErrorHover: string;
+    accentErrorSubtle: string;
+    accentNeutral: string;
+    accentNeutralHover: string;
+    accentFocusRing: string;
+    accentBorder: string;
+    accentDisabled: string;
+    accentDisabledContent: string;
+    accentPressedOverlay: string;
     surfacePrimary: string;
     surfaceSecondary: string;
     containerPrimary: string;

package/es/_styles/common/light.mjs

@@ -34,6 +34,18 @@ const derived = Object.assign(Object.assign({
   brandQuinary300: '#F19EDA',
   brandQuinary600: '#EA3E68',
   brandQuinary100: '#FAD6D9',
+  accentBrand: '#7000FF',
+  accentBrandHover: '#5D46A6',
+  accentError: '#F24835',
+  accentErrorHover: '#A82C1E',
+  accentErrorSubtle: '#FFFFFF',
+  accentNeutral: '#F3F4F6',
+  accentNeutralHover: '#E8EAED',
+  accentFocusRing: '#CDD1D5',
+  accentBorder: '#DDE0E3',
+  accentDisabled: '#DDE0E3',
+  accentDisabledContent: '#B2B8BC',
+  accentPressedOverlay: 'rgba(0, 0, 0, 0.12)',
   surfacePrimary: '#fff',
   surfaceSecondary: '#1d1d1d',
   containerPrimary: '#fff',

package/es/button-v3/index.d.ts

@@ -0,0 +1,4 @@
+export { buttonV3Dark, buttonV3Light } from '../_internal/button-v3';
+export type * from '../_internal/button-v3/src/interface';
+export type { ButtonV3Theme, ButtonV3ThemeVars } from '../_internal/button-v3/styles';
+export { buttonV3Props, default as UButtonV3, XButtonV3 as UxButtonV3 } from './src/ButtonV3';

package/es/button-v3/index.mjs

@@ -0,0 +1,2 @@
+export { buttonV3Dark, buttonV3Light } from "../_internal/button-v3/index.mjs";
+export { buttonV3Props, default as UButtonV3, XButtonV3 as UxButtonV3 } from "./src/ButtonV3.mjs";