@konstructio/ui 0.0.2

package/dist/index.js

@@ -0,0 +1,50 @@
+import { AlertDialog as e } from "./components/AlertDialog/AlertDialog.js";
+import { Autocomplete as m } from "./components/Autocomplete/Autocomplete.js";
+import { Breadcrumb as x } from "./components/Breadcrumb/Breadcrumb.js";
+import { Button as a } from "./components/Button/Button.js";
+import { Checkbox as l } from "./components/Checkbox/Checkbox.js";
+import { Dropdown as g } from "./components/Dropdown/Dropdown.js";
+import { Input as i } from "./components/Input/Input.js";
+import { M as c } from "./Modal-CO0_SnXD.js";
+import { NumberInput as h } from "./components/NumberInput/NumberInput.js";
+import { ProgressBar as A } from "./components/ProgressBar/ProgressBar.js";
+import { Radio as P } from "./components/Radio/Radio.js";
+import { Range as k } from "./components/Range/Range.js";
+import { Slider as C } from "./components/Slider/Slider.js";
+import { Switch as I } from "./components/Switch/Switch.js";
+import { Tag as R } from "./components/Tag/Tag.js";
+import { TagSelect as N } from "./components/TagSelect/TagSelect.js";
+import { TextArea as q } from "./components/TextArea/TextArea.js";
+import { Toast as z } from "./components/Toast/Toast.js";
+import { Tooltip as F } from "./components/Tooltip/Tooltip.js";
+import { ThemeContext as H } from "./contexts/theme.context.js";
+import { useTheme as K } from "./contexts/theme.hook.js";
+import { ThemeProvider as O } from "./contexts/theme.provider.js";
+import { useToggle as U } from "./hooks/useToggle.js";
+import { konstructPlugin as W } from "./plugins/konstruct.js";
+export {
+  e as AlertDialog,
+  m as Autocomplete,
+  x as Breadcrumb,
+  a as Button,
+  l as Checkbox,
+  g as Dropdown,
+  i as Input,
+  c as Modal,
+  h as NumberInput,
+  A as ProgressBar,
+  P as Radio,
+  k as Range,
+  C as Slider,
+  I as Switch,
+  R as Tag,
+  N as TagSelect,
+  q as TextArea,
+  H as ThemeContext,
+  O as ThemeProvider,
+  z as Toast,
+  F as Tooltip,
+  W as konstructPlugin,
+  K as useTheme,
+  U as useToggle
+};

package/dist/js.cookie-OLEfuq_g.js

@@ -0,0 +1,74 @@
+/*! js-cookie v3.0.5 | MIT */
+function d(r) {
+  for (var c = 1; c < arguments.length; c++) {
+    var f = arguments[c];
+    for (var p in f)
+      r[p] = f[p];
+  }
+  return r;
+}
+var g = {
+  read: function(r) {
+    return r[0] === '"' && (r = r.slice(1, -1)), r.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent);
+  },
+  write: function(r) {
+    return encodeURIComponent(r).replace(
+      /%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
+      decodeURIComponent
+    );
+  }
+};
+function s(r, c) {
+  function f(n, t, e) {
+    if (!(typeof document > "u")) {
+      e = d({}, c, e), typeof e.expires == "number" && (e.expires = new Date(Date.now() + e.expires * 864e5)), e.expires && (e.expires = e.expires.toUTCString()), n = encodeURIComponent(n).replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent).replace(/[()]/g, escape);
+      var o = "";
+      for (var i in e)
+        e[i] && (o += "; " + i, e[i] !== !0 && (o += "=" + e[i].split(";")[0]));
+      return document.cookie = n + "=" + r.write(t, n) + o;
+    }
+  }
+  function p(n) {
+    if (!(typeof document > "u" || arguments.length && !n)) {
+      for (var t = document.cookie ? document.cookie.split("; ") : [], e = {}, o = 0; o < t.length; o++) {
+        var i = t[o].split("="), v = i.slice(1).join("=");
+        try {
+          var u = decodeURIComponent(i[0]);
+          if (e[u] = r.read(v, u), n === u)
+            break;
+        } catch {
+        }
+      }
+      return n ? e[n] : e;
+    }
+  }
+  return Object.create(
+    {
+      set: f,
+      get: p,
+      remove: function(n, t) {
+        f(
+          n,
+          "",
+          d({}, t, {
+            expires: -1
+          })
+        );
+      },
+      withAttributes: function(n) {
+        return s(this.converter, d({}, this.attributes, n));
+      },
+      withConverter: function(n) {
+        return s(d({}, this.converter, n), this.attributes);
+      }
+    },
+    {
+      attributes: { value: Object.freeze(c) },
+      converter: { value: Object.freeze(r) }
+    }
+  );
+}
+var a = s(g, { path: "/" });
+export {
+  a
+};

