@greypan/web-ui 11.1.0 → 12.0.0

package/dist/components/middle-ellipsis/truncate.js

@@ -1,45 +1,75 @@
-//#region src/components/middle-ellipsis/truncate.ts
-var e;
-function t(t) {
-	if (t === "") return [];
-	e ??= new Intl.Segmenter(void 0, { granularity: "grapheme" });
-	let n = [];
-	for (let { index: r, segment: i } of e.segment(t)) n.push(r + i.length);
-	return n;
+// src/components/middle-ellipsis/truncate.ts
+let segmenter;
+/**
+* 每个字素簇的 UTF-16 结束偏移（升序，不含 0），末项恒等于 `text.length`。
+*
+* `Intl.Segmenter` 的构造不便宜，单例复用。目标浏览器（见 package.json 的 browserslist）
+* 与本地 node 测试环境都自带它，因此不写按码点切的退化分支——那会在部分环境里悄悄改变
+* 切分口径，而这正是本模块唯一的正确性来源。
+*/
+function clusterEnds(text) {
+	if (text === "") return [];
+	segmenter ??= new Intl.Segmenter(void 0, { granularity: "grapheme" });
+	const ends = [];
+	for (const { index, segment } of segmenter.segment(text)) ends.push(index + segment.length);
+	return ends;
 }
-function n(e, t) {
-	let n = 0, r = e;
-	for (; n < r;) {
-		let e = n + r + 1 >> 1;
-		t(e) ? n = e : r = e - 1;
+/** 宽度对簇数单调不减，因此可以二分求预算内放得下的最大簇数。 */
+function fitCount(total, fits) {
+	let lo = 0;
+	let hi = total;
+	while (lo < hi) {
+		const mid = lo + hi + 1 >> 1;
+		if (fits(mid)) lo = mid;
+		else hi = mid - 1;
 	}
-	return n;
+	return lo;
 }
-function r(e, r, i, a, o) {
-	if (e === "") return {
+/**
+* 在 `available` 内把 `text` 切成 `head + marker + tail`。
+*
+* `position` 与 CSSWG css-overflow-5 的 `text-overflow: ellipsis <length-percentage>` 同向：
+* 量的是标记结束边距行末边的距离占可用行内空间的比例。`0` 把标记贴在行末（只剩头部，等价于
+* 末尾省略），`100` 贴在行首（只剩尾部），`50` 居中；两端额度因此是 `(1 - p)` 与 `p`。
+*/
+function truncateMiddle(text, marker, position, available, probe) {
+	if (text === "") return {
 		head: "",
 		tail: "",
-		truncated: !1
+		truncated: false
 	};
-	if (o.prefix(e.length) <= a) return {
-		head: e,
+	if (probe.prefix(text.length) <= available) return {
+		head: text,
 		tail: "",
-		truncated: !1
+		truncated: false
 	};
-	let s = t(e), c = s.length, l = a - o.marker();
-	if (l <= 0) return {
+	const ends = clusterEnds(text);
+	const total = ends.length;
+	const space = available - probe.marker();
+	if (space <= 0) return {
 		head: "",
 		tail: "",
-		truncated: !0
+		truncated: true
 	};
-	let u = Math.min(1, Math.max(0, i / 100)), d = l * (1 - u), f = l * u, p = (e) => e === 0 ? 0 : s[e - 1] ?? 0, m = (t) => t === 0 ? e.length : s[c - t - 1] ?? 0, h = n(c, (e) => o.prefix(p(e)) <= d), g = n(c, (t) => o.suffix(e.length - m(t)) <= f);
-	return h + g > c && (h = Math.min(h, c), g = c - h), {
-		head: e.slice(0, p(h)),
-		tail: e.slice(m(g)),
-		truncated: !0
+	const ratio = Math.min(1, Math.max(0, position / 100));
+	const headBudget = space * (1 - ratio);
+	const tailBudget = space * ratio;
+	/** 前 `count` 个簇在原串里的结束偏移。 */
+	const headEnd = (count) => count === 0 ? 0 : ends[count - 1] ?? 0;
+	/** 后 `count` 个簇在原串里的起始偏移。 */
+	const tailStart = (count) => count === 0 ? text.length : ends[total - count - 1] ?? 0;
+	let headCount = fitCount(total, (count) => probe.prefix(headEnd(count)) <= headBudget);
+	let tailCount = fitCount(total, (count) => probe.suffix(text.length - tailStart(count)) <= tailBudget);
+	if (headCount + tailCount > total) {
+		headCount = Math.min(headCount, total);
+		tailCount = total - headCount;
+	}
+	return {
+		head: text.slice(0, headEnd(headCount)),
+		tail: text.slice(tailStart(tailCount)),
+		truncated: true
 	};
 }
-//#endregion
-export { t as clusterEnds, r as truncateMiddle };
+export { clusterEnds, truncateMiddle };
 
 //# sourceMappingURL=truncate.js.map

package/dist/components/middle-ellipsis/truncate.js.map

@@ -1 +1 @@
-{"version":3,"file":"truncate.js","names":[],"sources":["../../../src/components/middle-ellipsis/truncate.ts"],"sourcesContent":["/**\n * 单行「中间省略」的切分运算。\n *\n * 目标：把 `text` 拆成 `head + marker + tail`，两端各自在原串里连续、中间那段被丢掉，\n * 且合串不超过可用行内空间。切点只落在**字素簇**边界上，代理对、组合符序列和 ZWJ emoji\n * 都不会被从中间劈开——按 UTF-16 下标切一定会。\n *\n * 为什么这一层不能由 CSS 承担：`text-overflow` 渲染的是行盒里**一段连续**的内容，结构上\n * 不可能同时显示首尾而丢掉中间。能靠 `direction` / 双值写法挪动的只是省略号落在行的哪一\n * 端，而且 `direction: rtl` 那条路还会按双向算法重排内容（`2026-report.pdf` → `report.pdf-2026`）。\n * 完整调研见 docs/research/web-ui-middle-ellipsis-261007.md。\n *\n * 宽度口径：两端额度按 `position` 从可用空间里分出来，各自用「前 i 簇 / 后 i 簇」的**实测**\n * 宽度二分逼近。实测走调用方给的探针（Range 读取，不写 DOM），所以重算一次只有若干次读取，\n * 没有回流——panel 里同时存在成百上千个这样的单元格时，这个差别就是「一帧一次布局」与\n * 「一个单元格一次布局」的差别。\n *\n * 分段宽度不蕴含合串宽度：`head|marker` 与 `marker|tail` 两个接缝的字距和连字是分段量看不见\n * 的。这里不做合串实测，因为那要写一次 DOM 再读、把上面省下的回流又付回去；复核交给调用方\n * 对着**渲染出来的真实盒子**做一次（见组件的 `updated()`），那才是「放得下」的直接证据。\n */\n\n/** 默认省略标记：U+2026 HORIZONTAL ELLIPSIS。 */\nexport const DEFAULT_MARKER = '…'\n\nlet segmenter: Intl.Segmenter | undefined\n\n/**\n * 每个字素簇的 UTF-16 结束偏移（升序，不含 0），末项恒等于 `text.length`。\n *\n * `Intl.Segmenter` 的构造不便宜，单例复用。目标浏览器（见 package.json 的 browserslist）\n * 与本地 node 测试环境都自带它，因此不写按码点切的退化分支——那会在部分环境里悄悄改变\n * 切分口径，而这正是本模块唯一的正确性来源。\n */\nexport function clusterEnds(text: string): number[] {\n  if (text === '') return []\n\n  segmenter ??= new Intl.Segmenter(undefined, { granularity: 'grapheme' })\n\n  const ends: number[] = []\n  for (const { index, segment } of segmenter.segment(text)) ends.push(index + segment.length)\n  return ends\n}\n\n/**\n * 宽度探针。\n *\n * 三段都必须是**真实排版**下量到的宽度：字体回退、字距、连字、`letter-spacing`、\n * `text-transform` 都会改变字形的推进量，任何独立的估算（例如用 canvas 的 `measureText`）\n * 都要自己复刻这一整套解析，复刻不全就是静默的量错。\n */\nexport interface WidthProbe {\n  /** 原文前 `units` 个 UTF-16 单元的渲染宽度。 */\n  prefix(units: number): number\n  /** 原文后 `units` 个 UTF-16 单元的渲染宽度。 */\n  suffix(units: number): number\n  /** 标记自身的渲染宽度。 */\n  marker(): number\n}\n\nexport interface MiddleTruncation {\n  /** 保留的原文前缀。 */\n  readonly head: string\n  /** 保留的原文后缀。 */\n  readonly tail: string\n  /** 是否真的丢掉了内容；`false` 时合串就是原文，标记不出现。 */\n  readonly truncated: boolean\n}\n\n/** 宽度对簇数单调不减，因此可以二分求预算内放得下的最大簇数。 */\nfunction fitCount(total: number, fits: (count: number) => boolean): number {\n  let lo = 0\n  let hi = total\n  while (lo < hi) {\n    const mid = (lo + hi + 1) >> 1\n    if (fits(mid)) lo = mid\n    else hi = mid - 1\n  }\n  return lo\n}\n\n/**\n * 在 `available` 内把 `text` 切成 `head + marker + tail`。\n *\n * `position` 与 CSSWG css-overflow-5 的 `text-overflow: ellipsis <length-percentage>` 同向：\n * 量的是标记结束边距行末边的距离占可用行内空间的比例。`0` 把标记贴在行末（只剩头部，等价于\n * 末尾省略），`100` 贴在行首（只剩尾部），`50` 居中；两端额度因此是 `(1 - p)` 与 `p`。\n */\nexport function truncateMiddle(\n  text: string,\n  marker: string,\n  position: number,\n  available: number,\n  probe: WidthProbe\n): MiddleTruncation {\n  if (text === '') return { head: '', tail: '', truncated: false }\n\n  // 放得下就不截断，一个字符都不动——这既是正确性也是「短文本不该出现省略号」的体检点。\n  if (probe.prefix(text.length) <= available) return { head: text, tail: '', truncated: false }\n\n  const ends = clusterEnds(text)\n  const total = ends.length\n\n  /*\n   * 标记自己都放不下的快速路径：让标记溢出、由 overflow 把它裁掉（与 text-overflow 的既有语义\n   * 一致），而不是退回全文——退回全文会把标记挤出盒外，用户连「这里被截断了」的信号都看不到。\n   *\n   * 这一条不是正确性分支：预算为负时下面的通用路径同样得到 head / tail 都为空（`prefix(0) = 0`\n   * 不满足 `<= 负数`，两次二分都返回 0）。变异验证过——把它改成 `available <= 0`，整套测试仍全绿。\n   * 留着只是省掉两次二分，并把「标记放不下」这个意图写在明面上。\n   */\n  const space = available - probe.marker()\n  if (space <= 0) return { head: '', tail: '', truncated: true }\n\n  const ratio = Math.min(1, Math.max(0, position / 100))\n  const headBudget = space * (1 - ratio)\n  const tailBudget = space * ratio\n\n  /** 前 `count` 个簇在原串里的结束偏移。 */\n  const headEnd = (count: number): number => (count === 0 ? 0 : (ends[count - 1] ?? 0))\n  /** 后 `count` 个簇在原串里的起始偏移。 */\n  const tailStart = (count: number): number => (count === 0 ? text.length : (ends[total - count - 1] ?? 0))\n\n  let headCount = fitCount(total, count => probe.prefix(headEnd(count)) <= headBudget)\n  let tailCount = fitCount(total, count => probe.suffix(text.length - tailStart(count)) <= tailBudget)\n\n  /*\n   * 两端选中的簇加起来超过原文长度时，说明合串其实放得下，与上面的早退矛盾——那一步已经\n   * 用同一个探针量过全文。浮点误差仍可能把两个预算都推过界一点点，这里按头部优先夹紧，\n   * 保证 head 与 tail 不重叠。\n   */\n  if (headCount + tailCount > total) {\n    headCount = Math.min(headCount, total)\n    tailCount = total - headCount\n  }\n\n  return {\n    head: text.slice(0, headEnd(headCount)),\n    tail: text.slice(tailStart(tailCount)),\n    truncated: true\n  }\n}\n"],"mappings":";AAyBA,IAAI;AASJ,SAAgB,EAAY,GAAwB;CAClD,IAAI,MAAS,IAAI,OAAO,CAAC;CAEzB,MAAc,IAAI,KAAK,UAAU,KAAA,GAAW,EAAE,aAAa,WAAW,CAAC;CAEvE,IAAM,IAAiB,CAAC;CACxB,KAAK,IAAM,EAAE,UAAO,gBAAa,EAAU,QAAQ,CAAI,GAAG,EAAK,KAAK,IAAQ,EAAQ,MAAM;CAC1F,OAAO;AACT;AA4BA,SAAS,EAAS,GAAe,GAA0C;CACzE,IAAI,IAAK,GACL,IAAK;CACT,OAAO,IAAK,IAAI;EACd,IAAM,IAAO,IAAK,IAAK,KAAM;EAC7B,AAAI,EAAK,CAAG,IAAG,IAAK,IACf,IAAK,IAAM;CAClB;CACA,OAAO;AACT;AASA,SAAgB,EACd,GACA,GACA,GACA,GACA,GACkB;CAClB,IAAI,MAAS,IAAI,OAAO;EAAE,MAAM;EAAI,MAAM;EAAI,WAAW;CAAM;CAG/D,IAAI,EAAM,OAAO,EAAK,MAAM,KAAK,GAAW,OAAO;EAAE,MAAM;EAAM,MAAM;EAAI,WAAW;CAAM;CAE5F,IAAM,IAAO,EAAY,CAAI,GACvB,IAAQ,EAAK,QAUb,IAAQ,IAAY,EAAM,OAAO;CACvC,IAAI,KAAS,GAAG,OAAO;EAAE,MAAM;EAAI,MAAM;EAAI,WAAW;CAAK;CAE7D,IAAM,IAAQ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,IAAW,GAAG,CAAC,GAC/C,IAAa,KAAS,IAAI,IAC1B,IAAa,IAAQ,GAGrB,KAAW,MAA2B,MAAU,IAAI,IAAK,EAAK,IAAQ,MAAM,GAE5E,KAAa,MAA2B,MAAU,IAAI,EAAK,SAAU,EAAK,IAAQ,IAAQ,MAAM,GAElG,IAAY,EAAS,IAAO,MAAS,EAAM,OAAO,EAAQ,CAAK,CAAC,KAAK,CAAU,GAC/E,IAAY,EAAS,IAAO,MAAS,EAAM,OAAO,EAAK,SAAS,EAAU,CAAK,CAAC,KAAK,CAAU;CAYnG,OALI,IAAY,IAAY,MAC1B,IAAY,KAAK,IAAI,GAAW,CAAK,GACrC,IAAY,IAAQ,IAGf;EACL,MAAM,EAAK,MAAM,GAAG,EAAQ,CAAS,CAAC;EACtC,MAAM,EAAK,MAAM,EAAU,CAAS,CAAC;EACrC,WAAW;CACb;AACF"}
+{"version":3,"file":"truncate.js","names":[],"sources":["../../../src/components/middle-ellipsis/truncate.ts"],"sourcesContent":["/**\n * 单行「中间省略」的切分运算。\n *\n * 目标：把 `text` 拆成 `head + marker + tail`，两端各自在原串里连续、中间那段被丢掉，\n * 且合串不超过可用行内空间。切点只落在**字素簇**边界上，代理对、组合符序列和 ZWJ emoji\n * 都不会被从中间劈开——按 UTF-16 下标切一定会。\n *\n * 为什么这一层不能由 CSS 承担：`text-overflow` 渲染的是行盒里**一段连续**的内容，结构上\n * 不可能同时显示首尾而丢掉中间。能靠 `direction` / 双值写法挪动的只是省略号落在行的哪一\n * 端，而且 `direction: rtl` 那条路还会按双向算法重排内容（`2026-report.pdf` → `report.pdf-2026`）。\n * 完整调研见 docs/research/web-ui-middle-ellipsis-261007.md。\n *\n * 宽度口径：两端额度按 `position` 从可用空间里分出来，各自用「前 i 簇 / 后 i 簇」的**实测**\n * 宽度二分逼近。实测走调用方给的探针（Range 读取，不写 DOM），所以重算一次只有若干次读取，\n * 没有回流——panel 里同时存在成百上千个这样的单元格时，这个差别就是「一帧一次布局」与\n * 「一个单元格一次布局」的差别。\n *\n * 分段宽度不蕴含合串宽度：`head|marker` 与 `marker|tail` 两个接缝的字距和连字是分段量看不见\n * 的。这里不做合串实测，因为那要写一次 DOM 再读、把上面省下的回流又付回去；复核交给调用方\n * 对着**渲染出来的真实盒子**做一次（见组件的 `updated()`），那才是「放得下」的直接证据。\n */\n\n/** 默认省略标记：U+2026 HORIZONTAL ELLIPSIS。 */\nexport const DEFAULT_MARKER = '…'\n\nlet segmenter: Intl.Segmenter | undefined\n\n/**\n * 每个字素簇的 UTF-16 结束偏移（升序，不含 0），末项恒等于 `text.length`。\n *\n * `Intl.Segmenter` 的构造不便宜，单例复用。目标浏览器（见 package.json 的 browserslist）\n * 与本地 node 测试环境都自带它，因此不写按码点切的退化分支——那会在部分环境里悄悄改变\n * 切分口径，而这正是本模块唯一的正确性来源。\n */\nexport function clusterEnds(text: string): number[] {\n  if (text === '') return []\n\n  segmenter ??= new Intl.Segmenter(undefined, { granularity: 'grapheme' })\n\n  const ends: number[] = []\n  for (const { index, segment } of segmenter.segment(text)) ends.push(index + segment.length)\n  return ends\n}\n\n/**\n * 宽度探针。\n *\n * 三段都必须是**真实排版**下量到的宽度：字体回退、字距、连字、`letter-spacing`、\n * `text-transform` 都会改变字形的推进量，任何独立的估算（例如用 canvas 的 `measureText`）\n * 都要自己复刻这一整套解析，复刻不全就是静默的量错。\n */\nexport interface WidthProbe {\n  /** 原文前 `units` 个 UTF-16 单元的渲染宽度。 */\n  prefix(units: number): number\n  /** 原文后 `units` 个 UTF-16 单元的渲染宽度。 */\n  suffix(units: number): number\n  /** 标记自身的渲染宽度。 */\n  marker(): number\n}\n\nexport interface MiddleTruncation {\n  /** 保留的原文前缀。 */\n  readonly head: string\n  /** 保留的原文后缀。 */\n  readonly tail: string\n  /** 是否真的丢掉了内容；`false` 时合串就是原文，标记不出现。 */\n  readonly truncated: boolean\n}\n\n/** 宽度对簇数单调不减，因此可以二分求预算内放得下的最大簇数。 */\nfunction fitCount(total: number, fits: (count: number) => boolean): number {\n  let lo = 0\n  let hi = total\n  while (lo < hi) {\n    const mid = (lo + hi + 1) >> 1\n    if (fits(mid)) lo = mid\n    else hi = mid - 1\n  }\n  return lo\n}\n\n/**\n * 在 `available` 内把 `text` 切成 `head + marker + tail`。\n *\n * `position` 与 CSSWG css-overflow-5 的 `text-overflow: ellipsis <length-percentage>` 同向：\n * 量的是标记结束边距行末边的距离占可用行内空间的比例。`0` 把标记贴在行末（只剩头部，等价于\n * 末尾省略），`100` 贴在行首（只剩尾部），`50` 居中；两端额度因此是 `(1 - p)` 与 `p`。\n */\nexport function truncateMiddle(\n  text: string,\n  marker: string,\n  position: number,\n  available: number,\n  probe: WidthProbe\n): MiddleTruncation {\n  if (text === '') return { head: '', tail: '', truncated: false }\n\n  // 放得下就不截断，一个字符都不动——这既是正确性也是「短文本不该出现省略号」的体检点。\n  if (probe.prefix(text.length) <= available) return { head: text, tail: '', truncated: false }\n\n  const ends = clusterEnds(text)\n  const total = ends.length\n\n  /*\n   * 标记自己都放不下的快速路径：让标记溢出、由 overflow 把它裁掉（与 text-overflow 的既有语义\n   * 一致），而不是退回全文——退回全文会把标记挤出盒外，用户连「这里被截断了」的信号都看不到。\n   *\n   * 这一条不是正确性分支：预算为负时下面的通用路径同样得到 head / tail 都为空（`prefix(0) = 0`\n   * 不满足 `<= 负数`，两次二分都返回 0）。变异验证过——把它改成 `available <= 0`，整套测试仍全绿。\n   * 留着只是省掉两次二分，并把「标记放不下」这个意图写在明面上。\n   */\n  const space = available - probe.marker()\n  if (space <= 0) return { head: '', tail: '', truncated: true }\n\n  const ratio = Math.min(1, Math.max(0, position / 100))\n  const headBudget = space * (1 - ratio)\n  const tailBudget = space * ratio\n\n  /** 前 `count` 个簇在原串里的结束偏移。 */\n  const headEnd = (count: number): number => (count === 0 ? 0 : (ends[count - 1] ?? 0))\n  /** 后 `count` 个簇在原串里的起始偏移。 */\n  const tailStart = (count: number): number => (count === 0 ? text.length : (ends[total - count - 1] ?? 0))\n\n  let headCount = fitCount(total, count => probe.prefix(headEnd(count)) <= headBudget)\n  let tailCount = fitCount(total, count => probe.suffix(text.length - tailStart(count)) <= tailBudget)\n\n  /*\n   * 两端选中的簇加起来超过原文长度时，说明合串其实放得下，与上面的早退矛盾——那一步已经\n   * 用同一个探针量过全文。浮点误差仍可能把两个预算都推过界一点点，这里按头部优先夹紧，\n   * 保证 head 与 tail 不重叠。\n   */\n  if (headCount + tailCount > total) {\n    headCount = Math.min(headCount, total)\n    tailCount = total - headCount\n  }\n\n  return {\n    head: text.slice(0, headEnd(headCount)),\n    tail: text.slice(tailStart(tailCount)),\n    truncated: true\n  }\n}\n"],"mappings":";AAyBA,IAAI;;;;;;;;AASJ,SAAgB,YAAY,MAAwB;CAClD,IAAI,SAAS,IAAI,OAAO,CAAC;CAEzB,cAAc,IAAI,KAAK,UAAU,KAAA,GAAW,EAAE,aAAa,WAAW,CAAC;CAEvE,MAAM,OAAiB,CAAC;CACxB,KAAK,MAAM,EAAE,OAAO,aAAa,UAAU,QAAQ,IAAI,GAAG,KAAK,KAAK,QAAQ,QAAQ,MAAM;CAC1F,OAAO;AACT;;AA4BA,SAAS,SAAS,OAAe,MAA0C;CACzE,IAAI,KAAK;CACT,IAAI,KAAK;CACT,OAAO,KAAK,IAAI;EACd,MAAM,MAAO,KAAK,KAAK,KAAM;EAC7B,IAAI,KAAK,GAAG,GAAG,KAAK;OACf,KAAK,MAAM;CAClB;CACA,OAAO;AACT;;;;;;;;AASA,SAAgB,eACd,MACA,QACA,UACA,WACA,OACkB;CAClB,IAAI,SAAS,IAAI,OAAO;EAAE,MAAM;EAAI,MAAM;EAAI,WAAW;CAAM;CAG/D,IAAI,MAAM,OAAO,KAAK,MAAM,KAAK,WAAW,OAAO;EAAE,MAAM;EAAM,MAAM;EAAI,WAAW;CAAM;CAE5F,MAAM,OAAO,YAAY,IAAI;CAC7B,MAAM,QAAQ,KAAK;CAUnB,MAAM,QAAQ,YAAY,MAAM,OAAO;CACvC,IAAI,SAAS,GAAG,OAAO;EAAE,MAAM;EAAI,MAAM;EAAI,WAAW;CAAK;CAE7D,MAAM,QAAQ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,WAAW,GAAG,CAAC;CACrD,MAAM,aAAa,SAAS,IAAI;CAChC,MAAM,aAAa,QAAQ;;CAG3B,MAAM,WAAW,UAA2B,UAAU,IAAI,IAAK,KAAK,QAAQ,MAAM;;CAElF,MAAM,aAAa,UAA2B,UAAU,IAAI,KAAK,SAAU,KAAK,QAAQ,QAAQ,MAAM;CAEtG,IAAI,YAAY,SAAS,QAAO,UAAS,MAAM,OAAO,QAAQ,KAAK,CAAC,KAAK,UAAU;CACnF,IAAI,YAAY,SAAS,QAAO,UAAS,MAAM,OAAO,KAAK,SAAS,UAAU,KAAK,CAAC,KAAK,UAAU;CAOnG,IAAI,YAAY,YAAY,OAAO;EACjC,YAAY,KAAK,IAAI,WAAW,KAAK;EACrC,YAAY,QAAQ;CACtB;CAEA,OAAO;EACL,MAAM,KAAK,MAAM,GAAG,QAAQ,SAAS,CAAC;EACtC,MAAM,KAAK,MAAM,UAAU,SAAS,CAAC;EACrC,WAAW;CACb;AACF"}

package/dist/components/option/index.d.ts

@@ -1,22 +1,24 @@
-import { LitElement, PropertyValues } from 'lit';
+import "../icon/index.js";
+import { LitElement, PropertyValues } from "lit";
 export declare class WebUiOption extends LitElement {
-    static styles: import('lit').CSSResult;
-    value: string;
-    get label(): string;
-    set label(value: string);
-    private _label;
-    private _slottedLabel;
-    disabled: boolean;
-    selected: boolean;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    updated(changed: PropertyValues): void;
-    private _onLabelSlotChange;
-    private _getSlottedLabel;
-    render(): import('lit').TemplateResult<1>;
+  static styles: import("lit").CSSResult;
+  value: string;
+  get label(): string;
+  set label(value: string);
+  private _label;
+  private _slottedLabel;
+  disabled: boolean;
+  selected: boolean;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
+  updated(changed: PropertyValues): void;
+  private _onLabelSlotChange;
+  private _getSlottedLabel;
+  render(): import("lit").TemplateResult<1>;
 }
 declare global {
-    interface HTMLElementTagNameMap {
-        'web-ui-option': WebUiOption;
-    }
+  interface HTMLElementTagNameMap {
+    'web-ui-option': WebUiOption;
+  }
 }
+//# sourceMappingURL=index.d.ts.map

package/dist/components/option/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/option/index.ts"],"mappings":";;qBAUa,oBAAoB;SACf,sBAAM;EAEqB;MAEvC;MAGA,MAAM;UAKF;UACA;EAEoC;EACA;EAEnC;EAWA;EAWA,QAAQ,SAAS;UAWlB;UASA;EAQC,wBAAM;;QAYT;YACI;IACR,iBAAiB"}

package/dist/components/option/index.js

@@ -1,33 +1,42 @@
-import e from "../../_virtual/_@oxc-project_runtime@0.149.0/helpers/esm/decorate.js";
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
 import "../icon/index.js";
-import t from "../../icons/generated/heroicons-check-16-solid.js";
-import n from "./style.js";
-import { LitElement as r, html as i, unsafeCSS as a } from "lit";
-import { customElement as o, property as s } from "lit/decorators.js";
-//#region src/components/option/index.ts
-var c = class extends r {
-	constructor(...e) {
-		super(...e), this.value = "", this._label = "", this._slottedLabel = "", this.disabled = !1, this.selected = !1, this._onLabelSlotChange = () => {
-			let e = this._getSlottedLabel();
-			if (e === this._slottedLabel) return;
-			let t = this._label || this._slottedLabel;
-			this._slottedLabel = e, this.requestUpdate("label", t);
+import heroicons_check_16_solid_default from "../../icons/generated/heroicons-check-16-solid.js";
+import style_default from "./style.js";
+import { LitElement, html, unsafeCSS } from "lit";
+import { customElement, property } from "lit/decorators.js";
+// src/components/option/index.ts
+let WebUiOption = class WebUiOption extends LitElement {
+	constructor(..._args) {
+		super(..._args);
+		this.value = "";
+		this._label = "";
+		this._slottedLabel = "";
+		this.disabled = false;
+		this.selected = false;
+		this._onLabelSlotChange = () => {
+			const label = this._getSlottedLabel();
+			if (label === this._slottedLabel) return;
+			const old = this._label || this._slottedLabel;
+			this._slottedLabel = label;
+			this.requestUpdate("label", old);
 		};
 	}
 	static {
-		this.styles = a(n);
+		this.styles = unsafeCSS(style_default);
 	}
 	get label() {
 		return this._label || this._getSlottedLabel();
 	}
-	set label(e) {
-		let t = this.label;
-		this._label = e, this.requestUpdate("label", t);
+	set label(value) {
+		const old = this.label;
+		this._label = value;
+		this.requestUpdate("label", old);
 	}
 	connectedCallback() {
-		super.connectedCallback(), this.dispatchEvent(new CustomEvent("option-register", {
-			bubbles: !0,
-			composed: !0,
+		super.connectedCallback();
+		this.dispatchEvent(new CustomEvent("option-register", {
+			bubbles: true,
+			composed: true,
 			detail: {
 				value: this.value,
 				label: this.label,
@@ -36,43 +45,47 @@ var c = class extends r {
 		}));
 	}
 	disconnectedCallback() {
-		super.disconnectedCallback(), this.dispatchEvent(new CustomEvent("option-unregister", {
-			bubbles: !0,
-			composed: !0,
+		super.disconnectedCallback();
+		this.dispatchEvent(new CustomEvent("option-unregister", {
+			bubbles: true,
+			composed: true,
 			detail: { value: this.value }
 		}));
 	}
-	updated(e) {
-		(e.has("value") || e.has("label") || e.has("disabled")) && this.dispatchEvent(new CustomEvent("option-update", {
-			bubbles: !0,
-			composed: !0
+	updated(changed) {
+		if (changed.has("value") || changed.has("label") || changed.has("disabled")) this.dispatchEvent(new CustomEvent("option-update", {
+			bubbles: true,
+			composed: true
 		}));
 	}
 	_getSlottedLabel() {
-		return [...this.childNodes].filter((e) => !(e instanceof HTMLElement && e.slot)).map((e) => e.textContent).join("").trim();
+		return [...this.childNodes].filter((node) => !(node instanceof HTMLElement && node.slot)).map((node) => node.textContent).join("").trim();
 	}
 	render() {
-		return i`
+		return html`
       <div class="option-label">
-        <web-ui-icon class="check" size="16" .icon=${t}></web-ui-icon>
+        <web-ui-icon class="check" size="16" .icon=${heroicons_check_16_solid_default}></web-ui-icon>
         <slot name="prefix"></slot>
-        <span class="content-wrap">${this._label || i`<slot @slotchange=${this._onLabelSlotChange}></slot>`}</span>
+        <span class="content-wrap">${this._label || html`<slot @slotchange=${this._onLabelSlotChange}></slot>`}</span>
         <slot name="suffix"></slot>
       </div>
     `;
 	}
 };
-e([s({
+__decorate([property({
 	type: String,
-	reflect: !0
-})], c.prototype, "value", void 0), e([s({ type: String })], c.prototype, "label", null), e([s({
+	reflect: true
+})], WebUiOption.prototype, "value", void 0);
+__decorate([property({ type: String })], WebUiOption.prototype, "label", null);
+__decorate([property({
 	type: Boolean,
-	reflect: !0
-})], c.prototype, "disabled", void 0), e([s({
+	reflect: true
+})], WebUiOption.prototype, "disabled", void 0);
+__decorate([property({
 	type: Boolean,
-	reflect: !0
-})], c.prototype, "selected", void 0), c = e([o("web-ui-option")], c);
-//#endregion
-export { c as WebUiOption };
+	reflect: true
+})], WebUiOption.prototype, "selected", void 0);
+WebUiOption = __decorate([customElement("web-ui-option")], WebUiOption);
+export { WebUiOption };
 
 //# sourceMappingURL=index.js.map

package/dist/components/option/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/option/index.ts"],"sourcesContent":["import '@/components/icon'\n\nimport { html, LitElement, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { heroiconsCheck16Solid } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-option')\nexport class WebUiOption extends LitElement {\n  static override styles = unsafeCSS(style)\n\n  @property({ type: String, reflect: true }) value = ''\n  @property({ type: String })\n  get label(): string {\n    return this._label || this._getSlottedLabel()\n  }\n  set label(value: string) {\n    const old = this.label\n    this._label = value\n    this.requestUpdate('label', old)\n  }\n  private _label = ''\n  private _slottedLabel = ''\n\n  @property({ type: Boolean, reflect: true }) disabled = false\n  @property({ type: Boolean, reflect: true }) selected = false\n\n  override connectedCallback() {\n    super.connectedCallback()\n    this.dispatchEvent(\n      new CustomEvent('option-register', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value, label: this.label, disabled: this.disabled }\n      })\n    )\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this.dispatchEvent(\n      new CustomEvent('option-unregister', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value }\n      })\n    )\n  }\n\n  override updated(changed: PropertyValues) {\n    if (changed.has('value') || changed.has('label') || changed.has('disabled')) {\n      this.dispatchEvent(\n        new CustomEvent('option-update', {\n          bubbles: true,\n          composed: true\n        })\n      )\n    }\n  }\n\n  private _onLabelSlotChange = () => {\n    const label = this._getSlottedLabel()\n    if (label === this._slottedLabel) return\n\n    const old = this._label || this._slottedLabel\n    this._slottedLabel = label\n    this.requestUpdate('label', old)\n  }\n\n  private _getSlottedLabel(): string {\n    return [...this.childNodes]\n      .filter(node => !(node instanceof HTMLElement && node.slot))\n      .map(node => node.textContent)\n      .join('')\n      .trim()\n  }\n\n  override render() {\n    return html`\n      <div class=\"option-label\">\n        <web-ui-icon class=\"check\" size=\"16\" .icon=${heroiconsCheck16Solid}></web-ui-icon>\n        <slot name=\"prefix\"></slot>\n        <span class=\"content-wrap\">${this._label || html`<slot @slotchange=${this._onLabelSlotChange}></slot>`}</span>\n        <slot name=\"suffix\"></slot>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-option': WebUiOption\n  }\n}\n"],"mappings":";;;;;;;AAUO,IAAM,IAAN,cAA0B,EAAW;;EAoDP,aAjDgB,KAAA,QAAA,IAUlC,KAAA,SAAA,IACO,KAAA,gBAAA,IAE+B,KAAA,WAAA,IACA,KAAA,WAAA,IAmCpB,KAAA,2BAAA;GACjC,IAAM,IAAQ,KAAK,iBAAiB;GACpC,IAAI,MAAU,KAAK,eAAe;GAElC,IAAM,IAAM,KAAK,UAAU,KAAK;GAEhC,AADA,KAAK,gBAAgB,GACrB,KAAK,cAAc,SAAS,CAAG;EACjC;;;EA1DyB,KAAA,SAAA,EAAU,CAAK;;CAGxC,IACI,QAAgB;EAClB,OAAO,KAAK,UAAU,KAAK,iBAAiB;CAC9C;CACA,IAAI,MAAM,GAAe;EACvB,IAAM,IAAM,KAAK;EAEjB,AADA,KAAK,SAAS,GACd,KAAK,cAAc,SAAS,CAAG;CACjC;CAOA,oBAA6B;EAE3B,AADA,MAAM,kBAAkB,GACxB,KAAK,cACH,IAAI,YAAY,mBAAmB;GACjC,SAAS;GACT,UAAU;GACV,QAAQ;IAAE,OAAO,KAAK;IAAO,OAAO,KAAK;IAAO,UAAU,KAAK;GAAS;EAC1E,CAAC,CACH;CACF;CAEA,uBAAgC;EAE9B,AADA,MAAM,qBAAqB,GAC3B,KAAK,cACH,IAAI,YAAY,qBAAqB;GACnC,SAAS;GACT,UAAU;GACV,QAAQ,EAAE,OAAO,KAAK,MAAM;EAC9B,CAAC,CACH;CACF;CAEA,QAAiB,GAAyB;EACxC,CAAI,EAAQ,IAAI,OAAO,KAAK,EAAQ,IAAI,OAAO,KAAK,EAAQ,IAAI,UAAU,MACxE,KAAK,cACH,IAAI,YAAY,iBAAiB;GAC/B,SAAS;GACT,UAAU;EACZ,CAAC,CACH;CAEJ;CAWA,mBAAmC;EACjC,OAAO,CAAC,GAAG,KAAK,UAAU,CAAC,CACxB,QAAO,MAAQ,EAAE,aAAgB,eAAe,EAAK,KAAK,CAAC,CAC3D,KAAI,MAAQ,EAAK,WAAW,CAAC,CAC7B,KAAK,EAAE,CAAC,CACR,KAAK;CACV;CAEA,SAAkB;EAChB,OAAO,CAAI;;qDAEsC,EAAsB;;qCAEtC,KAAK,UAAU,CAAI,qBAAqB,KAAK,mBAAmB,UAAU;;;;CAI7G;AACF;AA5EG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GACxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,IAAA,GAYzB,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GACzC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GAlB3C,IAAA,EAAA,CAAA,EAAc,eAAe,CAAA,GAAA,CAAA"}
+{"version":3,"file":"index.js","names":["style","heroiconsCheck16Solid"],"sources":["../../../src/components/option/index.ts"],"sourcesContent":["import '@/components/icon'\n\nimport { html, LitElement, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { heroiconsCheck16Solid } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-option')\nexport class WebUiOption extends LitElement {\n  static override styles = unsafeCSS(style)\n\n  @property({ type: String, reflect: true }) value = ''\n  @property({ type: String })\n  get label(): string {\n    return this._label || this._getSlottedLabel()\n  }\n  set label(value: string) {\n    const old = this.label\n    this._label = value\n    this.requestUpdate('label', old)\n  }\n  private _label = ''\n  private _slottedLabel = ''\n\n  @property({ type: Boolean, reflect: true }) disabled = false\n  @property({ type: Boolean, reflect: true }) selected = false\n\n  override connectedCallback() {\n    super.connectedCallback()\n    this.dispatchEvent(\n      new CustomEvent('option-register', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value, label: this.label, disabled: this.disabled }\n      })\n    )\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this.dispatchEvent(\n      new CustomEvent('option-unregister', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value }\n      })\n    )\n  }\n\n  override updated(changed: PropertyValues) {\n    if (changed.has('value') || changed.has('label') || changed.has('disabled')) {\n      this.dispatchEvent(\n        new CustomEvent('option-update', {\n          bubbles: true,\n          composed: true\n        })\n      )\n    }\n  }\n\n  private _onLabelSlotChange = () => {\n    const label = this._getSlottedLabel()\n    if (label === this._slottedLabel) return\n\n    const old = this._label || this._slottedLabel\n    this._slottedLabel = label\n    this.requestUpdate('label', old)\n  }\n\n  private _getSlottedLabel(): string {\n    return [...this.childNodes]\n      .filter(node => !(node instanceof HTMLElement && node.slot))\n      .map(node => node.textContent)\n      .join('')\n      .trim()\n  }\n\n  override render() {\n    return html`\n      <div class=\"option-label\">\n        <web-ui-icon class=\"check\" size=\"16\" .icon=${heroiconsCheck16Solid}></web-ui-icon>\n        <slot name=\"prefix\"></slot>\n        <span class=\"content-wrap\">${this._label || html`<slot @slotchange=${this._onLabelSlotChange}></slot>`}</span>\n        <slot name=\"suffix\"></slot>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-option': WebUiOption\n  }\n}\n"],"mappings":";;;;;;;AAUO,IAAM,cAAN,MAAM,oBAAoB,WAAW;;;EAGS,KAAA,QAAA;EAUlC,KAAA,SAAA;EACO,KAAA,gBAAA;EAE+B,KAAA,WAAA;EACA,KAAA,WAAA;EAmCpB,KAAA,2BAAA;GACjC,MAAM,QAAQ,KAAK,iBAAiB;GACpC,IAAI,UAAU,KAAK,eAAe;GAElC,MAAM,MAAM,KAAK,UAAU,KAAK;GAChC,KAAK,gBAAgB;GACrB,KAAK,cAAc,SAAS,GAAG;EACjC;;;EA1DyB,KAAA,SAAA,UAAUA,aAAK;;CAGxC,IACI,QAAgB;EAClB,OAAO,KAAK,UAAU,KAAK,iBAAiB;CAC9C;CACA,IAAI,MAAM,OAAe;EACvB,MAAM,MAAM,KAAK;EACjB,KAAK,SAAS;EACd,KAAK,cAAc,SAAS,GAAG;CACjC;CAOA,oBAA6B;EAC3B,MAAM,kBAAkB;EACxB,KAAK,cACH,IAAI,YAAY,mBAAmB;GACjC,SAAS;GACT,UAAU;GACV,QAAQ;IAAE,OAAO,KAAK;IAAO,OAAO,KAAK;IAAO,UAAU,KAAK;GAAS;EAC1E,CAAC,CACH;CACF;CAEA,uBAAgC;EAC9B,MAAM,qBAAqB;EAC3B,KAAK,cACH,IAAI,YAAY,qBAAqB;GACnC,SAAS;GACT,UAAU;GACV,QAAQ,EAAE,OAAO,KAAK,MAAM;EAC9B,CAAC,CACH;CACF;CAEA,QAAiB,SAAyB;EACxC,IAAI,QAAQ,IAAI,OAAO,KAAK,QAAQ,IAAI,OAAO,KAAK,QAAQ,IAAI,UAAU,GACxE,KAAK,cACH,IAAI,YAAY,iBAAiB;GAC/B,SAAS;GACT,UAAU;EACZ,CAAC,CACH;CAEJ;CAWA,mBAAmC;EACjC,OAAO,CAAC,GAAG,KAAK,UAAU,CAAC,CACxB,QAAO,SAAQ,EAAE,gBAAgB,eAAe,KAAK,KAAK,CAAC,CAC3D,KAAI,SAAQ,KAAK,WAAW,CAAC,CAC7B,KAAK,EAAE,CAAC,CACR,KAAK;CACV;CAEA,SAAkB;EAChB,OAAO,IAAI;;qDAEsCC,iCAAsB;;qCAEtC,KAAK,UAAU,IAAI,qBAAqB,KAAK,mBAAmB,UAAU;;;;CAI7G;AACF;AA5EG,WAAA,CAAA,SAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,YAAA,WAAA,SAAA,KAAA,CAAA;AACxC,WAAA,CAAA,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,YAAA,WAAA,SAAA,IAAA;AAYzB,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,YAAA,WAAA,YAAA,KAAA,CAAA;AACzC,WAAA,CAAA,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,YAAA,WAAA,YAAA,KAAA,CAAA;AAlB3C,cAAA,WAAA,CAAA,cAAc,eAAe,CAAA,GAAA,WAAA"}

package/dist/components/option/style.js

@@ -1,6 +1,5 @@
-//#region src/components/option/style.css?inline
-var e = "*,:before,:after{box-sizing:border-box}:host{display:block}:host([disabled]){cursor:not-allowed;opacity:.4}.option-label{cursor:default;-webkit-user-select:none;user-select:none;gap:var(--wui-space-2,8px);box-sizing:border-box;height:32px;padding:0 var(--wui-space-2,8px);border-radius:var(--wui-radius-control,calc(infinity * 1px));font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;align-items:center;display:flex;overflow:hidden}.check{display:var(--wui-option-check-display,block);flex-shrink:0}.content-wrap{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}:host(:not([selected])) .check{visibility:hidden}::slotted([slot=prefix]),::slotted([slot=suffix]){flex-shrink:0}.option-label:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,color-mix(in srgb, var(--wui-color-accent,#0071e3) 40%, transparent));outline-offset:2px}:host([active]) .option-label{color:var(--wui-color-on-accent,#fff);background:var(--wui-color-accent,#0071e3)}@media (hover:hover) and (pointer:fine){:host(:not([active])) .option-label:hover{background:var(--wui-color-border,#0000001a)}}:host([disabled]) .option-label{cursor:not-allowed}";
-//#endregion
-export { e as default };
+// src/components/option/style.css?inline
+var style_default = "*,:before,:after{box-sizing:border-box}:host{display:block}:host([disabled]){cursor:not-allowed;opacity:.4}.option-label{cursor:default;-webkit-user-select:none;user-select:none;gap:var(--wui-space-2,8px);box-sizing:border-box;height:32px;padding:0 var(--wui-space-2,8px);border-radius:var(--wui-radius-control,calc(infinity * 1px));font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;align-items:center;display:flex;overflow:hidden}.check{display:var(--wui-option-check-display,block);flex-shrink:0}.content-wrap{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}:host(:not([selected])) .check{visibility:hidden}::slotted([slot=prefix]),::slotted([slot=suffix]){flex-shrink:0}.option-label:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,color-mix(in srgb, var(--wui-color-accent,#0071e3) 40%, transparent));outline-offset:2px}:host([active]) .option-label{color:var(--wui-color-on-accent,#fff);background:var(--wui-color-accent,#0071e3)}@media (hover:hover) and (pointer:fine){:host(:not([active])) .option-label:hover{background:var(--wui-color-border,#0000001a)}}:host([disabled]) .option-label{cursor:not-allowed}\n";
+export { style_default as default };
 
 //# sourceMappingURL=style.js.map

package/dist/components/option/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/option/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n:host {\n  display: block;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n  opacity: 0.4;\n}\n\n.option-label {\n  cursor: default;\n  user-select: none;\n\n  overflow: hidden;\n  display: flex;\n  gap: var(--wui-space-2, 8px);\n  align-items: center;\n\n  box-sizing: border-box;\n  height: 32px;\n  padding: 0 var(--wui-space-2, 8px);\n  border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n  font-size: var(--wui-font-size, 14px);\n  color: var(--wui-color-text, #1b1b1b);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.check {\n  display: var(--wui-option-check-display, block);\n  flex-shrink: 0;\n}\n\n.content-wrap {\n  overflow: hidden;\n  flex: 1;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n:host(:not([selected])) .check {\n  visibility: hidden;\n}\n\n::slotted([slot='prefix']),\n::slotted([slot='suffix']) {\n  flex-shrink: 0;\n}\n\n.option-label:focus-visible {\n  outline: var(--wui-focus-ring-width, 3px) solid\n    var(--wui-color-focus-ring, color-mix(in srgb, var(--wui-color-accent, #0071e3) 40%, transparent));\n  outline-offset: 2px;\n}\n\n:host([active]) .option-label {\n  color: var(--wui-color-on-accent, #fff);\n  background: var(--wui-color-accent, #0071e3);\n}\n\n@media (hover: hover) and (pointer: fine) {\n  :host(:not([active])) .option-label:hover {\n    background: var(--wui-color-border, rgb(0 0 0 / 0.1));\n  }\n}\n\n:host([disabled]) .option-label {\n  cursor: not-allowed;\n}\n"],"mappings":""}
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/option/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n:host {\n  display: block;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n  opacity: 0.4;\n}\n\n.option-label {\n  cursor: default;\n  user-select: none;\n\n  overflow: hidden;\n  display: flex;\n  gap: var(--wui-space-2, 8px);\n  align-items: center;\n\n  box-sizing: border-box;\n  height: 32px;\n  padding: 0 var(--wui-space-2, 8px);\n  border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n  font-size: var(--wui-font-size, 14px);\n  color: var(--wui-color-text, #1b1b1b);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.check {\n  display: var(--wui-option-check-display, block);\n  flex-shrink: 0;\n}\n\n.content-wrap {\n  overflow: hidden;\n  flex: 1;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n:host(:not([selected])) .check {\n  visibility: hidden;\n}\n\n::slotted([slot='prefix']),\n::slotted([slot='suffix']) {\n  flex-shrink: 0;\n}\n\n.option-label:focus-visible {\n  outline: var(--wui-focus-ring-width, 3px) solid\n    var(--wui-color-focus-ring, color-mix(in srgb, var(--wui-color-accent, #0071e3) 40%, transparent));\n  outline-offset: 2px;\n}\n\n:host([active]) .option-label {\n  color: var(--wui-color-on-accent, #fff);\n  background: var(--wui-color-accent, #0071e3);\n}\n\n@media (hover: hover) and (pointer: fine) {\n  :host(:not([active])) .option-label:hover {\n    background: var(--wui-color-border, rgb(0 0 0 / 0.1));\n  }\n}\n\n:host([disabled]) .option-label {\n  cursor: not-allowed;\n}\n"],"mappings":";AAAA,IAAA,gBAAA"}

package/dist/components/popover/index.d.ts

@@ -1,72 +1,73 @@
-import { Placement } from '@floating-ui/dom';
-import { LitElement } from 'lit';
-import { OverlayContainer } from '../../shared/overlay/portal';
+import { OverlayContainer } from "../../shared/overlay/portal.js";
+import { LitElement } from "lit";
+import { Placement } from "@floating-ui/dom";
 export declare class WebUiPopover extends LitElement {
-    static styles: import('lit').CSSResult[];
-    open: boolean;
-    disabled: boolean;
-    get placement(): Placement;
-    set placement(v: string);
-    private _placement;
-    get offset(): number;
-    set offset(v: number);
-    private _offset;
-    get trigger(): 'click' | 'hover' | 'manual';
-    set trigger(v: string);
-    private _trigger;
-    portal: boolean;
-    overlayContainer?: OverlayContainer;
-    private _showTimer?;
-    private _hideTimer?;
-    private readonly _userOpenChange;
-    private _shouldOpenInstantly;
-    private _panelId;
-    private _portal?;
-    /**
-     * 开启态 overlay（issue #120 Block 1）：本组件不再自行监听 keydown，只声明「我开着」，
-     * 由唯一仲裁者决定一次 Escape 关谁。实例作用域的帧事务入口也在这里（合并了原
-     * lifecycle）—— 它的 lifetime 长于一次开合（跨 `suspend()`/`resume()`），
-     * 但不长于实例本身。
-     */
-    private readonly _overlay;
-    private readonly _panel;
-    get isOpen(): boolean;
-    connectedCallback(): void;
-    firstUpdated(): void;
-    disconnectedCallback(): void;
-    protected updated(changed: Map<string, unknown>): void;
-    show(): void;
-    close(): void;
-    toggle(): void;
-    private _isInsideShadowRoot;
-    private _syncTriggerListeners;
-    private _syncOverlayInert;
-    private _openOverlay;
-    private _migratableContentNodes;
-    private _createPortal;
-    private _closeOverlay;
-    private _reconfigureOverlay;
-    private _dispatchChange;
-    private _syncTriggerAria;
-    private _focusPanel;
-    private _returnFocus;
-    private _queryTrigger;
-    private _onTriggerClick;
-    private _onClickOutside;
-    private _onFocusOut;
-    private _onPointerEnter;
-    private _onPointerLeave;
-    private _onPanelPointerEnter;
-    private _onPanelPointerLeave;
-    render(): import('lit').TemplateResult<1>;
-    readonly $events: {
-        'open-change': CustomEvent<{
-            open: boolean;
-        }>;
-    };
+  static styles: import("lit").CSSResult[];
+  open: boolean;
+  disabled: boolean;
+  get placement(): Placement;
+  set placement(v: string);
+  private _placement;
+  get offset(): number;
+  set offset(v: number);
+  private _offset;
+  get trigger(): 'click' | 'hover' | 'manual';
+  set trigger(v: string);
+  private _trigger;
+  portal: boolean;
+  overlayContainer?: OverlayContainer;
+  private _showTimer?;
+  private _hideTimer?;
+  private readonly _userOpenChange;
+  private _shouldOpenInstantly;
+  private _panelId;
+  private _portal?;
+  /**
+   * 开启态 overlay（issue #120 Block 1）：本组件不自行监听 keydown，只声明「我开着」，
+   * 由唯一仲裁者决定一次 Escape 关谁。实例作用域的帧事务入口也在这里
+   * —— 它的 lifetime 长于一次开合（跨 `suspend()`/`resume()`），
+   * 但不长于实例本身。
+   */
+  private readonly _overlay;
+  private readonly _panel;
+  get isOpen(): boolean;
+  connectedCallback(): void;
+  firstUpdated(): void;
+  disconnectedCallback(): void;
+  protected updated(changed: Map<string, unknown>): void;
+  show(): void;
+  close(): void;
+  toggle(): void;
+  private _isInsideShadowRoot;
+  private _syncTriggerListeners;
+  private _syncOverlayInert;
+  private _openOverlay;
+  private _migratableContentNodes;
+  private _createPortal;
+  private _closeOverlay;
+  private _reconfigureOverlay;
+  private _dispatchChange;
+  private _syncTriggerAria;
+  private _focusPanel;
+  private _returnFocus;
+  private _queryTrigger;
+  private _onTriggerClick;
+  private _onClickOutside;
+  private _onFocusOut;
+  private _onPointerEnter;
+  private _onPointerLeave;
+  private _onPanelPointerEnter;
+  private _onPanelPointerLeave;
+  render(): import("lit").TemplateResult<1>;
+  readonly $events: {
+    'open-change': CustomEvent<{
+      open: boolean;
+    }>;
+  };
 }
 declare global {
-    interface HTMLElementTagNameMap {
-        'web-ui-popover': WebUiPopover;
-    }
+  interface HTMLElementTagNameMap {
+    'web-ui-popover': WebUiPopover;
+  }
 }
+//# sourceMappingURL=index.d.ts.map

package/dist/components/popover/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../../src/components/popover/index.ts"],"mappings":";;;qBAqBa,qBAAqB;SAChB,sBAAM;EAEsB;EACA;MAGxC,aAAa;MAGb,UAAU;UAKN;MAGJ;MAGA,OAAO;UAKH;MAGJ;MAGA,QAAQ;UAKJ;EAEoC;EACZ,mBAAmB;UAE3C;UACA;mBACS;UACT;UAEA;UACA;;;;;;;mBAOS;mBAOA;MAab;EAIK;EAQA;EAiBA;YAaU,QAAQ,SAAS;EAsCpC;EAKA;EAKA;UAKQ;UAOA;UAYA;UAIA;UAWA;UAMA;UAmBM;UAIN;UAaA;UASA;UAOA;UAQA;UAOA;UAMA;UAUA;UAUA;UAWA;UAYA;UAWA;UAMA;EAUC,wBAAM;WA0BE;IACf,eAAe;MAAc;;;;QAIzB;YACI;IACR,kBAAkB"}