@vkzstudio/muza-ui 1.0.0 → 1.0.1

package/dist/styles/typography.css

@@ -0,0 +1,84 @@
+/* width >= 1024px */
+@theme {
+  --font-heading: Objectivity;
+  --font-text: Objectivity;
+  --font-cta: Objectivity;
+  --paragraph-spacing-12: 12px;
+  --text-2xs: 12px;
+  --text-input: 14px;
+  --text-xs: 14px;
+  --text-sm: 16px;
+  --text-md: 18px;
+  --text-lg: 20px;
+  --text-xl: 24px;
+  --text-2xl: 32px;
+  --text-3xl: 40px;
+  --text-4xl: 48px;
+  --text-5xl: 56px;
+  --text-6xl: 64px;
+  --text-7xl: 72px;
+  --font-weight-light: 300;
+  --font-weight-regular: 400;
+  --font-weight-medium: 500;
+  --font-weight-bold: 700;
+}
+
+/* max 1024px */
+@media (width < 64rem) {
+  :root {
+    --paragraph-spacing-12: 12px;
+    --text-2xs: 12px;
+    --text-xs: 14px;
+    --text-input: 16px;
+    --text-sm: 16px;
+    --text-md: 18px;
+    --text-lg: 20px;
+    --text-xl: 22px;
+    --text-2xl: 28px;
+    --text-3xl: 32px;
+    --text-4xl: 40px;
+    --text-5xl: 48px;
+    --text-6xl: 56px;
+    --text-7xl: 64px;
+  }
+}
+
+/* max 768px */
+@media (width < 48rem) {
+  :root {
+    --paragraph-spacing-12: 12px;
+    --text-2xs: 12px;
+    --text-xs: 14px;
+    --text-input: 16px;
+    --text-sm: 16px;
+    --text-md: 18px;
+    --text-lg: 20px;
+    --text-xl: 20px;
+    --text-2xl: 24px;
+    --text-3xl: 28px;
+    --text-4xl: 32px;
+    --text-5xl: 40px;
+    --text-6xl: 48px;
+    --text-7xl: 56px;
+  }
+}
+
+/* min 1600px */
+@media (width >= 100rem) {
+  :root {
+    --paragraph-spacing-12: 12px;
+    --text-2xs: 12px;
+    --text-input: 14px;
+    --text-xs: 14px;
+    --text-sm: 16px;
+    --text-md: 18px;
+    --text-lg: 20px;
+    --text-xl: 24px;
+    --text-2xl: 32px;
+    --text-3xl: 40px;
+    --text-4xl: 48px;
+    --text-5xl: 56px;
+    --text-6xl: 64px;
+    --text-7xl: 72px;
+  }
+}

package/dist/styles/utilities.css

@@ -0,0 +1,66 @@
+@utility fix-y-text {
+  /* Default value for >14px font size */
+  transform: translateY(0.125em);
+}
+
+@utility fix-y-text-* {
+  /* Custom value */
+  /* Use 2 for >14px font size */
+  /* Use 1 for <=14px font size */
+  transform: translateY(calc(--value(integer) * 0.0625em));
+}
+
+@utility focus-visible-auto {
+  @apply focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none;
+}
+
+@utility focus-visible-default {
+  @apply focus-visible:ring-2 focus-visible:ring-stroke-focus-outline-def focus-visible:ring-offset-2 focus-visible:outline-none;
+}
+
+@utility focus-visible-* {
+  @apply focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none;
+
+  &:focus-visible {
+    --tw-ring-color: --value(--color-*);
+  }
+}
+
+@utility focus-within-auto {
+  @apply focus-within:ring-2 focus-within:ring-offset-2 focus-within:outline-none;
+}
+
+@utility focus-within-default {
+  @apply focus-within:ring-2 focus-within:ring-stroke-focus-outline-def focus-within:ring-offset-2 focus-within:outline-none;
+}
+
+@utility focus-within-* {
+  @apply focus-within:ring-2 focus-within:ring-offset-2 focus-within:outline-none;
+
+  &:focus-within {
+    --tw-ring-color: --value(--color-*);
+  }
+}
+
+@utility focus-auto {
+  @apply focus:ring-2 focus:ring-offset-2 focus:outline-none;
+}
+
+@utility focus-default {
+  @apply focus:ring-2 focus:ring-stroke-focus-outline-def focus:ring-offset-2 focus:outline-none;
+}
+
+@utility focus-* {
+  @apply focus:ring-2 focus:ring-offset-2 focus:outline-none;
+
+  &:focus-visible {
+    --tw-ring-color: --value(--color-*);
+  }
+}
+
+@utility dropdown-shadow-default {
+  box-shadow: 0 8px 32px 0 rgba(59, 18, 107, 0.2);
+  /* Box shadow seems to have better performance on safari and since the cards in dropdowns are not transparent should work as intended */
+  /* transform: translateZ(0);
+  filter: drop-shadow(0px 8px 16px rgba(59, 18, 107, 0.2)); */
+}

