adobexd / plugin-samples Goto Github PK

Alternatively, can we host these video in public? like cc-files or youtube?

Hey, I was wondering if there is a list of available packages that you can use with adobe xd plugins? I didn't find anything related in the documentation but this line:
XD's plugin sandbox does not include most Node.js APIs, such as unrestricted filesystem access or the ability to spawn external processes. Npm packages that only depend on the core JavaScript language APIs can work in XD, but because XD's require() differs (see above), you will likely have to use webpack or rollup in order to generate a single-file bundle first. (Source)

https://github.com/AdobeXD/plugin-samples/blob/master/quick-start-react/src/react-shim.js is out of date.

If we update the sample's minVersion to 16, we can remove the setTimeout() & clearTimeout() shims.

If we update min to 18, we can remove the requestAnimationFrame() & cancelAnimationFrame() shims.

hi guys!
i want to import my design from another xd file into xd with plugin that i write,how can i do this, please help me.
is it possible?

1. missing nodemon in package.json
2. could not insert a Photo after building. (after fixing 1.)

@kerrishotts
btw, nor the prerelease version. It just doesn't show up in the plugin panel

ui-hello-react example uses react 16.15.2 which is not released yet.

ui-hello-react/package.json#L21

However, other examples use react 16.4.2.

I think it would be useful to add the externals to the webpack.config.js so that the XD API is available in the main.js file. I just had a look at the ui-pixabay example and noticed how it’s done there:

externals: {
  uxp: 'uxp',
  scenegraph: 'scenegraph'
},

Though it is listed in the readme file there is no getting-started sample listed in the repro.

I'm having trouble getting started with the React sample.

Install yarn if not available

npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules

😨 I followed the steps on this page.

npm install

npm WARN [email protected] No repository field.

audited 404 packages in 1.452s
found 0 vulnerabilities

Some success 🤔🤷‍♀️

yarn install

info No lockfile found.
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.

Followed by some success, I think?

yarn watch

yarn run v1.12.3
error Command "watch" not found.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

😣

dominictarr/event-stream#116
remy/nodemon#1469

npm already deleted malware package ( flatmap-stream ) but it would be installed by yarn command.

please update nodemon ( 1.18.4 -> 1.18.7 ) in following samples.

• e2e-adobe-stock
• ui-hello-react
• ui-tabs-react

(after install package by yarn)

$ npm ls flatmap-stream 
[email protected] /plugin-samples/ui-hello-react
└─┬ [email protected]
  └─┬ [email protected]
    └─┬ [email protected]
      └─┬ [email protected]
        └── [email protected] 

@achicu suggested I open an issue for this here. Does not appear to be possible to symlink an individual plugin folder.

Add an example on showing a local image from the plugin directory.

https://forums.adobexdplatform.com/t/found-a-bug-in-the-sample-code/370

It seems not work and cannot catch any error.

in the instructions for MacOS:

git clone [email protected]:AdobeXD/Plugin-Samples.git plugins

should be

git clone https://github.com/AdobeXD/plugin-samples.git

or something similar ("P" and "S" should be lowercase.

Can anyone help me how to Insert Image on Artboard using main js file? Also, can I add HTML elements on the artboard?

First, great work guys! What you did it's amazing!

I am testing API, and i cannot find references for

• Project Name
• Project links for Prototype and Design Specs

We are building a custom private plugin tool for EXTFOX Slack Channel where our UI/UX Team would publish updates.

Cheers,
Dusan, C.E.O

The sample contains this code which runs when clicking the "Done" button:

        function onsubmit(e) {
            let values = {
                horizontal: horizontal.value,
                vertical: vertical.value
            };
            console.log("submit: " + JSON.stringify(values))
            dialog.close();
        }

However, the variables horizontal and vertical don't exist (left over from a 'button padding' sample plugin maybe?). So if you run the plugin and click "Done," you get this JS error:

/develop/ui-context-menu/main.js:246: Uncaught TypeError: Cannot read property 'value' of undefined
/develop/ui-context-menu/main.js:8
                horizontal: horizontal.value,
                                       ^
Plugin TypeError: Cannot read property 'value' of undefined
    at onsubmit (/develop/ui-context-menu/main.js:8:40)
    at b.onclick (/develop/ui-context-menu/main.js:40:86)

The link to XD Plugin Guides (with url https://adobexdplatform.com/plugin-docs/guides) results in a 404.

Hello, I'm not sure here is the right place. I'm working on a plugin rely on fast image compression, using pure js is a bit slow, but can be easily implemented via canvas. I cannot access canvas in AdobeXD's plugin environment, would it be possible to use more dom API like canvas? Thanks.

1. Install the ui-html-playground sample
2. Launch XD and open a document
3. Look in the Developer Console

Result
A big error stack was logged:

Loading plugin /..../develop/ui-html-playground
This browser doesn't support cancelAnimationFrame. Make sure that you load a polyfill in older browsers. https://fb.me/react-polyfills
    at Object.error (plugins/PluginLoader.js:45:34)
    at /..../develop/ui-html-playground/main.js:20858:17
    at Object../node_modules/schedule/cjs/schedule.development.js (/..../develop/ui-html-playground/main.js:21158:5)
    at __webpack_require__ (/..../develop/ui-html-playground/main.js:21:30)
    at Object../node_modules/schedule/index.js (/..../develop/ui-html-playground/main.js:21175:20)
    at __webpack_require__ (/..../develop/ui-html-playground/main.js:21:30)
    at /..../develop/ui-html-playground/main.js:463:16
    at Object../node_modules/react-dom/cjs/react-dom.development.js (/..../develop/ui-html-playground/main.js:18529:5)
    at __webpack_require__ (/..../develop/ui-html-playground/main.js:21:30)
    at Object../node_modules/react-dom/index.js (/..../develop/ui-html-playground/main.js:18574:20)
    at __webpack_require__ (/..../develop/ui-html-playground/main.js:21:30)
    at Object.<anonymous> (/..../develop/ui-html-playground/main.js:21920:16)
    at Object../src/main.jsx (/..../develop/ui-html-playground/main.js:21970:30)
    at __webpack_require__ (/..../develop/ui-html-playground/main.js:21:30)
    at /..../develop/ui-html-playground/main.js:85:18
    at /..../develop/ui-html-playground/main.js:88:10
...

Expected
Polyfill the rAF-related APIs as needed so React works correctly and doesn't spam errors to the console. (Maybe someone could provide a standard set of these polyfills via https://github.com/AdobeXD/plugin-toolkit?)

Plugin does not execute anything. Rename updateWeather function in main.js to updateWeatherFunction or anything unique in main.js.

Change module.exports to
module.exports = {
commands: {
updateWeather: updateWeatherFunction
}
};

e.g., remove *@2x.png, *@3x.png files from the project

• e2e-adobe-stock/assets
• ui-playground/welcome/pages/assets
• ui-buttons-galore/
• sg-lots-of-rects/images/

Although, keep files in this project. This is the example that explains the plugin manager's behavior (use the largest of the icons listed).

• ui-dialog-variations/