@aicut/vue 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -137,37 +137,43 @@ A 3D lighting director for AI relighting flows — separate sub-entry; three.js
137
137
  ```vue
138
138
  <script setup lang="ts">
139
139
  import { ref } from "vue";
140
- import { LightingEditor, type LightingConfig } from "@aicut/vue/lighting";
140
+ import {
141
+ LightingEditor,
142
+ type LightingConfig,
143
+ } from "@aicut/vue/lighting";
144
+ import type { LightingEditor as CoreLightingEditor } from "@aicut/core/lighting";
141
145
  import "@aicut/core/styles.css";
142
146
 
143
- const editor = ref<{ api(): any } | null>(null);
147
+ const editor = ref<{ api(): CoreLightingEditor | null } | null>(null);
144
148
 
145
149
  function onChange(cfg: LightingConfig) {
146
150
  console.log(cfg);
147
151
  }
148
152
 
149
- function onGenerate(cfg: LightingConfig) {
150
- fetch("/relight", { method: "POST", body: JSON.stringify(cfg) });
153
+ function onGenerate() {
154
+ const cfg = editor.value?.api()?.getConfig();
155
+ if (cfg) fetch("/relight", { method: "POST", body: JSON.stringify(cfg) });
151
156
  }
152
157
  </script>
153
158
 
154
159
  <template>
155
- <LightingEditor
156
- ref="editor"
157
- subject-image-url="/frames/subject.jpg"
158
- smart-enabled
159
- @change="onChange"
160
- @generate="onGenerate"
161
- >
162
- <template #smart>
160
+ <!-- Library renders ONLY the picker; the Smart panel beside it is
161
+ host code in your own template. -->
162
+ <div style="display: flex; gap: 16px">
163
+ <LightingEditor
164
+ ref="editor"
165
+ subject-image-url="/frames/subject.jpg"
166
+ @change="onChange"
167
+ />
168
+ <aside>
163
169
  <textarea placeholder="Describe the mood…" />
164
- <button @click="editor?.api()?.requestGenerate()">Generate</button>
165
- </template>
166
- </LightingEditor>
170
+ <button @click="onGenerate">Generate</button>
171
+ </aside>
172
+ </div>
167
173
  </template>
168
174
  ```
169
175
 
170
- Props: `subjectImageUrl`, `defaultConfig`, `defaultView`, `theme`, `locale`, `smartEnabled`, `smartOpen`. Events: `ready`, `change`, `generate`. Use the named `<slot name="smart">` for the smart-mode panel content.
176
+ Props: `subjectImageUrl`, `defaultConfig`, `defaultView`, `theme`, `locale`. Events: `ready`, `change`. The library is intentionally scoped to the picker — Smart mode UI / Generate buttons / layout live in host code.
171
177
 
172
178
  ## Standalone `<Timeline>`
173
179
 
@@ -1,11 +1,5 @@
1
1
  import { LightingEditor as CoreLightingEditor, type LightingConfig, type LightingEditorOptions, type LightingView } from "@aicut/core/lighting";
2
2
  import type { Theme } from "@aicut/core";