package/dist/styles/white-label.css

@@ -0,0 +1,25 @@
+@theme static {
+  /* color */
+  --brand-12: var(--color-transparent-brand-12);
+  --brand-15: var(--color-transparent-brand-15);
+  --brand-8: var(--color-transparent-brand-8);
+  --brand-disabled: var(--color-purple-200);
+  --brand-focused: var(--color-purple-700);
+  --brand-hover: var(--color-purple-600);
+  --brand-primary: var(--color-purple-500);
+  --brand-quaternary: var(--color-purple-400);
+  --brand-secondary: var(--color-purple-300);
+  --brand-tertiary: var(--color-purple-100);
+  --brand-white: var(--color-neutral-off-white);
+  --gray-100: var(--color-gray-100);
+  --gray-1000: var(--color-gray-1000);
+  --gray-200: var(--color-gray-200);
+  --gray-300: var(--color-gray-300);
+  --gray-400: var(--color-gray-400);
+  --gray-50: var(--color-gray-50);
+  --gray-500: var(--color-gray-500);
+  --gray-600: var(--color-gray-600);
+  --gray-700: var(--color-gray-700);
+  --gray-800: var(--color-gray-800);
+  --gray-900: var(--color-gray-900);
+}

package/dist/utils/cn.d.ts

@@ -1,3 +1,3 @@
 import { ClassValue } from 'clsx';
-export declare function cn(...inputs: ClassValue[]): string;
+export declare const cn: (...inputs: ClassValue[]) => string;
 //# sourceMappingURL=cn.d.ts.map

