@dcodegroup-au/page-builder 0.2.7 → 0.2.9

package/example/src/App.vue

@@ -1,681 +1,6 @@
 <script setup>
-const page = {
-  id: 1,
-  title: "Page Builder",
-  sections: [
-    {
-      title: "Hero header",
-      type: "header",
-      components: [
-        {
-          name: "Sliders",
-          type: "sliders",
-          supportive_text: "Manage the slides in the slider.",
-          max_items: 5,
-          public: true,
-          data: [
-            {
-              title: "About ELAA",
-              description: "ELAA is a non-profit peak body championing excellence in Early Childhood Education and Care. They work collaboratively with members, partners, and all levels of government to develop solutions ensuring equity and excellence in our sector.",
-              public: true,
-              featured_image: 'https://www.gstatic.com/webp/gallery/1.jpg',
-              primary_button: {
-                show: true,
-                label: 'Join ELAA',
-                url: 'google.com', // external could be an url
-                type: 'site-content',
-                is_new_tab: true,
-              },
-              secondary_button: {
-                show: true,
-                label: 'Learn about ELAA',
-                url: 'facebook.com', // external could be an url
-                type: 'site-content',
-                open_in_new_tab: true,
-              },
-            },
-            {
-              title: "Best Life Evening Leadership Series",
-              description: "ELAA a live keynote address from Professor Joce Nuttall, who has over 40 years of experience as a leader, educator and researcher in early childhood settings ",
-              public: true,
-              featured_image: 'https://www.gstatic.com/webp/gallery/2.jpg',
-              primary_button: {
-                show: false,
-                label: 'Apply now ELAA',
-                url: 'facebook.com', // external could be an url
-                type: 'site-content',
-                is_new_tab: true,
-              },
-              secondary_button: {
-                show: true,
-                label: 'Construct ELAA',
-                url: 'facebook.com', // external could be an url
-                type: 'site-content',
-                open_in_new_tab: true,
-              },
-            },
-            {
-              title: "Early Childhood Education",
-              description: "In light of the recent investigations into the Early Childhood Education and Care (ECEC) sector, we want to acknowledge the emotional toll this coverage may have had on members of our community. ",
-              public: true,
-              featured_image: 'https://www.gstatic.com/webp/gallery/4.jpg',
-              primary_button: {
-                show: true,
-                label: 'Apply To Dcodegroup',
-                url: 'facebook.com', // external could be an url
-                type: 'site-content',
-                is_new_tab: true,
-              },
-              secondary_button: {
-                show: true,
-                label: 'Construct Dcodegroup',
-                url: 'admin', // external could be an url
-                type: 'site-content',
-                open_in_new_tab: true,
-              },
-            },
-            {
-              title: "Image Credits",
-              description: "The images on this page come from a number of different sources. We have selected some delightful and rich pictures to showcase qualities of WebP.",
-              public: true,
-              featured_image: 'https://www.gstatic.com/webp/gallery/5.webp',
-              primary_button: {
-                show: true,
-                label: 'Apply To Image Credits',
-                url: '/admin', // external could be an url
-                type: 'site-content',
-                is_new_tab: true,
-              },
-              secondary_button: {
-                show: true,
-                label: 'Construct Image Credits',
-                url: '/admin', // external could be an url
-                type: 'site-content',
-                open_in_new_tab: true,
-              },
-            },
-          ]
-        },
-        {
-          name: "Links",
-          type: "links",
-          supportive_text: "Manage the links.",
-          max_items: 7,
-          data: [
-            {
-              title: "Privacy Policy",
-              url: '/admin', // external could be an url
-              type: 'site-content',
-              open_in_new_tab: true,
-            },
-            {
-              title: "Google",
-              url: 'https://google.com', // external could be an url
-              type: 'external-page',
-              open_in_new_tab: true,
-            }
-          ]
-        }
-      ]
-    },
-    {
-      title: "Logo cloud",
-      type: "logo",
-      display: "horizontal",
-      components: [
-        {
-          name: "Section header",
-          type: "header",
-          supporting_text: "ELAA is proudly supporting",
-        },
-        {
-          id: 2,
-          name: "Logos",
-          type: "logos",
-          max_items: 7,
-          height: 'medium',
-          data: [
-            {
-              url: "https://childroadsafety.org.au/",
-              logo: "https://beta-frontend.elaa.org.au/img/logos/starting_out_safely.png",
-            },
-            {
-              url: "https://carseatssavelives.com.au/",
-              logo: "https://beta-frontend.elaa.org.au/img/logos/car_seats_save_lives.jpg",
-            }
-          ]
-        }
-      ]
-    },
-    {
-      title: "Vertical tabs module",
-      type: "tabs",
-      components: [
-        {
-          name: "Section header",
-          type: "header",
-          title: 'Rich with resources',
-          center: true,
-          dark: true,
-          supporting_text: 'Comprehensive free and paid resources covering every aspect of early childhood education.',
-        },
-        {
-          name: "Vertical tabs",
-          type: "vertical_tabs",
-          supportive_text: "Manage the tabs",
-          max_items: 5,
-          public: true,
-          data: [
-            {
-              title: "Free Downloadable Resources",
-              description: "Explore a variety of no-cost tools and information available to everyone.",
-              public: true,
-              featured_image: 'https://beta-frontend.elaa.org.au/img/homepage/asset_free_resources.png',
-              primary_button: {
-                show: true,
-                name: 'Linked to',
-                label: 'View all',
-                url: 'google.com', // external could be an url
-                type: 'external-page',
-                is_new_tab: true,
-              },
-            },
-            {
-              title: "Paid Resources & Subscriptions",
-              description: "Access premium content and exclusive materials with our subscription services.",
-              public: true,
-              featured_image: 'https://beta-frontend.elaa.org.au/img/homepage/asset_paid_resources.png',
-              primary_button: {
-                show: true,
-                name: 'Linked to',
-                label: 'View all',
-                url: 'http://google.com', // external could be an url
-                type: 'external-page',
-                is_new_tab: true,
-              },
-            },
-            {
-              title: "Video Library",
-              description: "Watch quick, informative videos (10-15 mins each) available for free.",
-              public: true,
-              featured_image: 'https://beta-frontend.elaa.org.au/img/homepage/asset_video.png',
-              primary_button: {
-                show: true,
-                name: 'Linked to',
-                label: 'View all',
-                url: 'google.com', // external could be an url
-                type: 'external-page',
-                is_new_tab: true,
-              },
-            },
-            {
-              title: "Self-paced Modules",
-              description: "Engage with our flexible, on-demand training modules at your own pace.",
-              public: true,
-              featured_image: 'https://beta-frontend.elaa.org.au/img/homepage/asset_self_paced.png',
-              primary_button: {
-                show: true,
-                name: 'Linked to',
-                label: 'View all',
-                url: 'google.com', // external could be an url
-                type: 'external-page',
-                is_new_tab: true,
-              },
-            },
-          ]
-        }
-      ]
-    },
-    {
-      title: "Logo cloud",
-      type: "logo",
-      display: "vertical",
-      components: [
-        {
-          name: "Section header",
-          type: "header",
-          supporting_text: "ELAA’s preferred partners offer special benefits to ELAA members and support ELAA’s activities",
-        },
-        {
-          id: 2,
-          name: "Logos",
-          type: "logos",
-          max_items: 7,
-          height: 'small',
-          data: [
-            {
-              url: "/",
-              logo: "https://beta-frontend.elaa.org.au/img/logos/anzuk.png",
-            },
-            {
-              url: "/",
-              logo: "https://beta-frontend.elaa.org.au/img/logos/bunnings.png",
-            },
-            {
-              url: "/",
-              logo: "https://beta-frontend.elaa.org.au/img/logos/hesta.png",
-            }, {
-              url: "/",
-              logo: "",
-            }
-          ]
-        }
-      ]
-    },
-    {
-      title: "Collection grid",
-      type: "collection_grid",
-      components: [
-        {
-          name: "Section header",
-          type: "header",
-          title: 'News',
-          dark: true,
-          center: true,
-          supporting_text: 'Stay Informed with the Latest Developments in Early Education',
-        },
-        {
-          name: "Grid",
-          type: "news_grid",
-          button: {
-            title: 'View all news',
-            url: 'google.com', // external could be an url
-            type: 'external-page',
-            is_new_tab: true,
-            show: true,
-          },
-          content: {
-            label: 'Content',
-            supportive_text: 'This grid will be automatically populated with the latest three news items.',
-            items: [
-              {
-                image: "https://beta-frontend.elaa.org.au/img/news/news_1.jpg",
-                categories: [{
-                  name: 'Wages, IR and Governance',
-                  style: 'navy',
-                }],
-                link: "https://example.com",
-                title: "Fair Work Laws changes for casual employment",
-                dateTime: "10 Sep 2024",
-              },
-              {
-                image: "https://beta-frontend.elaa.org.au/img/news/news_2.jpg",
-                categories: [{
-                  name: 'Member Benefits',
-                  style: 'brand',
-                }],
-                link: "https://example.com",
-                title: "ELAA renews its partnership with Bunnings for another year: make the most of your Bunnings PowerPass membership benefits",
-                dateTime: "09 Sep 2024",
-              },
-              {
-                image: "https://beta-frontend.elaa.org.au/img/news/news_3.jpg",
-                categories: [{
-                  name: 'Advocacy',
-                  style: 'orange',
-                }],
-                link: "https://example.com",
-                title: "Meet our Best Start Best Life (BSBL) Reform and Engagement Advisor Leanne Rodriguez",
-                dateTime: "08 Sep 2024",
-              },
-            ]
-          }
-        },
-        {
-          name: "Grid",
-          type: "video_grid",
-          max_items: 3,
-          data: [
-            {
-              video: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerFun.mp4",
-            },
-            {
-              video: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4",
-            },
-            {
-              video: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerEscapes.mp4",
-            }
-          ]
-        }
-      ]
-    },
-    {
-      title: "Collection carousel",
-      type: "collection_carousel",
-      has_background: true,
-      components: [
-        {
-          name: "Section header",
-          type: "header",
-          title: 'Upcoming Events',
-          dark: true,
-          supporting_text: 'Don\'t Miss Our Upcoming Activities and Gatherings in Early Education.',
-        },
-        {
-          name: "Carousel",
-          type: "carousel",
-          button: {
-            title: 'View all events',
-            url: 'google.com', // external could be an url
-            type: 'external-page',
-            is_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: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_1.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: 'Free',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-              {
-                type: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_2.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: '$395 <span style="font-weight: lighter;">(Members)</span> <br> $495 <span style="font-weight: lighter;">(Non-Members)</span>',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-              {
-                type: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_3.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: 'Free',
-                button_title: 'Free',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-              {
-                type: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_1.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: 'Free',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-              {
-                type: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_2.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: '$395 <span style="font-weight: lighter;">(Members)</span> <br> $495 <span style="font-weight: lighter;">(Non-Members)</span>',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-              {
-                type: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_2.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: '$395 <span style="font-weight: lighter;">(Members)</span> <br> $495 <span style="font-weight: lighter;">(Non-Members)</span>',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-              {
-                type: 'event',
-                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.',
-                image: 'https://beta-frontend.elaa.org.au/img/events/event_2.jpg',
-                tags: ['Governance', 'CEO&Leadership', 'Zoom webinar'],
-                line_1: 'June 20 @ 12:30 pm - 1:15 pm AEST',
-                line_2: '$395 <span style="font-weight: lighter;">(Members)</span> <br> $495 <span style="font-weight: lighter;">(Non-Members)</span>',
-                primary_button: {
-                  icon: 'plus',
-                  title: 'Register',
-                  url: 'google.com'
-                },
-                secondary_button: {
-                  title: 'Learn more',
-                  url: 'google.com'
-                },
-              },
-            ]
-          }
-        },
-      ]
-    },
-    {
-      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',
-            is_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: "Quick links",
-      type: "quick_links",
-      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 10 links.",
-          max_items: 10,
-          data: [
-            {
-              title: "Advisory Services",
-              url: '/admin', // external could be an url
-              type: 'site-content',
-              open_in_new_tab: true,
-            },
-            {
-              title: "Capability Assessment Support Service",
-              url: 'https://google.com', // external could be an url
-              type: 'external-page',
-              open_in_new_tab: true,
-            },
-            {
-              title: "Consultancy Services",
-              url: 'https://google.com', // external could be an url
-              type: 'external-page',
-              open_in_new_tab: true,
-            },
-            {
-              title: "Payroll Calculations",
-              url: 'https://google.com', // external could be an url
-              type: 'external-page',
-              open_in_new_tab: true,
-            },
-            {
-              title: "VECTEA 2024",
-              url: 'https://google.com', // external could be an url
-              type: 'external-page',
-              open_in_new_tab: true,
-            }
-          ]
-        }
-      ]
-    },
-  ]
-};
+import {Home} from "./pages/Home.js";
+import {BestLife} from "./pages/BestLife.js";
 
 const slide = {
   title: "About ELAA",
@@ -713,6 +38,33 @@ const tab = {
   },
 }
 
+const timelineItem = {
+  title: "2025",
+  group_title: "2025",
+  max_items: 5,
+  lines: [
+    {
+      title: "Free Downloadable Resources",
+      description: "Explore a variety of no-cost tools and information available to everyone.",
+    }
+  ]
+}
+
+const linkCardItem = {
+  title: "2025",
+  description: "2025",
+  public: true,
+  icon: 'XCircle',
+  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',
+    is_new_tab: true,
+  },
+}
+
 const sites = [
   {
     name: "Site 1",
@@ -723,25 +75,34 @@ const sites = [
     href: "/site-2",
   }
 ]
+
+const breadcrumbs = [
+  'Site 1',
+  'Site 2',
+]
 </script>
 
 <template>
   <div>
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Page Render</h1>
-      <PageRender :page="page"/>
+      <PageRender :page="BestLife"/>
     </div>
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Slider Edit</h1>
       <ItemEdit :item="slide" :sites="sites"/>
     </div>
+    <div style="margin: 40px 0">
+      <h1 style="margin-bottom: 20px; font-size: 50px;">Link Card Edit</h1>
+      <LinkCardEdit :item="linkCardItem" :sites="sites"/>
+    </div>
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Vertical Tab Edit</h1>
       <ItemEdit :item="tab" :sites="sites"/>
     </div>
     <div style="margin: 40px 0">
       <h1 style="margin-bottom: 20px; font-size: 50px;">Page Builder</h1>
-      <PageBuilder v-model="page"/>
+      <PageBuilder v-model="BestLife" :breadcrumbs="breadcrumbs"/>
     </div>
   </div>
 </template>