@kong/kongponents 9.45.2-pr.2966.e9b6b84.0 → 9.45.3

package/dist/nuxt/index.js

@@ -42,8 +42,8 @@ export default defineNuxtModule({
                 name,
                 export: name,
                 filePath: '@kong/kongponents',
-                //!IMPORTANT: we must register components as global because the Nuxt app might be using packages that rely on Kongponents being globally available
-                global: true,
+                // we don't need global registration here
+                global: false,
                 // 'all' means both client and server
                 mode: 'all',
             });
@@ -64,6 +64,6 @@ export default defineNuxtModule({
                 },
             });
         });
-        logger.success('Kongponents module has been registered 🚀');
+        logger.success('🚀 Kongponents module has been registered.');
     },
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kong/kongponents",
-  "version": "9.45.2-pr.2966.e9b6b84.0",
+  "version": "9.45.3",
   "description": "Kong Component library",
   "type": "module",
   "repository": {
@@ -8,7 +8,7 @@
     "url": "https://github.com/Kong/kongponents.git"
   },
   "homepage": "https://kongponents.konghq.com/",
-  "main": "./dist/kongponents.cjs",
+  "main": "./dist/kongponents.umd.js",
   "module": "./dist/kongponents.es.js",
   "files": [
     "dist",
@@ -20,7 +20,7 @@
     ".": {
       "types": "./dist/types/index.d.ts",
       "import": "./dist/kongponents.es.js",
-      "require": "./dist/kongponents.cjs"
+      "require": "./dist/kongponents.umd.js"
     },
     "./nuxt": {
       "import": "./dist/nuxt/index.js",
@@ -30,6 +30,34 @@
     "./package.json": "./package.json",
     "./dist/*": "./dist/*"
   },
+  "scripts": {
+    "build:cli": "rimraf ./bin && tsc --project ./cli/tsconfig.json && chmod u+x ./bin/index.js",
+    "build:docs": "vitepress build docs",
+    "build:kongponents": "pnpm typecheck && vite build && vue-tsc -p './tsconfig.build.json' --emitDeclarationOnly && tsc-alias -p './tsconfig.build.json' && pnpm build:nuxt",
+    "build:nuxt": "tsc -p ./tsconfig.build.nuxt.json --outDir dist/nuxt",
+    "build:visualize": "cross-env-shell BUILD_VISUALIZER=true vite build -m production",
+    "build": "pnpm build:cli && pnpm stylelint && pnpm lint && pnpm build:kongponents && pnpm build:docs",
+    "build:ci": "pnpm build:kongponents && pnpm build:docs",
+    "commit": "cz",
+    "create-kongponent": "node ./bin/index.js",
+    "sandbox:dev": "cross-env USE_SANDBOX=true vite",
+    "sandbox:build": "cross-env USE_SANDBOX=true vite build && shx cp sandbox/dist/index.html sandbox/dist/404.html",
+    "sandbox:build:netlify": "cross-env USE_SANDBOX=true USE_NETLIFY=true vite build && shx cp sandbox/dist/index.html sandbox/dist/404.html",
+    "sandbox:preview": "cross-env USE_SANDBOX=true vite preview",
+    "docs:build": "vitepress build docs",
+    "docs:dev": "vitepress dev docs",
+    "docs:serve": "vitepress serve docs",
+    "docs:preview": "vitepress preview docs --port 8080",
+    "typecheck": "vue-tsc -p './tsconfig.build.json' --noEmit",
+    "lint": "eslint",
+    "lint:fix": "eslint --fix",
+    "stylelint": "stylelint './src/**/*.{css,scss,sass,vue}'",
+    "stylelint:fix": "stylelint './src/**/*.{css,scss,sass,vue}' --fix",
+    "test": "cypress run --component -b chrome",
+    "test:open": "cypress open --component -b chrome",
+    "test:spec": "cypress run --component -b chrome --spec",
+    "semantic-release": "semantic-release"
+  },
   "dependencies": {
     "@floating-ui/vue": "^1.1.9",
     "@kong/icons": "^1.39.0",
@@ -166,6 +194,7 @@
     "node": ">=v16.20.2 || >=18.12.1 || >=20.14.0 || >=22.14.0",
     "pnpm": ">=9.11.0 || >=10.10.0"
   },
+  "packageManager": "pnpm@10.18.3",
   "volta": {
     "node": "24.10.0",
     "pnpm": "10.18.3"
@@ -179,34 +208,5 @@
       "jiraPrepend": "[",
       "jiraAppend": "]"
     }
-  },
-  "scripts": {
-    "build:cli": "rimraf ./bin && tsc --project ./cli/tsconfig.json && chmod u+x ./bin/index.js",
-    "build:docs": "vitepress build docs",
-    "build:kongponents:umd": "BUILD_UMD=true vite build",
-    "build:kongponents": "pnpm typecheck && vite build && vue-tsc -p './tsconfig.build.json' --emitDeclarationOnly && tsc-alias -p './tsconfig.build.json' && pnpm build:kongponents:umd && pnpm build:nuxt",
-    "build:nuxt": "tsc -p ./tsconfig.build.nuxt.json --outDir dist/nuxt",
-    "build:visualize": "cross-env-shell BUILD_VISUALIZER=true vite build -m production",
-    "build": "pnpm build:cli && pnpm stylelint && pnpm lint && pnpm build:kongponents && pnpm build:docs",
-    "build:ci": "pnpm build:kongponents && pnpm build:docs",
-    "commit": "cz",
-    "create-kongponent": "node ./bin/index.js",
-    "sandbox:dev": "cross-env USE_SANDBOX=true vite",
-    "sandbox:build": "cross-env USE_SANDBOX=true vite build && shx cp sandbox/dist/index.html sandbox/dist/404.html",
-    "sandbox:build:netlify": "cross-env USE_SANDBOX=true USE_NETLIFY=true vite build && shx cp sandbox/dist/index.html sandbox/dist/404.html",
-    "sandbox:preview": "cross-env USE_SANDBOX=true vite preview",
-    "docs:build": "vitepress build docs",
-    "docs:dev": "vitepress dev docs",
-    "docs:serve": "vitepress serve docs",
-    "docs:preview": "vitepress preview docs --port 8080",
-    "typecheck": "vue-tsc -p './tsconfig.build.json' --noEmit",
-    "lint": "eslint",
-    "lint:fix": "eslint --fix",
-    "stylelint": "stylelint './src/**/*.{css,scss,sass,vue}'",
-    "stylelint:fix": "stylelint './src/**/*.{css,scss,sass,vue}' --fix",
-    "test": "cypress run --component -b chrome",
-    "test:open": "cypress open --component -b chrome",
-    "test:spec": "cypress run --component -b chrome --spec",
-    "semantic-release": "semantic-release"
   }
