@dcodegroup-au/page-builder 0.5.2 → 0.5.4

package/example/src/App.vue

@@ -9,6 +9,8 @@ import {ChildSafeStandard} from "./pages/ChildSafeStandard.js";
 import {AdvisoryServices} from "./pages/AdvisoryService.js";
 import {PartnerWithUs} from "./pages/PartnerWithUs.js";
 import {OurGroups} from "./pages/OurGroups.js";
+import {Vectea2024} from "./pages/Vectea2024.js";
+import {AdvocaryAndResearch} from "./pages/AdvocaryAndResearch.js";
 
 const slide = {
   title: "About ELAA",
@@ -92,10 +94,10 @@ const breadcrumbs = [
 
 <template>
   <div>
-    {{ JSON.stringify(OurGroups) }}
+    {{ JSON.stringify(Vectea2024) }}
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Page Render</h1>
-      <PageRender :page="OurGroups"/>
+      <PageRender :page="AdvocaryAndResearch"/>
     </div>
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Slider Edit</h1>
@@ -111,7 +113,7 @@ const breadcrumbs = [
     </div>
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Page Builder</h1>
-      <PageBuilder v-model="OurGroups" :breadcrumbs="breadcrumbs"/>
+      <PageBuilder v-model="AdvocaryAndResearch" :breadcrumbs="breadcrumbs"/>
     </div>
   </div>
 </template>

package/example/src/pages/AdvocaryAndResearch.js

@@ -0,0 +1,337 @@
+export const AdvocaryAndResearch =
+  {
+  title: "Advocacy and Research",
+  sections: [
+    {
+      title: "Standard header",
+      type: "standard_header",
+      components: [
+        {
+          name: "Standard header",
+          type: "header",
+          title: "Advocacy & Research",
+          supporting_text_max_length: 500,
+          supporting_text: "The Victorian Early Childhood Teachers and Educators Agreement (VECTEA) is an enterprise agreement that applies to early childhood teachers and educators employed in kindergarten education programs in Victoria.",
+        },
+      ]
+    },
+    {
+      title: "Callout Section",
+      type: "callout",
+      components: [
+        {
+          name: "Callout Section",
+          type: "callout",
+          title: "Our Vision",
+          has_extra: true,
+          title_label: "Eyebrow heading",
+          supporting_text: "Excellence and equity in early childhood education and care",
+          supporting_text_label: "Message *",
+          supporting_text_max_length: 500,
+          featured_image: "https://beta-frontend.elaa.org.au/img/what-we-do/strategy.png"
+        },
+      ]
+    },
+    {
+      title: "Bullet Points Section",
+      type: "bullet_points",
+      has_background: true,
+      margin: true,
+      two_column: true,
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: "Addressing Section Challenges",
+          icon: "AlertCircle",
+          supporting_text: "ELAA has developed a grass roots understanding of the value and challenges presented by early childhood education. We share our members’ passion for delivering excellence in early learning to children before they commence school, and we help them to do this by providing professional support and resources on a wide range of matters including:",
+        },
+        {
+          name: "Bullet Points",
+          type: "bullet_points",
+          supportive_text: "This section can contain up to 10 items.",
+          title: "Our key areas of focus are:",
+          max_items: 10,
+          has_type_switcher: false,
+          max_title: 500,
+          data: [
+            {
+              title: "Read more about our history 1",
+            },
+            {
+              title: "Read more about our history 2",
+            },
+            {
+              title: "Read more about our history 3",
+            },
+            {
+              title: "Read more about our history 4",
+            },
+          ]
+        }
+      ]
+    },
+    {
+      title: "Bullet Points Section",
+      type: "bullet_points",
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: "Why Partner with ELAA?",
+          featured_image: "https://beta-frontend.elaa.org.au/img/what-we-do/advocacy-research.png",
+        },
+        {
+          name: "Bullet Points",
+          type: "bullet_points",
+          supportive_text: "This section can contain up to 10 items.",
+          has_type_switcher: false,
+          max_items: 10,
+          max_title: 500,
+          data: [
+            {
+              title: "We are uniquely placed to raise your business profile in the ECEC sector",
+            },
+            {
+              title: "Work with a values based peak body who are trusted by their members.",
+            },
+            {
+              title: "We actively work with our partners, developing flexible tailored approaches to maximise your return on investment.",
+            },
+            {
+              title: "We have a dedicated, largely female audience – and we know what works for them.",
+            },
+          ]
+        }
+      ]
+    },
+    {
+      title: "Collection carousel",
+      type: "collection_carousel",
+      has_background: false,
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: 'Our Submission',
+          dark: true,
+          supporting_text: null,
+        },
+        {
+          name: "Carousel",
+          type: "carousel",
+          button: {
+            title: 'View all submissions',
+            url: 'google.com', // external could be an url
+            type: 'external-page',
+            open_in_new_tab: true,
+          },
+          content: {
+            label: 'Content',
+            supportive_text: 'This carousel will be automatically populated with all upcoming events. This section will be hidden if there’s no upcoming events.',
+            items: [
+              {
+                type: 'submission',
+                title: 'Change Management – Drop in session',
+                description: 'This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector. This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector.',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+              {
+                type: 'submission',
+                title: 'Let’s start making sense of OHS: Safety – not child’s play',
+                description: 'This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector.',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+              {
+                type: 'submission',
+                title: 'DE Regional Governance Training Session',
+                description: 'Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector.',
+                button_title: 'Free',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+              {
+                type: 'submission',
+                title: 'Change Management – Drop in session 2',
+                description: 'This face to face event is specifically designed for those responsible for the management of OHS in early childhood services.',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+              {
+                type: 'submission',
+                title: 'Let’s start making sense of OHS: Safety – not child’s play 2',
+                description: 'This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector.',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+              {
+                type: 'submission',
+                title: 'Let’s start making sense of OHS: Safety – not child’s play 3',
+                description: 'This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector.',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+              {
+                type: 'submission',
+                title: 'Let’s start making sense of OHS: Safety – not child’s play 4',
+                description: 'This face to face event is specifically designed for those responsible for the management of OHS in early childhood services. Guidance on how to manage risks by addressing the most common hazards faced by the early childhood sector.',
+                primary_button: {
+                  icon: 'plus',
+                  title: 'Read submmission',
+                  url: 'google.com'
+                },
+                secondary_button: {
+                  title: 'Learn more',
+                  url: 'google.com'
+                },
+              },
+            ]
+          }
+        }
+      ]
+    },
+    {
+      title: "Link card section",
+      type: "link_card",
+      display: "vertical",
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: "ELAA Supports",
+          supporting_text: "Excellence and equity in early childhood education and care",
+        },
+        {
+          name: "Link cards",
+          type: "link_cards",
+          supportive_text: "Manage the link cards.",
+          max_items: 4,
+          data: [
+            {
+              title: "Read more about our history",
+              icon: "AlertCircle",
+              public: true,
+              primary_button: {
+                show: true,
+                name: 'Button',
+                label: 'Join ELAA',
+                url: 'https://beta-frontend.elaa.org.au/img/homepage/asset_free_resources.png', // external could be an url
+                type: 'external-page',
+                open_in_new_tab: false,
+              }
+            },
+            {
+              title: "Read more about our history",
+              public: true,
+              icon: 'AlignLeft01',
+              primary_button: {
+                show: true,
+                name: 'Button',
+                label: 'Learn more',
+                url: '', // external could be an url
+                type: 'external-page',
+                open_in_new_tab: true,
+              }
+            },
+            {
+              title: "Read more about our history",
+              public: true,
+              icon: 'AlignLeft01',
+              primary_button: {
+                show: true,
+                name: 'Button',
+                label: 'Learn more',
+                url: '', // external could be an url
+                type: 'external-page',
+                open_in_new_tab: true,
+              }
+            },
+            {
+              title: "Read more about our history",
+              public: true,
+              icon: 'AlignLeft01',
+              primary_button: {
+                show: true,
+                name: 'Button',
+                label: 'Email us',
+                url: 'https://beta-frontend.elaa.org.au/img/homepage/asset_free_resources.png', // external could be an url
+                type: 'external-page',
+                open_in_new_tab: true,
+              }
+            },
+          ]
+        }
+      ]
+    },
+    {
+      title: "Quick links",
+      type: "quick_links",
+      as_cta: true,
+      components: [
+        {
+          type: "header",
+          title: 'Services',
+          supporting_text: 'Our knowledge and expertise of the early childhood sector enables ELAA to provide expert professional advice and support.',
+        },
+        {
+          name: "Link grid",
+          type: "link_grid",
+          supportive_text: "This section can contain up to 5 links.",
+          max_items: 5,
+          data: [
+            {
+              title: "Advisory Services",
+              url: '/admin', // external could be an url
+              type: 'site-content',
+              open_in_new_tab: true,
+            },
+          ]
+        }
+      ]
+    },
+  ]
+};

package/example/src/pages/Vectea2024.js

@@ -0,0 +1,205 @@
+export const Vectea2024 =
+  {
+  title: "VECTEA 2024",
+  sections: [
+    {
+      title: "Standard header",
+      type: "standard_header",
+      components: [
+        {
+          name: "Standard header",
+          type: "header",
+          title: "VECTEA 2024",
+          supporting_text_max_length: 500,
+          supporting_text: "The Victorian Early Childhood Teachers and Educators Agreement (VECTEA) is an enterprise agreement that applies to early childhood teachers and educators employed in kindergarten education programs in Victoria.",
+        },
+      ]
+    },
+    {
+      title: "Paragraph section",
+      type: "paragraph",
+      components: [
+        {
+          name: "Paragraph section",
+          type: "paragraph",
+          title: "ELAA is proudly supporting",
+          paragraph: '<p>The Victorian Government’s Best Start, Best Life reforms represent the most substantial transformation in Victoria’s early childhood sector in a generation. As part of these reforms:</p><ol><li data-list=\\"bullet\\"><span class=\\"ql-ui\\" contenteditable=\\"false\\"></span>The Three-Year-Old Kindergarten program will expand, reaching 15 hours per week across the state by 2029.</li><li data-list=\\"bullet\\"><span class=\\"ql-ui\\" contenteditable=\\"false\\"></span>The Four-Year-Old Kindergarten program will evolve into Pre-Prep, with weekly hours increasing from 15 to 30 by 2036 throughout Victoria.</li></ol><p>Extending the hours of teacher-led, play-based learning through Pre-Prep in the year before school provides children with enhanced access to the numerous benefits of early childhood education. Pre-Prep will launch in 2025, starting with children in six regional Victorian local government areas, and will gradually expand across the state.</p>',
+          featured_image: "https://beta.elaa.org.au/img/what-we-do/vectea-2024/01.jpg",
+        },
+      ]
+    },
+    {
+      title: "Link card section",
+      type: "link_card",
+      display: "vertical",
+      no_background: true,
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: "ELAA Supports",
+        },
+        {
+          name: "Link cards",
+          type: "link_cards",
+          supportive_text: "Manage the link cards.",
+          max_items: 4,
+          data: [
+            {
+              title: "Read more about our history",
+              description: "Happy Birthday ELAA – celebrating 30 years of service to members",
+              icon: "AlertCircle",
+              public: true,
+              primary_button: {
+                show: true,
+                name: 'Button',
+                label: 'Learn more',
+                url: 'https://beta-frontend.elaa.org.au/img/homepage/asset_free_resources.png', // external could be an url
+                type: 'external-page',
+                open_in_new_tab: false,
+              }
+            },
+            {
+              title: "Read more about our history",
+              description: "Happy Birthday ELAA – celebrating 30 years of service to members",
+              public: true,
+              icon: 'AlignLeft01',
+              primary_button: {
+                show: true,
+                name: 'Button',
+                label: 'Learn more',
+                url: 'https://beta-frontend.elaa.org.au/img/homepage/asset_free_resources.png', // external could be an url
+                type: 'external-page',
+                open_in_new_tab: true,
+              }
+            },
+          ]
+        }
+      ]
+    },
+    {
+      title: "Bullet Points Section",
+      type: "bullet_points",
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: "Why Partner with ELAA?",
+          featured_image: "https://beta.elaa.org.au/img/what-we-do/vectea-2024/02.jpg",
+        },
+        {
+          name: "Bullet Points",
+          type: "bullet_points",
+          supportive_text: "This section can contain up to 10 items.",
+          has_type_switcher: false,
+          max_items: 10,
+          max_title: 500,
+          data: [
+            {
+              title: "We are uniquely placed to raise your business profile in the ECEC sector",
+            },
+            {
+              title: "Work with a values based peak body who are trusted by their members.",
+            },
+            {
+              title: "We actively work with our partners, developing flexible tailored approaches to maximise your return on investment.",
+            },
+            {
+              title: "We have a dedicated, largely female audience – and we know what works for them.",
+            },
+          ]
+        }
+      ]
+    },
+    {
+      title: "Bullet Points Section",
+      type: "bullet_points",
+      has_background: true,
+      components: [
+        {
+          revert: true,
+          name: "Section header",
+          type: "header",
+          title: "Benefits for teaching staff",
+          supporting_text: "The VECTEA has delivered significantly improved pay and conditions for teachers compared to teachers on the industry (modern) award, enabling kindergartens to retain their superior quality ratings.\n" +
+            "\n" +
+            "Some of the beneficial employment conditions of the VECTEA 2020 for teachers and educators include:​",
+          featured_image: "https://beta.elaa.org.au/img/what-we-do/vectea-2024/03.jpg",
+        },
+        {
+          name: "Bullet Points",
+          type: "bullet_points",
+          supportive_text: "This section can contain up to 10 items.",
+          has_type_switcher: false,
+          max_items: 10,
+          max_title: 500,
+          data: [
+            {
+              title: "extended planning time to support quality programming ​ (30 minutes per teaching hour for early childhood teachers (ECT) and 15 minutes per teaching hour for educators)",
+            },
+            {
+              title: "10 weeks of paid annual leave (term break leave)",
+            },
+            {
+              title: "16 weeks of employer-paid parental leave for primary caregivers",
+            },
+            {
+              title: "We actively work with our partners, developing flexible tailored approaches to maximise your return on investment.",
+            },
+            {
+              title: "We have a dedicated, largely female audience – and we know what works for them.",
+            },
+          ]
+        }
+      ]
+    },
+    {
+      title: "FAQs Section",
+      type: "faqs",
+      components: [
+        {
+          name: "Section header",
+          type: "header",
+          title: 'Frequently asked questions',
+          supporting_text: 'Frequently Asked Questions for Committees and Managers',
+        },
+        {
+          name: "FAQs",
+          type: "feature_items",
+          supportive_text: "This section can contain up to 10 items.",
+          has_type_switcher: false,
+          max_items: 50,
+          max_title: 500,
+          data: [
+            {
+              has_extra: true,
+              as_item: true,
+              title: "What is an enterprise agreement? Is this the same as an award?",
+              supporting_text: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Dignissimos quaerat sed minus maiores dolorem consectetur quibusdam harum itaque deserunt at eligendi qui illum praesentium odit sit, voluptates nobis expedita?",
+            },
+            {
+              has_extra: true,
+              as_item: true,
+              title: "What is an enterprise agreement? Is this the same as an award?",
+              supporting_text: "The last scheduled salary increase under VECTEA 2020, along with its corresponding agreements, was in April 2024. During the re-negotiation period, current salaries established under VECTEA 2020 will continue to be in effect. \n" +
+                "Future salary increases under a new VECTEA 2024 will take effect once the Fair Work Commission approves the new agreement.\n" +
+                "ELAA will continue to release Wage Bulletins every July for the VECTEA 2020. During this period, salaries of certain VECTEA classifications may be updated in accordance with increases to the underpinning modern awards.",
+            },
+            {
+              has_extra: true,
+              as_item: true,
+              title: "We actively work with our partners, developing flexible tailored approaches to maximise your return on investment.",
+              supporting_text: "This section can contain up to 10 items.",
+            },
+            {
+              has_extra: true,
+              as_item: true,
+              title: "We have a dedicated, largely female audience – and we know what works for them.",
+              supporting_text: "This section can contain up to 10 items.",
+            },
+          ]
+        }
+      ]
+    },
+  ]
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcodegroup-au/page-builder",
-  "version": "0.5.2",
+  "version": "0.5.4",
   "exports": {
     ".": {
       "import": "./dist/page-builder.es.js"

package/src/assets/svg/left_vector.svg

@@ -0,0 +1,3 @@
+<svg width="435" height="266" viewBox="0 0 435 266" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M201.971 -102.931C292.729 -67.7545 395.68 -30.0658 424.539 62.8945C454.76 160.245 410.669 267.688 339.758 340.914C276.809 405.918 180.85 413.635 90.5516 407.784C10.8181 402.617 -65.3177 373.252 -115.884 311.388C-166.322 249.681 -181.838 169.034 -168.875 90.3974C-154.991 6.17807 -120.61 -79.6055 -44.9217 -119.063C32.0201 -159.174 121.066 -134.289 201.971 -102.931Z" fill="#78BDB5"/>
+</svg>

package/src/components/PageRender.vue

@@ -26,6 +26,7 @@ import LinkList from "@/components/presenters/modules/LinkList.vue";
 import BulletPoints from "@/components/presenters/modules/BulletPoints.vue";
 import Callout from "@/components/presenters/modules/Callout.vue";
 import ContactUs from "@/components/presenters/modules/ContactUs.vue";
+import FAQ from "@/components/presenters/modules/FAQ.vue";
 
 const props = defineProps({
   page: {
@@ -50,6 +51,7 @@ const componentMaps = ref({
   bullet_points: markRaw(BulletPoints),
   callout: markRaw(Callout),
   contact_us: markRaw(ContactUs),
+  faqs: markRaw(FAQ),
 });
 
 const currentComponent = (section) => {

package/src/components/builders/Header.vue

@@ -21,14 +21,14 @@
             :label-text="dataRef?.title_label ?? 'Title *'"
             class="w-full mb-4"
             :value="dataRef.title"
-            :limit="51"
+            :limit="100"
         >
           <input
               v-model="dataRef.title"
               name="title"
               type="text"
               placeholder="Title"
-              :maxlength="51"
+              :maxlength="100"
               class="border-1 border-solid border-gray-300 rounded-lg bg-white w-full"
           />
         </input-wrapper>

package/src/components/builders/Links.vue

@@ -2,13 +2,31 @@
   <div class="rounded-xl bg-gray-50 px-6 py-5">
     <div class="flex justify-between pb-2">
       <div class="flex justify-between w-full py-1">
-        <div>
+        <div class="min-w-[50%] w-full">
           <p class="text-lg font-semibold text-gray-900">
             {{ componentData.name }}
           </p>
           <p class="text-sm text-gray-600 mt-1">
             {{ componentData.supportive_text }}
           </p>
+          <input-wrapper
+              v-if="componentData.hasOwnProperty('title')"
+              is-vertical
+              field="title"
+              label-text="Title *"
+              class="w-[50%] my-8"
+              :value="componentData.title"
+              :limit="100"
+          >
+            <input
+                v-model="componentData.title"
+                name="title"
+                type="text"
+                placeholder="Title"
+                :maxlength="100"
+                class="border-1 border-solid border-gray-300 rounded-lg bg-white w-full"
+            />
+          </input-wrapper>
         </div>
         <div>
           <a

package/src/components/builders/NewsGrid.vue

@@ -12,14 +12,14 @@
             label-text="Title *"
             class="w-full mb-4"
             :value="componentData.button.title"
-            :limit="20"
+            :limit="100"
         >
           <input
               v-model="componentData.button.title"
               name="title"
               type="text"
               placeholder="Title"
-              :maxlength="20"
+              :maxlength="100"
               class="border-1 border-solid border-gray-300 rounded-lg bg-white w-full"
           />
         </input-wrapper>