@fui-org/fui-cli 2.1.4 → 2.2.0

package/skills/{fui-skill → fui}/examples/component.vue

@@ -1,162 +1,162 @@
-<template>
-  <div class="uc-component-name">
-    <v-card outlined>
-      <v-card-title v-if="title" class="subtitle-1 font-weight-bold">
-        <slot name="title">
-          {{ title }}
-        </slot>
-      </v-card-title>
-
-      <v-card-text>
-        <div v-if="loading">
-          <slot name="loading">
-            Loading...
-          </slot>
-        </div>
-        <div v-else-if="!hasItems">
-          <slot name="empty">
-            No data
-          </slot>
-        </div>
-        <div v-else>
-          <slot :items="localItems" :selected-item="localValue">
-            <v-list dense>
-              <v-list-item
-                v-for="(item, index) in localItems"
-                :key="item.id || item.value || index"
-                @click="handleSelect(item)"
-              >
-                <v-list-item-content>
-                  <v-list-item-title>{{ getItemLabel(item) }}</v-list-item-title>
-                </v-list-item-content>
-              </v-list-item>
-            </v-list>
-          </slot>
-
-          <v-btn
-            v-if="showAction"
-            small
-            color="primary"
-            :disabled="disabled"
-            @click="handleAction"
-          >
-            {{ actionLabel }}
-          </v-btn>
-        </div>
-      </v-card-text>
-    </v-card>
-  </div>
-</template>
-
-<script>
-/**
- * Description: Reusable starter component. Prefer generic props, emits, and slots.
- * Usage: <uc-component-name :items="rows" :value="selectedRow" @select="handleSelect"></uc-component-name>
- * NOTE: No "name:" property — FUI resolves name from filename automatically.
- */
-export default {
-  props: {
-    title: {
-      type: String,
-      default: ''
-    },
-    value: {
-      type: [String, Number, Object, Array],
-      default: null
-    },
-    items: {
-      type: Array,
-      default: function() {
-        return [];
-      }
-    },
-    itemText: {
-      type: String,
-      default: 'label'
-    },
-    loading: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    showAction: {
-      type: Boolean,
-      default: true
-    },
-    actionLabel: {
-      type: String,
-      default: 'Action'
-    },
-    options: {
-      type: Object,
-      default: function() {
-        return {};
-      }
-    }
-  },
-  data() {
-    return {
-      localValue: null,
-      localItems: []
-    }
-  },
-  computed: {
-    hasItems() {
-      return this.localItems.length > 0;
-    },
-    resolvedItemText() {
-      return this.options.itemText || this.itemText;
-    },
-    resolvedItemValue() {
-      return this.options.itemValue || 'value';
-    }
-  },
-  watch: {
-    value: {
-      handler(val) {
-        this.localValue = val;
-      },
-      immediate: true
-    },
-    items: {
-      handler(val) {
-        this.localItems = Array.isArray(val) ? val : [];
-      },
-      immediate: true
-    }
-  },
-  methods: {
-    getItemLabel(item) {
-      if (!item || typeof item !== 'object') {
-        return item;
-      }
-
-      return item[this.resolvedItemText] || item.label || item.name || '';
-    },
-    getItemValue(item) {
-      if (!item || typeof item !== 'object') {
-        return item;
-      }
-
-      return item[this.resolvedItemValue] || item.value || item.id || item;
-    },
-    handleSelect(item) {
-      var nextValue = this.getItemValue(item);
-      this.localValue = nextValue;
-      this.$emit('input', nextValue);
-      this.$emit('select', item);
-      this.$emit('change', nextValue);
-    },
-    handleAction() {
-      this.$emit('action', {
-        value: this.localValue,
-        items: this.localItems
-      });
-    }
-  }
-}
-</script>
-
+<template>
+  <div class="uc-component-name">
+    <v-card outlined>
+      <v-card-title v-if="title" class="subtitle-1 font-weight-bold">
+        <slot name="title">
+          {{ title }}
+        </slot>
+      </v-card-title>
+
+      <v-card-text>
+        <div v-if="loading">
+          <slot name="loading">
+            Loading...
+          </slot>
+        </div>
+        <div v-else-if="!hasItems">
+          <slot name="empty">
+            No data
+          </slot>
+        </div>
+        <div v-else>
+          <slot :items="localItems" :selected-item="localValue">
+            <v-list dense>
+              <v-list-item
+                v-for="(item, index) in localItems"
+                :key="item.id || item.value || index"
+                @click="handleSelect(item)"
+              >
+                <v-list-item-content>
+                  <v-list-item-title>{{ getItemLabel(item) }}</v-list-item-title>
+                </v-list-item-content>
+              </v-list-item>
+            </v-list>
+          </slot>
+
+          <v-btn
+            v-if="showAction"
+            small
+            color="primary"
+            :disabled="disabled"
+            @click="handleAction"
+          >
+            {{ actionLabel }}
+          </v-btn>
+        </div>
+      </v-card-text>
+    </v-card>
+  </div>
+</template>
+
+<script>
+/**
+ * Description: Reusable starter component. Prefer generic props, emits, and slots.
+ * Usage: <uc-component-name :items="rows" :value="selectedRow" @select="handleSelect"></uc-component-name>
+ * NOTE: No "name:" property — FUI resolves name from filename automatically.
+ */
+export default {
+  props: {
+    title: {
+      type: String,
+      default: ''
+    },
+    value: {
+      type: [String, Number, Object, Array],
+      default: null
+    },
+    items: {
+      type: Array,
+      default: function() {
+        return [];
+      }
+    },
+    itemText: {
+      type: String,
+      default: 'label'
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    showAction: {
+      type: Boolean,
+      default: true
+    },
+    actionLabel: {
+      type: String,
+      default: 'Action'
+    },
+    options: {
+      type: Object,
+      default: function() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      localValue: null,
+      localItems: []
+    }
+  },
+  computed: {
+    hasItems() {
+      return this.localItems.length > 0;
+    },
+    resolvedItemText() {
+      return this.options.itemText || this.itemText;
+    },
+    resolvedItemValue() {
+      return this.options.itemValue || 'value';
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        this.localValue = val;
+      },
+      immediate: true
+    },
+    items: {
+      handler(val) {
+        this.localItems = Array.isArray(val) ? val : [];
+      },
+      immediate: true
+    }
+  },
+  methods: {
+    getItemLabel(item) {
+      if (!item || typeof item !== 'object') {
+        return item;
+      }
+
+      return item[this.resolvedItemText] || item.label || item.name || '';
+    },
+    getItemValue(item) {
+      if (!item || typeof item !== 'object') {
+        return item;
+      }
+
+      return item[this.resolvedItemValue] || item.value || item.id || item;
+    },
+    handleSelect(item) {
+      var nextValue = this.getItemValue(item);
+      this.localValue = nextValue;
+      this.$emit('input', nextValue);
+      this.$emit('select', item);
+      this.$emit('change', nextValue);
+    },
+    handleAction() {
+      this.$emit('action', {
+        value: this.localValue,
+        items: this.localItems
+      });
+    }
+  }
+}
+</script>
+

