@rovula/ui 0.0.21 → 0.0.23

package/src/_theme/variables/xspector/typography.css

@@ -1,178 +0,0 @@
-:root[data-theme="xspector"] {
-  /* TYPE */
-  --h1-family: "Poppins";
-  --h1-size: 64px;
-  --h1-size-rem: 4rem;
-  --h1-weight: 700;
-  --h1-style: normal;
-  --h1-line-height: 80px;
-  --h1-line-height-rem: 5rem;
-  --h2-family: "Poppins";
-  --h2-size: 48px;
-  --h2-size-rem: 3rem;
-  --h2-weight: 700;
-  --h2-style: normal;
-  --h2-line-height: 60px;
-  --h2-line-height-rem: 3.75rem;
-  --h3-family: "Poppins";
-  --h3-size: 32px;
-  --h3-size-rem: 2rem;
-  --h3-weight: 700;
-  --h3-style: normal;
-  --h3-line-height: 48px;
-  --h3-line-height-rem: 3rem;
-  --h4-family: "Poppins";
-  --h4-size: 24px;
-  --h4-size-rem: 1.5rem;
-  --h4-weight: 700;
-  --h4-style: normal;
-  --h4-line-height: 32px;
-  --h4-line-height-rem: 2rem;
-  --h5-family: "Poppins";
-  --h5-size: 20px;
-  --h5-size-rem: 1.25rem;
-  --h5-weight: 700;
-  --h5-style: normal;
-  --h5-line-height: 28px;
-  --h5-line-height-rem: 1.75rem;
-  --h6-family: "Poppins";
-  --h6-size: 18px;
-  --h6-size-rem: 1.125rem;
-  --h6-weight: 700;
-  --h6-style: normal;
-  --h6-line-height: 24px;
-  --h6-line-height-rem: 1.5rem;
-  --subtitle1-family: "Poppins";
-  --subtitle1-size: 16px;
-  --subtitle1-size-rem: 1rem;
-  --subtitle1-weight: 400;
-  --subtitle1-style: normal;
-  --subtitle1-line-height: 24px;
-  --subtitle1-line-height-rem: 1.5rem;
-  --subtitle2-family: "Poppins";
-  --subtitle2-size: 16px;
-  --subtitle2-size-rem: 1rem;
-  --subtitle2-weight: 500;
-  --subtitle2-style: normal;
-  --subtitle2-line-height: 24px;
-  --subtitle2-line-height-rem: 1.5rem;
-  --subtitle3-family: "Poppins";
-  --subtitle3-size: 16px;
-  --subtitle3-size-rem: 1rem;
-  --subtitle3-weight: 600;
-  --subtitle3-style: normal;
-  --subtitle3-line-height: 24px;
-  --subtitle3-line-height-rem: 1.5rem;
-  --subtitle4-family: "Poppins";
-  --subtitle4-size: 14px;
-  --subtitle4-size-rem: 0.875rem;
-  --subtitle4-weight: 400;
-  --subtitle4-style: normal;
-  --subtitle4-line-height: 22px;
-  --subtitle4-line-height-rem: 1.375rem;
-  --subtitle5-family: "Poppins";
-  --subtitle5-size: 14px;
-  --subtitle5-size-rem: 0.875rem;
-  --subtitle5-weight: 500;
-  --subtitle5-style: normal;
-  --subtitle5-line-height: 22px;
-  --subtitle5-line-height-rem: 1.375rem;
-  --subtitle6-family: "Poppins";
-  --subtitle6-size: 14px;
-  --subtitle6-size-rem: 0.875rem;
-  --subtitle6-weight: 600;
-  --subtitle6-style: normal;
-  --subtitle6-line-height: 22px;
-  --subtitle6-line-height-rem: 1.375rem;
-  --body1-family: "Poppins";
-  --body1-size: 16px;
-  --body1-size-rem: 1rem;
-  --body1-weight: 400;
-  --body1-style: normal;
-  --body1-line-height: 20px;
-  --body1-line-height-rem: 1.25rem;
-  --body2-family: "Poppins";
-  --body2-size: 16px;
-  --body2-size-rem: 1rem;
-  --body2-weight: 500;
-  --body2-style: normal;
-  --body2-line-height: 20px;
-  --body2-line-height-rem: 1.25rem;
-  --body3-family: "Poppins";
-  --body3-size: 14px;
-  --body3-size-rem: 0.875rem;
-  --body3-weight: 400;
-  --body3-style: normal;
-  --body3-line-height: 18px;
-  --body3-line-height-rem: 1.125rem;
-  --body4-family: "Poppins";
-  --body4-size: 14px;
-  --body4-size-rem: 0.875rem;
-  --body4-weight: 500;
-  --body4-style: normal;
-  --body4-line-height: 18px;
-  --body4-line-height-rem: 1.125rem;
-  --small1-family: "Poppins";
-  --small1-size: 12px;
-  --small1-size-rem: 0.75rem;
-  --small1-weight: 400;
-  --small1-style: normal;
-  --small1-line-height: 14px;
-  --small1-line-height-rem: 0.875rem;
-  --small2-family: "Poppins";
-  --small2-size: 12px;
-  --small2-size-rem: 0.75rem;
-  --small2-weight: 500;
-  --small2-style: normal;
-  --small2-line-height: 14px;
-  --small2-line-height-rem: 0.875rem;
-  --small3-family: "Poppins";
-  --small3-size: 12px;
-  --small3-size-rem: 0.75rem;
-  --small3-weight: 600;
-  --small3-style: normal;
-  --small3-line-height: 14px;
-  --small3-line-height-rem: 0.875rem;
-  --small4-family: "Poppins";
-  --small4-size: 10px;
-  --small4-size-rem: 0.625rem;
-  --small4-weight: 400;
-  --small4-style: normal;
-  --small4-line-height: 12px;
-  --small4-line-height-rem: 0.75rem;
-  --small5-family: "Poppins";
-  --small5-size: 10px;
-  --small5-size-rem: 0.625rem;
-  --small5-weight: 500;
-  --small5-style: normal;
-  --small5-line-height: 12px;
-  --small5-line-height-rem: 0.75rem;
-  --label-label1-family: "Poppins";
-  --label-label1-size: 12px;
-  --label-label1-size-rem: 0.75rem;
-  --label-label1-weight: 400;
-  --label-label1-style: normal;
-  --label-label1-line-height: 12px;
-  --label-label1-line-height-rem: 0.75rem;
-  --label-label2-family: "Poppins";
-  --label-label2-size: 10px;
-  --label-label2-size-rem: 0.625rem;
-  --label-label2-weight: 400;
-  --label-label2-style: normal;
-  --label-label2-line-height: 10px;
-  --label-label2-line-height-rem: 0.625rem;
-  --button-button-l-family: "Poppins";
-  --button-button-l-size: 16px;
-  --button-button-l-size-rem: 1rem;
-  --button-button-l-weight: 700;
-  --button-button-l-style: normal;
-  --button-button-l-line-height: 24px;
-  --button-button-l-line-height-rem: 1.5rem;
-  --button-button-ms-family: "Poppins";
-  --button-button-ms-size: 14px;
-  --button-button-ms-size-rem: 0.875rem;
-  --button-button-ms-weight: 700;
-  --button-button-ms-style: normal;
-  --button-button-ms-line-height: 22px;
-  --button-button-ms-line-height-rem: 1.375rem;
-}