package/dist/package.json

@@ -0,0 +1,118 @@
+{
+  "name": "@konstructio/ui",
+  "description": "A set of reusable and customizable React components built for konstruct.io",
+  "private": false,
+  "version": "0.0.1",
+  "type": "module",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "files": [
+    "dist"
+  ],
+  "author": {
+    "name": "Jesús Manuel Fuentes Trejo",
+    "email": "me@futjesus.dev",
+    "url": "https://futjesus.dev"
+  },
+  "keywords": [
+    "konstruct",
+    "colony",
+    "kubefirst",
+    "react",
+    "tailwind",
+    "vite",
+    "vitest",
+    "radix"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/konstructio/konstruct-ui.git"
+  },
+  "bugs": {
+    "url": "https://github.com/konstructio/konstruct-ui/issues"
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "homepage": "https://konstructio.github.io/konstruct-ui",
+  "scripts": {
+    "build": "rimraf ./dist & tsc --p ./tsconfig.build.json && vite build && cp ./package.json ./dist/package.json",
+    "build:storybook": "storybook build -o storybook-static && cp -r public/* storybook-static",
+    "check:prettier": "prettier lib --check --config ./.prettierrc",
+    "check:types": "tsc -p tsconfig.json",
+    "ci": "npm run build && npm run check:prettier && vitest run",
+    "deps:update": "npx npm-check-updates --interactive --format group",
+    "dev": "vite",
+    "format:prettier": "prettier lib --write './**/*.{js,jsx,ts,tsx}' --config ./.prettierrc",
+    "lint": "eslint lib --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "prepare": "husky",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "test": "vitest run --coverage",
+    "test:watch": "vitest run -w"
+  },
+  "dependencies": {
+    "@radix-ui/react-alert-dialog": "^1.1.2",
+    "@radix-ui/react-checkbox": "^1.1.2",
+    "@radix-ui/react-slider": "^1.2.1",
+    "@radix-ui/react-slot": "^1.1.0",
+    "@radix-ui/react-switch": "^1.1.1",
+    "@radix-ui/react-toast": "^1.2.2",
+    "@radix-ui/react-visually-hidden": "^1.1.0",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.1",
+    "js-cookie": "^3.0.5",
+    "react-feather": "^2.0.10",
+    "react-focus-lock": "^2.13.2",
+    "react-remove-scroll": "^2.6.0",
+    "react-router-dom": "^6.28.0",
+    "tailwind-merge": "^2.5.4"
+  },
+  "peerDependencies": {
+    "react": "^18",
+    "react-dom": "^18"
+  },
+  "devDependencies": {
+    "@arethetypeswrong/cli": "^0.17.0",
+    "@storybook/addon-essentials": "^8.4.4",
+    "@storybook/addon-interactions": "^8.4.4",
+    "@storybook/addon-links": "^8.4.4",
+    "@storybook/addon-styling-webpack": "^1.0.1",
+    "@storybook/blocks": "^8.4.4",
+    "@storybook/react": "^8.4.4",
+    "@storybook/react-vite": "^8.4.4",
+    "@storybook/test": "^8.4.4",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.0.1",
+    "@testing-library/user-event": "^14.5.2",
+    "@types/js-cookie": "^3.0.6",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
+    "@typescript-eslint/eslint-plugin": "^8.14.0",
+    "@typescript-eslint/parser": "^8.14.0",
+    "@vitejs/plugin-react": "^4.3.3",
+    "@vitest/coverage-v8": "^2.1.5",
+    "ajv": "^8.17.1",
+    "autoprefixer": "^10.4.20",
+    "eslint": "^8.57.0",
+    "eslint-plugin-react-hooks": "^4.6.2",
+    "eslint-plugin-react-refresh": "^0.4.7",
+    "eslint-plugin-storybook": "^0.9.0",
+    "glob": "^11.0.0",
+    "husky": "^9.1.6",
+    "jsdom": "^25.0.1",
+    "postcss": "^8.4.49",
+    "prettier": "^3.3.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "rimraf": "^6.0.1",
+    "storybook": "^8.4.4",
+    "tailwindcss": "^3.4.14",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.6.3",
+    "vite": "^5.4.11",
+    "vite-plugin-dts": "^4.3.0",
+    "vite-plugin-lib-inject-css": "^2.1.1",
+    "vitest": "^2.1.5"
+  }
+}

package/dist/plugins/index.d.ts

@@ -0,0 +1 @@
+export * from './konstruct';

package/dist/plugins/index.js

@@ -0,0 +1,4 @@
+import { konstructPlugin as t } from "./konstruct.js";
+export {
+  t as konstructPlugin
+};

package/dist/plugins/konstruct.d.ts

@@ -0,0 +1,4 @@
+export declare const konstructPlugin: {
+    handler: import('tailwindcss/types/config').PluginCreator;
+    config?: Partial<import('tailwindcss/types/config').Config>;
+};

package/dist/plugins/konstruct.js

@@ -0,0 +1,104 @@
+import { g as l } from "../_commonjsHelpers-C6fGbg64.js";
+import { konstructColors as s } from "./utils/colors.js";
+var c = {}, d = {};
+(function(t) {
+  Object.defineProperty(t, "__esModule", {
+    value: !0
+  }), Object.defineProperty(t, "default", {
+    enumerable: !0,
+    get: function() {
+      return o;
+    }
+  });
+  function r(n, e) {
+    return {
+      handler: n,
+      config: e
+    };
+  }
+  r.withOptions = function(n, e = () => ({})) {
+    const i = function(a) {
+      return {
+        __options: a,
+        handler: n(a),
+        config: e(a)
+      };
+    };
+    return i.__isOptionsFunction = !0, i.__pluginFunction = n, i.__configFunction = e, i;
+  };
+  const o = r;
+})(d);
+(function(t) {
+  Object.defineProperty(t, "__esModule", {
+    value: !0
+  }), Object.defineProperty(t, "default", {
+    enumerable: !0,
+    get: function() {
+      return n;
+    }
+  });
+  const r = /* @__PURE__ */ o(d);
+  function o(e) {
+    return e && e.__esModule ? e : {
+      default: e
+    };
+  }
+  const n = r.default;
+})(c);
+let u = c;
+var f = (u.__esModule ? u : { default: u }).default;
+const g = /* @__PURE__ */ l(f), _ = g(
+  function({ addBase: t }) {
+    t({
+      ":root": {
+        "--viewport-padding": "25px"
+      }
+    });
+  },
+  {
+    theme: {
+      extend: {
+        colors: { ...s },
+        viewportPadding: "",
+        backgroundImage: {
+          "kubefirst-gradient": "linear-gradient(90deg, #81E2B4, #8851C8)"
+        },
+        animation: {
+          "gradient-move": "moveGradient 6s linear infinite",
+          "slide-in": "slideIn 150ms cubic-bezier(0.16, 1, 0.3, 1)",
+          "swipe-out": "swipeOut 150ms cubic-bezier(0.16, 1, 0.3, 1)"
+        },
+        keyframes: {
+          moveGradient: {
+            "0%": { backgroundPosition: "0% 50%" },
+            "50%": { backgroundPosition: "100% 50%" },
+            "100%": { backgroundPosition: "0% 50%" }
+          },
+          hide: {
+            from: { opacity: "1" },
+            to: { opacity: "0" }
+          },
+          slideIn: {
+            from: {
+              transform: "translateX(calc(100% + var(--viewport-padding)))"
+            },
+            to: {
+              transform: "translateX(0)"
+            }
+          },
+          swipeOut: {
+            from: {
+              transform: "translateX(0)"
+            },
+            to: {
+              transform: "translateX(calc(100% + var(--viewport-padding)))"
+            }
+          }
+        }
+      }
+    }
+  }
+);
+export {
+  _ as konstructPlugin
+};

package/dist/plugins/utils/colors.d.ts

@@ -0,0 +1,206 @@
+export declare const konstructColors: {
+    black: "#000";
+    white: "#fff";
+    blue: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    gray: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    green: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    indigo: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    metal: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    neutral: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    orange: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    pink: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    powder: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    purple: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    red: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    slate: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    stone: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    teal: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    yellow: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    zinc: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    facebook: string;
+    twitter: string;
+    github: string;
+    linkedin: string;
+    youtube: string;
+    slack: string;
+    kubefirst: {
+        'purple-light': string;
+        'purple-dark': string;
+    };
+};