package/dist/utils/cn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cn.d.ts","sourceRoot":"","sources":["../../src/utils/cn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAG5C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}
+{"version":3,"file":"cn.d.ts","sourceRoot":"","sources":["../../src/utils/cn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAkK5C,eAAO,MAAM,EAAE,GAAI,GAAG,QAAQ,UAAU,EAAE,WAEzC,CAAA"}

package/dist/utils/cn.js

@@ -0,0 +1,159 @@
+import { clsx as c } from "clsx";
+import { extendTailwindMerge as m } from "tailwind-merge";
+const o = [
+  "none",
+  "3xs",
+  "2xs",
+  "xs",
+  "sm",
+  "md",
+  "lg",
+  "xl",
+  "2xl",
+  "3xl",
+  "4xl",
+  "5xl",
+  "6xl",
+  "7xl",
+  "8xl",
+  "9xl",
+  "10xl",
+  "full",
+  "comp-accordion-ico-size-sm",
+  "comp-accordion-ico-size-md",
+  "comp-accordion-p-hor",
+  "comp-accordion-ico-size-lg",
+  "comp-accordion-p",
+  "comp-accordion-settings-corner-radius",
+  "comp-accordion-settings-gap",
+  "comp-accordion-settings-p",
+  "comp-alert-gap-sm",
+  "comp-alert-hor-p-sm",
+  "comp-alert-gap-lg",
+  "comp-alert-hor-p-lg",
+  "comp-alert-ver-p-sm",
+  "comp-alert-ico-size",
+  "comp-alert-ver-p-lg",
+  "comp-attachment-p",
+  "comp-benefit-card-ico-size",
+  "comp-breadcrumb-gap",
+  "comp-breadcrumb-ico-size-sm",
+  "comp-button-p-none",
+  "comp-button-gap",
+  "comp-button-p-xxs",
+  "comp-button-p-xs",
+  "comp-button-p-md",
+  "comp-button-p-sm",
+  "comp-button-h-xs",
+  "comp-button-p-def",
+  "comp-button-p-lg",
+  "comp-button-w-xs",
+  "comp-button-h-sm",
+  "comp-button-w-sm",
+  "comp-button-h-def",
+  "comp-button-w-def",
+  "comp-button-h-lg",
+  "comp-button-w-lg",
+  "comp-calendar-ico-size",
+  "comp-calendar-window-size",
+  "comp-card-p-hor",
+  "comp-card-p-ver",
+  "comp-card-category-ico-size",
+  "comp-card-category-p",
+  "comp-card-category-h",
+  "comp-card-dashboard-p",
+  "comp-card-dashboard-ico-bg-size",
+  "comp-card-dashboard-p-right",
+  "comp-carousel-circle-size",
+  "comp-checkbox-w-stroke",
+  "comp-dialog-p",
+  "comp-dialog-gap",
+  "comp-dialog-p-hor-overlay",
+  "comp-dialog-img-h",
+  "comp-dialog-img-w",
+  "comp-dialog-w-sm",
+  "comp-dialog-w-md",
+  "comp-dialog-w-lg",
+  "comp-dialog-android-p-ver-sm",
+  "comp-dialog-android-gap",
+  "comp-dialog-android-p-hor-sm",
+  "comp-dialog-android-p-hor-def",
+  "comp-dialog-android-p-ver-def",
+  "comp-empty-state-gap",
+  "comp-empty-state-ico-size",
+  "comp-file-upload-ico-size",
+  "comp-header-gap",
+  "comp-header-p-hor-d",
+  "comp-help-button-p",
+  "comp-help-button-h",
+  "comp-input-gap",
+  "comp-input-spacing-pin",
+  "comp-input-p-hor",
+  "comp-input-h-small",
+  "comp-input-h-def",
+  "comp-input-h-large",
+  "comp-internal-benefits-circle-size",
+  "comp-login-circle-size",
+  "comp-pin-indicator-stroke-width",
+  "comp-pin-indicator-size",
+  "comp-pin-indicator-gap",
+  "comp-popup-p",
+  "comp-quantity-selector-p-hor",
+  "comp-quantity-selector-p-ver",
+  "comp-radio-w-stroke",
+  "comp-radio-dot-size",
+  "comp-segmented-control-p",
+  "comp-segmented-control-max-width-item",
+  "comp-segmented-control-max-width",
+  "comp-select-p-large",
+  "comp-select-p-def",
+  "comp-select-h-small",
+  "comp-select-h-def",
+  "comp-select-h-large",
+  "comp-slider-indicator-dot-size",
+  "comp-slider-indicator-gap",
+  "comp-stepper-gap",
+  "comp-stepper-btn-size",
+  "comp-story-gap",
+  "comp-submenu-admin-divider-h",
+  "comp-submenu-admin-bg-ico-size",
+  "comp-submenu-admin-divider-w",
+  "comp-switch-height-def",
+  "comp-tab-bar-gap-sm",
+  "comp-tab-bar-p-ver-def",
+  "comp-tab-bar-gap-def",
+  "comp-tab-bar-p-hor-def",
+  "comp-table-p",
+  "comp-table-img-size",
+  "comp-table-h",
+  "comp-tag-dot-size",
+  "comp-tag-ico-size",
+  "comp-tag-h-sm",
+  "comp-tag-h-def",
+  "comp-texteditor-ico-bg-size",
+  "comp-time-picker-container-h",
+  "comp-top-nav-bar-p-hor",
+  "comp-top-nav-bar-p-ver",
+  "comp-top-nav-bar-h",
+  "icon-xsmall",
+  "icon-small",
+  "icon-medium",
+  "icon-large",
+  "icon-xlarge",
+  "icon-2xlarge",
+  "layout-p-top",
+  "layout-gap-web",
+  "layout-gap-standard",
+  "layout-p-standard"
+], e = m({
+  extend: {
+    theme: {
+      spacing: o,
+      radius: o
+    },
+    classGroups: {}
+  }
+}), i = (...p) => e(c(p));
+export {
+  i as cn
+};

package/dist/utils/index.d.ts

@@ -1,2 +1,3 @@
 export * from './cn';
+export * from './spacing';
 //# sourceMappingURL=index.d.ts.map

package/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,MAAM,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,MAAM,CAAA;AACpB,cAAc,WAAW,CAAA"}