package/src/components/ActionButton/ActionButton.styles copy.ts

@@ -1,95 +0,0 @@
-import { cva } from "class-variance-authority";
-
-export const actionButtonVariants = cva(
-  ["rounded box-border flex items-center justify-center"],
-  {
-    variants: {
-      variant: {
-        solid: [
-          "bg-secondary-default border-secondary-default text-secondary-foreground fill-secondary-foreground",
-          "hover:bg-secondary-hover hover:border-secondary-hover",
-          "active:bg-secondary-pressed active:border-secondary-pressed",
-        ],
-        outline: [
-          "border bg-transparent disabled:bg-transparent disabled:border-disable-outline",
-          "text-secondary-default fill-secondary-default border-secondary-stroke",
-          "hover:bg-secondary-hover-bg hover:border-secondary-hover hover:text-secondary-hover hover:fill-secondary-hover",
-          "active:bg-secondary-hover-bg active:border-secondary-pressed active:text-secondary-pressed active:fill-secondary-pressed",
-        ],
-        icon: [
-          "bg-transparent disabled:bg-transparent rounded-full",
-          "text-secondary-default fill-secondary-default",
-          "hover:bg-secondary-hover-bg hover:text-secondary-hover hover:fill-secondary-hover",
-          "active:text-secondary-pressed active:fill-secondary-pressed",
-        ],
-      },
-      size: {
-        xs: "p-[2px] w-[18px] h-[18px]",
-        sm: "px-2 py-1 w-[38px] h-[30px]",
-        md: "px-3 py-2 w-[46px] h-[38px]",
-        lg: "px-4 py-3 w-[64px] h-[56px]",
-      },
-      disabled: {
-        false: "",
-      },
-      active: {
-        false: "",
-      },
-    },
-    compoundVariants: [
-      {
-        variant: "solid",
-        active: true,
-        className: [
-          "bg-primary-default border-primary-default text-primary-foreground fill-primary-foreground",
-          "hover:bg-primary-hover hover:border-primary-hover",
-          "active:bg-primary-pressed active:border-primary-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        active: true,
-        className: [
-          "text-primary-default fill-primary-default border-primary-stroke",
-          "hover:bg-primary-hover-bg hover:border-primary-hover hover:text-primary-hover hover:fill-primary-hover",
-          "active:bg-primary-hover-bg active:border-primary-pressed active:text-primary-pressed active:fill-primary-pressed",
-        ],
-      },
-      {
-        variant: "icon",
-        active: true,
-        className: [
-          "text-primary-default fill-primary-default",
-          "hover:bg-primary-hover-bg hover:text-primary-hover hover:fill-primary-hover",
-          "active:text-primary-pressed active:fill-primary-pressed",
-        ],
-      },
-      {
-        size: "lg",
-        variant: "icon",
-        className: "w-[56px] h-[56px]",
-      },
-      {
-        size: "md",
-        variant: "icon",
-        className: "w-[38px] h-[38px]",
-      },
-      {
-        size: "sm",
-        variant: "icon",
-        className: "w-[30px] h-[30px]",
-      },
-      {
-        disabled: true,
-        className:
-          "pointer-events-none border-transparent bg-disable-solid text-disable-outline fill-disable-outline",
-      },
-    ],
-    defaultVariants: {
-      size: "md",
-      variant: "solid",
-      disabled: false,
-      active: false,
-    },
-  }
-);

package/src/components/Button/Button.styles copy.ts

@@ -1,214 +0,0 @@
-import { cva } from "class-variance-authority";
-
-export const buttonVariants = cva(
-  [
-    // "inline-flex items-center justify-center align-middle no-underline transition-colors ease-in-out duration-300",
-    // "font-sans appearance-none select-none rounded-sm border font-medium tracking-[.02857em]",
-    // "aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:cursor-not-allowed",
-    // "gap-2 font-bold text-white hover:bg-opacity-90 active:scale-[98%]",
-    "gap-2 font-bold text-white outline-none",
-    "transition ease-in-out duration-45",
-  ],
-  {
-    variants: {
-      color: {
-        primary: [
-          "bg-primary-default border-primary-default text-primary-foreground fill-primary-foreground",
-          "hover:bg-primary-hover hover:border-primary-hover",
-          "active:bg-primary-pressed active:border-primary-pressed",
-        ],
-        secondary: [
-          "bg-secondary-default border-secondary-default text-secondary-foreground fill-secondary-foreground",
-          "hover:bg-secondary-hover hover:border-secondary-hover",
-          "active:bg-secondary-pressed active:border-secondary-pressed",
-        ],
-        tertiary: [
-          "bg-tertiary-default border-tertiary-default text-tertiary-foreground fill-tertiary-foreground",
-          "hover:bg-tertiary-hover hover:border-tertiary-hover",
-          "active:bg-tertiary-pressed active:border-tertiary-pressed",
-        ],
-        success: [
-          "bg-success-default border-success-default text-success-foreground fill-success-foreground",
-          "hover:bg-success-hover hover:border-success-hover",
-          "active:bg-success-pressed active:border-success-pressed",
-        ],
-        info: [
-          "bg-info-default border-info-default text-info-foreground fill-info-foreground",
-          "hover:bg-info-hover hover:border-info-hover",
-          "active:bg-info-pressed active:border-info-pressed",
-        ],
-        warning: [
-          "bg-warning-default border-warning-default text-warning-foreground fill-warning-foreground",
-          "hover:bg-warning-hover hover:border-warning-hover",
-          "active:bg-warning-pressed active:border-warning-pressed",
-        ],
-        error: [
-          "bg-error-default border-error-default text-error-foreground fill-error-foreground",
-          "hover:bg-error-hover hover:border-error-hover",
-          "active:bg-error-pressed active:border-error-pressed",
-        ],
-      },
-      size: {
-        sm: "px-3 py-1 text-sm rounded-sm",
-        md: "px-4 py-2 text-sm rounded-md",
-        lg: "px-6 py-4 text-base rounded-lg",
-      },
-      variant: {
-        solid: "border",
-        outline: "border bg-transparent disabled:border-disable-outline",
-        flat: "bg-transparent",
-        link: "bg-transparent underline underline-offset-4",
-      },
-      disabled: {
-        true: "pointer-events-none border-transparent bg-disable-solid text-disable-outline fill-disable-outline",
-      },
-      fullwidth: {
-        true: "w-full",
-      },
-    },
-    compoundVariants: [
-      // --- Outline ---
-      {
-        variant: "outline",
-        color: "primary",
-        className: [
-          "text-primary-default fill-primary-default border-primary-stroke",
-          "hover:bg-primary-hover-bg hover:border-primary-hover hover:text-primary-hover hover:fill-primary-hover",
-          "active:bg-primary-hover-bg active:border-primary-pressed active:text-primary-pressed active:fill-primary-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        color: "secondary",
-        className: [
-          "text-secondary-default fill-secondary-default border-secondary-stroke",
-          "hover:bg-secondary-hover-bg hover:border-secondary-hover hover:text-secondary-hover hover:fill-secondary-hover",
-          "active:bg-secondary-hover-bg active:border-secondary-pressed active:text-secondary-pressed active:fill-secondary-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        color: "tertiary",
-        className: [
-          "text-tertiary-default fill-tertiary-default border-tertiary-stroke",
-          "hover:bg-tertiary-hover-bg hover:border-tertiary-hover hover:text-tertiary-hover hover:fill-tertiary-hover",
-          "active:bg-tertiary-hover-bg active:border-tertiary-pressed active:text-tertiary-pressed active:fill-tertiary-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        color: "success",
-        className: [
-          "text-success-default fill-success-default border-success-stroke",
-          "hover:bg-success-hover-bg hover:border-success-hover hover:text-success-hover hover:fill-success-hover",
-          "active:bg-success-hover-bg active:border-success-pressed active:text-success-pressed active:fill-success-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        color: "info",
-        className: [
-          "text-info-default fill-info-default border-info-stroke",
-          "hover:bg-info-hover-bg hover:border-info-hover hover:text-info-hover hover:fill-info-hover",
-          "active:bg-info-hover-bg active:border-info-pressed active:text-info-pressed active:fill-info-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        color: "warning",
-        className: [
-          "text-warning-default fill-warning-default border-warning-stroke",
-          "hover:bg-warning-hover-bg hover:border-warning-hover hover:text-warning-hover hover:fill-warning-hover",
-          "active:bg-warning-hover-bg active:border-warning-pressed active:text-warning-pressed active:fill-warning-pressed",
-        ],
-      },
-      {
-        variant: "outline",
-        color: "error",
-        className: [
-          "text-error-default fill-error-default border-error-stroke",
-          "hover:bg-error-hover-bg hover:border-error-hover hover:text-error-hover hover:fill-error-hover",
-          "active:bg-error-hover-bg active:border-error-pressed active:text-error-pressed active:fill-error-pressed",
-        ],
-      },
-      // --- Flat, link ---
-      {
-        variant: ["flat", "link"],
-        color: "primary",
-        className: [
-          "text-primary-default fill-primary-default",
-          "hover:bg-primary-hover-bg hover:text-primary-hover hover:fill-primary-hover",
-          "active:bg-transparent active:text-primary-pressed active:fill-primary-pressed",
-        ],
-      },
-      {
-        variant: ["flat", "link"],
-        color: "secondary",
-        className: [
-          "text-secondary-default fill-secondary-default",
-          "hover:bg-secondary-hover-bg hover:text-secondary-hover hover:fill-secondary-hover",
-          "active:bg-transparent active:text-secondary-pressed active:fill-secondary-pressed",
-        ],
-      },
-      {
-        variant: ["flat", "link"],
-        color: "tertiary",
-        className: [
-          "text-tertiary-default fill-tertiary-default",
-          "hover:bg-tertiary-hover-bg hover:text-tertiary-hover hover:fill-tertiary-hover",
-          "active:bg-transparent active:text-tertiary-pressed active:fill-tertiary-pressed",
-        ],
-      },
-      {
-        variant: ["flat", "link"],
-        color: "success",
-        className: [
-          "text-success-default fill-success-default",
-          "hover:bg-success-hover-bg hover:text-success-hover hover:fill-success-hover",
-          "active:bg-transparent active:text-success-pressed active:fill-success-pressed",
-        ],
-      },
-      {
-        variant: ["flat", "link"],
-        color: "info",
-        className: [
-          "text-info-default fill-info-default",
-          "hover:bg-info-hover-bg hover:text-info-hover hover:fill-info-hover",
-          "active:bg-transparent active:text-info-pressed active:fill-info-pressed",
-        ],
-      },
-      {
-        variant: ["flat", "link"],
-        color: "warning",
-        className: [
-          "text-warning-default fill-warning-default",
-          "hover:bg-warning-hover-bg hover:text-warning-hover hover:fill-warning-hover",
-          "active:bg-transparent active:text-warning-pressed active:fill-warning-pressed",
-        ],
-      },
-      {
-        variant: ["flat", "link"],
-        color: "error",
-        className: [
-          "text-error-default fill-error-default",
-          "hover:bg-error-hover-bg hover:text-error-hover hover:fill-error-hover",
-          "active:bg-transparent active:text-error-pressed active:fill-error-pressed",
-        ],
-      },
-      // --- Disabled --
-      {
-        variant: ["outline", "flat", "link"],
-        disabled: true,
-        className: [
-          "bg-transtarent border-disabled-outline text-disable-outline fill-disable-outline",
-        ],
-      },
-    ],
-    defaultVariants: {
-      size: "md",
-      color: "primary",
-      variant: "solid",
-      fullwidth: true,
-    },
-  }
-);