-}
+}

package/dist/kongponents.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("./kongponents2.cjs");;/* empty css               */const s=require("./kongponents4.cjs"),t=require("./kongponents5.cjs"),u=require("./kongponents6.cjs"),d=require("./kongponents7.cjs"),c=require("./kongponents8.cjs"),K=require("./kongponents9.cjs"),e=require("./kongponents10.cjs"),p=require("./kongponents11.cjs"),q=require("./kongponents12.cjs"),n=require("./kongponents13.cjs"),f=require("./kongponents14.cjs"),a=require("./kongponents15.cjs"),y=require("./kongponents16.cjs"),g=require("./kongponents17.cjs"),A=require("./kongponents18.cjs"),T=require("./kongponents19.cjs"),_=require("./kongponents20.cjs"),S=require("./kongponents21.cjs");;/* empty css                */const m=require("./kongponents23.cjs"),B=require("./kongponents24.cjs");;/* empty css                */const k=require("./kongponents26.cjs");;/* empty css                */const M=require("./kongponents28.cjs"),C=require("./kongponents29.cjs"),b=require("./kongponents30.cjs"),P=require("./kongponents31.cjs"),v=require("./kongponents32.cjs"),x=require("./kongponents33.cjs"),h=require("./kongponents34.cjs"),D=require("./kongponents35.cjs"),I=require("./kongponents36.cjs"),w=require("./kongponents37.cjs"),z=require("./kongponents38.cjs"),E=require("./kongponents39.cjs"),H=require("./kongponents40.cjs"),L=require("./kongponents41.cjs"),i=require("./kongponents42.cjs"),R=require("./kongponents43.cjs"),V=require("./kongponents44.cjs"),F=require("./kongponents45.cjs"),O=require("./kongponents46.cjs"),U=require("./kongponents47.cjs"),W=require("./kongponents48.cjs"),$=require("./kongponents49.cjs"),j=require("./kongponents50.cjs"),G=require("./kongponents51.cjs"),J=require("./kongponents52.cjs"),N=require("./kongponents53.cjs"),Q=require("./kongponents54.cjs"),X=require("./kongponents55.cjs"),Y=require("./kongponents56.cjs"),Z=require("./kongponents57.cjs"),ee=require("./kongponents58.cjs"),re=require("./kongponents59.cjs"),te=require("./kongponents60.cjs"),ae=require("./kongponents61.cjs"),oe=require("./kongponents62.cjs"),ue=require("./kongponents63.cjs"),ne=require("./kongponents64.cjs"),ie=require("./kongponents65.cjs"),le=require("./kongponents66.cjs"),se=require("./kongponents67.cjs"),de=require("./kongponents68.cjs"),ce=require("./kongponents69.cjs"),Ke={install:l=>{for(const o in r)l.component(o,r[o])}};exports.components=r;exports.AlertAppearances=s.AlertAppearances;exports.BadgeAppearances=t.BadgeAppearances;exports.BadgeMethodAppearances=t.BadgeMethodAppearances;exports.BadgeSizes=t.BadgeSizes;exports.ButtonAppearances=u.ButtonAppearances;exports.ButtonSizes=u.ButtonSizes;exports.HeaderTags=d.HeaderTags;exports.CardSizeArray=c.CardSizeArray;exports.TriggerAlignmentArray=K.TriggerAlignmentArray;exports.DateTimePickerModes=e.DateTimePickerModes;exports.ModeArray=e.ModeArray;exports.ModeArrayCustom=e.ModeArrayCustom;exports.ModeArrayRelative=e.ModeArrayRelative;exports.ModeDateOnly=e.ModeDateOnly;exports.TimepickerMode=e.TimepickerMode;exports.EmptyStateIconVariants=p.EmptyStateIconVariants;exports.MethodsArray=q.MethodsArray;exports.PopPlacementsArray=n.PopPlacementsArray;exports.PopTriggerArray=n.PopTriggerArray;exports.RadioTypesArray=f.RadioTypesArray;exports.SkeletonBoxHeightArray=a.SkeletonBoxHeightArray;exports.SkeletonBoxWidthArray=a.SkeletonBoxWidthArray;exports.SkeletonTypeArray=a.SkeletonTypeArray;exports.StepperStateArray=y.StepperStateArray;exports.TableViewHeaderKeys=g.TableViewHeaderKeys;exports.ToasterAppearances=A.ToasterAppearances;exports.KClipboardProvider=T.default;exports.KToggle=_.default;exports.KSkeleton=S.default;exports.ToastManager=m.default;exports.KTooltip=B.default;exports.KTreeList=k.default;exports.KTableData=M.default;exports.KComponent=C.default;exports.KAlert=b.default;exports.KBadge=P.default;exports.KBreadcrumbs=v.default;exports.KButton=x.default;exports.KCard=h.default;exports.KCatalog=D.default;exports.KCatalogItem=I.default;exports.KCheckbox=w.default;exports.KCodeBlock=z.default;exports.KCodeBlockIconButton=E.default;exports.KCollapse=H.default;exports.KDateTimePicker=L.default;exports.KDropdown=i.default;exports.KDropdownMenu=i.default;exports.KDropdownItem=R.default;exports.KEmptyState=V.default;exports.KFileUpload=F.default;exports.KInput=O.default;exports.KInputSwitch=U.default;exports.KLabel=W.default;exports.KModal=$.default;exports.KModalFullscreen=j.default;exports.KMultiselect=G.default;exports.KPagination=J.default;exports.KPop=N.default;exports.KPrompt=Q.default;exports.KRadio=X.default;exports.KSegmentedControl=Y.default;exports.KSelect=Z.default;exports.KSkeletonBox=ee.default;exports.KSlideout=re.default;exports.KStepper=te.default;exports.KTable=ae.default;exports.KTabs=oe.default;exports.KTextArea=ue.default;exports.KToaster=ne.default;exports.KExternalLink=ie.default;exports.KTruncate=le.default;exports.KCopy=se.default;exports.KTableView=de.default;exports.KSlider=ce.default;exports.default=Ke;

