@imgly/plugin-cutout-library-web 0.0.2 → 0.0.3-rc.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/dist/index.mjs CHANGED
@@ -1,186 +1,2 @@
1
- // src/constants.ts
2
- var CANVAS_MENU_COMPONENT_ID = `${"@imgly/plugin-cutout-library-web"}.canvasMenu`;
3
- var CANVAS_MENU_COMPONENT_BUTTON_ID = `${CANVAS_MENU_COMPONENT_ID}.button`;
4
- var ASSET_SOURCE_ID = "ly.img.cutout";
5
- var ENTRY_ID = `${ASSET_SOURCE_ID}.entry`;
6
-
7
- // src/components.ts
8
- function registerComponents(cesdk) {
9
- cesdk.ui.unstable_setCanvasMenuOrder([
10
- CANVAS_MENU_COMPONENT_ID,
11
- ...cesdk.ui.unstable_getCanvasMenuOrder()
12
- ]);
13
- const CANVAS_MENU_COMPONENT_BUTTON_I18N_ID = `${CANVAS_MENU_COMPONENT_BUTTON_ID}.label`;
14
- cesdk.setTranslations({
15
- en: {
16
- [CANVAS_MENU_COMPONENT_BUTTON_I18N_ID]: "Cutout"
17
- }
18
- });
19
- cesdk.ui.unstable_registerComponent(
20
- CANVAS_MENU_COMPONENT_ID,
21
- ({ builder: { Button }, engine }) => {
22
- const allowedTypes = [
23
- "//ly.img.ubq/graphic",
24
- "//ly.img.ubq/text"
25
- ];
26
- const selectedBlockIds = engine.block.findAllSelected();
27
- if (selectedBlockIds.length !== 1 || !allowedTypes.includes(engine.block.getType(selectedBlockIds[0]))) {
28
- return null;
29
- }
30
- Button(CANVAS_MENU_COMPONENT_BUTTON_ID, {
31
- label: CANVAS_MENU_COMPONENT_BUTTON_I18N_ID,
32
- icon: `${DEFAULT_ASSET_BASE_URI}/dock-light.svg`,
33
- onClick: () => {
34
- generateCutoutFromSelection(cesdk);
35
- }
36
- });
37
- }
38
- );
39
- }
40
-
41
- // src/loadAssetSourceFromContentJSON.ts
42
- async function loadAssetSourceFromContentJSON(engine, content, baseURL = "", applyAsset) {
43
- const { assets, id: sourceId } = content;
44
- engine.asset.addLocalSource(sourceId, void 0, applyAsset);
45
- assets.forEach((asset) => {
46
- if (asset.meta) {
47
- Object.entries(asset.meta).forEach(([key, value]) => {
48
- const stringValue = value.toString();
49
- if (stringValue.includes("{{base_url}}")) {
50
- const updated = stringValue.replace("{{base_url}}", baseURL);
51
- if (asset.meta) {
52
- asset.meta[key] = updated;
53
- }
54
- }
55
- });
56
- }
57
- if (asset.payload?.sourceSet) {
58
- asset.payload.sourceSet.forEach((sourceSet) => {
59
- sourceSet.uri = sourceSet.uri.replace("{{base_url}}", baseURL);
60
- });
61
- }
62
- engine.asset.addAssetToSource(sourceId, asset);
63
- });
64
- }
65
- var loadAssetSourceFromContentJSON_default = loadAssetSourceFromContentJSON;
66
-
67
- // src/plugin.ts
68
- function CutoutPlugin({
69
- assetBaseUri,
70
- addCanvasMenuButton
71
- }) {
72
- return {
73
- initializeUserInterface: ({ cesdk }) => {
74
- addCutoutAssetSource(cesdk, { assetBaseUri });
75
- if (addCanvasMenuButton)
76
- registerComponents(cesdk);
77
- cesdk.setTranslations({
78
- en: {
79
- [`libraries.${ENTRY_ID}.label`]: "Cutouts"
80
- }
81
- });
82
- }
83
- };
84
- }
85
- function GetCutoutLibraryInsertEntry(config = DEFAULT_PLUGIN_CONFIGURATION) {
86
- const { assetBaseUri } = getPluginConfiguration(config);
87
- return {
88
- id: ENTRY_ID,
89
- sourceIds: [ASSET_SOURCE_ID],
90
- icon: ({ theme }) => `${assetBaseUri}/dock-${theme}.svg`,
91
- gridColumns: 2,
92
- gridItemHeight: "square",
93
- cardLabel: (asset) => asset.label,
94
- cardLabelPosition: () => "below"
95
- };
96
- }
97
- async function addCutoutAssetSource(cesdk, {
98
- assetBaseUri
99
- }) {
100
- const contentJSON = await fetch(
101
- `${assetBaseUri}/${ASSET_SOURCE_ID}/content.json`
102
- ).then((res) => res.json());
103
- loadAssetSourceFromContentJSON_default(
104
- cesdk.engine,
105
- contentJSON,
106
- `${assetBaseUri}/${ASSET_SOURCE_ID}/assets`,
107
- async (asset) => {
108
- if (asset.id === "cutout-selection") {
109
- return generateCutoutFromSelection(cesdk);
110
- }
111
- if (!asset.meta || !asset.meta.vectorPath2) {
112
- return;
113
- }
114
- asset.meta.vectorPath = asset.meta.vectorPath2;
115
- const blockId = await cesdk.engine.asset.defaultApplyAsset(asset);
116
- return blockId;
117
- }
118
- );
119
- }
120
- function generateCutoutFromSelection(cesdk) {
121
- const pageId = cesdk.engine.scene.getCurrentPage();
122
- if (pageId == null) {
123
- cesdk.ui.showNotification({
124
- message: "No page block available to add the cutout from selection",
125
- type: "error"
126
- });
127
- return void 0;
128
- }
129
- const pageChildren = cesdk.engine.block.getChildren(pageId);
130
- const selectedBlockIds = cesdk.engine.block.findAllSelected().filter((selectedBlockId) => {
131
- return pageChildren.includes(selectedBlockId);
132
- });
133
- if (selectedBlockIds.length > 0) {
134
- const hasCutoutsSelected = selectedBlockIds.some((selectedBlockId) => {
135
- return cesdk.engine.block.getType(selectedBlockId) === "//ly.img.ubq/cutout";
136
- });
137
- if (hasCutoutsSelected) {
138
- cesdk.ui.showNotification({
139
- message: "Cutout blocks cannot be cutout from selection",
140
- type: "error"
141
- });
142
- return void 0;
143
- }
144
- const blockId = cesdk.engine.block.createCutoutFromBlocks(selectedBlockIds);
145
- cesdk.engine.block.appendChild(pageId, blockId);
146
- cesdk.engine.block.setAlwaysOnTop(blockId, true);
147
- cesdk.engine.block.select(blockId);
148
- cesdk.engine.editor.addUndoStep();
149
- return blockId;
150
- } else {
151
- cesdk.ui.showNotification({
152
- message: "No selected blocks available to cutout from selection",
153
- type: "error"
154
- });
155
- return void 0;
156
- }
157
- }
158
- var plugin_default = CutoutPlugin;
159
-
160
- // src/index.ts
161
- var DEFAULT_ASSET_BASE_URI = `https://staticimgly.com/${"@imgly/plugin-cutout-library-web".replace(
162
- "@",
163
- ""
164
- )}/${"0.0.2"}/dist/assets`;
165
- var DEFAULT_PLUGIN_CONFIGURATION = {
166
- assetBaseUri: DEFAULT_ASSET_BASE_URI,
167
- addCanvasMenuButton: true
168
- };
169
- function getPluginConfiguration(config) {
170
- return { ...DEFAULT_PLUGIN_CONFIGURATION, ...config };
171
- }
172
- var Plugin = (config = DEFAULT_PLUGIN_CONFIGURATION) => ({
173
- name: "@imgly/plugin-cutout-library-web",
174
- version: "0.0.2",
175
- ...plugin_default({ ...DEFAULT_PLUGIN_CONFIGURATION, ...config })
176
- });
177
- var src_default = Plugin;
178
- export {
179
- DEFAULT_ASSET_BASE_URI,
180
- DEFAULT_PLUGIN_CONFIGURATION,
181
- GetCutoutLibraryInsertEntry,
182
- src_default as default,
183
- generateCutoutFromSelection,
184
- getPluginConfiguration
185
- };
1
+ var c="@imgly/plugin-cutout-library-web.canvasMenu",d=`${c}.button`;var u="ly.img.cutout",f=`${u}.entry`;function C(t){t.ui.unstable_setCanvasMenuOrder([c,...t.ui.unstable_getCanvasMenuOrder()]);let n=`${d}.label`;t.setTranslations({en:{[n]:"Cutout"}}),t.ui.unstable_registerComponent(c,({builder:{Button:o},engine:e})=>{let a=["//ly.img.ubq/graphic","//ly.img.ubq/text"],i=e.block.findAllSelected();if(i.length!==1||!a.includes(e.block.getType(i[0])))return null;o(d,{label:n,icon:({theme:r})=>`${p}/dock-${r}.svg`,onClick:()=>{g(t)}})})}async function I(t,n,o="",e){let{assets:a,id:i}=n;t.asset.addLocalSource(i,void 0,e),a.forEach(r=>{r.meta&&Object.entries(r.meta).forEach(([l,S])=>{let m=S.toString();if(m.includes("{{base_url}}")){let b=m.replace("{{base_url}}",o);r.meta&&(r.meta[l]=b)}}),r.payload?.sourceSet&&r.payload.sourceSet.forEach(l=>{l.uri=l.uri.replace("{{base_url}}",o)}),t.asset.addAssetToSource(i,r)})}var N=I;function A({assetBaseUri:t,addCanvasMenuButton:n}){return{initializeUserInterface:({cesdk:o})=>{O(o,{assetBaseUri:t}),n&&C(o),o.setTranslations({en:{[`libraries.${f}.label`]:"Cutouts"}})}}}function P(t=s){let{assetBaseUri:n}=E(t);return{id:f,sourceIds:[u],icon:({theme:o})=>`${n}/dock-${o}.svg`,gridColumns:2,gridItemHeight:"square",cardLabel:o=>o.label,cardLabelPosition:()=>"below"}}async function O(t,{assetBaseUri:n}){let o=await fetch(`${n}/${u}/content.json`).then(e=>e.json());N(t.engine,o,`${n}/${u}/assets`,async e=>e.id==="cutout-selection"?g(t):!e.meta||!e.meta.vectorPath2?void 0:(e.meta.vectorPath=e.meta.vectorPath2,await t.engine.asset.defaultApplyAsset(e)))}function g(t){let n=t.engine.scene.getCurrentPage();if(n==null){t.ui.showNotification({message:"No page block available to add the cutout from selection",type:"error"});return}let o=t.engine.block.getChildren(n),e=t.engine.block.findAllSelected().filter(a=>o.includes(a));if(e.length>0){if(e.some(r=>t.engine.block.getType(r)==="//ly.img.ubq/cutout")){t.ui.showNotification({message:"Cutout blocks cannot be cutout from selection",type:"error"});return}let i=t.engine.block.createCutoutFromBlocks(e);return t.engine.block.appendChild(n,i),t.engine.block.setAlwaysOnTop(i,!0),t.engine.block.select(i),t.engine.editor.addUndoStep(),i}else{t.ui.showNotification({message:"No selected blocks available to cutout from selection",type:"error"});return}}var _=A;var p=`https://staticimgly.com/${"@imgly/plugin-cutout-library-web".replace("@","")}/0.0.3-rc.0/dist/assets`,s={assetBaseUri:p,addCanvasMenuButton:!0};function E(t){return{...s,...t}}var T=(t=s)=>({name:"@imgly/plugin-cutout-library-web",version:"0.0.3-rc.0",..._({...s,...t})}),V=T;export{p as DEFAULT_ASSET_BASE_URI,s as DEFAULT_PLUGIN_CONFIGURATION,P as GetCutoutLibraryInsertEntry,V as default,g as generateCutoutFromSelection,E as getPluginConfiguration};
186
2
  //# sourceMappingURL=index.mjs.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/constants.ts", "../src/components.ts", "../src/loadAssetSourceFromContentJSON.ts", "../src/plugin.ts", "../src/index.ts"],
