storyblok / field-plugin Goto Github PK
View Code? Open in Web Editor NEWCreate and deploy Storyblok Field Plugin
Home Page: https://www.storyblok.com/docs/plugins/field-plugins/introduction
Create and deploy Storyblok Field Plugin
Home Page: https://www.storyblok.com/docs/plugins/field-plugins/introduction
Is your feature request related to a problem? Please describe.
I have played around with React template and made my first field type plugin in this new new API. Unfortunately, I found out that there is no error interception or some hook to prevent CMS from saving, so I could make custom error handling within the field type plugin.
Describe the solution you'd like
My plugin is much more advanced and acts rather like a widget with input and some more inputs generated dynamically, so I have error handling to prevent invalid cases. The example could look like in the additional context.
My FieldPluginResponse.data.content
is not a string, but rather an object {}
, so I have to have custom error handling for better and UI with guided output.
I do not want to imply exact solution, but from top of my head there could be some setError
(similar to setContent
), so CMS could check it before saving the page and would generate the messages queue of single string and/or array of strings which are set by the field plugin. The rest could be part of the usual flow - that error icon next to Publish button to hint user to resolve listed errors.
Additional context
Describe the bug
Discord Link
Expected behavior
The field plugin size is adapted to its content and does not cut off parts of the iframe.
Additional context
storyblok/[email protected] works correctly
Currently the only way to provide options to a plugin seems to be through "Self" and entering the individual options for each instance of a plugin. This becomes extremely tedious and error-prone when having more than very frew instances of a plugin.
In the field settings pane it is possible to switch from "Self" to "Datasource" (amongst others). So we thought that would be the perfect way to use a datasource. That way we only have to select the correct data source and when something changes (external API URL in our case) only the datasource has to be updated.
There does not seem to be a good way to centrally manage settings like that – for standard field types like Single-Option this works very well and we'd like to have the same ease of use for custom fields…
Is your feature request related to a problem? Please describe.
Currently the Field Plugin Sandbox only displays the content and the data.
I would suggest for a possibility to enter data.
Not a problem, but would help to develop plugins, that access content of the current story.
Describe the solution you'd like
The complete data structure (incl. content) should be editable and provided to the field plugin as storyblok would do it in real life.
Describe alternatives you've considered
Currently the data will be taken from an .env.local file and "simulated" that this data comes from stroyblok
Describe the solution you'd like
I would like to be able to access FieldPlugin options from within the validateContent function.
The reason is i've got a plugin that selects objects, and i was thinking about having an option that states if it should be an single or multiselect. And if multiple, the validation creates an array, if single its just a string.
Describe alternatives you've considered
...
Additional context
...
Describe the bug
I have following behavior with my custom field plugin:
The Visual Editor does not detect changes if the content of the field plugin changes
Created a react field plugin that returns an object like {A:stringA, b:stringB}.
In the plugin the state will be stored with useState
const [value, setValue] = useState<>({A: '',B: ''})
every time the value changes the setContent function will be called via an useEffect
useEffect(() => {
actions?.setContent(value)
}, [value])
To Reproduce
Steps to reproduce the behavior:
Expected behavior
"Save" button of Visual Editor should change to a different state - signaling that there are changes in the story
Feature request:
Current block data object in the root of your plugin.data or a util function which returns the object.
Use case you want to read data from a field from your current block. At the moment you have the blockUid in your plugin.data and you have t recursively search for the object with the given uid to get your block data object. Would be cool to either have the block object in the root of your plugin.data or a util function which returns the object. so not everybody has to implement his own search block function.
Describe the bug
When updating Vue Refs to update page content in the Sandbox, the Refs update, but the Sandbox doesn't as it usually would in a vue 3 project. For instance, I am using the Cloudinary Media Library, and when an asset is returned, it is added to the assetList ref. I am then using a v-for in my template to display each item in the assetList. However, once a new item is added (or removed) from the ref, the Sandbox doesn't reflect that change. I have to then hot reload the code in order to force update it to reflect the new content.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
Once reactive vue elements are updated, the sandbox should display them as so.
I've set up a simple example below with a counter (which is initialised as const counter = ref(0);
) & button to demonstrate (the counter ref is updating, but the sandbox is not. However, if i change something, change it back & hot reload it updates to what it should be in the Sandbox)
Screenshots
Desktop (please complete the following information):
Additional context
I am new to working with the Field Plugin Sandbox & creating custom Storyblok plugins so please let me know if it's something I'm going wrong with on my end with the plugin/need to do to rectify. thankyou!
update: found the issue & rectified. it was a vue onMounted error causing the issue. thanks :)
Is your feature request related to a problem? Please describe.
As we see the publish: true
is enabled in CLI (https://github.com/storyblok/field-plugin/blob/main/packages/cli/src/commands/deploy/helper.ts#L83C7-L83C21), this it is not possible to push an update of the Plugin in draft level, thus it gets instantly published, which may not align with the way teams may use it in CI automations.
Describe the solution you'd like
It should be possible to define --publish false
(though by default it is enabled, that is fine), so the release process would be 2 steps:
Describe alternatives you've considered
No alternatives, we have to be sure the version we push is the one we want to appear on production, thus there is no doublecheck step or other flows possible.
Additional context
Severity: minor.
Describe the bug
Running the visual editor from a domain that is not app.storyblok.com
causes field plugins to load indefinitely. The origin used will always be set to app.storyblok.com
if the plugin is not running in the sandbox. This causes message sent from the iframe
to not get handled by the event listener. Using the same field plugin at app.storyblok.com
works as intended.
To Reproduce
We are running a Next.JS site with Storyblok on three different environments. Production, Staging and development (localhost).
Since development runs on a http server we access the Visual Editor using "method 2" as detailed here:
We host the html file on localhost:1337/cms
. To have parity in the other environment we have asked our content editors to also access the editor using https://production.com/cms
and https://staging.com/cms
.
As detailed in the description this causes the host production.com
to not match the origin in the posted message:
Since no events can be handled the plugin is not transitioning from the loaded state and won't be able to react to any other message
Expected behavior
Field plugins should work even when running the visual editor through the static editor.html
file on domains that's not app.storyblok.com
Screenshots
Field plugin running but without being able to change the height or set the output:
Desktop (please complete the following information):
Smartphone (please complete the following information):
Additional context
I can see that some work regarding this has been done in PR #367
Describe the bug
The height of the iframe doesn't fill the available height of the modal.
To Reproduce
Steps to reproduce the behavior:
npx @storyblok/field-plugin-cli@latest create
pnpm dev
Expected behavior
The iframe should fill the available height.
Desktop (please complete the following information):
Describe the bug
When trying to run a vue3 plugin, it results in an error.
To Reproduce
Steps to reproduce the behavior:
npx @storyblok/field-plugin-cli@alpha
cd {what-ever-you-named-it}
yarn build
Expected behavior
I expect no errors.
Desktop (please complete the following information):
Additional context
I have no idea if this actually causes it to not work properly, or if its just an error with no affect.
Describe the bug
The Field Plugin Sandbox doesn't work in the browser Brave due to its ad blocker.
To Reproduce
Steps to reproduce the behavior:
yarn dev
Expected behavior
It should just work.
Is your feature request related to a problem? Please describe.
Hey! I know this project is in alpha stage, but I've been using it to create some plugins and it works like a charm, much better than the legacy method. Great work!
Since the templates are written in TypeScript, would be nice to have generic types, specially to customize the useFieldPlugin().data.content
(which is unknown
) without losing type-safety. In your templates you treat the content
as number
to store the value of the counter. In my case, I would like to store an object instead.
What I've done to achieve that is modifying the FieldPluginProvider.vue
(vue3 template) and useFieldPlugin.ts
to inject my custom types. By doing this, I have safe autocompletion in useFieldPlugin().data.content
and useFieldPlugin().data.setContent()
.
I made this codesandbox to show my workaround, based on the vue3 template.
Files of interest:
src/types.ts
src/useFieldPlugin.ts
src/components/FieldPluginProvider.vue
src/components/Counter.vue
src/components/Foo.vue
Describe the solution you'd like
If you see src/types.ts
, I added an interface (PluginContent
) for my custom content, and rewrite FieldPluginData
, FieldPluginActions
and FieldPluginResponse
to include the PluginContent
. Also I updated some pieces in the createFieldPlugin
callback function used in FieldPluginProvider.vue
.
Instead rewriting those types and monkey-patching that callback would be nicer to do something like:
const plugin = reactive<PluginResponse<MyContent>>({
type: 'loading',
});
createFieldPlugin<MyContent>(() => {})
Not sure that would be the best solution, it's just an idea.
Describe alternatives you've considered
Nothing else
Additional context
Nothing else
A collection of bugs with the vue3 template.
Steps to reproduce the behavior:
npx @storyblok/field-plugin-cli@alpha --template vue3
cd ./nameoffieldtemplate
yarn dev
defineProps
is a compiler macro and no longer needs to be imported."
Fix: Remove all explicit imports of defineProps
.
Describe the bug
The options
object from the useFieldPlugin
is continuously undefined in my field plugins. I logged out the type
also and I can see that it's stuck in a loading
value.
I'm experiencing this on with the version "@storyblok/field-plugin": "1.0.1"
and "vue": "^3.2.47"
. I also created a new project using version "@storyblok/field-plugin": "1.0.2",
.
I really would love to get a fix for this as we need to use the same plugin for multiple StoryBlok spaces so we are relying on the options to switch the credentials.
To Reproduce
Steps to reproduce the behavior:
Log out the options
object from the useFieldPlugin
as shown below;
<script setup lang="ts">
import type { SetModalOpen } from '@storyblok/field-plugin'
import { useFieldPlugin } from '@storyblok/field-plugin/vue3';
const { data: pluginData, type: pluginType } = useFieldPlugin()
console.log("PLUGIN OPTIONS", pluginData?.options);
const props = defineProps<{
isModalOpen: boolean
setModalOpen: SetModalOpen<any>
}>()
</script>
Expected behavior
The options
object should have the properties defined in the following field-plugin.config.json` file;
{
"options": [
{
"name": "API_URL",
"value": ""
},
{
"name": "API_KEY",
"value": ""
}
]
}
Screenshots
Additional context
Just tried to update to Vite 5, to be on the newest version, and having this errors, is the plugins support Vite 5 and i'm doping something wrong, or it's not supported yet ? :) sending also my vite.config.ts
(but its basically boilerplate one)
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import cssInjectedByJs from 'vite-plugin-css-injected-by-js'
import { plugins } from '@storyblok/field-plugin/vite'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react(), cssInjectedByJs(), ...plugins],
build: {
rollupOptions: {
output: {
format: 'commonjs',
entryFileNames: `[name].js`,
chunkFileNames: `[name].js`,
assetFileNames: `[name].[ext]`,
},
},
},
server: {
port: 8080,
host: true,
},
})
@ef-global/backpack-sb-plugins-common:lint: vite.config.ts:8:22 - error TS2769: No overload matches this call.
@ef-global/backpack-sb-plugins-common:lint: The last overload gave the following error.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>[]' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>[]' is not assignable to type 'PluginOption[]'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>' is not assignable to type 'Plugin_2'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'apply' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean) | undefined' is not assignable to type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean) |...'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: UserConfig, env: ConfigEnv) => boolean' is not assignable to type '"serve" | "build" | ((this: void, config: UserConfig, env: ConfigEnv) => boolean) | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean' is not assignable to type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean'.
@ef-global/backpack-sb-plugins-common:lint: Types of parameters 'config' and 'config' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'plugins' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[] | undefined' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[] | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[]' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[]'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin_2' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin_2' is not assignable to type 'Plugin<any>'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'apply' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean) |...' is not assignable to type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean) | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: UserConfig, env: ConfigEnv) => boolean' is not assignable to type '"serve" | "build" | ((this: void, config: UserConfig, env: ConfigEnv) => boolean) | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean' is not assignable to type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean'.
@ef-global/backpack-sb-plugins-common:lint: Types of parameters 'config' and 'config' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'plugins' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[] | undefined' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[] | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[]' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[]'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Promise<false | Plugin<any> | PluginOption[] | null | undefined>' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Promise<false | Plugin<any> | PluginOption[] | null | undefined>' is not assignable to type 'Promise<false | Plugin_2 | PluginOption[] | null | undefined>'.
@ef-global/backpack-sb-plugins-common:lint: Type 'false | Plugin<any> | PluginOption[] | null | undefined' is not assignable to type 'false | Plugin_2 | PluginOption[] | null | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>' is not assignable to type 'false | Plugin_2 | PluginOption[] | null | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption'.
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: 8 plugins: [react(), cssInjectedByJs(), ...plugins],
@ef-global/backpack-sb-plugins-common:lint: ~~~~~~~~~~~~~~~~~
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: node_modules/vite/dist/node/index.d.ts:579:25
@ef-global/backpack-sb-plugins-common:lint: 579 export declare function defineConfig(config: UserConfigExport): UserConfigExport;
@ef-global/backpack-sb-plugins-common:lint: ~~~~~~~~~~~~
@ef-global/backpack-sb-plugins-common:lint: The last overload is declared here.
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: vite.config.ts:8:41 - error TS2769: No overload matches this call.
@ef-global/backpack-sb-plugins-common:lint: The last overload gave the following error.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>[]' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>[]' is not assignable to type 'PluginOption[]'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>' is not assignable to type 'Plugin_2'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'apply' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean) | undefined' is not assignable to type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean) |...'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: UserConfig, env: ConfigEnv) => boolean' is not assignable to type '"serve" | "build" | ((this: void, config: UserConfig, env: ConfigEnv) => boolean) | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean' is not assignable to type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean'.
@ef-global/backpack-sb-plugins-common:lint: Types of parameters 'config' and 'config' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'plugins' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[] | undefined' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[] | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[]' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[]'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin_2' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin_2' is not assignable to type 'Plugin<any>'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'apply' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean) |...' is not assignable to type '"serve" | "build" | ((this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean) | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: UserConfig, env: ConfigEnv) => boolean' is not assignable to type '"serve" | "build" | ((this: void, config: UserConfig, env: ConfigEnv) => boolean) | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").ConfigEnv) => boolean' is not assignable to type '(this: void, config: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig, env: import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").ConfigEnv) => boolean'.
@ef-global/backpack-sb-plugins-common:lint: Types of parameters 'config' and 'config' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").UserConfig' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").UserConfig'.
@ef-global/backpack-sb-plugins-common:lint: Types of property 'plugins' are incompatible.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[] | undefined' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[] | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption[]' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption[]'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Promise<false | Plugin<any> | PluginOption[] | null | undefined>' is not assignable to type 'PluginOption'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Promise<false | Plugin<any> | PluginOption[] | null | undefined>' is not assignable to type 'Promise<false | Plugin_2 | PluginOption[] | null | undefined>'.
@ef-global/backpack-sb-plugins-common:lint: Type 'false | Plugin<any> | PluginOption[] | null | undefined' is not assignable to type 'false | Plugin_2 | PluginOption[] | null | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'Plugin<any>' is not assignable to type 'false | Plugin_2 | PluginOption[] | null | undefined'.
@ef-global/backpack-sb-plugins-common:lint: Type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/node_modules/vite/dist/node/index").PluginOption' is not assignable to type 'import("/Users/marckraw/Projects/EF/gc/backpack-sb-plugins-react/packages/common/node_modules/vite/dist/node/index").PluginOption'.
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: 8 plugins: [react(), cssInjectedByJs(), ...plugins],
@ef-global/backpack-sb-plugins-common:lint: ~~~~~~~~~~
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: node_modules/vite/dist/node/index.d.ts:579:25
@ef-global/backpack-sb-plugins-common:lint: 579 export declare function defineConfig(config: UserConfigExport): UserConfigExport;
@ef-global/backpack-sb-plugins-common:lint: ~~~~~~~~~~~~
@ef-global/backpack-sb-plugins-common:lint: The last overload is declared here.
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: vitest.config.ts:5:3 - error TS2345: Argument of type 'UserConfig & Promise<UserConfig> & (UserConfigFnObject & UserConfigExport)' is not assignable to parameter of type 'never'.
@ef-global/backpack-sb-plugins-common:lint: Type 'UserConfig & Promise<UserConfig> & UserConfigFnObject' is not assignable to type 'never'.
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: 5 viteConfig,
@ef-global/backpack-sb-plugins-common:lint: ~~~~~~~~~~
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: Found 3 errors in 2 files.
@ef-global/backpack-sb-plugins-common:lint:
@ef-global/backpack-sb-plugins-common:lint: Errors Files
@ef-global/backpack-sb-plugins-common:lint: 2 vite.config.ts:8
@ef-global/backpack-sb-plugins-common:lint: 1 vitest.config.ts:5
Is your feature request related to a problem? Please describe.
We do keep Field-types in Organisation level (https://app.storyblok.com/#/me/org/fields), which is accessible ONLY for users having Admin level.
Multiple developers can contribute to plugin monorepo, and they should be able to push new plugins in automated way via CLI only with no need to go to Admin panel to configure them, hence they must be able to have plugin assigned to some certain spaces via CLI.
Describe the solution you'd like
Extend CLI deploy command with --spaces
flag option to instantly assign plugin to certain spaces, f.e
--spaces 0123456
or multiple:
--spaces 0123456,0123457,0123458
Additional context
Severity: high.
Describe the bug
I just bootstrapped a new custom field plug-in. When running pnpm build
the task fails, because @storyblok/field-plugin/test
could not be found.
A clear and concise description of what the bug is.
To Reproduce
Steps to reproduce the behavior:
pnpm dlx @storyblok/field-plugin-cli@latest create
with options pnpm and vue3.pnpm build
src/components/FieldPluginExample/index.spec.ts:4:34 - error TS2307: Cannot find module '@storyblok/field-plugin/test' or its corresponding type declarations.
Expected behavior
Bootstrapping an empty custom field works as described in the documentation.
Screenshots
I first discovered the problem after following the guide regarding Continuous Delivery:
After doing some debugging I realized that I do not get auto-completion for the test
-helpers package at all:
There is also no test
folder in the distribution release:
Desktop (please complete the following information):
Additional context
I did a bit of debugging into
field-plugin/packages/field-plugin/helpers/build.config.ts
Lines 27 to 36 in 1e8889e
test
-package and the others?Describe the bug
Created a Vue field plugin using monorepo with the cli
To Reproduce
Steps to reproduce the behavior:
Ass simple starter field to log the options
Add options to field-plugin.config.json
<script setup lang="ts">
import { useFieldPlugin } from '@storyblok/field-plugin/vue3';
const plugin = useFieldPlugin()
console.log(plugin);
</script>
{
"options": [
{
"name": "option",
"value": "value"
}
]
}
Expected behavior
Expect to log the options but it is emty
Desktop (please complete the following information):
Additional context
Using the sandbox I also see no default options are set
Is your feature request related to a problem? Please describe.
To ensure smooth QA process, we have a need to share the sandbox URLs to other people with the settings preserved, hence it is not possible to have it now, which makes it inconvenient to share link and share what to enter to settings to test out different look or configuration of the plugin for QA or other developers.
Describe the solution you'd like
A clear and concise description of what you want to happen.
Whenever anything changes in "Settings" (manifest / translatable toggle / language) changes, preserve the state in URL query parameters.
Additional context
Is your feature request related to a problem? Please describe.
When I create a new field type plugin, I have no possibility to deliver e.g. texts, labels, descriptions, buttons in the language of the user, because I do not know the interface language of the user.
Describe the solution you'd like
Maybe add the storyblok interface language from the user to the message that the field type wrapper (parent) sends to the field type (child) via postMessage(). Now you can set the interface language in the Vue or React app and add the correct translations. If the language does not exist in the field plugin you can set a fallback.
Describe the bug
Create fails for pnpm due to missing version constraint for the package manager field in the package.json
Error:
✖ Running `pnpm install`..
file:///Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/execa/lib/error.js:59
error = new Error(message);
^
Error: Command failed with exit code 1: pnpm install
Usage Error: Invalid package manager specification in ../../package.json; expected a semver version
$ pnpm ...
at makeError (file:///Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/execa/lib/error.js:59:11)
at handlePromise (file:///Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/execa/index.js:119:26)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async S (/Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/@storyblok/field-plugin-cli/dist/main.cjs:1:1594)
at async R (/Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/@storyblok/field-plugin-cli/dist/main.cjs:7:885)
at async Pe (/Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/@storyblok/field-plugin-cli/dist/main.cjs:15:77)
at async Te (/Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/@storyblok/field-plugin-cli/dist/main.cjs:17:401)
at async Command.<anonymous> (/Users/xxx/.npm/_npx/ca700ea613ccf9d4/node_modules/@storyblok/field-plugin-cli/dist/main.cjs:20:3468) {
shortMessage: 'Command failed with exit code 1: pnpm install',
command: 'pnpm install',
escapedCommand: 'pnpm install',
exitCode: 1,
signal: undefined,
signalDescription: undefined,
stdout: 'Usage Error: Invalid package manager specification in ../../package.json; expected a semver version\n' +
'\n' +
'$ pnpm ...',
stderr: '',
failed: true,
timedOut: false,
isCanceled: false,
killed: false
}
To Reproduce
Steps to reproduce the behavior:
npx @storyblok/field-plugin-cli@latest
Expected behavior
Pnpm install starts and succeds.
Desktop (please complete the following information):
Is your feature request related to a problem? Please describe.
There is a way to publish (creates new or updates existing one), but there is no way to delete plugins via CLI, hence only via admin panel.
Describe the solution you'd like
Add possibility to delete plugin by name (or id (?), but name makes more sense as the publishing happens by stating the name) via CLI
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.