newElementButton and removeElementButton props/schema

[mix359]

Hi, I'm trying to figure out how to set the removeElementButtonLabel and newElementButtonLabel props from the field schema. There's any way? Why they aren't schema properties, like the showRemoveButton?

Shouldn't exist a removeElementButtonLabelClasses like the newElementButtonLabelClasses?

If I make a standard boostrap accordion item container, could I make a PR, to be included? Or a way to structure the component in a way that is compatible with those html/css class structure required by bootstrap & co. That can be an extra component, shipped with this packages, that one can import and assign to the itemContainerComponent.

Thanks Daniele

[gwenaelp]

Hi,

Sorry for the delay of response! All of your ideas are amazing! I am glad to see issues appearing on that fairly new repo!

This component is pretty new and it definitely lacks some options. I wanted to see if it was interesting for the community before implementing more. "removeElementButtonLabelClasses" "removeElementButtonLabel" and "newElementButtonLabel" props are part of those lacking implementations.

Concerning the integration for a bootstrap accordion, if you want to ship it within this repo you might have to add bootstrap as a dependency to this project, am I correct? If it's actually the case I might decline your offer to integrate it directly into this repository, in favor of a standalone repo (but at the end containers like yours can be listed directly into the readme of this repo)

I will review your PR asap and I'll let you know!

Thank you for your interest and glad to receive more issues as you need them!

Gwenael

[gwenaelp]

I merged the PR #3 . I close this issue. Thank you very much!

[besrabasant]

I am not able to set the newElementButtonLabel props.

[mix359]

Hi @besrabasant

The newElementButtonLabel isn't a props of the component... It's a property of the schema of the field. You can check an example here:

https://github.com/gwenaelp/vfg-field-array/blob/master/README.md

If you still have problem using it, please open a new issue with an example of the code you're using.

Cheers Mix

[besrabasant]

I have added the property to the schema as mentioned in the Docs.

 model: {
                options: [],
            },
            schema: {
                fields: [{
                    type: "array",
                    label: "",
                    model: "options",
                    itemContainerComponent: "OptionsFieldContainer",
                    showRemoveButton: true,
                    newElementButtonLabelClasses: "btn btn-solid",
                    newElementButtonLabel: "Add an Option",
                }]
            }

But the button still says + New. the newElementButtonLabelClasses work fine.

[gwenaelp]

I just tried it on a project using this library, it seems to work for me... Can you show me that bug in a jsfiddle maybe? I'm going to work on it if indeed there is a problem.

[besrabasant]

Hey @gwenaelp, Sorry for responding late. Here's a code example with the issue.

Look in App.vue

[mix359]

@besrabasant I've checked your example and is effectively working differently from my projects in a strange way: Looking with the dev tool I can see the newElementButtonLabel is considered a props and not a computed properties as it should be... So probably something is changed in vue or in vfg (I haven't updated that in the last two months)

Saldy at the moment I couldn't investigate more until the next week (I haven't my pc this week). I will check if I have a bit of time ;)

Cheers Mix

[besrabasant]

@mix359 This works perfectly fine in the storybook examples... Can't seem to figure what's the issue.

[besrabasant]

@mix359 I just copied the source files directly into my project and everything works fine... I suppose the issue is with the distribution build.

[gwenaelp]

@besrabasant You might have pinpointed another problem. It might indeed concern the release in npm, or a random build problem. I'm busy at the moment, but i'll try to have a look a it as well next week.

Thanks to both of you @mix359 and @besrabasant for your helpful activity on this project ! :+1:

I'm not as active on github as I would like these days but i'll try to be more present in september at least!

[goatandsheep]

Also, there's no form-control class on input fields. As vfg has a built-in class system to match that of bootstrap, while not coupling itself with it, I think the input fields and others should also be consistent with the vfg classes.