refactor: hoppscotch ui (#2887)

* feat: hopp ui initialized * feat: button components added * feat: windi css integration * chore: package removed from hopp ui * feat: storybook added * feat: move all smart components hoppscotch-ui * fix: import issue from components/smart * fix: env input component import * feat: add hoppui to windicss config * fix: remove storybook * feat: move components from hoppscotch-ui * feat: storybook added * feat: storybook progress * feat: themeing storybook * feat: add stories * chore: package updated * chore: stories added * feat: stories added * feat: stories added * feat: icons resolved * feat: i18n composable resolved * feat: histoire added * chore: resolved prettier issue * feat: radio story added * feat: story added for all components * feat: new components added to stories * fix: resolved issues * feat: readme.md added * feat: context/provider added * chore: removed app component registry * chore: remove importing of all components in hopp-ui to allow code splitting * chore: fix vite config errors * chore: jsdoc added * chore: any replaced with smart-item * chore: i18n added to ui components * chore: clean up - removed a duplicate button --------- Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com> Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>
2023-01-28 08:57:00 +06:00
parent 9d7052c626
commit 0fcda0be1a
65 changed files with 2961 additions and 214 deletions
--- a/packages/hoppscotch-ui/windi.config.ts
+++ b/packages/hoppscotch-ui/windi.config.ts
@@ -0,0 +1,65 @@
+import { defineConfig } from "windicss/helpers"
+
+export default defineConfig({
+  theme: {
+    container: {
+      center: true,
+    },
+    extend: {
+      inset: {
+        upperPrimaryStickyFold: "var(--upper-primary-sticky-fold)",
+        upperSecondaryStickyFold: "var(--upper-secondary-sticky-fold)",
+        upperTertiaryStickyFold: "var(--upper-tertiary-sticky-fold)",
+        upperMobilePrimaryStickyFold: "var(--upper-mobile-primary-sticky-fold)",
+        upperMobileSecondaryStickyFold:
+          "var(--upper-mobile-secondary-sticky-fold)",
+        upperMobileStickyFold: "var(--upper-mobile-sticky-fold)",
+        upperMobileTertiaryStickyFold:
+          "var(--upper-mobile-tertiary-sticky-fold)",
+        lowerPrimaryStickyFold: "var(--lower-primary-sticky-fold)",
+        lowerSecondaryStickyFold: "var(--lower-secondary-sticky-fold)",
+        lowerTertiaryStickyFold: "var(--lower-tertiary-sticky-fold)",
+        sidebarPrimaryStickyFold: "var(--sidebar-primary-sticky-fold)",
+      },
+      colors: {
+        primary: "var(--primary-color)",
+        primaryLight: "var(--primary-light-color)",
+        primaryDark: "var(--primary-dark-color)",
+        primaryContrast: "var(--primary-contrast-color)",
+        secondary: "var(--secondary-color)",
+        secondaryLight: "var(--secondary-light-color)",
+        secondaryDark: "var(--secondary-dark-color)",
+        accent: "var(--accent-color)",
+        accentLight: "var(--accent-light-color)",
+        accentDark: "var(--accent-dark-color)",
+        accentContrast: "var(--accent-contrast-color)",
+        divider: "var(--divider-color)",
+        dividerLight: "var(--divider-light-color)",
+        dividerDark: "var(--divider-dark-color)",
+        error: "var(--error-color)",
+        tooltip: "var(--tooltip-color)",
+        popover: "var(--popover-color)",
+        gradientFrom: "var(--gradient-from-color)",
+        gradientVia: "var(--gradient-via-color)",
+        gradientTo: "var(--gradient-to-color)",
+      },
+      fontFamily: {
+        sans: "var(--font-sans)",
+        mono: "var(--font-mono)",
+        icon: "var(--font-icon)",
+      },
+      fontSize: {
+        tiny: "var(--font-size-tiny)",
+        body: "var(--font-size-body)",
+      },
+      lineHeight: {
+        body: "var(--line-height-body)",
+      },
+      cursor: {
+        nsResize: "ns-resize",
+        grab: "grab",
+        grabbing: "grabbing",
+      },
+    },
+  },
+})