@well-insight/ui 0.1.9 → 0.1.11

package/dist/tree-table/style.css

@@ -16,12 +16,13 @@
     --wi-control-padding-x-small: 10px;
     --wi-control-padding-x-medium: 12px;
     --wi-control-padding-x-large: 14px;
-    --wi-button-padding-x-small: 10px;
-    --wi-button-padding-x-medium: 14px;
-    --wi-button-padding-x-large: 18px;
+
     --wi-radius-control: 3px;
-    --wi-focus-shadow: 0 0 0 2px color-mix(in srgb, var(--wi-color-primary) 20%, transparent);
-    --wi-focus-shadow-danger: 0 0 0 2px color-mix(in srgb, var(--wi-color-danger) 20%, transparent);
+    --wi-border-width: 1px;
+    --wi-focus-shadow: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-primary) 20%, transparent);
+    --wi-focus-shadow-danger: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-danger) 20%, transparent);
     --wi-color-success: #159570;
     --wi-color-info: #2563eb;
     --wi-color-warning: #d97706;
@@ -39,10 +40,7 @@
     --wi-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
     --wi-shadow-sticky: 4px 0 8px color-mix(in srgb, #000 6%, transparent);
     --wi-shadow-sticky-end: -4px 0 8px color-mix(in srgb, #000 6%, transparent);
-    --wi-terminal-bg: #111827;
-    --wi-terminal-fg: #e5e7eb;
-    --wi-terminal-prompt: #34d399;
-    --wi-terminal-border: color-mix(in srgb, #fff 12%, transparent);
+
     /* Typography scale (component text, not control-height fonts) */
     --wi-font-size-xs: 0.75rem;
     --wi-font-size-sm: 0.8125rem;
@@ -56,8 +54,7 @@
     --wi-z-dropdown: calc(var(--wi-z-base) + 50);
     --wi-z-toast: calc(var(--wi-z-base) + 100);
     --wi-z-popper: 40;
-    --wi-menu-min-width: 10rem;
-    --wi-menu-min-width-lg: 12rem;
+
     --wi-control-affix-size: 2rem;
     --wi-control-affix-gap: 2.35rem;
     --wi-control-affix-padding: 2.5rem;
@@ -118,9 +115,6 @@
     --wi-control-padding-x-small: 8px;
     --wi-control-padding-x-medium: 10px;
     --wi-control-padding-x-large: 12px;
-    --wi-button-padding-x-small: 8px;
-    --wi-button-padding-x-medium: 12px;
-    --wi-button-padding-x-large: 16px;
 }
 
 [data-wi-density="spacious"] {
@@ -139,9 +133,32 @@
     --wi-control-padding-x-small: 12px;
     --wi-control-padding-x-medium: 14px;
     --wi-control-padding-x-large: 16px;
-    --wi-button-padding-x-small: 12px;
-    --wi-button-padding-x-medium: 16px;
-    --wi-button-padding-x-large: 20px;
+}
+
+[data-wi-density="compact"] .wi-layout-header {
+    --wi-layout-header-height: 48px;
+}
+
+[data-wi-density="compact"] .wi-layout-footer {
+    --wi-layout-footer-height: 40px;
+}
+
+[data-wi-density="compact"] .wi-layout-sider {
+    --wi-layout-sider-width: 240px;
+    --wi-layout-sider-collapsed-width: 44px;
+}
+
+[data-wi-density="spacious"] .wi-layout-header {
+    --wi-layout-header-height: 64px;
+}
+
+[data-wi-density="spacious"] .wi-layout-footer {
+    --wi-layout-footer-height: 56px;
+}
+
+[data-wi-density="spacious"] .wi-layout-sider {
+    --wi-layout-sider-width: 288px;
+    --wi-layout-sider-collapsed-width: 52px;
 }
 
 [data-theme="dark"] {
@@ -152,8 +169,10 @@
     --wi-color-text-muted: #94a3b8;
     --wi-color-border: #334155;
     --wi-color-focus-ring: #93c5fd;
-    --wi-focus-shadow: 0 0 0 2px color-mix(in srgb, var(--wi-color-primary) 28%, transparent);
-    --wi-focus-shadow-danger: 0 0 0 2px color-mix(in srgb, var(--wi-color-danger) 28%, transparent);
+    --wi-focus-shadow: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-primary) 28%, transparent);
+    --wi-focus-shadow-danger: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-danger) 28%, transparent);
     --wi-color-success: #5eead4;
     --wi-color-info: #93c5fd;
     --wi-color-warning: #fbbf24;