4
- "sourcesContent": ["export const VERSION = PLUGIN_VERSION;\nexport const CANVAS_MENU_COMPONENT_ID = `${PLUGIN_NAME}.canvasMenu`;\nexport const CANVAS_MENU_COMPONENT_BUTTON_ID = `${CANVAS_MENU_COMPONENT_ID}.button`;\nexport const FEATURE_ID = `${PLUGIN_NAME}.feature`;\nexport const ASSET_SOURCE_ID = 'ly.img.cutout';\nexport const ENTRY_ID = `${ASSET_SOURCE_ID}.entry`;\n", "import CreativeEditorSDK, { ObjectTypeLonghand } from '@cesdk/cesdk-js';\nimport { DEFAULT_ASSET_BASE_URI } from '.';\nimport {\n CANVAS_MENU_COMPONENT_BUTTON_ID,\n CANVAS_MENU_COMPONENT_ID\n} from './constants';\nimport { generateCutoutFromSelection } from './plugin';\n\nexport function registerComponents(cesdk: CreativeEditorSDK) {\n cesdk.ui.unstable_setCanvasMenuOrder([\n CANVAS_MENU_COMPONENT_ID,\n ...cesdk.ui.unstable_getCanvasMenuOrder()\n ]);\n // }\n const CANVAS_MENU_COMPONENT_BUTTON_I18N_ID = `${CANVAS_MENU_COMPONENT_BUTTON_ID}.label`;\n\n cesdk.setTranslations({\n en: {\n [CANVAS_MENU_COMPONENT_BUTTON_I18N_ID]: 'Cutout'\n }\n });\n\n cesdk.ui.unstable_registerComponent(\n CANVAS_MENU_COMPONENT_ID,\n ({ builder: { Button }, engine }) => {\n // only show canvas menu button for type=graphic, type=text\n const allowedTypes: ObjectTypeLonghand[] = [\n '//ly.img.ubq/graphic',\n '//ly.img.ubq/text'\n ] as const;\n const selectedBlockIds = engine.block.findAllSelected();\n if (\n selectedBlockIds.length !== 1 ||\n !allowedTypes.includes(engine.block.getType(selectedBlockIds[0]))\n ) {\n return null;\n }\n Button(CANVAS_MENU_COMPONENT_BUTTON_ID, {\n label: CANVAS_MENU_COMPONENT_BUTTON_I18N_ID,\n icon: `${DEFAULT_ASSET_BASE_URI}/dock-light.svg`,\n onClick: () => {\n generateCutoutFromSelection(cesdk);\n }\n });\n }\n );\n}\n", "import { AssetDefinition, AssetResult, CreativeEngine } from '@cesdk/cesdk-js';\n\nasync function loadAssetSourceFromContentJSON(\n engine: CreativeEngine,\n content: ContentJSON,\n baseURL = '',\n applyAsset?: ((asset: AssetResult) => Promise<number | undefined>) | undefined\n) {\n const { assets, id: sourceId } = content;\n\n engine.asset.addLocalSource(sourceId, undefined, applyAsset);\n assets.forEach((asset) => {\n if (asset.meta) {\n Object.entries(asset.meta).forEach(([key, value]: [any, any]) => {\n const stringValue: string = value.toString();\n if (stringValue.includes('{{base_url}}')) {\n const updated = stringValue.replace('{{base_url}}', baseURL);\n if (asset.meta) {\n asset.meta[key] = updated;\n }\n }\n });\n }\n\n if (asset.payload?.sourceSet) {\n asset.payload.sourceSet.forEach((sourceSet) => {\n sourceSet.uri = sourceSet.uri.replace('{{base_url}}', baseURL);\n });\n }\n\n engine.asset.addAssetToSource(sourceId, asset);\n });\n}\nexport type ContentJSON = {\n version: string;\n id: string;\n assets: AssetDefinition[];\n};\n\nexport default loadAssetSourceFromContentJSON;\n", "import type CreativeEditorSDK from '@cesdk/cesdk-js';\nimport { type EditorPlugin } from '@cesdk/cesdk-js';\nimport {\n DEFAULT_PLUGIN_CONFIGURATION,\n PluginConfiguration,\n getPluginConfiguration\n} from '.';\nimport { registerComponents } from './components';\nimport { ASSET_SOURCE_ID, ENTRY_ID } from './constants';\nimport loadAssetSourceFromContentJSON from './loadAssetSourceFromContentJSON';\n\nexport function CutoutPlugin({\n assetBaseUri,\n addCanvasMenuButton\n}: PluginConfiguration): EditorPlugin {\n return {\n initializeUserInterface: ({ cesdk }) => {\n addCutoutAssetSource(cesdk, { assetBaseUri });\n if (addCanvasMenuButton) registerComponents(cesdk);\n cesdk.setTranslations({\n en: {\n [`libraries.${ENTRY_ID}.label`]: 'Cutouts'\n }\n });\n }\n };\n}\n\nexport function GetCutoutLibraryInsertEntry(\n config: Partial<PluginConfiguration> = DEFAULT_PLUGIN_CONFIGURATION\n) {\n const { assetBaseUri } = getPluginConfiguration(config);\n return {\n id: ENTRY_ID,\n sourceIds: [ASSET_SOURCE_ID],\n icon: ({ theme }: { theme: string }) => `${assetBaseUri}/dock-${theme}.svg`,\n gridColumns: 2,\n gridItemHeight: 'square' as const,\n cardLabel: (asset: any) => asset.label,\n cardLabelPosition: () => 'below' as const\n };\n}\n\nasync function addCutoutAssetSource(\n cesdk: CreativeEditorSDK,\n {\n assetBaseUri\n }: {\n assetBaseUri: string;\n }\n) {\n const contentJSON = await fetch(\n `${assetBaseUri}/${ASSET_SOURCE_ID}/content.json`\n ).then((res) => res.json());\n\n loadAssetSourceFromContentJSON(\n cesdk.engine,\n contentJSON,\n `${assetBaseUri}/${ASSET_SOURCE_ID}/assets`,\n async (asset) => {\n if (asset.id === 'cutout-selection') {\n return generateCutoutFromSelection(cesdk);\n }\n if (!asset.meta || !asset.meta.vectorPath2) {\n return;\n }\n // Workaround to enable proper thumbnails for predefined cutouts\n // @ts-ignore\n asset.meta.vectorPath = asset.meta.vectorPath2;\n const blockId = await cesdk.engine.asset.defaultApplyAsset(asset);\n return blockId;\n }\n );\n}\n\nexport function generateCutoutFromSelection(cesdk: CreativeEditorSDK) {\n const pageId = cesdk.engine.scene.getCurrentPage();\n if (pageId == null) {\n cesdk.ui.showNotification({\n message: 'No page block available to add the cutout from selection',\n type: 'error'\n });\n return undefined;\n }\n const pageChildren = cesdk.engine.block.getChildren(pageId);\n\n const selectedBlockIds = cesdk.engine.block\n .findAllSelected()\n .filter((selectedBlockId) => {\n return pageChildren.includes(selectedBlockId);\n });\n\n if (selectedBlockIds.length > 0) {\n const hasCutoutsSelected = selectedBlockIds.some((selectedBlockId) => {\n return (\n cesdk.engine.block.getType(selectedBlockId) === '//ly.img.ubq/cutout'\n );\n });\n if (hasCutoutsSelected) {\n cesdk.ui.showNotification({\n message: 'Cutout blocks cannot be cutout from selection',\n type: 'error'\n });\n return undefined;\n }\n const blockId = cesdk.engine.block.createCutoutFromBlocks(selectedBlockIds);\n cesdk.engine.block.appendChild(pageId, blockId);\n cesdk.engine.block.setAlwaysOnTop(blockId, true);\n cesdk.engine.block.select(blockId);\n cesdk.engine.editor.addUndoStep();\n return blockId;\n } else {\n cesdk.ui.showNotification({\n message: 'No selected blocks available to cutout from selection',\n type: 'error'\n });\n return undefined;\n }\n}\n\nexport default CutoutPlugin;\n", "import plugin, {\n GetCutoutLibraryInsertEntry,\n generateCutoutFromSelection\n} from './plugin';\n\nexport const DEFAULT_ASSET_BASE_URI = `https://staticimgly.com/${PLUGIN_NAME.replace(\n '@',\n ''\n)}/${PLUGIN_VERSION}/dist/assets`;\n\nexport const DEFAULT_PLUGIN_CONFIGURATION = {\n assetBaseUri: DEFAULT_ASSET_BASE_URI,\n addCanvasMenuButton: true\n};\n\nexport interface PluginConfiguration {\n assetBaseUri: string;\n addCanvasMenuButton: boolean;\n}\n\nexport function getPluginConfiguration(\n config: Partial<PluginConfiguration>\n): PluginConfiguration {\n return { ...DEFAULT_PLUGIN_CONFIGURATION, ...config };\n}\n\nconst Plugin = (\n config: Partial<PluginConfiguration> = DEFAULT_PLUGIN_CONFIGURATION\n) => ({\n name: PLUGIN_NAME,\n version: PLUGIN_VERSION,\n ...plugin({ ...DEFAULT_PLUGIN_CONFIGURATION, ...config })\n});\n\nexport default Plugin;\n\nexport { GetCutoutLibraryInsertEntry, generateCutoutFromSelection };\n"],
5
- "mappings": "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",
6
- "names": []
4
+ "sourcesContent": ["export const VERSION = PLUGIN_VERSION;\nexport const CANVAS_MENU_COMPONENT_ID = `${PLUGIN_NAME}.canvasMenu`;\nexport const CANVAS_MENU_COMPONENT_BUTTON_ID = `${CANVAS_MENU_COMPONENT_ID}.button`;\nexport const FEATURE_ID = `${PLUGIN_NAME}.feature`;\nexport const ASSET_SOURCE_ID = 'ly.img.cutout';\nexport const ENTRY_ID = `${ASSET_SOURCE_ID}.entry`;\n", "import CreativeEditorSDK, { ObjectTypeLonghand } from '@cesdk/cesdk-js';\nimport { DEFAULT_ASSET_BASE_URI } from '.';\nimport {\n CANVAS_MENU_COMPONENT_BUTTON_ID,\n CANVAS_MENU_COMPONENT_ID\n} from './constants';\nimport { generateCutoutFromSelection } from './plugin';\n\nexport function registerComponents(cesdk: CreativeEditorSDK) {\n cesdk.ui.unstable_setCanvasMenuOrder([\n CANVAS_MENU_COMPONENT_ID,\n ...cesdk.ui.unstable_getCanvasMenuOrder()\n ]);\n // }\n const CANVAS_MENU_COMPONENT_BUTTON_I18N_ID = `${CANVAS_MENU_COMPONENT_BUTTON_ID}.label`;\n\n cesdk.setTranslations({\n en: {\n [CANVAS_MENU_COMPONENT_BUTTON_I18N_ID]: 'Cutout'\n }\n });\n\n cesdk.ui.unstable_registerComponent(\n CANVAS_MENU_COMPONENT_ID,\n ({ builder: { Button }, engine }) => {\n // only show canvas menu button for type=graphic, type=text\n const allowedTypes: ObjectTypeLonghand[] = [\n '//ly.img.ubq/graphic',\n '//ly.img.ubq/text'\n ] as const;\n const selectedBlockIds = engine.block.findAllSelected();\n if (\n selectedBlockIds.length !== 1 ||\n !allowedTypes.includes(engine.block.getType(selectedBlockIds[0]))\n ) {\n return null;\n }\n Button(CANVAS_MENU_COMPONENT_BUTTON_ID, {\n label: CANVAS_MENU_COMPONENT_BUTTON_I18N_ID,\n icon: ({ theme }) => `${DEFAULT_ASSET_BASE_URI}/dock-${theme}.svg`,\n onClick: () => {\n generateCutoutFromSelection(cesdk);\n }\n });\n }\n );\n}\n", "import { AssetDefinition, AssetResult, CreativeEngine } from '@cesdk/cesdk-js';\n\nasync function loadAssetSourceFromContentJSON(\n engine: CreativeEngine,\n content: ContentJSON,\n baseURL = '',\n applyAsset?: ((asset: AssetResult) => Promise<number | undefined>) | undefined\n) {\n const { assets, id: sourceId } = content;\n\n engine.asset.addLocalSource(sourceId, undefined, applyAsset);\n assets.forEach((asset) => {\n if (asset.meta) {\n Object.entries(asset.meta).forEach(([key, value]: [any, any]) => {\n const stringValue: string = value.toString();\n if (stringValue.includes('{{base_url}}')) {\n const updated = stringValue.replace('{{base_url}}', baseURL);\n if (asset.meta) {\n asset.meta[key] = updated;\n }\n }\n });\n }\n\n if (asset.payload?.sourceSet) {\n asset.payload.sourceSet.forEach((sourceSet) => {\n sourceSet.uri = sourceSet.uri.replace('{{base_url}}', baseURL);\n });\n }\n\n engine.asset.addAssetToSource(sourceId, asset);\n });\n}\nexport type ContentJSON = {\n version: string;\n id: string;\n assets: AssetDefinition[];\n};\n\nexport default loadAssetSourceFromContentJSON;\n", "import type CreativeEditorSDK from '@cesdk/cesdk-js';\nimport { type EditorPlugin } from '@cesdk/cesdk-js';\nimport {\n DEFAULT_PLUGIN_CONFIGURATION,\n PluginConfiguration,\n getPluginConfiguration\n} from '.';\nimport { registerComponents } from './components';\nimport { ASSET_SOURCE_ID, ENTRY_ID } from './constants';\nimport loadAssetSourceFromContentJSON from './loadAssetSourceFromContentJSON';\n\nexport function CutoutPlugin({\n assetBaseUri,\n addCanvasMenuButton\n}: PluginConfiguration): EditorPlugin {\n return {\n initializeUserInterface: ({ cesdk }) => {\n addCutoutAssetSource(cesdk, { assetBaseUri });\n if (addCanvasMenuButton) registerComponents(cesdk);\n cesdk.setTranslations({\n en: {\n [`libraries.${ENTRY_ID}.label`]: 'Cutouts'\n }\n });\n }\n };\n}\n\nexport function GetCutoutLibraryInsertEntry(\n config: Partial<PluginConfiguration> = DEFAULT_PLUGIN_CONFIGURATION\n) {\n const { assetBaseUri } = getPluginConfiguration(config);\n return {\n id: ENTRY_ID,\n sourceIds: [ASSET_SOURCE_ID],\n icon: ({ theme }: { theme: string }) => `${assetBaseUri}/dock-${theme}.svg`,\n gridColumns: 2,\n gridItemHeight: 'square' as const,\n cardLabel: (asset: any) => asset.label,\n cardLabelPosition: () => 'below' as const\n };\n}\n\nasync function addCutoutAssetSource(\n cesdk: CreativeEditorSDK,\n {\n assetBaseUri\n }: {\n assetBaseUri: string;\n }\n) {\n const contentJSON = await fetch(\n `${assetBaseUri}/${ASSET_SOURCE_ID}/content.json`\n ).then((res) => res.json());\n\n loadAssetSourceFromContentJSON(\n cesdk.engine,\n contentJSON,\n `${assetBaseUri}/${ASSET_SOURCE_ID}/assets`,\n async (asset) => {\n if (asset.id === 'cutout-selection') {\n return generateCutoutFromSelection(cesdk);\n }\n if (!asset.meta || !asset.meta.vectorPath2) {\n return;\n }\n // Workaround to enable proper thumbnails for predefined cutouts\n // @ts-ignore\n asset.meta.vectorPath = asset.meta.vectorPath2;\n const blockId = await cesdk.engine.asset.defaultApplyAsset(asset);\n return blockId;\n }\n );\n}\n\nexport function generateCutoutFromSelection(cesdk: CreativeEditorSDK) {\n const pageId = cesdk.engine.scene.getCurrentPage();\n if (pageId == null) {\n cesdk.ui.showNotification({\n message: 'No page block available to add the cutout from selection',\n type: 'error'\n });\n return undefined;\n }\n const pageChildren = cesdk.engine.block.getChildren(pageId);\n\n const selectedBlockIds = cesdk.engine.block\n .findAllSelected()\n .filter((selectedBlockId) => {\n return pageChildren.includes(selectedBlockId);\n });\n\n if (selectedBlockIds.length > 0) {\n const hasCutoutsSelected = selectedBlockIds.some((selectedBlockId) => {\n return (\n cesdk.engine.block.getType(selectedBlockId) === '//ly.img.ubq/cutout'\n );\n });\n if (hasCutoutsSelected) {\n cesdk.ui.showNotification({\n message: 'Cutout blocks cannot be cutout from selection',\n type: 'error'\n });\n return undefined;\n }\n const blockId = cesdk.engine.block.createCutoutFromBlocks(selectedBlockIds);\n cesdk.engine.block.appendChild(pageId, blockId);\n cesdk.engine.block.setAlwaysOnTop(blockId, true);\n cesdk.engine.block.select(blockId);\n cesdk.engine.editor.addUndoStep();\n return blockId;\n } else {\n cesdk.ui.showNotification({\n message: 'No selected blocks available to cutout from selection',\n type: 'error'\n });\n return undefined;\n }\n}\n\nexport default CutoutPlugin;\n", "import plugin, {\n GetCutoutLibraryInsertEntry,\n generateCutoutFromSelection\n} from './plugin';\n\nexport const DEFAULT_ASSET_BASE_URI = `https://staticimgly.com/${PLUGIN_NAME.replace(\n '@',\n ''\n)}/${PLUGIN_VERSION}/dist/assets`;\n\nexport const DEFAULT_PLUGIN_CONFIGURATION = {\n assetBaseUri: DEFAULT_ASSET_BASE_URI,\n addCanvasMenuButton: true\n};\n\nexport interface PluginConfiguration {\n assetBaseUri: string;\n addCanvasMenuButton: boolean;\n}\n\nexport function getPluginConfiguration(\n config: Partial<PluginConfiguration>\n): PluginConfiguration {\n return { ...DEFAULT_PLUGIN_CONFIGURATION, ...config };\n}\n\nconst Plugin = (\n config: Partial<PluginConfiguration> = DEFAULT_PLUGIN_CONFIGURATION\n) => ({\n name: PLUGIN_NAME,\n version: PLUGIN_VERSION,\n ...plugin({ ...DEFAULT_PLUGIN_CONFIGURATION, ...config })\n});\n\nexport default Plugin;\n\nexport { GetCutoutLibraryInsertEntry, generateCutoutFromSelection };\n"],
5
+ "mappings": "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",
6
+ "names": ["CANVAS_MENU_COMPONENT_ID", "CANVAS_MENU_COMPONENT_BUTTON_ID", "ASSET_SOURCE_ID", "ENTRY_ID", "registerComponents", "cesdk", "CANVAS_MENU_COMPONENT_ID", "CANVAS_MENU_COMPONENT_BUTTON_I18N_ID", "CANVAS_MENU_COMPONENT_BUTTON_ID", "Button", "engine", "allowedTypes", "selectedBlockIds", "theme", "DEFAULT_ASSET_BASE_URI", "generateCutoutFromSelection", "loadAssetSourceFromContentJSON", "engine", "content", "baseURL", "applyAsset", "assets", "sourceId", "asset", "key", "value", "stringValue", "updated", "sourceSet", "loadAssetSourceFromContentJSON_default", "CutoutPlugin", "assetBaseUri", "addCanvasMenuButton", "cesdk", "addCutoutAssetSource", "registerComponents", "ENTRY_ID", "GetCutoutLibraryInsertEntry", "config", "DEFAULT_PLUGIN_CONFIGURATION", "getPluginConfiguration", "ASSET_SOURCE_ID", "theme", "asset", "contentJSON", "res", "loadAssetSourceFromContentJSON_default", "generateCutoutFromSelection", "pageId", "pageChildren", "selectedBlockIds", "selectedBlockId", "blockId", "plugin_default", "DEFAULT_ASSET_BASE_URI", "DEFAULT_PLUGIN_CONFIGURATION", "getPluginConfiguration", "config", "Plugin", "plugin_default", "src_default"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@imgly/plugin-cutout-library-web",
3
- "version": "0.0.2",
3
+ "version": "0.0.3-rc.0",
4
4
  "description": "Cutout Library plugin for the CE.SDK editor",
5
5
  "keywords": [
6
6
  "CE.SDK",