package/dist/kongponents.es10.js

@@ -1,24 +0,0 @@
-var t = /* @__PURE__ */ ((e) => (e.Date = "date", e.Time = "time", e.Datetime = "dateTime", e.Relative = "relative", e.RelativeDate = "relativeDate", e.RelativeDateTime = "relativeDateTime", e))(t || {});
-const a = t, l = Object.values(t), r = [
-  "date",
-  "time",
-  "dateTime"
-  /* Datetime */
-], v = [
-  "relative",
-  "relativeDate",
-  "relativeDateTime"
-  /* RelativeDateTime */
-], i = [
-  "date",
-  "relativeDate"
-  /* RelativeDate */
-];
-export {
-  t as DateTimePickerModes,
-  l as ModeArray,
-  r as ModeArrayCustom,
-  v as ModeArrayRelative,
-  i as ModeDateOnly,
-  a as TimepickerMode
-};

package/dist/kongponents.es102.js

@@ -1,105 +0,0 @@
-import { defineComponent as f, useAttrs as k, watch as b, computed as n, createElementBlock as h, openBlock as c, normalizeClass as y, createBlock as C, resolveDynamicComponent as p, mergeProps as w, withCtx as D, createElementVNode as B, renderSlot as $, createTextVNode as A, toDisplayString as I } from "vue";
-const M = { class: "dropdown-item-trigger-label" }, i = "dropdown-item-trigger", j = /* @__PURE__ */ f({
-  inheritAttrs: !1,
-  __name: "KDropdownItem",
-  props: {
-    item: { default: null },
-    hasDivider: { type: Boolean },
-    danger: { type: Boolean },
-    disabled: { type: Boolean },
-    selected: { type: Boolean },
-    selectionMenuChild: { type: Boolean },
-    onClick: { type: Function },
-    isDangerous: { type: Boolean, default: () => {
-    } }
-  },
-  emits: ["click", "change"],
-  setup(t, { emit: m }) {
-    const g = k();
-    b(() => t.isDangerous, (e) => {
-      typeof e < "u" && console.warn("KDropdownItem: `isDangerous` prop is deprecated. Please use `danger` prop instead. See the migration guide for more details: https://kongponents.konghq.com/guide/migrating-to-version-9.html#kdropdownmenu");
-    });
-    const r = m, o = n(() => {
-      var e;
-      return (e = t.item) != null && e.to ? "link" : typeof t.onClick < "u" || t.selectionMenuChild ? "button" : "default";
-    }), v = n(() => {
-      var e;
-      return ((e = t.item) == null ? void 0 : e.label) || "";
-    }), l = n(() => {
-      var e;
-      return ((e = t.item) == null ? void 0 : e.to) || void 0;
-    }), u = (e) => {
-      r("click", e), t.selectionMenuChild && r("change", t.item);
-    }, d = n(() => {
-      let e = "div";
-      return o.value === "link" && l.value && typeof l.value == "string" ? e = "link" : o.value === "link" && l.value && typeof l.value == "object" ? e = "router-link" : o.value === "button" && (e = "button"), e;
-    }), a = n(() => {
-      const e = Object.assign({}, g);
-      return delete e.class, delete e.disabled, delete e.style, e;
-    }), s = n(() => ({
-      link: {
-        tag: "a",
-        attrs: {
-          // add disabled class instead of disabled attribute because disabled is not a valid attribute for links
-          class: `${i} ${t.disabled ? "disabled" : ""}`,
-          href: l.value,
-          ...a.value
-        }
-      },
-      "router-link": {
-        tag: "router-link",
-        onClick: u,
-        attrs: {
-          // add disabled class instead of disabled attribute because disabled is not a valid attribute for links
-          class: `${i} ${t.disabled ? "disabled" : ""}`,
-          to: l.value,
-          ...a.value
-        }
-      },
-      button: {
-        tag: "button",
-        onClick: u,
-        attrs: {
-          type: "button",
-          // don't add disabled class because we want the disabled attribute on the button
-          class: i,
-          disabled: t.disabled,
-          ...a.value
-        }
-      },
-      div: {
-        tag: "div",
-        attrs: {
-          // add disabled class instead of disabled attribute because disabled is not a valid attribute for div
-          class: `${i} ${t.disabled ? "disabled" : ""}`,
-          ...a.value
-        }
-      }
-    }));
-    return (e, S) => (c(), h("li", {
-      class: y(["k-dropdown-item", [{
-        "has-divider": t.hasDivider,
-        disabled: t.disabled,
-        danger: t.danger || t.isDangerous,
-        "dropdown-selected-option": t.selected
-      }, e.$attrs.class, e.$attrs.style]]),
-      "data-testid": "dropdown-item"
-    }, [
-      (c(), C(p(s.value[d.value].tag), w({ "data-testid": "dropdown-item-trigger" }, s.value[d.value].attrs, {
-        onClick: s.value[d.value].onClick
-      }), {
-        default: D(() => [
-          B("span", M, [
-            $(e.$slots, "default", {}, () => [
-              A(I(v.value), 1)
-            ], !0)
-          ])
-        ]),
-        _: 3
-      }, 16, ["onClick"]))
-    ], 2));
-  }
-});
-export {
-  j as default
-};