@@ -170,10 +189,6 @@
     --wi-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
     --wi-shadow-sticky: 4px 0 8px color-mix(in srgb, #000 35%, transparent);
     --wi-shadow-sticky-end: -4px 0 8px color-mix(in srgb, #000 35%, transparent);
-    --wi-terminal-bg: #020617;
-    --wi-terminal-fg: #e2e8f0;
-    --wi-terminal-prompt: #5eead4;
-    --wi-terminal-border: color-mix(in srgb, #fff 14%, transparent);
 }
 
 @media (prefers-reduced-motion: reduce) {
@@ -465,8 +480,8 @@
     font-size: var(--wi-font-size-xs);
 }
 
-.wi-textarea-field__help--error,
-.wi-select-field__help--error {
+.wi-textarea-field__help--invalid,
+.wi-select-field__help--invalid {
     color: var(--wi-color-danger);
 }
 
@@ -485,9 +500,8 @@
 }
 
 .wi-textarea--invalid:focus-visible,
-.wi-textarea--error:focus-visible,
-.wi-select--error.wi-select--open,
-.wi-select--error:focus-visible {
+.wi-select--invalid.wi-select--open,
+.wi-select--invalid:focus-visible {
     border-color: var(--wi-color-danger);
     box-shadow: var(--wi-focus-shadow-danger);
 }
@@ -735,6 +749,45 @@
     line-height: 1;
 }
 
+.wi-icon {
+    display: inline-flex;
+    height: 1rem;
+    width: 1rem;
+}
+
+.wi-icon svg {
+    height: 100%;
+    width: 100%;
+}
+
+.wi-icon--sm,
+.wi-icon--small {
+    height: 0.875rem;
+    width: 0.875rem;
+}
+
+.wi-icon--md,
+.wi-icon--normal {
+    height: 1rem;
+    width: 1rem;
+}
+
+.wi-icon--lg,
+.wi-icon--large {
+    height: 1.25rem;
+    width: 1.25rem;
+}
+
+.wi-icon--spin svg {
+    animation: wi-icon-spin 0.8s linear infinite;
+}
+
+@keyframes wi-icon-spin {
+    to {
+        transform: rotate(360deg);
+    }
+}
+
 /* —— Data: TreeTable —— */
 .wi-treetable {
     overflow: auto;

package/dist/tree-table/style.js

@@ -1,3 +1,4 @@
 import '../theme/styles.css'
 import '../styles/base.css'
+import '../components/Icon/styles.css'
 import '../components/TreeTable/styles.css'

package/dist/virtual-scroller/style.css

@@ -16,12 +16,13 @@
     --wi-control-padding-x-small: 10px;
     --wi-control-padding-x-medium: 12px;
     --wi-control-padding-x-large: 14px;
-    --wi-button-padding-x-small: 10px;
-    --wi-button-padding-x-medium: 14px;
-    --wi-button-padding-x-large: 18px;
+
     --wi-radius-control: 3px;
-    --wi-focus-shadow: 0 0 0 2px color-mix(in srgb, var(--wi-color-primary) 20%, transparent);
-    --wi-focus-shadow-danger: 0 0 0 2px color-mix(in srgb, var(--wi-color-danger) 20%, transparent);
+    --wi-border-width: 1px;
+    --wi-focus-shadow: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-primary) 20%, transparent);
+    --wi-focus-shadow-danger: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-danger) 20%, transparent);
     --wi-color-success: #159570;
     --wi-color-info: #2563eb;
     --wi-color-warning: #d97706;
