goldnead / statamic-collapse-fieldtype Goto Github PK
View Code? Open in Web Editor NEWA Collapse-Fieldtype for Statamic to beautifully hide and show your fields.
License: MIT License
A Collapse-Fieldtype for Statamic to beautifully hide and show your fields.
License: MIT License
The field does not work when I nest an Entries
field type inside of it. It throws JS console errors (the same one multiple times).
Now I'm no expert, but it seems that Statamic can no longer 'find' the items I linked in the Entries field, maybe because they are nested in the Collapse field?
Is this a known issue or perhaps intended behavior or a bug?
The console error:
TypeError: Cannot read properties of undefined (reading 'map')
at a.items (RelationshipInput.vue:155:1)
at fn.get (vue.common.prod.js:6:26596)
at fn.evaluate (vue.common.prod.js:6:27746)
at a.items (vue.common.prod.js:6:29650)
at a.<anonymous> (RelationshipInput.vue:1:180)
at e._render (vue.common.prod.js:6:35309)
at a.r (vue.common.prod.js:6:67998)
at fn.get (vue.common.prod.js:6:26596)
at fn.run (vue.common.prod.js:6:27480)
at cn (vue.common.prod.js:6:25588)
Love this initiative!
One issue though. When I config the fields within the 'collapse fieldtype' as clearable they are not removed after I cleared them.
Normal behavior is that fields with no value in them are cleared from the content Yaml file (When 'allways save' is off which is the default).
Now my empty 'images' have {} and my 'select fields' have 'null' instead of them disappearing all the way.
To complete my information, my fields are added from a existing fieldset and one or two solo fields (mostly selects)
Additional question/wish:
Fields within the collapsed field are now grouped within that field. This could be an issue when using the 'Collapsed field' as an 'upgrade' on existing content (templates have to be updated too). An option to leave them ungrouped at the base level would be nice.
Keep up the good work!
pssssst: a tabbed interface would be nice too!
When a replicator field is placed inside a collapse field, the replicator contents fail to load when the collapse field is expanded.
I believe this is the same as the grid behavior pointed out in issue #1
The set up in the provided image is a single default collapse field, containing a single default replicator, containing a single default input field (by default field I mean, no changes were made after adding the field).
(EDIT: This is a really nice add-on. The fact that you built and shared it is greatly appreciated!)
Here is the yaml file for the blueprint in the screenshot:
tabs:
main:
display: Main
sections:
-
display: 'Collapse Replicator Test'
fields:
-
handle: collapse_field
field:
fields:
-
handle: replicator_field
field:
collapse: false
previews: true
fullscreen: true
sets:
new_set_group:
display: 'New Set Group'
instructions: null
icon: null
sets:
new_set:
display: 'New Set'
instructions: null
icon: null
fields:
-
handle: text_field
field:
input_type: text
antlers: false
type: text
display: 'Text Field'
listable: hidden
instructions_position: above
visibility: visible
replicator_preview: true
hide_display: false
type: replicator
display: 'Replicator Field'
listable: hidden
instructions_position: above
visibility: visible
replicator_preview: true
hide_display: false
type: collapse
display: 'Collapse Field'
listable: hidden
instructions_position: above
visibility: visible
replicator_preview: true
hide_display: false
By design this field behaves like any other structured field such as a grid or a replicator fieldtype. This means, any saved data will be grouped like this:
any_field: "some data"
collapse_field:
field_inside: "some data"
This might not be the intended behavior. I'll have a look into this and reevaluate if this might be a feature that would be possible in future.
My aim is to pack the settings in the collapse. These settings should then be considered in the partials.
For example, whether the type is a job or a blog. Then, in the partial, I want to check the type and show or hide fields accordingly.
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.