package/dist/kongponents.es105.js

@@ -1,144 +0,0 @@
-import { defineComponent as T, useSlots as b, useId as K, computed as u, createElementBlock as i, openBlock as o, normalizeClass as f, createElementVNode as l, createCommentVNode as s, renderSlot as n, createBlock as y, resolveDynamicComponent as N, unref as k, createTextVNode as $, toDisplayString as c, createVNode as O, withCtx as d, Fragment as S, renderList as D } from "vue";
-import v from "./kongponents.es205.js";
-import R from "./kongponents.es187.js";
-import U from "./kongponents.es183.js";
-import A from "./kongponents.es201.js";
-import { KUI_COLOR_TEXT_DECORATIVE_AQUA as L, KUI_COLOR_TEXT_NEUTRAL as w, KUI_COLOR_TEXT_WARNING as z, KUI_ICON_SIZE_60 as X } from "./kongponents.es184.js";
-import F from "./kongponents.es33.js";
-import "./kongponents.es5.js";
-import "./kongponents.es10.js";
-import { EmptyStateIconVariants as r } from "./kongponents.es11.js";
-import G from "./kongponents.es34.js";
-const Q = { class: "empty-state-content" }, W = ["aria-hidden"], Z = {
-  key: 0,
-  class: "empty-state-title"
-}, j = {
-  key: 1,
-  class: "empty-state-message"
-}, q = {
-  key: 2,
-  class: "empty-state-action"
-}, H = {
-  key: 0,
-  class: "empty-state-features-container"
-}, J = {
-  key: 0,
-  "aria-hidden": "true",
-  class: "feature-icon"
-}, M = { class: "card-header" }, P = ["title"], Y = {
-  key: 1,
-  class: "empty-state-footer-container"
-}, ct = /* @__PURE__ */ T({
-  __name: "KEmptyState",
-  props: {
-    title: { default: "" },
-    message: { default: "" },
-    actionButtonVisible: { type: Boolean, default: !0 },
-    actionButtonText: { default: "" },
-    actionButtonDisabled: { type: Boolean },
-    iconVariant: { default: () => r.Default },
-    iconBackground: { type: Boolean, default: !1 },
-    features: { default: () => [] }
-  },
-  emits: ["click-action"],
-  setup(e, { emit: h }) {
-    const B = h, g = b(), C = K(), E = u(() => {
-      switch (e.iconVariant) {
-        case r.Default:
-          return v;
-        case r.Error:
-          return A;
-        case r.Search:
-          return U;
-        case r.Kong:
-          return R;
-        default:
-          return v;
-      }
-    }), I = u(() => {
-      if (e.iconBackground)
-        return L;
-      switch (e.iconVariant) {
-        case r.Error:
-          return z;
-        default:
-          return w;
-      }
-    }), p = u(() => {
-      if (g.image)
-        return "empty-state-image";
-      const t = "empty-state-icon";
-      return e.iconBackground ? `${t} has-background` : t;
-    });
-    return (t, m) => (o(), i("div", {
-      class: f(["k-empty-state", [e.iconVariant]])
-    }, [
-      l("div", Q, [
-        l("div", {
-          "aria-hidden": t.$slots.image ? void 0 : "true",
-          class: f(p.value)
-        }, [
-          n(t.$slots, "image", {}, () => [
-            n(t.$slots, "icon", {}, () => [
-              (o(), y(N(E.value), {
-                color: I.value,
-                decorative: "",
-                size: k(X)
-              }, null, 8, ["color", "size"]))
-            ], !0)
-          ], !0)
-        ], 10, W),
-        e.title || t.$slots.title ? (o(), i("div", Z, [
-          n(t.$slots, "title", {}, () => [
-            $(c(e.title), 1)
-          ], !0)
-        ])) : s("", !0),
-        e.message || t.$slots.default ? (o(), i("div", j, [
-          n(t.$slots, "default", {}, () => [
-            l("p", null, c(e.message), 1)
-          ], !0)
-        ])) : s("", !0),
-        e.actionButtonVisible && e.actionButtonText || t.$slots.action ? (o(), i("div", q, [
-          n(t.$slots, "action", {}, () => [
-            O(F, {
-              disabled: e.actionButtonDisabled,
-              type: "button",
-              onClick: m[0] || (m[0] = (a) => B("click-action"))
-            }, {
-              default: d(() => [
-                n(t.$slots, "action-button-icon", {}, void 0, !0),
-                $(" " + c(e.actionButtonText), 1)
-              ]),
-              _: 3
-            }, 8, ["disabled"])
-          ], !0)
-        ])) : s("", !0)
-      ]),
-      e.features.length ? (o(), i("div", H, [
-        (o(!0), i(S, null, D(e.features, (a, V) => (o(), y(G, {
-          key: `feature-${k(C)}-${a.key || V}`,
-          class: "empty-state-feature-card"
-        }, {
-          title: d(() => [
-            a.key && t.$slots[`feature-icon-${a.key}`] ? (o(), i("div", J, [
-              n(t.$slots, `feature-icon-${a.key}`, {}, void 0, !0)
-            ])) : s("", !0),
-            l("div", M, c(a.title), 1)
-          ]),
-          default: d(() => [
-            l("div", {
-              title: a.description
-            }, c(a.description), 9, P)
-          ]),
-          _: 2
-        }, 1024))), 128))
-      ])) : s("", !0),
-      t.$slots.footer ? (o(), i("div", Y, [
-        n(t.$slots, "footer", {}, void 0, !0)
-      ])) : s("", !0)
-    ], 2));
-  }
-});
-export {
-  ct as default
-};