@@ -39,10 +40,7 @@
     --wi-shadow-lg: 0 1rem 3rem rgb(15 23 42 / 0.25);
     --wi-shadow-sticky: 4px 0 8px color-mix(in srgb, #000 6%, transparent);
     --wi-shadow-sticky-end: -4px 0 8px color-mix(in srgb, #000 6%, transparent);
-    --wi-terminal-bg: #111827;
-    --wi-terminal-fg: #e5e7eb;
-    --wi-terminal-prompt: #34d399;
-    --wi-terminal-border: color-mix(in srgb, #fff 12%, transparent);
+
     /* Typography scale (component text, not control-height fonts) */
     --wi-font-size-xs: 0.75rem;
     --wi-font-size-sm: 0.8125rem;
@@ -56,8 +54,7 @@
     --wi-z-dropdown: calc(var(--wi-z-base) + 50);
     --wi-z-toast: calc(var(--wi-z-base) + 100);
     --wi-z-popper: 40;
-    --wi-menu-min-width: 10rem;
-    --wi-menu-min-width-lg: 12rem;
+
     --wi-control-affix-size: 2rem;
     --wi-control-affix-gap: 2.35rem;
     --wi-control-affix-padding: 2.5rem;
@@ -118,9 +115,6 @@
     --wi-control-padding-x-small: 8px;
     --wi-control-padding-x-medium: 10px;
     --wi-control-padding-x-large: 12px;
-    --wi-button-padding-x-small: 8px;
-    --wi-button-padding-x-medium: 12px;
-    --wi-button-padding-x-large: 16px;
 }
 
 [data-wi-density="spacious"] {
@@ -139,9 +133,32 @@
     --wi-control-padding-x-small: 12px;
     --wi-control-padding-x-medium: 14px;
     --wi-control-padding-x-large: 16px;
-    --wi-button-padding-x-small: 12px;
-    --wi-button-padding-x-medium: 16px;
-    --wi-button-padding-x-large: 20px;
+}
+
+[data-wi-density="compact"] .wi-layout-header {
+    --wi-layout-header-height: 48px;
+}
+
+[data-wi-density="compact"] .wi-layout-footer {
+    --wi-layout-footer-height: 40px;
+}
+
+[data-wi-density="compact"] .wi-layout-sider {
+    --wi-layout-sider-width: 240px;
+    --wi-layout-sider-collapsed-width: 44px;
+}
+
+[data-wi-density="spacious"] .wi-layout-header {
+    --wi-layout-header-height: 64px;
+}
+
+[data-wi-density="spacious"] .wi-layout-footer {
+    --wi-layout-footer-height: 56px;
+}
+
+[data-wi-density="spacious"] .wi-layout-sider {
+    --wi-layout-sider-width: 288px;
+    --wi-layout-sider-collapsed-width: 52px;
 }
 
 [data-theme="dark"] {
@@ -152,8 +169,10 @@
     --wi-color-text-muted: #94a3b8;
     --wi-color-border: #334155;
     --wi-color-focus-ring: #93c5fd;
-    --wi-focus-shadow: 0 0 0 2px color-mix(in srgb, var(--wi-color-primary) 28%, transparent);
-    --wi-focus-shadow-danger: 0 0 0 2px color-mix(in srgb, var(--wi-color-danger) 28%, transparent);
+    --wi-focus-shadow: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-primary) 28%, transparent);
+    --wi-focus-shadow-danger: 0 0 0 2px
+        color-mix(in srgb, var(--wi-color-danger) 28%, transparent);
     --wi-color-success: #5eead4;
     --wi-color-info: #93c5fd;
     --wi-color-warning: #fbbf24;
@@ -170,10 +189,6 @@
     --wi-shadow-lg: 0 1rem 3rem rgb(0 0 0 / 0.55);
     --wi-shadow-sticky: 4px 0 8px color-mix(in srgb, #000 35%, transparent);
     --wi-shadow-sticky-end: -4px 0 8px color-mix(in srgb, #000 35%, transparent);
-    --wi-terminal-bg: #020617;
-    --wi-terminal-fg: #e2e8f0;
-    --wi-terminal-prompt: #5eead4;
-    --wi-terminal-border: color-mix(in srgb, #fff 14%, transparent);
 }
 
 @media (prefers-reduced-motion: reduce) {
@@ -465,8 +480,8 @@
     font-size: var(--wi-font-size-xs);
 }
 
-.wi-textarea-field__help--error,
-.wi-select-field__help--error {
+.wi-textarea-field__help--invalid,
+.wi-select-field__help--invalid {
     color: var(--wi-color-danger);
 }
 
@@ -485,9 +500,8 @@
 }
 
 .wi-textarea--invalid:focus-visible,
-.wi-textarea--error:focus-visible,
-.wi-select--error.wi-select--open,
-.wi-select--error:focus-visible {
+.wi-select--invalid.wi-select--open,
+.wi-select--invalid:focus-visible {
     border-color: var(--wi-color-danger);
     box-shadow: var(--wi-focus-shadow-danger);
 }

package/package.json

@@ -1,27 +1,20 @@
 {
   "name": "@well-insight/ui",
-  "version": "0.1.9",
+  "type": "module",
+  "version": "0.1.11",
   "description": "Vue 3 component library for Well Insight.",
   "license": "MIT",
-  "type": "module",
-  "engines": {
-    "node": ">=20.19.0"
-  },
+  "homepage": "https://github.com/well-insight/well-insight-ui#readme",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/well-insight/well-insight-ui.git"
   },
-  "homepage": "https://github.com/well-insight/well-insight-ui#readme",
   "bugs": {
     "url": "https://github.com/well-insight/well-insight-ui/issues"
   },
   "publishConfig": {
     "access": "public"
   },
-  "files": [
-    "dist",
-    "CHANGELOG.md"
-  ],
   "sideEffects": [
     "**/*.css",
     "**/*/style.js",
@@ -654,17 +647,26 @@
     "./virtual-scroller/style.css": "./dist/virtual-scroller/style.css",
     "./docs": "./src/docs/index.ts"
   },
-  "types": "./dist/index.d.ts",
   "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "CHANGELOG.md",
+    "dist"
+  ],
+  "engines": {
+    "node": ">=20.19.0"
+  },
   "peerDependencies": {
     "vue": "^3.5.0"
   },
   "devDependencies": {
+    "@antfu/eslint-config": "^9.3.0",
     "@commitlint/cli": "^19.8.1",
     "@commitlint/config-conventional": "^19.8.1",
     "@vitejs/plugin-vue": "^6.0.8",
     "@vitest/coverage-v8": "^4.1.10",
     "@vue/test-utils": "^2.4.11",
+    "eslint": "^10.9.1",
     "happy-dom": "^20.11.2",
     "husky": "^9.1.7",
     "shiki": "^4.4.3",
@@ -684,6 +686,8 @@
     "preview": "vite preview --config playground/vite.config.ts",
     "build": "node scripts/prepare-on-demand.mjs && node scripts/generate-exports.mjs && vite build && vite build --mode on-demand && node scripts/emit-style-entries.mjs",
     "typecheck": "vue-tsc --noEmit -p tsconfig.json",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "test": "vitest run",
     "test:coverage": "vitest run --coverage",
     "release": "node scripts/release.mjs",
@@ -698,6 +702,9 @@
     "release:git": "node scripts/release-git.mjs --tag --branch",
     "release:mcp": "node scripts/release-mcp.mjs",
     "mcp:generate": "pnpm --filter @well-insight/ui-mcp generate",
+    "mcp:check-catalog": "pnpm --filter @well-insight/ui-mcp check-catalog",
+    "mcp:validate-catalog": "pnpm --filter @well-insight/ui-mcp validate-catalog",
+    "mcp:audit-examples": "pnpm --filter @well-insight/ui-mcp audit-example-coverage",
     "mcp:build": "pnpm --filter @well-insight/ui-mcp build",
     "mcp:start": "pnpm --filter @well-insight/ui-mcp start"
   }

package/dist/Pagination-C-F_ZDXr.js

@@ -1,148 +0,0 @@
-import { n as e, t } from "./locale-CYkJyRd1.js";
-import { Fragment as n, computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, defineComponent as s, normalizeClass as c, openBlock as l, ref as u, renderList as d, toDisplayString as f, unref as p, withKeys as m, withModifiers as h } from "vue";
-//#region src/components/Pagination/Pagination.vue?vue&type=script&setup=true&lang.ts
-var g = ["aria-label"], _ = ["disabled", "aria-label"], v = {
-	key: 0,
-	class: "wi-pagination__simple",
-	"aria-current": "page"
-}, y = [
-	"disabled",
-	"aria-label",
-	"aria-current",
-	"onClick"
-], b = ["disabled", "aria-label"], x = {
-	key: 2,
-	class: "wi-pagination__sizer"
-}, S = { class: "wi-pagination__sizer-label" }, C = ["disabled", "value"], w = ["value"], T = {
-	key: 3,
-	class: "wi-pagination__jumper"
-}, E = [
-	"max",
-	"disabled",
-	"value",
-	"onKeydown"
-], D = { key: 0 }, O = /* @__PURE__ */ s({
-	__name: "Pagination",
-	props: {
-		modelValue: { default: 1 },
-		totalRecords: {},
-		rows: { default: 10 },
-		pageSize: {},
-		pageLinkSize: { default: 5 },
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		showSizePicker: {
-			type: Boolean,
-			default: !1
-		},
-		pageSizes: { default: () => [
-			10,
-			20,
-			50,
-			100
-		] },
-		showQuickJumper: {
-			type: Boolean,
-			default: !1
-		},
-		simple: {
-			type: Boolean,
-			default: !1
-		}
-	},
-	emits: [
-		"update:modelValue",
-		"page",
-		"update:rows",
-		"update:pageSize"
-	],
-	setup(s, { expose: O, emit: k }) {
-		let A = s, j = k, M = e(), N = u(""), P = r(() => Math.max(1, A.pageSize ?? A.rows)), F = r(() => Math.max(1, Math.ceil(A.totalRecords / P.value))), I = r(() => Math.min(Math.max(1, A.modelValue), F.value)), L = r(() => (I.value - 1) * P.value), R = r(() => {
-			let e = Math.min(A.pageLinkSize, F.value), t = Math.min(Math.max(1, I.value - Math.floor(e / 2)), F.value - e + 1);
-			return Array.from({ length: e }, (e, n) => t + n);
-		}), z = r(() => {
-			let e = [...A.pageSizes];
-			return e.includes(P.value) || e.unshift(P.value), e;
-		});
-		function B(e) {
-			let t = Math.min(Math.max(1, e), F.value);
-			A.disabled || t === I.value || (j("update:modelValue", t), j("page", t));
-		}
-		function V(e) {
-			if (A.disabled || e === P.value) return;
-			j("update:rows", e), j("update:pageSize", e);
-			let t = Math.max(1, Math.ceil(A.totalRecords / e)), n = Math.min(I.value, t);
-			n !== I.value && (j("update:modelValue", n), j("page", n));
-		}
-		function H(e) {
-			let t = Number(e.target.value);
-			Number.isFinite(t) && V(t);
-		}
-		function U() {
-			let e = Number.parseInt(N.value, 10);
-			N.value = "", Number.isFinite(e) && B(e);
-		}
-		function W(e) {
-			return t(M.value.page, { page: e });
-		}
-		return O({
-			first: L,
-			pageCount: F
-		}), (e, t) => (l(), a("nav", {
-			class: c(["wi-pagination", { "wi-pagination--simple": s.simple }]),
-			"aria-label": p(M).pagination
-		}, [
-			o("button", {
-				type: "button",
-				class: "wi-pagination__button",
-				disabled: s.disabled || I.value === 1,
-				"aria-label": p(M).prevPage,
-				onClick: t[0] ||= (e) => B(I.value - 1)
-			}, "‹", 8, _),
-			s.simple ? (l(), a("span", v, f(I.value) + " / " + f(F.value), 1)) : (l(!0), a(n, { key: 1 }, d(R.value, (e) => (l(), a("button", {
-				key: e,
-				type: "button",
-				class: c(["wi-pagination__button", { "wi-pagination__button--active": e === I.value }]),
-				disabled: s.disabled,
-				"aria-label": W(e),
-				"aria-current": e === I.value ? "page" : void 0,
-				onClick: (t) => B(e)
-			}, f(e), 11, y))), 128)),
-			o("button", {
-				type: "button",
-				class: "wi-pagination__button",
-				disabled: s.disabled || I.value === F.value,
-				"aria-label": p(M).nextPage,
-				onClick: t[1] ||= (e) => B(I.value + 1)
-			}, "›", 8, b),
-			s.showSizePicker && !s.simple ? (l(), a("label", x, [o("span", S, f(p(M).itemsPerPage), 1), o("select", {
-				class: "wi-pagination__select",
-				disabled: s.disabled,
-				value: P.value,
-				onChange: H
-			}, [(l(!0), a(n, null, d(z.value, (e) => (l(), a("option", {
-				key: e,
-				value: e
-			}, f(e), 9, w))), 128))], 40, C)])) : i("", !0),
-			s.showQuickJumper && !s.simple ? (l(), a("label", T, [
-				o("span", null, f(p(M).jumpToPage), 1),
-				o("input", {
-					class: "wi-pagination__input",
-					type: "number",
-					min: "1",
-					max: F.value,
-					disabled: s.disabled,
-					value: N.value,
-					onInput: t[2] ||= (e) => N.value = e.target.value,
-					onKeydown: m(h(U, ["prevent"]), ["enter"]),
-					onBlur: U
-				}, null, 40, E),
-				p(M).pageClassifier ? (l(), a("span", D, f(p(M).pageClassifier), 1)) : i("", !0)
-			])) : i("", !0)
-		], 10, g));
-	}
-});
-//#endregion
-export { O as t };