package/skills/{fui-skill → fui}/references/INDEX.md

@@ -14,7 +14,7 @@ Load: `fui skill ref references/a.md references/b.md` (several at once OK).
 
 - FUI anatomy, Project→Module hierarchy (import/component/set merge), runtime, vueData/v_Set → `platform-architecture.md`
 - module.json's 4 parts (data/watch/controls/set) → `module-json-anatomy.md`
-- `HTMLOnly: true`: server embeds NO library (Vue/Vuetify/jQuery/lodash/MDI/`projectdefaultstyle.css` absent); declare all in the module; `script-map.md` does NOT apply → `module-structure.md` §HTMLOnly=true: KHÔNG có thư viện nào được nhúng sẵn
+- `HTMLOnly: true`: server embeds NO library (Vue/Vuetify/jQuery/lodash/MDI/`projectdefaultstyle.css` absent); declare all in the module; `script-map.md` does NOT apply → `module-structure.md` §"HTMLOnly=true: no library is embedded"
 
 ## UI / components
 
@@ -57,7 +57,7 @@ Load: `fui skill ref references/a.md references/b.md` (several at once OK).
 ## User permissions
 
 - `SystemRight` (level) vs `FunctionRight` (per function), `v-if`/menu `right`, `fui right system|function list/new/update/delete` (8 commands) → `permission-system.md`
-- Guarding control/menu/SP with a right code — it must exist; how to create → `permission-system.md` (§"mã quyền phải TỒN TẠI trước khi đem gác")
+- Guarding control/menu/SP with a right code — it must exist; how to create → `permission-system.md` (§"A right code must EXIST before guarding with it")
 - SQL permission checks in SP body → `tapi-permission-patterns.md`
 
 ## Database
@@ -83,7 +83,7 @@ Load: `fui skill ref references/a.md references/b.md` (several at once OK).
 - Ordered commands (reset → reload → toast) in `CALLBACK`/`:action`/`watch`/`THEN` → `controls-patterns.md` §CORE RULE
 - v_old, deep-watch, cascading → `watcher-patterns.md`
 - EXE, MAP, complex expressions → `advanced-techniques.md`
-- Blank page with 0 JS errors and 0 Vue warns, or complex logic in `:attr` `:option` `:config` → `advanced-techniques.md` §1 + `fui module validate`
+- Blank page (often with no JS error to trace), or complex logic in `:attr` `:option` `:config` → `advanced-techniques.md` §1 + `fui module validate`
 - `… is not defined` at render, or `EXE`/`FUN` doing nothing → `advanced-techniques.md` §2 (function must exist in `script.js`; `fui module publish script`). ⚠️ `fui module validate` misses this; use `fui module simulate --render`
 - Built-in utilities (openWindow, ajaxCALL, jsonToExcel, groupBy…) → `default-function.md`
 - Bundled libs (jQuery, lodash, moment, numeral, toast, jquery-confirm) — check before adding a CDN; ⚠️ `HTMLOnly=false` only → `script-map.md` §0
@@ -96,9 +96,10 @@ Load: `fui skill ref references/a.md references/b.md` (several at once OK).
 
 - "new session" / "phiên mới" / "cửa sổ mới": open another Claude Code CLI in its own terminal window (workspace root resolved dynamically, NEVER hard-coded) → `new-session.md`
 - Hand work / instructions to another running Claude session (coordinating several sessions, a multi-AI workflow, parallelizing work per module) — `ListAgents`/`SendMessage` → `new-session.md` §6
+- Build, test and fix one module with little supervision (planner → builder → tester → fix, one approval at the end) → `team-run.md` (the `fui` skill decides between this and a direct change; the agents come with fui)
 - Per-command safety (R/M, Safe/Confirm/Destructive), strict mode, `fui sp verify`, error log → `tools-registry.md`
 - Pre-publish definition-of-done (`fui module validate` + `fui module outline` + `fui module simulate` + static `fui sp verify`) → `verification.md`
-- UI broken, cause unknown — cheapest verification layer (symptom → layer; read BEFORE `--render`, reread after ≥2 renders without progress) → `verification.md` §Chọn tầng kiểm chứng
+- UI broken, cause unknown — cheapest verification layer (symptom → layer; read BEFORE `--render`, reread after ≥2 renders without progress) → `verification.md` §"Pick the tier by SYMPTOM"
 
 ## Design system