package/dist/kongponents.es107.js

@@ -1,213 +0,0 @@
-import { defineComponent as re, useSlots as oe, useAttrs as ue, useId as ne, computed as o, useTemplateRef as W, ref as b, watch as de, createElementBlock as m, openBlock as n, mergeProps as P, withModifiers as q, createBlock as w, createCommentVNode as A, withDirectives as se, createSlots as U, withCtx as p, createTextVNode as M, toDisplayString as v, renderSlot as B, createElementVNode as K, normalizeClass as D, createVNode as j, vShow as ve, unref as G } from "vue";
-import ce from "./kongponents.es48.js";
-import fe from "./kongponents.es46.js";
-import H from "./kongponents.es33.js";
-import be from "./kongponents.es172.js";
-import me from "./kongponents.es193.js";
-import pe from "./kongponents.es194.js";
-const he = ["role"], ge = { class: "file-upload-input-wrapper" }, ye = {
-  key: 1,
-  class: "file-upload-dropzone-wrapper"
-}, ze = ["aria-disabled", "aria-labelledby", "tabindex"], ke = {
-  "aria-hidden": "true",
-  class: "dropzone-icon"
-}, Se = { key: 0 }, $e = { key: 1 }, De = /* @__PURE__ */ re({
-  inheritAttrs: !1,
-  __name: "KFileUpload",
-  props: {
-    labelAttributes: { default: () => ({}) },
-    label: { default: "" },
-    help: {},
-    buttonText: { default: "Select file" },
-    placeholder: { default: "" },
-    accept: {},
-    maxFileSize: { default: null },
-    error: { type: Boolean },
-    errorMessage: { default: "" },
-    disabled: { type: Boolean },
-    appearance: { default: "input" }
-  },
-  emits: ["file-added", "file-removed", "error"],
-  setup(e, { emit: J }) {
-    const c = J, O = oe(), u = ue(), { stripRequiredLabel: Q } = be(), X = ne(), C = o(() => u.id ? String(u.id) : X), Y = o(() => {
-      const l = { ...u };
-      return delete l.id, l;
-    }), E = W("input"), Z = o(() => {
-      var l;
-      return !!((l = e.labelAttributes) != null && l.info || O["label-tooltip"]);
-    }), _ = o(() => Q(e.label, L.value)), L = o(() => (u == null ? void 0 : u.required) !== void 0 && String(u == null ? void 0 : u.required) !== "false"), I = o(() => d.value ? "Drag & drop a file" : "No file selected"), h = b(!1), T = o(() => {
-      if (h.value) {
-        let l = "bytes", a = s.value;
-        return s.value >= 1024 && s.value < 1024 * 1024 && (a = s.value / 1024, l = "KB"), s.value >= 1024 * 1024 && (a = s.value / (1024 * 1024), l = "MB"), `File size must be less than ${a}${l}.`;
-      }
-      return "";
-    }), s = o(() => e.maxFileSize || e.maxFileSize === 0 ? e.maxFileSize : 5 * 1024 * 1024), g = o(() => k.value || h.value || e.error), f = b(0), t = b(""), y = b(null), ee = W("dropzone"), le = (l) => {
-      var S, $, i, x, V;
-      k.value = !1;
-      const a = l.target.files, r = (S = a[0]) == null ? void 0 : S.size;
-      Number(r) > s.value && (f.value++, h.value = !0, c("error", a));
-      const F = (i = ($ = E.value) == null ? void 0 : $.$el) == null ? void 0 : i.querySelector("input");
-      a.length ? (y.value = a, t.value = a[0].name || "", c("file-added", a)) : (F.files = y.value, t.value = ((V = (x = y.value) == null ? void 0 : x[0]) == null ? void 0 : V.name) || "");
-    }, N = () => {
-      var a, r;
-      if (t.value) {
-        ae();
-        return;
-      }
-      const l = (r = (a = E.value) == null ? void 0 : a.$el) == null ? void 0 : r.querySelector("input");
-      l && l.click();
-    }, ae = () => {
-      y.value = null, t.value = "", f.value++, h.value = !1, c("file-removed");
-    }, z = b(!1), k = b(!1), te = (l) => !e.accept || !Array.isArray(e.accept) || !e.accept.length ? !0 : e.accept.some((a) => {
-      if (a.startsWith("."))
-        return l.name.toLowerCase().endsWith(a.toLowerCase());
-      if (a.endsWith("/*")) {
-        const r = a.slice(0, -2);
-        return l.type.startsWith(r);
-      } else
-        return l.type === a;
-    }), R = o(() => k.value ? `Unsupported file type. Please upload one of the following: ${e.accept.join(", ")}` : ""), ie = (l) => {
-      var a, r, F, S, $;
-      if (!e.disabled) {
-        d.value ? (a = ee.value) == null || a.focus() : (F = (r = E.value) == null ? void 0 : r.input) == null || F.focus(), z.value = !1;
-        const i = (S = l.dataTransfer) == null ? void 0 : S.files;
-        if (i && i.length) {
-          const x = ($ = i[0]) == null ? void 0 : $.size;
-          if (Number(x) > s.value) {
-            f.value++, h.value = !0, c("error", i);
-            return;
-          }
-          te(i[0]) ? (k.value = !1, y.value = i, t.value = i[0].name || "", c("file-added", i)) : (k.value = !0, c("error", i));
-        }
-      }
-    }, d = o(() => e.appearance === "dropzone");
-    return de(() => u.id, () => {
-      f.value++;
-    }, { immediate: !0 }), (l, a) => (n(), m("div", P({ class: "k-file-upload" }, Y.value, {
-      role: e.disabled ? void 0 : "region",
-      onDragleave: a[0] || (a[0] = q((r) => z.value = !1, ["prevent"])),
-      onDragover: a[1] || (a[1] = q((r) => z.value = !0, ["prevent"])),
-      onDrop: q(ie, ["prevent"])
-    }), [
-      e.label ? (n(), w(ce, P({ key: 0 }, e.labelAttributes, {
-        id: d.value ? `file-upload-dropzone-label-${C.value}` : void 0,
-        for: C.value,
-        required: L.value
-      }), U({
-        default: p(() => [
-          M(v(_.value) + " ", 1)
-        ]),
-        _: 2
-      }, [
-        Z.value ? {
-          name: "tooltip",
-          fn: p(() => [
-            B(l.$slots, "label-tooltip", {}, void 0, !0)
-          ]),
-          key: "0"
-        } : void 0
-      ]), 1040, ["id", "for", "required"])) : A("", !0),
-      se(K("div", ge, [
-        d.value ? A("", !0) : (n(), m("span", {
-          key: f.value,
-          class: D(["file-upload-input-text", { placeholder: !t.value, "has-icon": l.$slots.icon, disabled: e.disabled }])
-        }, v(t.value ? t.value : e.placeholder || I.value), 3)),
-        (n(), w(fe, {
-          id: C.value,
-          key: f.value,
-          ref: "input",
-          accept: e.accept,
-          class: D(["upload-input", { dragging: z.value && !e.disabled }]),
-          disabled: e.disabled,
-          error: g.value,
-          "error-message": e.errorMessage || R.value || T.value,
-          help: e.help,
-          hidden: d.value,
-          placeholder: e.placeholder || I.value,
-          title: "",
-          type: "file",
-          onChange: le
-        }, U({ _: 2 }, [
-          l.$slots.icon && !d.value ? {
-            name: "before",
-            fn: p(() => [
-              B(l.$slots, "icon", {}, void 0, !0)
-            ]),
-            key: "0"
-          } : void 0,
-          d.value ? void 0 : {
-            name: "after",
-            fn: p(() => [
-              j(H, {
-                appearance: "tertiary",
-                class: "file-upload-button",
-                "data-testid": "file-upload-button",
-                disabled: e.disabled,
-                size: "small",
-                onClick: N
-              }, {
-                default: p(() => [
-                  M(v(t.value ? "Clear" : e.buttonText), 1)
-                ]),
-                _: 1
-              }, 8, ["disabled"])
-            ]),
-            key: "1"
-          }
-        ]), 1032, ["id", "accept", "class", "disabled", "error", "error-message", "help", "hidden", "placeholder"]))
-      ], 512), [
-        [ve, !d.value]
-      ]),
-      d.value ? (n(), m("div", ye, [
-        K("div", {
-          ref: "dropzone",
-          "aria-disabled": e.disabled ? "true" : void 0,
-          "aria-labelledby": e.label ? `file-upload-dropzone-label-${C.value}` : void 0,
-          class: D(["dropzone", {
-            dragging: z.value && !e.disabled,
-            disabled: e.disabled,
-            error: g.value,
-            "has-file": !!t.value
-          }]),
-          "data-testid": "file-upload-dropzone",
-          role: "button",
-          tabindex: e.disabled ? -1 : 0,
-          onClick: N
-        }, [
-          K("div", ke, [
-            B(l.$slots, "icon", {}, () => [
-              t.value ? (n(), w(G(me), {
-                key: 0,
-                decorative: ""
-              })) : (n(), w(G(pe), {
-                key: 1,
-                decorative: ""
-              }))
-            ], !0)
-          ]),
-          t.value ? (n(), m("span", Se, v(t.value), 1)) : (n(), m("span", $e, v(e.placeholder || I.value), 1)),
-          j(H, {
-            appearance: "tertiary",
-            class: "file-upload-button",
-            "data-testid": "file-upload-button",
-            disabled: e.disabled,
-            onClick: q(N, ["stop"])
-          }, {
-            default: p(() => [
-              M(v(t.value ? "Clear" : e.buttonText), 1)
-            ]),
-            _: 1
-          }, 8, ["disabled"]),
-          B(l.$slots, "dropzone-footer", {}, void 0, !0)
-        ], 10, ze),
-        g.value || e.help ? (n(), m("p", {
-          key: 0,
-          class: D(["help-text", { error: g.value }])
-        }, v(g.value && (e.errorMessage || R.value || T.value) || e.help), 3)) : A("", !0)
-      ])) : A("", !0)
-    ], 16, he));
-  }
-});
-export {
-  De as default
-};