@shwfed/config 2.7.2 → 2.7.4

package/dist/runtime/components/config/blocks/2026-05-06/com.shwfed.block.markdown/schema.js

@@ -1,5 +1,6 @@
 import { Schema } from "effect";
 import { Locale } from "../../../../../share/locale.js";
+import { Expression } from "../../../../../share/expression.js";
 export const type = "com.shwfed.block.markdown";
 export const compatibilityDate = "2026-05-06";
 export const metadata = {
@@ -8,7 +9,11 @@ export const metadata = {
   w: { initial: 8, min: 2, max: Infinity },
   h: { initial: 2, min: 2, max: Infinity }
 };
-export function schema(_configure, _blockRef) {
+export function schema(configure, _blockRef) {
+  const CelStyle = Expression({
+    configure,
+    resultType: (t) => t === "string" || t === "dyn" || t.startsWith("map") || t.startsWith("optional")
+  });
   return Schema.Struct({
     id: Schema.UUID.annotations({ description: "\u5757\u552F\u4E00\u6807\u8BC6" }),
     type: Schema.tag(type),
@@ -17,6 +22,10 @@ export function schema(_configure, _blockRef) {
       title: "\u5185\u90E8\u540D\u79F0",
       description: "\u4EC5\u5728\u7F16\u8F91\u5668\u5185\u53EF\u89C1\u7684\u5757\u540D\uFF0C\u7528\u4E8E\u5728\u4FA7\u8FB9\u680F\u548C\u5E03\u5C40\u7F16\u8F91\u5668\u4E2D\u8BC6\u522B\u5757\uFF1B\u8FD0\u884C\u65F6\u4E0D\u5C55\u793A"
     })),
+    style: Schema.optional(CelStyle).annotations({
+      title: "\u6837\u5F0F",
+      description: "\u8FD4\u56DE\u5E94\u7528\u5728 Markdown \u5757\u6839\u5143\u7D20\u4E0A\u7684\u6837\u5F0F\u7684 CEL \u8868\u8FBE\u5F0F\uFF0C\u53EF\u8FD4\u56DE CSS \u5B57\u7B26\u4E32\uFF08\u5982 `'padding: 2rem'`\uFF09\u6216\u6837\u5F0F\u5BF9\u8C61\uFF08\u5982 `{'padding': '2rem'}`\uFF09\uFF1B\u7559\u7A7A\u5219\u4E0D\u8BBE\u989D\u5916\u6837\u5F0F"
+    }),
     content: Locale.annotations({
       title: "\u5185\u5BB9",
       description: "\u6E32\u67D3\u4E3A Markdown \u7684\u591A\u8BED\u8A00\u6587\u672C"

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/badge.vue

@@ -28,6 +28,16 @@ const rendered = computed(() => {
   if (!template.value) return "";
   return interpolateMarkdown(template.value, cel, { ...baseContext(), json: jsonOption.value });
 });
+const visible = computed(() => {
+  const expr = props.badge.show;
+  if (!expr) return true;
+  try {
+    return Effect.runSync(cel(expr, { ...baseContext(), json: jsonOption.value }));
+  } catch (e) {
+    console.warn("[shwfed-card-badge] show evaluation failed", e);
+    return true;
+  }
+});
 async function refresh() {
   const req = props.badge.request;
   if (!req) return;
@@ -70,7 +80,7 @@ watch(
 </script>
 
 <template>
-  <template v-if="template">
+  <template v-if="template && visible">
     <Badge
       v-if="badge.dot"
       :variant="badge.variant ?? 'default'"

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/config.d.vue.ts

@@ -43,6 +43,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;
@@ -85,6 +86,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/config.vue

@@ -59,7 +59,7 @@ const slotAccessor = computed({
   }
 });
 const editor = useSlotEditor(slotAccessor, { configure: configure.value });
-const viewMode = ref("content");
+const viewMode = ref("general");
 function selectContent() {
   viewMode.value = "content";
   drilledBlockId.value = null;
@@ -103,6 +103,9 @@ function setBadgeRequest(v) {
 function setBadgeContent(v) {
   patchBadge({ content: isLocaleBlank(v) ? void 0 : v });
 }
+function setBadgeShow(v) {
+  patchBadge({ show: v.trim().length > 0 ? v : void 0 });
+}
 function setBadgeInterval(v) {
   patchBadge({ interval: typeof v === "number" && v > 0 ? Math.round(v) : void 0 });
 }
@@ -190,38 +193,38 @@ if (breadcrumbExt) {
     >
       <div
         class="row pl-2"
-        :class="viewMode === 'content' ? 'bg-[color-mix(in_srgb,var(--primary)_10%,white)] text-(--primary)' : 'text-zinc-700 hover:bg-zinc-50'"
-        @click="selectContent()"
+        :class="viewMode === 'general' ? 'bg-[color-mix(in_srgb,var(--primary)_10%,white)] text-(--primary)' : 'text-zinc-700 hover:bg-zinc-50'"
+        @click="selectGeneral()"
       >
         <Icon
-          icon="fluent:apps-list-20-regular"
+          icon="fluent:settings-20-regular"
           class="size-4 shrink-0"
         />
-        <span class="flex-1 truncate">内容</span>
+        <span class="flex-1 truncate">通用配置</span>
       </div>
 
       <div
         class="row pl-2"
-        :class="viewMode === 'badge' ? 'bg-[color-mix(in_srgb,var(--primary)_10%,white)] text-(--primary)' : 'text-zinc-700 hover:bg-zinc-50'"
-        @click="selectBadge()"
+        :class="viewMode === 'content' ? 'bg-[color-mix(in_srgb,var(--primary)_10%,white)] text-(--primary)' : 'text-zinc-700 hover:bg-zinc-50'"
+        @click="selectContent()"
       >
         <Icon
-          icon="fluent:badge-20-regular"
+          icon="fluent:apps-list-20-regular"
           class="size-4 shrink-0"
         />
-        <span class="flex-1 truncate">徽章</span>
+        <span class="flex-1 truncate">内容</span>
       </div>
 
       <div
         class="row pl-2"
-        :class="viewMode === 'general' ? 'bg-[color-mix(in_srgb,var(--primary)_10%,white)] text-(--primary)' : 'text-zinc-700 hover:bg-zinc-50'"
-        @click="selectGeneral()"
+        :class="viewMode === 'badge' ? 'bg-[color-mix(in_srgb,var(--primary)_10%,white)] text-(--primary)' : 'text-zinc-700 hover:bg-zinc-50'"
+        @click="selectBadge()"
       >
         <Icon
-          icon="fluent:settings-20-regular"
+          icon="fluent:badge-20-regular"
           class="size-4 shrink-0"
         />
-        <span class="flex-1 truncate">通用配置</span>
+        <span class="flex-1 truncate">徽章</span>
       </div>
 
       <Separator class="my-2" />
@@ -352,6 +355,30 @@ if (breadcrumbExt) {
 
       <!-- Badge settings. -->
       <template v-else-if="viewMode === 'badge'">
+        <Field orientation="vertical">
+          <FieldLabel class="text-xs text-zinc-500">
+            <template
+              v-if="badgeDescription('request')"
+              #tooltip
+            >
+              <Markdown
+                :source="badgeDescription('request')"
+                block
+                class="prose prose-sm prose-zinc"
+              />
+            </template>
+            {{ badgeTitle("request") }}
+          </FieldLabel>
+          <ExpressionEditor
+            :model-value="badge.request ?? ''"
+            placeholder="可选；如 http.get('/api/notifications')"
+            result-type="HttpRequest"
+            multiline
+            class="min-h-20"
+            @update:model-value="(v) => setBadgeRequest(v)"
+          />
+        </Field>
+
         <Field orientation="vertical">
           <FieldLabel class="text-xs text-zinc-500">
             <template
@@ -377,24 +404,24 @@ if (breadcrumbExt) {
         <Field orientation="vertical">
           <FieldLabel class="text-xs text-zinc-500">
             <template
-              v-if="badgeDescription('request')"
+              v-if="badgeDescription('show')"
               #tooltip
             >
               <Markdown
-                :source="badgeDescription('request')"
+                :source="badgeDescription('show')"
                 block
                 class="prose prose-sm prose-zinc"
               />
             </template>
-            {{ badgeTitle("request") }}
+            {{ badgeTitle("show") }}
           </FieldLabel>
           <ExpressionEditor
-            :model-value="badge.request ?? ''"
-            placeholder="可选；如 http.get('/api/notifications')"
-            result-type="HttpRequest"
+            :model-value="badge.show ?? ''"
+            placeholder="例：json.?data.?total.orValue(0) != 0"
+            result-type="bool"
             multiline
-            class="min-h-20"
-            @update:model-value="(v) => setBadgeRequest(v)"
+            class="min-h-12"
+            @update:model-value="(v) => setBadgeShow(v)"
           />
         </Field>
 

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/config.vue.d.ts

@@ -43,6 +43,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;
@@ -85,6 +86,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/runtime.d.vue.ts

@@ -43,6 +43,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;
@@ -85,6 +86,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/runtime.vue.d.ts

@@ -43,6 +43,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;
@@ -85,6 +86,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 readonly locale: "en" | "ja" | "ko";
                 readonly message: string;
             }[]] | undefined;
+            readonly show?: string | undefined;
             readonly dot?: boolean | undefined;
             readonly variant?: "default" | "destructive" | "outline" | "secondary" | undefined;
             readonly request?: string | undefined;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/schema.d.ts

@@ -37,6 +37,7 @@ export declare function badgeSchema(configure: Configure): Schema.Struct<{
         locale: Schema.Literal<["ja", "en", "ko"]>;
         message: Schema.SchemaClass<string, string, never>;
     }>]>>>;
+    show: Schema.optional<Schema.Schema<string, string, never>>;
     interval: Schema.optional<Schema.refine<number, Schema.filter<typeof Schema.Number>>>;
     dot: Schema.optional<Schema.SchemaClass<boolean, boolean, never>>;
     variant: Schema.optional<Schema.Literal<["default", "secondary", "destructive", "outline"]>>;
@@ -57,6 +58,7 @@ export declare function schema(configure: Configure, blockRef: AnySchema): Schem
             locale: Schema.Literal<["ja", "en", "ko"]>;
             message: Schema.SchemaClass<string, string, never>;
         }>]>>>;
+        show: Schema.optional<Schema.Schema<string, string, never>>;
         interval: Schema.optional<Schema.refine<number, Schema.filter<typeof Schema.Number>>>;
         dot: Schema.optional<Schema.SchemaClass<boolean, boolean, never>>;
         variant: Schema.optional<Schema.Literal<["default", "secondary", "destructive", "outline"]>>;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.card/schema.js

@@ -28,6 +28,13 @@ export function badgeSchema(configure) {
       registerJson(env);
     }
   });
+  const CelShow = Expression({
+    configure: (env) => {
+      configure(env);
+      registerJson(env);
+    },
+    resultType: "bool"
+  });
   return Schema.Struct({
     request: Schema.optional(CelRequest).annotations({
       title: "\u8BF7\u6C42",
@@ -37,6 +44,10 @@ export function badgeSchema(configure) {
       title: "\u5185\u5BB9",
       description: "\u672C\u5730\u5316\u7684\u5185\u8054 Markdown\uFF0C\u652F\u6301 `{{ \u8868\u8FBE\u5F0F }}` CEL \u63D2\u503C\uFF0C\u53EF\u5F15\u7528 `json`\uFF1B\u7559\u7A7A\u5219\u4E0D\u663E\u793A\u5FBD\u7AE0"
     }),
+    show: Schema.optional(CelShow).annotations({
+      title: "\u663E\u793A\u6761\u4EF6",
+      description: "\u8FD4\u56DE `bool` \u7684\u8868\u8FBE\u5F0F\uFF0C\u53EF\u5F15\u7528 `json`\uFF1B\u8FD4\u56DE `false` \u65F6\u5373\u4F7F `\u5185\u5BB9` \u975E\u7A7A\u4E5F\u4E0D\u663E\u793A\u5FBD\u7AE0\uFF1B\u7559\u7A7A\u5219\u59CB\u7EC8\u663E\u793A\u3002\u5E38\u7528\u4E8E\u5FFD\u7565\u7279\u5B9A\u503C\uFF08\u5982 total \u4E3A 0 \u65F6\u9690\u85CF\uFF09"
+    }),
     interval: Schema.optional(
       Schema.Number.pipe(Schema.int(), Schema.positive()).annotations({
         title: "\u8F6E\u8BE2\u95F4\u9694",

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.icon/config.d.vue.ts

@@ -0,0 +1,34 @@
+import type { Environment } from '../../../../../vendor/cel-js/lib/index.js';
+import { type Value } from './schema.js';
+type __VLS_Props = {
+    configure?: (env: Environment) => void;
+};
+type __VLS_ModelProps = {
+    modelValue: Value;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.icon/config.vue

@@ -0,0 +1,153 @@
+<script setup>
+import { Schema } from "effect";
+import { ColorPicker } from "../../../../ui/color-picker";
+import { Field, FieldLabel } from "../../../../ui/field";
+import { IconPicker } from "../../../../ui/icon-picker";
+import { InputGroup, InputGroupInput, InputGroupNumberField } from "../../../../ui/input-group";
+import { Markdown } from "../../../../ui/markdown";
+import { Switch } from "../../../../ui/switch";
+import {
+  getStructFieldDescription,
+  getStructFieldTitle,
+  schema
+} from "./schema";
+defineOptions({ name: "ShwfedBlockIconConfig" });
+const block = defineModel({ type: null, ...{ required: true } });
+defineProps({
+  configure: { type: Function, required: false }
+});
+const blockSchema = schema(() => {
+}, Schema.Any);
+const fieldTitle = (f) => getStructFieldTitle(blockSchema, f) ?? f;
+const fieldDescription = (f) => getStructFieldDescription(blockSchema, f);
+function setDisplayName(v) {
+  const s = String(v ?? "");
+  block.value = { ...block.value, displayName: s.length > 0 ? s : void 0 };
+}
+function setIcon(v) {
+  block.value = { ...block.value, icon: v };
+}
+function setColor(v) {
+  block.value = { ...block.value, color: v.trim().length > 0 ? v : void 0 };
+}
+function setSize(v) {
+  block.value = { ...block.value, size: typeof v === "number" && v > 0 ? Math.round(v) : void 0 };
+}
+function setCircle(v) {
+  block.value = { ...block.value, circle: v ? true : void 0 };
+}
+</script>
+
+<template>
+  <div class="flex flex-col gap-3">
+    <Field orientation="vertical">
+      <FieldLabel class="text-xs text-zinc-500">
+        <template
+          v-if="fieldDescription('displayName')"
+          #tooltip
+        >
+          <Markdown
+            :source="fieldDescription('displayName')"
+            block
+            class="prose prose-sm prose-zinc"
+          />
+        </template>
+        {{ fieldTitle("displayName") }}
+      </FieldLabel>
+      <InputGroup>
+        <InputGroupInput
+          :model-value="block.displayName ?? ''"
+          placeholder="例：状态图标"
+          @update:model-value="setDisplayName"
+        />
+      </InputGroup>
+    </Field>
+
+    <Field orientation="vertical">
+      <FieldLabel class="text-xs text-zinc-500">
+        <template
+          v-if="fieldDescription('icon')"
+          #tooltip
+        >
+          <Markdown
+            :source="fieldDescription('icon')"
+            block
+            class="prose prose-sm prose-zinc"
+          />
+        </template>
+        {{ fieldTitle("icon") }}
+      </FieldLabel>
+      <IconPicker
+        :model-value="block.icon"
+        @update:model-value="setIcon"
+      />
+    </Field>
+
+    <div class="grid grid-cols-2 gap-3">
+      <Field orientation="vertical">
+        <FieldLabel class="text-xs text-zinc-500">
+          <template
+            v-if="fieldDescription('color')"
+            #tooltip
+          >
+            <Markdown
+              :source="fieldDescription('color')"
+              block
+              class="prose prose-sm prose-zinc"
+            />
+          </template>
+          {{ fieldTitle("color") }}
+        </FieldLabel>
+        <ColorPicker
+          :model-value="block.color ?? ''"
+          placeholder="#4f46e5"
+          @update:model-value="setColor"
+        />
+      </Field>
+
+      <Field orientation="vertical">
+        <FieldLabel class="text-xs text-zinc-500">
+          <template
+            v-if="fieldDescription('size')"
+            #tooltip
+          >
+            <Markdown
+              :source="fieldDescription('size')"
+              block
+              class="prose prose-sm prose-zinc"
+            />
+          </template>
+          {{ fieldTitle("size") }}
+        </FieldLabel>
+        <InputGroup>
+          <InputGroupNumberField
+            :model-value="block.size"
+            :min="1"
+            placeholder="8"
+            @update:model-value="(v) => setSize(v)"
+          />
+        </InputGroup>
+      </Field>
+    </div>
+
+    <Field orientation="horizontal">
+      <FieldLabel class="text-xs text-zinc-500">
+        <template
+          v-if="fieldDescription('circle')"
+          #tooltip
+        >
+          <Markdown
+            :source="fieldDescription('circle')"
+            block
+            class="prose prose-sm prose-zinc"
+          />
+        </template>
+        {{ fieldTitle("circle") }}
+      </FieldLabel>
+      <Switch
+        :model-value="block.circle ?? false"
+        @update:model-value="setCircle"
+      />
+    </Field>
+  </div>
+</template>

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.icon/config.vue.d.ts

@@ -0,0 +1,34 @@
+import type { Environment } from '../../../../../vendor/cel-js/lib/index.js';
+import { type Value } from './schema.js';
+type __VLS_Props = {
+    configure?: (env: Environment) => void;
+};
+type __VLS_ModelProps = {
+    modelValue: Value;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.icon/runtime.d.vue.ts

@@ -0,0 +1,34 @@
+import type { Environment } from '../../../../../vendor/cel-js/lib/index.js';
+import type { Value } from './schema.js';
+type __VLS_Props = {
+    configure?: (env: Environment) => void;
+};
+type __VLS_ModelProps = {
+    'block': Value;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:block": (value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:block"?: ((value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.icon/runtime.vue

@@ -0,0 +1,41 @@
+<script setup>
+import { computed } from "vue";
+import { Icon } from "@iconify/vue";
+defineOptions({ name: "ShwfedBlockIconRuntime" });
+const block = defineModel("block", { type: null, ...{ required: true } });
+defineProps({
+  configure: { type: Function, required: false }
+});
+const DEFAULT_SIZE = 8;
+const iconSize = computed(() => block.value.size ?? DEFAULT_SIZE);
+const iconStyle = computed(() => {
+  const s = { fontSize: `calc(${iconSize.value} * 0.25rem)` };
+  if (block.value.color) s.color = block.value.color;
+  return s;
+});
+const circleStyle = computed(() => ({
+  padding: `calc(${iconSize.value} * 0.125rem)`,
+  backgroundColor: `color-mix(in srgb, ${block.value.color || "currentColor"} 20%, white)`
+}));
+</script>
+
+<template>
+  <div class="flex h-full w-full items-center justify-center">
+    <div
+      v-if="block.circle"
+      class="flex items-center justify-center rounded-full"
+      :style="circleStyle"
+    >
+      <Icon
+        v-if="block.icon"
+        :icon="block.icon"
+        :style="iconStyle"
+      />
+    </div>
+    <Icon
+      v-else-if="block.icon"
+      :icon="block.icon"
+      :style="iconStyle"
+    />
+  </div>
+</template>

package/dist/runtime/components/config/blocks/2026-06-02/com.shwfed.block.icon/runtime.vue.d.ts

@@ -0,0 +1,34 @@
+import type { Environment } from '../../../../../vendor/cel-js/lib/index.js';
+import type { Value } from './schema.js';
+type __VLS_Props = {
+    configure?: (env: Environment) => void;
+};
+type __VLS_ModelProps = {
+    'block': Value;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:block": (value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:block"?: ((value: {
+        readonly size?: number | undefined;
+        readonly type: "com.shwfed.block.icon";
+        readonly id: string;
+        readonly icon: string;
+        readonly color?: string | undefined;
+        readonly circle?: boolean | undefined;
+        readonly displayName?: string | undefined;
+        readonly compatibilityDate: "2026-06-02";
+    }) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;