3
- /**
4
- * Vue 3 shell for the 3D lighting picker. Renders scene + controls;
5
- * nothing else. Host code lays out their own surrounding UI (smart
6
- * mode panel, generate button, etc.) alongside this component in
7
- * their own template.
8
- */
9
3
  type __VLS_Props = {
10
4
  subjectImageUrl?: string;
11
5
  defaultConfig?: Partial<LightingConfig>;
@@ -13,7 +7,11 @@ type __VLS_Props = {
13
7
  theme?: Theme;
14
8
  locale?: LightingEditorOptions["locale"];
15
9
  };
16
- declare const _default: import("vue").DefineComponent<__VLS_Props, {
10
+ declare var __VLS_5: {};
11
+ type __VLS_Slots = {} & {
12
+ controlsFooter?: (props: typeof __VLS_5) => any;
13
+ };
14
+ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
17
15
  api: () => CoreLightingEditor | null;
18
16
  }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
19
17
  ready: (api: CoreLightingEditor) => any;
@@ -22,5 +20,11 @@ declare const _default: import("vue").DefineComponent<__VLS_Props, {
22
20
  onReady?: ((api: CoreLightingEditor) => any) | undefined;
23
21
  onChange?: ((cfg: LightingConfig) => any) | undefined;
24
22
  }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
23
+ declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
25
24
  export default _default;
25
+ type __VLS_WithSlots<T, S> = T & {
26
+ new (): {
27
+ $slots: S;
28
+ };
29
+ };
26
30
  //# sourceMappingURL=LightingEditor.vue.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"LightingEditor.vue.d.ts","sourceRoot":"","sources":["../src/LightingEditor.vue"],"names":[],"mappings":"AAiFA,OAAO,EACL,cAAc,IAAI,kBAAkB,EACpC,KAAK,cAAc,EACnB,KAAK,qBAAqB,EAC1B,KAAK,YAAY,EAClB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEzC;;;;;GAKG;AACH,KAAK,WAAW,GAAG;IACjB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACxC,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,MAAM,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;CAC1C,CAAC;;eAmDS,kBAAkB,GAAG,IAAI;;;;;;;;AAuCpC,wBAQG"}
1
+ {"version":3,"file":"LightingEditor.vue.d.ts","sourceRoot":"","sources":["../src/LightingEditor.vue"],"names":[],"mappings":"AAsFA,OAAO,EACL,cAAc,IAAI,kBAAkB,EACpC,KAAK,cAAc,EACnB,KAAK,qBAAqB,EAC1B,KAAK,YAAY,EAClB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEzC,KAAK,WAAW,GAAG;IACjB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACxC,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,MAAM,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;CAC1C,CAAC;AA2FF,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAuBtD,QAAA,MAAM,eAAe;eA1DV,kBAAkB,GAAG,IAAI;;;;;;;kFAkElC,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
package/dist/lighting.cjs CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),i=require("@aicut/core/lighting"),u=n.defineComponent({__name:"LightingEditor",props:{subjectImageUrl:{},defaultConfig:{},defaultView:{},theme:{},locale:{}},emits:["ready","change"],setup(l,{expose:c,emit:g}){const r=l,a=g,o=n.useTemplateRef("host");let e=null;return n.onMounted(()=>{o.value&&(e=i.LightingEditor.create({container:o.value,subjectImageUrl:r.subjectImageUrl,config:r.defaultConfig,view:r.defaultView,theme:r.theme,locale:r.locale,onChange:t=>a("change",t)}),a("ready",e))}),n.watch(()=>r.theme,t=>{t&&e&&e.setTheme(t)}),n.watch(()=>r.locale,t=>{e&&e.setLocale(t??{})}),n.watch(()=>r.subjectImageUrl,t=>{t&&e&&e.setSubjectImage(t)}),n.onBeforeUnmount(()=>{e==null||e.destroy(),e=null}),c({api:()=>e}),(t,s)=>(n.openBlock(),n.createElementBlock("div",{ref_key:"host",ref:o,"data-aicut-lighting-host":""},null,512))}});Object.defineProperty(exports,"DEFAULT_LIGHTING_CONFIG",{enumerable:!0,get:()=>i.DEFAULT_LIGHTING_CONFIG});Object.defineProperty(exports,"PRESET_DIRECTIONS",{enumerable:!0,get:()=>i.PRESET_DIRECTIONS});Object.defineProperty(exports,"lightingLocaleEn",{enumerable:!0,get:()=>i.lightingLocaleEn});Object.defineProperty(exports,"lightingLocaleZh",{enumerable:!0,get:()=>i.lightingLocaleZh});Object.defineProperty(exports,"mergeLightingLocale",{enumerable:!0,get:()=>i.mergeLightingLocale});Object.defineProperty(exports,"snapToPreset",{enumerable:!0,get:()=>i.snapToPreset});exports.LightingEditor=u;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("@aicut/core/lighting"),s=e.defineComponent({__name:"LightingEditor",props:{subjectImageUrl:{},defaultConfig:{},defaultView:{},theme:{},locale:{}},emits:["ready","change"],setup(c,{expose:u,emit:g}){const r=c,i=g,a=e.useTemplateRef("host");let t=null;const l=e.ref(null);return e.onMounted(()=>{a.value&&(t=n.LightingEditor.create({container:a.value,subjectImageUrl:r.subjectImageUrl,config:r.defaultConfig,view:r.defaultView,theme:r.theme,locale:r.locale,onChange:o=>i("change",o)}),l.value=t.controlsFooter,i("ready",t))}),e.watch(()=>r.theme,o=>{o&&t&&t.setTheme(o)}),e.watch(()=>r.locale,o=>{t&&t.setLocale(o??{})}),e.watch(()=>r.subjectImageUrl,o=>{o&&t&&t.setSubjectImage(o)}),e.onBeforeUnmount(()=>{t==null||t.destroy(),t=null,l.value=null}),u({api:()=>t}),(o,m)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"host",ref:a,"data-aicut-lighting-host":""},[l.value?(e.openBlock(),e.createBlock(e.Teleport,{key:0,to:l.value},[e.renderSlot(o.$slots,"controlsFooter")],8,["to"])):e.createCommentVNode("",!0)],512))}});Object.defineProperty(exports,"DEFAULT_LIGHTING_CONFIG",{enumerable:!0,get:()=>n.DEFAULT_LIGHTING_CONFIG});Object.defineProperty(exports,"PRESET_DIRECTIONS",{enumerable:!0,get:()=>n.PRESET_DIRECTIONS});Object.defineProperty(exports,"lightingLocaleEn",{enumerable:!0,get:()=>n.lightingLocaleEn});Object.defineProperty(exports,"lightingLocaleZh",{enumerable:!0,get:()=>n.lightingLocaleZh});Object.defineProperty(exports,"mergeLightingLocale",{enumerable:!0,get:()=>n.mergeLightingLocale});Object.defineProperty(exports,"snapToPreset",{enumerable:!0,get:()=>n.snapToPreset});exports.LightingEditor=s;
2
2
  //# sourceMappingURL=lighting.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"lighting.cjs","sources":["../src/LightingEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, useTemplateRef, watch } from \"vue\";\nimport {\n LightingEditor as CoreLightingEditor,\n type LightingConfig,\n type LightingEditorOptions,\n type LightingView,\n} from \"@aicut/core/lighting\";\nimport type { Theme } from \"@aicut/core\";\n\n/**\n * Vue 3 shell for the 3D lighting picker. Renders scene + controls;\n * nothing else. Host code lays out their own surrounding UI (smart\n * mode panel, generate button, etc.) alongside this component in\n * their own template.\n */\nconst props = defineProps<{\n subjectImageUrl?: string;\n defaultConfig?: Partial<LightingConfig>;\n defaultView?: LightingView;\n theme?: Theme;\n locale?: LightingEditorOptions[\"locale\"];\n}>();\n\nconst emit = defineEmits<{\n (e: \"ready\", api: CoreLightingEditor): void;\n (e: \"change\", cfg: LightingConfig): void;\n}>();\n\nconst host = useTemplateRef<HTMLDivElement>(\"host\");\nlet editor: CoreLightingEditor | null = null;\n\nonMounted(() => {\n if (!host.value) return;\n editor = CoreLightingEditor.create({\n container: host.value,\n subjectImageUrl: props.subjectImageUrl,\n config: props.defaultConfig,\n view: props.defaultView,\n theme: props.theme,\n locale: props.locale,\n onChange: (cfg) => emit(\"change\", cfg),\n });\n emit(\"ready\", editor);\n});\n\nwatch(\n () => props.theme,\n (theme) => {\n if (theme && editor) editor.setTheme(theme);\n },\n);\nwatch(\n () => props.locale,\n (locale) => {\n if (editor) editor.setLocale(locale ?? {});\n },\n);\nwatch(\n () => props.subjectImageUrl,\n (url) => {\n if (url && editor) editor.setSubjectImage(url);\n },\n);\n\nonBeforeUnmount(() => {\n editor?.destroy();\n editor = null;\n});\n\ndefineExpose({\n api: (): CoreLightingEditor | null => editor,\n});\n</script>\n\n<template>\n <div ref=\"host\" data-aicut-lighting-host=\"\" />\n</template>\n"],"names":["props","__props","emit","__emit","host","useTemplateRef","editor","onMounted","CoreLightingEditor","cfg","watch","theme","locale","url","onBeforeUnmount","__expose","_createElementBlock"],"mappings":"wTAgBA,MAAMA,EAAQC,EAQRC,EAAOC,EAKPC,EAAOC,EAAAA,eAA+B,MAAM,EAClD,IAAIC,EAAoC,KAExCC,OAAAA,EAAAA,UAAU,IAAM,CACTH,EAAK,QACVE,EAASE,EAAAA,eAAmB,OAAO,CACjC,UAAWJ,EAAK,MAChB,gBAAiBJ,EAAM,gBACvB,OAAQA,EAAM,cACd,KAAMA,EAAM,YACZ,MAAOA,EAAM,MACb,OAAQA,EAAM,OACd,SAAWS,GAAQP,EAAK,SAAUO,CAAG,CAAA,CACtC,EACDP,EAAK,QAASI,CAAM,EACtB,CAAC,EAEDI,EAAAA,MACE,IAAMV,EAAM,MACXW,GAAU,CACLA,GAASL,GAAQA,EAAO,SAASK,CAAK,CAC5C,CAAA,EAEFD,EAAAA,MACE,IAAMV,EAAM,OACXY,GAAW,CACNN,GAAQA,EAAO,UAAUM,GAAU,CAAA,CAAE,CAC3C,CAAA,EAEFF,EAAAA,MACE,IAAMV,EAAM,gBACXa,GAAQ,CACHA,GAAOP,GAAQA,EAAO,gBAAgBO,CAAG,CAC/C,CAAA,EAGFC,EAAAA,gBAAgB,IAAM,CACpBR,GAAA,MAAAA,EAAQ,UACRA,EAAS,IACX,CAAC,EAEDS,EAAa,CACX,IAAK,IAAiCT,CAAA,CACvC,wBAICU,EAAAA,mBAA8C,MAAA,SAArC,OAAJ,IAAIZ,EAAO,2BAAyB,EAAA"}
1
+ {"version":3,"file":"lighting.cjs","sources":["../src/LightingEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref, useTemplateRef, watch } from \"vue\";\nimport {\n LightingEditor as CoreLightingEditor,\n type LightingConfig,\n type LightingEditorOptions,\n type LightingView,\n} from \"@aicut/core/lighting\";\nimport type { Theme } from \"@aicut/core\";\n\nconst props = defineProps<{\n subjectImageUrl?: string;\n defaultConfig?: Partial<LightingConfig>;\n defaultView?: LightingView;\n theme?: Theme;\n locale?: LightingEditorOptions[\"locale\"];\n}>();\n\nconst emit = defineEmits<{\n (e: \"ready\", api: CoreLightingEditor): void;\n (e: \"change\", cfg: LightingConfig): void;\n}>();\n\nconst host = useTemplateRef<HTMLDivElement>(\"host\");\nlet editor: CoreLightingEditor | null = null;\n/**\n * Footer slot DOM node — set after mount so the Teleport target\n * exists before Vue tries to portal slot content into it.\n */\nconst footerSlot = ref<HTMLElement | null>(null);\n\nonMounted(() => {\n if (!host.value) return;\n editor = CoreLightingEditor.create({\n container: host.value,\n subjectImageUrl: props.subjectImageUrl,\n config: props.defaultConfig,\n view: props.defaultView,\n theme: props.theme,\n locale: props.locale,\n onChange: (cfg) => emit(\"change\", cfg),\n });\n footerSlot.value = editor.controlsFooter;\n emit(\"ready\", editor);\n});\n\nwatch(\n () => props.theme,\n (theme) => {\n if (theme && editor) editor.setTheme(theme);\n },\n);\nwatch(\n () => props.locale,\n (locale) => {\n if (editor) editor.setLocale(locale ?? {});\n },\n);\nwatch(\n () => props.subjectImageUrl,\n (url) => {\n if (url && editor) editor.setSubjectImage(url);\n },\n);\n\nonBeforeUnmount(() => {\n editor?.destroy();\n editor = null;\n footerSlot.value = null;\n});\n\ndefineExpose({\n api: (): CoreLightingEditor | null => editor,\n});\n</script>\n\n<template>\n <div ref=\"host\" data-aicut-lighting-host=\"\">\n <Teleport v-if=\"footerSlot\" :to=\"footerSlot\">\n <slot name=\"controlsFooter\" />\n </Teleport>\n </div>\n</template>\n"],"names":["props","__props","emit","__emit","host","useTemplateRef","editor","footerSlot","ref","onMounted","CoreLightingEditor","cfg","watch","theme","locale","url","onBeforeUnmount","__expose","_createElementBlock","_createBlock","_Teleport","_renderSlot","_ctx"],"mappings":"wTAUA,MAAMA,EAAQC,EAQRC,EAAOC,EAKPC,EAAOC,EAAAA,eAA+B,MAAM,EAClD,IAAIC,EAAoC,KAKxC,MAAMC,EAAaC,EAAAA,IAAwB,IAAI,EAE/CC,OAAAA,EAAAA,UAAU,IAAM,CACTL,EAAK,QACVE,EAASI,EAAAA,eAAmB,OAAO,CACjC,UAAWN,EAAK,MAChB,gBAAiBJ,EAAM,gBACvB,OAAQA,EAAM,cACd,KAAMA,EAAM,YACZ,MAAOA,EAAM,MACb,OAAQA,EAAM,OACd,SAAWW,GAAQT,EAAK,SAAUS,CAAG,CAAA,CACtC,EACDJ,EAAW,MAAQD,EAAO,eAC1BJ,EAAK,QAASI,CAAM,EACtB,CAAC,EAEDM,EAAAA,MACE,IAAMZ,EAAM,MACXa,GAAU,CACLA,GAASP,GAAQA,EAAO,SAASO,CAAK,CAC5C,CAAA,EAEFD,EAAAA,MACE,IAAMZ,EAAM,OACXc,GAAW,CACNR,GAAQA,EAAO,UAAUQ,GAAU,CAAA,CAAE,CAC3C,CAAA,EAEFF,EAAAA,MACE,IAAMZ,EAAM,gBACXe,GAAQ,CACHA,GAAOT,GAAQA,EAAO,gBAAgBS,CAAG,CAC/C,CAAA,EAGFC,EAAAA,gBAAgB,IAAM,CACpBV,GAAA,MAAAA,EAAQ,UACRA,EAAS,KACTC,EAAW,MAAQ,IACrB,CAAC,EAEDU,EAAa,CACX,IAAK,IAAiCX,CAAA,CACvC,wBAICY,EAAAA,mBAIM,MAAA,SAJG,OAAJ,IAAId,EAAO,2BAAyB,EAAA,GACvBG,EAAA,qBAAhBY,EAAAA,YAEWC,EAAAA,SAAA,OAFkB,GAAIb,EAAA,KAAA,GAC/Bc,aAA8BC,EAAA,OAAA,gBAAA,CAAA"}
package/dist/lighting.js CHANGED
@@ -1,7 +1,7 @@
1
- import { defineComponent as g, useTemplateRef as s, onMounted as m, watch as a, onBeforeUnmount as h, openBlock as u, createElementBlock as f } from "vue";
2
- import { LightingEditor as p } from "@aicut/core/lighting";
3
- import { DEFAULT_LIGHTING_CONFIG as C, PRESET_DIRECTIONS as U, lightingLocaleEn as b, lightingLocaleZh as j, mergeLightingLocale as v, snapToPreset as w } from "@aicut/core/lighting";
4
- const _ = /* @__PURE__ */ g({
1
+ import { defineComponent as g, useTemplateRef as m, ref as f, onMounted as h, watch as a, onBeforeUnmount as p, openBlock as i, createElementBlock as d, createBlock as I, Teleport as L, renderSlot as E, createCommentVNode as _ } from "vue";
2
+ import { LightingEditor as v } from "@aicut/core/lighting";
3
+ import { DEFAULT_LIGHTING_CONFIG as y, PRESET_DIRECTIONS as S, lightingLocaleEn as w, lightingLocaleZh as B, mergeLightingLocale as F, snapToPreset as N } from "@aicut/core/lighting";
4
+ const b = /* @__PURE__ */ g({
5
5
  __name: "LightingEditor",
6
6
  props: {
7
7
  subjectImageUrl: {},
@@ -11,19 +11,20 @@ const _ = /* @__PURE__ */ g({
11
11
  locale: {}
12
12
  },
13
13
  emits: ["ready", "change"],
14
- setup(l, { expose: c, emit: r }) {
15
- const o = l, i = r, n = s("host");
14
+ setup(c, { expose: s, emit: u }) {
15
+ const o = c, r = u, n = m("host");
16
16
  let e = null;
17
- return m(() => {
18
- n.value && (e = p.create({
17
+ const l = f(null);
18
+ return h(() => {
19
+ n.value && (e = v.create({
19
20
  container: n.value,
20
21
  subjectImageUrl: o.subjectImageUrl,
21
22
  config: o.defaultConfig,
22
23
  view: o.defaultView,
23
24
  theme: o.theme,
24
25
  locale: o.locale,
25
- onChange: (t) => i("change", t)
26
- }), i("ready", e));
26
+ onChange: (t) => r("change", t)
27
+ }), l.value = e.controlsFooter, r("ready", e));
27
28
  }), a(
28
29
  () => o.theme,
29
30
  (t) => {
@@ -39,24 +40,31 @@ const _ = /* @__PURE__ */ g({
39
40
  (t) => {
40
41
  t && e && e.setSubjectImage(t);
41
42
  }
42
- ), h(() => {
43
- e == null || e.destroy(), e = null;
44
- }), c({
43
+ ), p(() => {
44
+ e == null || e.destroy(), e = null, l.value = null;
45
+ }), s({
45
46
  api: () => e
46
- }), (t, d) => (u(), f("div", {
47
+ }), (t, T) => (i(), d("div", {
47
48
  ref_key: "host",
48
49
  ref: n,
49
50
  "data-aicut-lighting-host": ""
50
- }, null, 512));
51
+ }, [
52
+ l.value ? (i(), I(L, {
53
+ key: 0,
54
+ to: l.value
55
+ }, [
56
+ E(t.$slots, "controlsFooter")
57
+ ], 8, ["to"])) : _("", !0)
58
+ ], 512));
51
59
  }
52
60
  });
53
61
  export {
54
- C as DEFAULT_LIGHTING_CONFIG,
55
- _ as LightingEditor,
56
- U as PRESET_DIRECTIONS,
57
- b as lightingLocaleEn,
58
- j as lightingLocaleZh,
59
- v as mergeLightingLocale,
60
- w as snapToPreset
62
+ y as DEFAULT_LIGHTING_CONFIG,
63
+ b as LightingEditor,
64
+ S as PRESET_DIRECTIONS,
65
+ w as lightingLocaleEn,
66
+ B as lightingLocaleZh,
67
+ F as mergeLightingLocale,
68
+ N as snapToPreset
61
69
  };
62
70
  //# sourceMappingURL=lighting.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"lighting.js","sources":["../src/LightingEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, useTemplateRef, watch } from \"vue\";\nimport {\n LightingEditor as CoreLightingEditor,\n type LightingConfig,\n type LightingEditorOptions,\n type LightingView,\n} from \"@aicut/core/lighting\";\nimport type { Theme } from \"@aicut/core\";\n\n/**\n * Vue 3 shell for the 3D lighting picker. Renders scene + controls;\n * nothing else. Host code lays out their own surrounding UI (smart\n * mode panel, generate button, etc.) alongside this component in\n * their own template.\n */\nconst props = defineProps<{\n subjectImageUrl?: string;\n defaultConfig?: Partial<LightingConfig>;\n defaultView?: LightingView;\n theme?: Theme;\n locale?: LightingEditorOptions[\"locale\"];\n}>();\n\nconst emit = defineEmits<{\n (e: \"ready\", api: CoreLightingEditor): void;\n (e: \"change\", cfg: LightingConfig): void;\n}>();\n\nconst host = useTemplateRef<HTMLDivElement>(\"host\");\nlet editor: CoreLightingEditor | null = null;\n\nonMounted(() => {\n if (!host.value) return;\n editor = CoreLightingEditor.create({\n container: host.value,\n subjectImageUrl: props.subjectImageUrl,\n config: props.defaultConfig,\n view: props.defaultView,\n theme: props.theme,\n locale: props.locale,\n onChange: (cfg) => emit(\"change\", cfg),\n });\n emit(\"ready\", editor);\n});\n\nwatch(\n () => props.theme,\n (theme) => {\n if (theme && editor) editor.setTheme(theme);\n },\n);\nwatch(\n () => props.locale,\n (locale) => {\n if (editor) editor.setLocale(locale ?? {});\n },\n);\nwatch(\n () => props.subjectImageUrl,\n (url) => {\n if (url && editor) editor.setSubjectImage(url);\n },\n);\n\nonBeforeUnmount(() => {\n editor?.destroy();\n editor = null;\n});\n\ndefineExpose({\n api: (): CoreLightingEditor | null => editor,\n});\n</script>\n\n<template>\n <div ref=\"host\" data-aicut-lighting-host=\"\" />\n</template>\n"],"names":["props","__props","emit","__emit","host","useTemplateRef","editor","onMounted","CoreLightingEditor","cfg","watch","theme","locale","url","onBeforeUnmount","__expose","_createElementBlock"],"mappings":";;;;;;;;;;;;;;AAgBA,UAAMA,IAAQC,GAQRC,IAAOC,GAKPC,IAAOC,EAA+B,MAAM;AAClD,QAAIC,IAAoC;AAExC,WAAAC,EAAU,MAAM;AACd,MAAKH,EAAK,UACVE,IAASE,EAAmB,OAAO;AAAA,QACjC,WAAWJ,EAAK;AAAA,QAChB,iBAAiBJ,EAAM;AAAA,QACvB,QAAQA,EAAM;AAAA,QACd,MAAMA,EAAM;AAAA,QACZ,OAAOA,EAAM;AAAA,QACb,QAAQA,EAAM;AAAA,QACd,UAAU,CAACS,MAAQP,EAAK,UAAUO,CAAG;AAAA,MAAA,CACtC,GACDP,EAAK,SAASI,CAAM;AAAA,IACtB,CAAC,GAEDI;AAAA,MACE,MAAMV,EAAM;AAAA,MACZ,CAACW,MAAU;AACT,QAAIA,KAASL,KAAQA,EAAO,SAASK,CAAK;AAAA,MAC5C;AAAA,IAAA,GAEFD;AAAA,MACE,MAAMV,EAAM;AAAA,MACZ,CAACY,MAAW;AACV,QAAIN,KAAQA,EAAO,UAAUM,KAAU,CAAA,CAAE;AAAA,MAC3C;AAAA,IAAA,GAEFF;AAAA,MACE,MAAMV,EAAM;AAAA,MACZ,CAACa,MAAQ;AACP,QAAIA,KAAOP,KAAQA,EAAO,gBAAgBO,CAAG;AAAA,MAC/C;AAAA,IAAA,GAGFC,EAAgB,MAAM;AACpB,MAAAR,KAAA,QAAAA,EAAQ,WACRA,IAAS;AAAA,IACX,CAAC,GAEDS,EAAa;AAAA,MACX,KAAK,MAAiCT;AAAA,IAAA,CACvC,mBAICU,EAA8C,OAAA;AAAA,eAArC;AAAA,MAAJ,KAAIZ;AAAA,MAAO,4BAAyB;AAAA,IAAA;;;"}
1
+ {"version":3,"file":"lighting.js","sources":["../src/LightingEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref, useTemplateRef, watch } from \"vue\";\nimport {\n LightingEditor as CoreLightingEditor,\n type LightingConfig,\n type LightingEditorOptions,\n type LightingView,\n} from \"@aicut/core/lighting\";\nimport type { Theme } from \"@aicut/core\";\n\nconst props = defineProps<{\n subjectImageUrl?: string;\n defaultConfig?: Partial<LightingConfig>;\n defaultView?: LightingView;\n theme?: Theme;\n locale?: LightingEditorOptions[\"locale\"];\n}>();\n\nconst emit = defineEmits<{\n (e: \"ready\", api: CoreLightingEditor): void;\n (e: \"change\", cfg: LightingConfig): void;\n}>();\n\nconst host = useTemplateRef<HTMLDivElement>(\"host\");\nlet editor: CoreLightingEditor | null = null;\n/**\n * Footer slot DOM node — set after mount so the Teleport target\n * exists before Vue tries to portal slot content into it.\n */\nconst footerSlot = ref<HTMLElement | null>(null);\n\nonMounted(() => {\n if (!host.value) return;\n editor = CoreLightingEditor.create({\n container: host.value,\n subjectImageUrl: props.subjectImageUrl,\n config: props.defaultConfig,\n view: props.defaultView,\n theme: props.theme,\n locale: props.locale,\n onChange: (cfg) => emit(\"change\", cfg),\n });\n footerSlot.value = editor.controlsFooter;\n emit(\"ready\", editor);\n});\n\nwatch(\n () => props.theme,\n (theme) => {\n if (theme && editor) editor.setTheme(theme);\n },\n);\nwatch(\n () => props.locale,\n (locale) => {\n if (editor) editor.setLocale(locale ?? {});\n },\n);\nwatch(\n () => props.subjectImageUrl,\n (url) => {\n if (url && editor) editor.setSubjectImage(url);\n },\n);\n\nonBeforeUnmount(() => {\n editor?.destroy();\n editor = null;\n footerSlot.value = null;\n});\n\ndefineExpose({\n api: (): CoreLightingEditor | null => editor,\n});\n</script>\n\n<template>\n <div ref=\"host\" data-aicut-lighting-host=\"\">\n <Teleport v-if=\"footerSlot\" :to=\"footerSlot\">\n <slot name=\"controlsFooter\" />\n </Teleport>\n </div>\n</template>\n"],"names":["props","__props","emit","__emit","host","useTemplateRef","editor","footerSlot","ref","onMounted","CoreLightingEditor","cfg","watch","theme","locale","url","onBeforeUnmount","__expose","_createElementBlock","_createBlock","_Teleport","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;AAUA,UAAMA,IAAQC,GAQRC,IAAOC,GAKPC,IAAOC,EAA+B,MAAM;AAClD,QAAIC,IAAoC;AAKxC,UAAMC,IAAaC,EAAwB,IAAI;AAE/C,WAAAC,EAAU,MAAM;AACd,MAAKL,EAAK,UACVE,IAASI,EAAmB,OAAO;AAAA,QACjC,WAAWN,EAAK;AAAA,QAChB,iBAAiBJ,EAAM;AAAA,QACvB,QAAQA,EAAM;AAAA,QACd,MAAMA,EAAM;AAAA,QACZ,OAAOA,EAAM;AAAA,QACb,QAAQA,EAAM;AAAA,QACd,UAAU,CAACW,MAAQT,EAAK,UAAUS,CAAG;AAAA,MAAA,CACtC,GACDJ,EAAW,QAAQD,EAAO,gBAC1BJ,EAAK,SAASI,CAAM;AAAA,IACtB,CAAC,GAEDM;AAAA,MACE,MAAMZ,EAAM;AAAA,MACZ,CAACa,MAAU;AACT,QAAIA,KAASP,KAAQA,EAAO,SAASO,CAAK;AAAA,MAC5C;AAAA,IAAA,GAEFD;AAAA,MACE,MAAMZ,EAAM;AAAA,MACZ,CAACc,MAAW;AACV,QAAIR,KAAQA,EAAO,UAAUQ,KAAU,CAAA,CAAE;AAAA,MAC3C;AAAA,IAAA,GAEFF;AAAA,MACE,MAAMZ,EAAM;AAAA,MACZ,CAACe,MAAQ;AACP,QAAIA,KAAOT,KAAQA,EAAO,gBAAgBS,CAAG;AAAA,MAC/C;AAAA,IAAA,GAGFC,EAAgB,MAAM;AACpB,MAAAV,KAAA,QAAAA,EAAQ,WACRA,IAAS,MACTC,EAAW,QAAQ;AAAA,IACrB,CAAC,GAEDU,EAAa;AAAA,MACX,KAAK,MAAiCX;AAAA,IAAA,CACvC,mBAICY,EAIM,OAAA;AAAA,eAJG;AAAA,MAAJ,KAAId;AAAA,MAAO,4BAAyB;AAAA,IAAA;MACvBG,EAAA,cAAhBY,EAEWC,GAAA;AAAA;QAFkB,IAAIb,EAAA;AAAA,MAAA;QAC/Bc,EAA8BC,EAAA,QAAA,gBAAA;AAAA,MAAA;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aicut/vue",
3
- "version": "0.3.0",
3
+ "version": "0.4.0",
4
4
  "description": "Vue 3 wrapper for the AiCut video editor + lighting picker — thin declarative shells over @aicut/core.",
5
5
  "license": "MIT",
6
6
  "author": "ziqiang <ziqiangytu@gmail.com>",
@@ -60,7 +60,7 @@
60
60
  "README.md"
61
61
  ],
62
62
  "dependencies": {
63
- "@aicut/core": "0.3.0"
63
+ "@aicut/core": "0.4.0"
64
64
  },
65
65
  "peerDependencies": {
66
66
  "vue": "^3.4.0"