ruidy/React-SaaS-sample
1
0
Fork 0
mirror of https://github.com/rjNemo/React-SaaS-sample synced 2026-06-06 05:06:38 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
React-SaaS-sample/divjoy-project.json
Ruidy Nemausat d501c9d04f template
2019-11-02 20:18:05 +01:00

7017 lines
No EOL
260 KiB
JSON
Raw Blame History

{
"data": [
{
"type": "instance",
"subtype": "app-instance",
"componentId": "app",
"id": 4010090,
"isVisible": true,
"children": []
}
],
"components": [
{
"type": "component",
"name": "Navbar",
"id": 9215568,
"children": [
{
"type": "instance",
"componentId": 3871614,
"attributes": "{\n\tspaced: props.spaced,\n color: props.color\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"navbar-brand"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"navbar-item"
],
"children": [
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: '/' \n}",
"children": [
{
"type": "element",
"tagName": "img",
"attributes": "{\n src: props.logo,\n alt: \"Logo\"\n}",
"classNames": [
"image"
],
"id": 6799068,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "src",
"value": "props.logo",
"isString": false,
"type": "MemberExpression"
},
{
"key": "alt",
"value": "Logo",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 2503295,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 1945490,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"children": [
{
"type": "element",
"tagName": "span",
"id": 4597590,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
},
{
"type": "element",
"tagName": "span",
"id": 3843238,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
},
{
"type": "element",
"tagName": "span",
"id": 5574078,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
}
],
"classNames": [
"navbar-burger",
"burger"
],
"attributes": "{\n onClick: () => setMenuOpen(!menuOpen)\n}",
"classNameExpressions": [
{
"js": "menuOpen",
"classNames": [
"is-active"
]
}
],
"id": 3211285,
"isVisible": true,
"image": "",
"name": "",
"style": "",
"propsArray": [
{
"key": "onClick",
"value": "() => setMenuOpen(!menuOpen)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 1224919,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"navbar-menu"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"navbar-end"
],
"children": [
{
"type": "if",
"js": "auth.user",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"navbar-item",
"has-dropdown",
"is-hoverable"
],
"children": [
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: '/' \n}",
"children": [
{
"type": "text",
"text": "Account",
"id": 6169912,
"isVisible": true,
"children": []
}
],
"classNames": [
"navbar-link"
],
"id": 9738087,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "div",
"classNames": [
"navbar-dropdown",
"is-boxed"
],
"children": [
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: '/dashboard'\n}",
"children": [
{
"type": "text",
"text": "Dashboard",
"id": 5098892,
"isVisible": true,
"children": []
}
],
"classNames": [
"navbar-item"
],
"id": 2586971,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/dashboard",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: \"/signout\",\n onClick: (e) => {\n e.preventDefault();\n auth.signout();\n }\n}",
"children": [
{
"type": "text",
"text": "Sign out",
"id": 5949729,
"isVisible": true,
"children": []
}
],
"classNames": [
"navbar-item"
],
"id": 8221397,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/signout",
"isString": true,
"type": "StringLiteral"
},
{
"key": "onClick",
"value": "(e) => {\n e.preventDefault();\n auth.signout();\n}",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 3892263,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 2746102,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3173739,
"isVisible": true
},
{
"type": "if",
"js": "!auth.user",
"children": [
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: '/signin'\n}",
"children": [
{
"type": "text",
"text": "Sign in",
"id": 7986864,
"isVisible": true,
"children": []
}
],
"classNames": [
"navbar-item"
],
"id": 5577253,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/signin",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 6673849,
"isVisible": true
}
],
"id": 916218,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"classNameExpressions": [
{
"js": "menuOpen",
"classNames": [
"is-active"
]
}
],
"id": 753773,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"propsArray": []
}
],
"id": 9875662,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 1027311,
"isVisible": true,
"propsArray": [
{
"key": "spaced",
"value": "props.spaced",
"isString": false,
"type": "MemberExpression"
},
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"code": "\tconst auth = useAuth(); \n\tconst [menuOpen, setMenuOpen] = useState(false);\n \n ",
"tags": [
"Navigation"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"nameFormatted": "Navbar",
"nameStyleModule": "NavbarComponent",
"modulePath": "src/components/Navbar"
},
{
"type": "component",
"name": "Navbar Container",
"id": 3871614,
"children": [
{
"type": "element",
"tagName": "nav",
"classNames": [
"navbar"
],
"children": [
{
"type": "children",
"id": 3170614,
"isVisible": true,
"children": []
}
],
"classNameExpressions": [
{
"js": "props.color",
"classNames": [
"is-{props.color}"
]
},
{
"js": "props.spaced",
"classNames": [
"is-spaced"
]
}
],
"id": 6664260,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "NavbarContainer",
"nameStyleModule": "NavbarContainer",
"modulePath": "src/components/NavbarContainer"
},
{
"type": "component",
"name": "Section",
"id": 1079246,
"children": [
{
"type": "element",
"tagName": "section",
"classNames": [
"hero",
"section",
"is-block",
"is-relative"
],
"classNameExpressions": [
{
"js": "color",
"classNames": [
"is-{color}"
]
},
{
"js": "size",
"classNames": [
"is-{size}"
]
}
],
"children": [
{
"type": "if",
"js": "backgroundImage",
"children": [
{
"type": "instance",
"componentId": 1986700,
"attributes": "{\n\timage: backgroundImage,\n opacity: backgroundImageOpacity\n}",
"id": 6976618,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "image",
"value": "backgroundImage",
"isString": false,
"type": "Identifier"
},
{
"key": "opacity",
"value": "backgroundImageOpacity",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 4689902,
"isVisible": true
},
{
"type": "children",
"id": 6313629,
"isVisible": true,
"children": []
}
],
"attributes": "{\n\t...otherProps\n}",
"style": "// Add light border if two white\n// sections next to each other.\n.is-white + &.is-white {\n border-top: 1px solid #F0F0F0;\n}",
"id": 7573224,
"isVisible": true,
"image": "",
"name": "",
"propsArray": [
{
"key": null,
"value": "otherProps",
"isString": false,
"type": "SpreadElement"
}
]
}
],
"code": "\tconst {\n color, \n size, \n backgroundImage,\n backgroundImageOpacity,\n children,\n // Passed to section element\n ...otherProps \n } = props;\n",
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "Section",
"nameStyleModule": "SectionComponent",
"modulePath": "src/components/Section"
},
{
"type": "component",
"name": "Hero Section",
"id": 7454246,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-vcentered",
"is-desktop"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-5-desktop",
"has-text-centered-touch"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n // value from 1-6\n size: 1\n}",
"id": 2326079,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "1",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 8669042,
"attributes": "{\n\tparentColor: props.color,\n // small, normal, medium, large\n size: \"medium\",\n onClick: props.buttonOnClick\n}",
"children": [
{
"type": "text",
"text": "{props.buttonText}",
"id": 3887774,
"isVisible": true,
"children": []
}
],
"id": 9572835,
"isVisible": true,
"propsArray": [
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "onClick",
"value": "props.buttonOnClick",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 6733235,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-1"
],
"name": "Spacer",
"id": 8571842,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"column"
],
"children": [
{
"type": "element",
"tagName": "figure",
"classNames": [
"image"
],
"children": [
{
"type": "element",
"tagName": "img",
"attributes": "{\n src: props.image,\n alt: \"Illustration\"\n}",
"id": 9314021,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "src",
"value": "props.image",
"isString": false,
"type": "MemberExpression"
},
{
"key": "alt",
"value": "Illustration",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"style": "margin: 0 auto;\nmax-width: 570px;",
"id": 6832296,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 6527102,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3243841,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 580002,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 8181092,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Popular",
"Hero"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "HeroSection",
"nameStyleModule": "HeroSection",
"modulePath": "src/components/HeroSection"
},
{
"type": "component",
"name": "Section Button",
"id": 8669042,
"children": [
{
"type": "element",
"tagName": "button",
"classNames": [
"button"
],
"children": [
{
"type": "children",
"id": 776571,
"isVisible": true,
"children": []
}
],
"attributes": "{\n ...otherProps\n}",
"classNameExpressions": [
{
"js": "['primary', 'info', 'success', 'warning', 'danger', 'black', 'dark'].includes(parentColor)",
"classNames": [
"is-{parentColor}",
"is-inverted"
]
},
{
"js": " ['white', 'light'].includes(parentColor) || !parentColor",
"classNames": [
"is-primary"
]
},
{
"js": "size",
"classNames": [
"is-{size}"
]
},
{
"js": "state",
"classNames": [
"is-{state}"
]
},
{
"js": "fullWidth",
"classNames": [
"is-fullwidth"
]
}
],
"id": 7815642,
"isVisible": true,
"image": "",
"name": "",
"style": "",
"propsArray": [
{
"key": null,
"value": "otherProps",
"isString": false,
"type": "SpreadElement"
}
]
}
],
"description": "A button whose color is determined by the background color of its parent component (passed in via `parentColor` prop).",
"code": "\tconst {\n parentColor, \n size, \n state, \n fullWidth,\n // Passed to button element\n ...otherProps\n } = props;\n",
"isVisible": true,
"nameLibrary": "",
"tags": [],
"nameFormatted": "SectionButton",
"nameStyleModule": "SectionButton",
"modulePath": "src/components/SectionButton"
},
{
"type": "component",
"name": "Section Header",
"id": 5415335,
"children": [
{
"type": "if",
"js": "props.title || props.subtitle",
"id": 8933982,
"children": [
{
"type": "element",
"tagName": "header",
"children": [
{
"type": "if",
"js": "props.title",
"id": 3832557,
"children": [
{
"type": "element",
"tagName": "h1",
"classNames": [
"title",
"is-spaced",
"has-text-weight-bold"
],
"children": [
{
"type": "text",
"text": "{props.title}",
"id": 3346646,
"isVisible": true,
"children": []
}
],
"classNameExpressions": [
{
"js": "props.size",
"classNames": [
"is-{props.size}"
]
},
{
"js": "props.size === 1",
"classNames": [
"is-size-2-mobile"
]
}
],
"id": 5428871,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"propsArray": []
}
],
"isVisible": true
},
{
"type": "if",
"js": "props.subtitle",
"children": [
{
"type": "element",
"tagName": "p",
"classNames": [
"subtitle"
],
"children": [
{
"type": "text",
"text": "{props.subtitle}",
"id": 4050505,
"isVisible": true,
"children": []
}
],
"id": 2045497,
"classNameExpressions": [
{
"js": "props.size > 4",
"classNames": [
"is-6"
]
}
],
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"propsArray": []
}
],
"id": 4428299,
"isVisible": true
}
],
"classNameExpressions": [
{
"js": "props.centered",
"classNames": [
"is-centered"
]
}
],
"style": "margin-bottom: 3rem;\n\n// Remove margin if nothing after header\n&:last-child{\n margin-bottom: 0;\n}\n\n// Added if props.centered is true\n&.is-centered {\n text-align: center;\n}\n\n.subtitle {\n\tmax-width: 700px;\n // So we can have max-width but still\n // have alignment controlled by text-align.\n display: inline-block;\n}",
"id": 4841502,
"name": "Header",
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"propsArray": []
}
],
"isVisible": true
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "SectionHeader",
"nameStyleModule": "SectionHeader",
"modulePath": "src/components/SectionHeader"
},
{
"type": "component",
"name": "Background Image",
"id": 1986700,
"children": [
{
"type": "element",
"tagName": "div",
"attributes": "{\n style: {\n '--image': `url(${props.image})`,\n '--opacity': props.opacity\n }\n}",
"style": "content: \"\";\nbackground-image: var(--image);\nbackground-position: center center;\nbackground-size: cover;\nopacity: var(--opacity);\ntop: 0;\nleft: 0;\nbottom: 0;\nright: 0;\nposition: absolute;\nz-index: 0;",
"id": 4730303,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"children": [],
"propsArray": [
{
"key": "style",
"value": "{\n '--image': `url(${props.image})`,\n '--opacity': props.opacity\n}",
"isString": false,
"type": "ObjectExpression"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "BackgroundImage",
"nameStyleModule": "BackgroundImage",
"modulePath": "src/components/BackgroundImage"
},
{
"type": "component",
"name": "Clients Section",
"id": 4279952,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 8194712,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 7285372,
"attributes": "{\n items: [\n {\n name: 'Instagram',\n image: \"https://uploads.divjoy.com/logo-instagram.svg\",\n width: \"150px\",\n },\n {\n name: 'Slack',\n image: \"https://uploads.divjoy.com/logo-slack.svg\",\n width: \"135px\"\n },\n {\n name: 'Tinder',\n image: \"https://uploads.divjoy.com/logo-tinder.svg\",\n width: \"90px\"\n },\n {\n name: 'Spotify',\n image: \"https://uploads.divjoy.com/logo-spotify.svg\",\n width: \"135px\"\n }\n ]\n}",
"id": 8708010,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "items",
"value": "[\n {\n name: 'Instagram',\n image: \"https://uploads.divjoy.com/logo-instagram.svg\",\n width: \"150px\",\n },\n {\n name: 'Slack',\n image: \"https://uploads.divjoy.com/logo-slack.svg\",\n width: \"135px\"\n },\n {\n name: 'Tinder',\n image: \"https://uploads.divjoy.com/logo-tinder.svg\",\n width: \"90px\"\n },\n {\n name: 'Spotify',\n image: \"https://uploads.divjoy.com/logo-spotify.svg\",\n width: \"135px\"\n }\n]",
"isString": false,
"type": "ArrayExpression"
}
]
}
],
"id": 2018945,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 1636201,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Clients",
"Popular"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "ClientsSection",
"nameStyleModule": "ClientsSection",
"modulePath": "src/components/ClientsSection"
},
{
"type": "component",
"name": "Clients",
"id": 7285372,
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-centered",
"is-multiline"
],
"children": [
{
"type": "foreach",
"valName": "item",
"indexName": "index",
"objectName": "props.items",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-narrow",
"has-text-centered"
],
"children": [
{
"type": "element",
"tagName": "div",
"style": "margin: 0 12px;\nimg {\n // Removes extra space under image\n vertical-align: bottom;\n}",
"children": [
{
"type": "element",
"tagName": "img",
"attributes": "{\n src: item.image,\n width: item.width,\n alt: item.name\n}",
"id": 6426386,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "src",
"value": "item.image",
"isString": false,
"type": "MemberExpression"
},
{
"key": "width",
"value": "item.width",
"isString": false,
"type": "MemberExpression"
},
{
"key": "alt",
"value": "item.name",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"name": "Logo",
"id": 4646506,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
}
],
"attributes": "{\n key: index\n}",
"id": 6330706,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "key",
"value": "index",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 2176993,
"isVisible": true,
"objectType": "array"
}
],
"id": 2434375,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "Clients",
"nameStyleModule": "Clients",
"modulePath": "src/components/Clients"
},
{
"type": "component",
"name": "Features Section",
"id": 1166901,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 5566068,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 8535752,
"attributes": "{\n items: [\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-mind_map_cwng.svg\"\n },\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-personal_settings_kihd.svg\"\n },\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-having_fun_iais.svg\"\n },\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-balloons_vxx5.svg\"\n }\n ]\n}",
"id": 753221,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "items",
"value": "[\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-mind_map_cwng.svg\"\n },\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-personal_settings_kihd.svg\"\n },\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-having_fun_iais.svg\"\n },\n {\n title: \"Explore\",\n description: \"Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus.\",\n image: \"https://uploads.divjoy.com/undraw-balloons_vxx5.svg\"\n }\n]",
"isString": false,
"type": "ArrayExpression"
}
]
}
],
"id": 2630198,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 7879233,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Features",
"Popular"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "FeaturesSection",
"nameStyleModule": "FeaturesSection",
"modulePath": "src/components/FeaturesSection"
},
{
"type": "component",
"name": "Features",
"id": 8535752,
"children": [
{
"type": "element",
"tagName": "div",
"style": "max-width: 900px;\nmargin: 80px auto 0 auto;",
"children": [
{
"type": "foreach",
"valName": "item",
"indexName": "index",
"objectName": "props.items",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-variable",
"is-8",
"is-vcentered",
"has-text-centered-mobile"
],
"style": "// Reverse every other row\n&:nth-of-type(even) {\n flex-direction: row-reverse;\n}\n\n&:not(:last-of-type) {\n padding-bottom: 1.5rem;\n @media screen and (min-width: 769px) {\n padding-bottom: 2.5rem;\n }\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-half"
],
"children": [
{
"type": "element",
"tagName": "h3",
"classNames": [
"title",
"has-text-weight-bold",
"is-spaced",
"is-3"
],
"style": "margin-bottom: 1.2rem !important;",
"children": [
{
"type": "text",
"text": "{item.title}",
"id": 967800,
"isVisible": true,
"children": []
}
],
"id": 9683929,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "p",
"classNames": [
"subtitle"
],
"children": [
{
"type": "text",
"text": "{item.description}",
"id": 4810067,
"isVisible": true,
"children": []
}
],
"id": 1911482,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 836366,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"column"
],
"children": [
{
"type": "element",
"tagName": "figure",
"classNames": [
"image"
],
"children": [
{
"type": "element",
"tagName": "img",
"attributes": "{\n src: item.image,\n alt: item.title\n}",
"id": 8166672,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "src",
"value": "item.image",
"isString": false,
"type": "MemberExpression"
},
{
"key": "alt",
"value": "item.title",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 2009629,
"style": "max-width: 300px;\nmargin: 30px auto;",
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 5005051,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 7839467,
"attributes": "{\n\tkey: index\n}",
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": [
{
"key": "key",
"value": "index",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 426775,
"isVisible": true,
"objectType": "array"
}
],
"id": 2124975,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "Features",
"nameStyleModule": "Features",
"modulePath": "src/components/Features"
},
{
"type": "component",
"name": "Testimonials Section",
"id": 3770170,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 5825807,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 472158,
"attributes": "{\n items: [\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-5.jpeg',\n name: 'Sarah Kline',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.',\n company: \"Company\"\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-48.jpeg',\n name: 'Shawna Murray',\n role: 'Software Engineer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam!',\n company: \"Company\"\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-12.jpeg',\n name: 'Blake Elder',\n role: 'Designer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae.',\n company: \"Company\"\n }\n ]\n}",
"id": 5346966,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "items",
"value": "[\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-5.jpeg',\n name: 'Sarah Kline',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.',\n company: \"Company\"\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-48.jpeg',\n name: 'Shawna Murray',\n role: 'Software Engineer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam!',\n company: \"Company\"\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-12.jpeg',\n name: 'Blake Elder',\n role: 'Designer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae.',\n company: \"Company\"\n }\n]",
"isString": false,
"type": "ArrayExpression"
}
]
}
],
"id": 9651265,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 1543239,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Testimonials"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "TestimonialsSection",
"nameStyleModule": "TestimonialsSection",
"modulePath": "src/components/TestimonialsSection"
},
{
"type": "component",
"name": "Testimonials",
"id": 472158,
"children": [
{
"type": "instance",
"componentId": 6198410,
"children": [
{
"type": "foreach",
"valName": "item",
"objectName": "props.items",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-flex"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"card",
"is-flex"
],
"style": "flex-direction: column;",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"card-content",
"has-text-centered",
"is-flex"
],
"style": "flex-direction: column;\nheight: 100%;\npadding: 1.8rem;",
"children": [
{
"type": "element",
"tagName": "div",
"name": "Avatar Wrapper",
"style": "margin: 0 auto;",
"children": [
{
"type": "instance",
"componentId": 7412067,
"attributes": "{\n\timage: item.avatar,\n size: 96,\n alt: item.name\n}",
"id": 2381070,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "image",
"value": "item.avatar",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "96",
"isString": false,
"type": "NumericLiteral"
},
{
"key": "alt",
"value": "item.name",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 3316611,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "p",
"name": "Quote",
"style": "margin-top: 30px;",
"children": [
{
"type": "text",
"text": "\"{item.bio}\"",
"id": 1711314,
"isVisible": true,
"children": []
}
],
"id": 5568984,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"name": "Info",
"style": "margin-top: auto;\npadding-top: 40px;",
"children": [
{
"type": "element",
"tagName": "div",
"name": "Name",
"classNames": [
"has-text-weight-bold"
],
"children": [
{
"type": "text",
"text": "{item.name}",
"id": 71786,
"isVisible": true,
"children": []
}
],
"id": 385562,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"name": "Company",
"classNames": [
"link",
"is-size-7"
],
"children": [
{
"type": "text",
"text": "{item.company}",
"id": 2567670,
"isVisible": true,
"children": []
}
],
"style": "margin-top: 3px;",
"id": 7909141,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 7396980,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
}
],
"id": 987401,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 3219495,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 8349892,
"attributes": "{\n\tkey: index\n}",
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "key",
"value": "index",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 9087936,
"indexName": "index",
"isVisible": true,
"objectType": "array"
}
],
"id": 6131369,
"isVisible": true,
"attributes": "{\n\n}",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "Testimonials",
"nameStyleModule": "Testimonials",
"modulePath": "src/components/Testimonials"
},
{
"type": "component",
"name": "Centered Columns",
"id": 6198410,
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-centered",
"is-variable",
"is-4",
"is-multiline"
],
"children": [
{
"type": "children",
"id": 7476441,
"isVisible": true,
"children": []
}
],
"id": 2388015,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "CenteredColumns",
"nameStyleModule": "CenteredColumns",
"modulePath": "src/components/CenteredColumns"
},
{
"type": "component",
"name": "Avatar",
"id": 7412067,
"children": [
{
"type": "element",
"tagName": "figure",
"classNames": [
"image"
],
"classNameExpressions": [
{
"js": "size",
"classNames": [
"is-{size}x{size}"
]
}
],
"children": [
{
"type": "element",
"tagName": "img",
"attributes": "{\n src: image,\n alt: alt,\n ...otherProps\n}",
"classNames": [
"is-rounded"
],
"id": 7660562,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "src",
"value": "image",
"isString": false,
"type": "Identifier"
},
{
"key": "alt",
"value": "alt",
"isString": false,
"type": "Identifier"
},
{
"key": null,
"value": "otherProps",
"isString": false,
"type": "SpreadElement"
}
]
}
],
"id": 3545177,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"propsArray": []
}
],
"code": "\tconst { image, size, alt, ...otherProps } = props;\n",
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "Avatar",
"nameStyleModule": "Avatar",
"modulePath": "src/components/Avatar"
},
{
"type": "component",
"name": "Footer",
"id": 203216,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"brand",
"left"
],
"children": [
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: '/' \n}",
"children": [
{
"type": "element",
"tagName": "img",
"attributes": "{\n src: props.logo,\n alt: \"Logo\"\n}",
"id": 782650,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "src",
"value": "props.logo",
"isString": false,
"type": "MemberExpression"
},
{
"key": "alt",
"value": "Logo",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 4753230,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 6328584,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"links",
"right"
],
"children": [
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "text",
"text": "About",
"id": 4566084,
"isVisible": true,
"children": []
}
],
"attributes": "{\n\thref: '/about'\n}",
"id": 5142584,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/about",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "text",
"text": "FAQ",
"id": 41141,
"isVisible": true,
"children": []
}
],
"attributes": "{\n\thref: '/faq',\n}",
"id": 7264362,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/faq",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "text",
"text": "Contact",
"id": 9366721,
"isVisible": true,
"children": []
}
],
"attributes": "{\n\thref: '/contact',\n}",
"id": 2333053,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/contact",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "text",
"text": "Blog",
"id": 8263046,
"isVisible": true,
"children": []
}
],
"attributes": "{\n target: \"_blank\",\n href: \"https://medium.com\",\n rel: \"noopener noreferrer\"\n}",
"id": 5194689,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "target",
"value": "_blank",
"isString": true,
"type": "StringLiteral"
},
{
"key": "href",
"value": "https://medium.com",
"isString": true,
"type": "StringLiteral"
},
{
"key": "rel",
"value": "noopener noreferrer",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 847974,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"social",
"right"
],
"children": [
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "element",
"tagName": "span",
"classNames": [
"icon"
],
"children": [
{
"type": "element",
"tagName": "i",
"classNames": [
"fab",
"fa-twitter"
],
"id": 6283470,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
}
],
"id": 3994074,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"attributes": "{\n\thref: 'https://twitter.com',\n\ttarget: '_blank',\n rel: 'noopener noreferrer'\n}",
"id": 8489828,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "https://twitter.com",
"isString": true,
"type": "StringLiteral"
},
{
"key": "target",
"value": "_blank",
"isString": true,
"type": "StringLiteral"
},
{
"key": "rel",
"value": "noopener noreferrer",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "element",
"tagName": "span",
"classNames": [
"icon"
],
"children": [
{
"type": "element",
"tagName": "i",
"classNames": [
"fab",
"fa-facebook-f"
],
"id": 8936496,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
}
],
"id": 3232684,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"attributes": "{\n\thref: 'https://facebook.com',\n\ttarget: '_blank',\n rel: 'noopener noreferrer'\n}",
"id": 7606899,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "https://facebook.com",
"isString": true,
"type": "StringLiteral"
},
{
"key": "target",
"value": "_blank",
"isString": true,
"type": "StringLiteral"
},
{
"key": "rel",
"value": "noopener noreferrer",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "element",
"tagName": "span",
"classNames": [
"icon"
],
"children": [
{
"type": "element",
"tagName": "i",
"classNames": [
"fab",
"fa-instagram"
],
"id": 8331840,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": []
}
],
"id": 2925991,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"attributes": "{\n\thref: 'https://instagram.com',\n\ttarget: '_blank',\n rel: 'noopener noreferrer'\n}",
"id": 2600085,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "https://instagram.com",
"isString": true,
"type": "StringLiteral"
},
{
"key": "target",
"value": "_blank",
"isString": true,
"type": "StringLiteral"
},
{
"key": "rel",
"value": "noopener noreferrer",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 617938,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"copyright",
"left"
],
"children": [
{
"type": "text",
"text": "{props.copyright}",
"id": 9660171,
"isVisible": true,
"children": []
}
],
"id": 531660,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"style": "display: flex;\nflex-wrap: wrap;\n> div {\n display: flex;\n flex: none;\n justify-content: center;\n width: 100%;\n margin-bottom: 24px;\n}\n\n.brand {\n img {\n display: block;\n height: 32px;\n }\n}\n\n.social {\n align-items: flex-end;\n}\n\n.social, .links {\n a {\n color: inherit;\n &:hover {\n opacity: 0.8;\n }\n\n &:not(:first-of-type) {\n margin-left: 20px;\n }\n }\n}\n\n// Tablet and up\n@media screen and (min-width: 769px) {\n > div {\n flex: 50%;\n }\n\n .left {\n justify-content: flex-start;\n }\n\n .right {\n justify-content: flex-end;\n }\n \n // Move links to end (bottom right)\n // Swaps position with social\n .links {\n order: 1;\n }\n}",
"id": 4190157,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 4337160,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Footer",
"Popular"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "Footer",
"nameStyleModule": "FooterComponent",
"modulePath": "src/components/Footer"
},
{
"type": "component",
"subtype": "page-component",
"children": [
{
"type": "instance",
"componentId": 7454246,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"white\",\n // normal, medium, large\n size: \"medium\",\n title: \"To Do App Beta\",\n subtitle: \"Keep things in order\",\n buttonText: \"Get Started\",\n image: 'https://uploads.divjoy.com/undraw-japan_ubgk.svg',\n buttonOnClick: () => {\n router.push('/pricing');\n }\n}",
"id": 195077,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "To Do App Beta",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "Keep things in order",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "Get Started",
"isString": true,
"type": "StringLiteral"
},
{
"key": "image",
"value": "https://uploads.divjoy.com/undraw-japan_ubgk.svg",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonOnClick",
"value": "() => {\n router.push('/pricing');\n}",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
},
{
"type": "instance",
"componentId": 4279952,
"attributes": "{\n\t// primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"light\",\n // normal, medium, large\n size: \"normal\",\n title: \"\",\n subtitle: \"\"\n}",
"id": 813240,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "light",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "normal",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "instance",
"componentId": 1166901,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"medium\",\n title: \"Features\",\n subtitle: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.\"\n}",
"id": 8647187,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Features",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "instance",
"componentId": 3770170,
"attributes": "{\n\t// primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"light\",\n // normal, medium, large\n size: \"medium\",\n title: \"Here's what people are saying\",\n subtitle: \"\"\n}",
"id": 5160492,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "light",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Here's what people are saying",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "instance",
"componentId": 74477,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"medium\",\n title: \"Stay in the know\",\n subtitle: \"Receive our latest articles and feature updates\",\n buttonText: \"Subscribe\",\n inputPlaceholder: \"Enter your email\",\n subscribedMessage: \"You are now subscribed!\"\n}",
"id": 890301,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Stay in the know",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "Receive our latest articles and feature updates",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "Subscribe",
"isString": true,
"type": "StringLiteral"
},
{
"key": "inputPlaceholder",
"value": "Enter your email",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subscribedMessage",
"value": "You are now subscribed!",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 1513260,
"code": "\tconst router = useRouter();\n",
"isVisible": true,
"path": "",
"nameFormatted": "IndexPage",
"nameStyleModule": "IndexPage",
"modulePath": "src/pages/index"
},
{
"type": "component",
"subtype": "page-component",
"path": "about",
"id": 3773675,
"children": [
{
"type": "instance",
"componentId": 4857083,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"primary\",\n // normal, medium, large\n size: \"large\",\n title: \"We help you make money\",\n subtitle: \"Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam!\"\n}",
"id": 1322277,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "primary",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "large",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "We help you make money",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam!",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "instance",
"componentId": 6816015,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"medium\",\n title: \"Meet the Team\",\n subtitle: \"\"\n}",
"id": 8526933,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Meet the Team",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "AboutPage",
"nameStyleModule": "AboutPage",
"modulePath": "src/pages/about"
},
{
"type": "component",
"name": "Content Section",
"id": 4857083,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size,\n backgroundImage: props.backgroundImage,\n backgroundImageOpacity: props.backgroundImageOpacity\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 2\n}",
"id": 578586,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "2",
"isString": false,
"type": "NumericLiteral"
}
]
}
],
"id": 5744175,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 9123185,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
},
{
"key": "backgroundImage",
"value": "props.backgroundImage",
"isString": false,
"type": "MemberExpression"
},
{
"key": "backgroundImageOpacity",
"value": "props.backgroundImageOpacity",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Content"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "ContentSection",
"nameStyleModule": "ContentSection",
"modulePath": "src/components/ContentSection"
},
{
"type": "component",
"name": "Team Bios Section",
"id": 6816015,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 981326,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 9687587,
"attributes": "{\n people: [\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-68.jpeg',\n name: 'John Smith',\n role: 'Software Engineer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo.',\n twitterUrl: 'https://twitter.com',\n facebookUrl: 'https://facebook.com',\n linkedinUrl: 'https://linkedin.com'\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-35.jpeg',\n name: 'Lisa Zinn',\n role: 'Software Engineer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam! Labore reprehenderit beatae magnam animi!',\n twitterUrl: 'https://twitter.com',\n facebookUrl: 'https://facebook.com',\n linkedinUrl: 'https://linkedin.com'\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-16.jpeg',\n name: 'Diana Low',\n role: 'Designer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam! Labore reprehenderit beatae magnam animi!',\n twitterUrl: 'https://twitter.com',\n facebookUrl: 'https://facebook.com',\n linkedinUrl: 'https://linkedin.com'\n }\n ]\n}",
"id": 2949380,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "people",
"value": "[\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-68.jpeg',\n name: 'John Smith',\n role: 'Software Engineer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo.',\n twitterUrl: 'https://twitter.com',\n facebookUrl: 'https://facebook.com',\n linkedinUrl: 'https://linkedin.com'\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-35.jpeg',\n name: 'Lisa Zinn',\n role: 'Software Engineer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam! Labore reprehenderit beatae magnam animi!',\n twitterUrl: 'https://twitter.com',\n facebookUrl: 'https://facebook.com',\n linkedinUrl: 'https://linkedin.com'\n },\n {\n avatar: 'https://uploads.divjoy.com/pravatar-150x-16.jpeg',\n name: 'Diana Low',\n role: 'Designer',\n bio: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae, quas accusantium perferendis sapiente explicabo, corporis totam! Labore reprehenderit beatae magnam animi!',\n twitterUrl: 'https://twitter.com',\n facebookUrl: 'https://facebook.com',\n linkedinUrl: 'https://linkedin.com'\n }\n]",
"isString": false,
"type": "ArrayExpression"
}
]
}
],
"id": 5420427,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 4242966,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Popular",
"Team"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "TeamBiosSection",
"nameStyleModule": "TeamBiosSection",
"modulePath": "src/components/TeamBiosSection"
},
{
"type": "component",
"name": "Team Bios",
"id": 9687587,
"children": [
{
"type": "instance",
"componentId": 6198410,
"children": [
{
"type": "foreach",
"valName": "person",
"objectName": "props.people",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-half-tablet",
"is-one-third-desktop",
"is-flex"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"card",
"is-flex"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"card-content",
"is-flex",
"has-text-centered"
],
"children": [
{
"type": "element",
"tagName": "div",
"name": "Avatar Wrapper",
"style": "margin: 0 auto;",
"children": [
{
"type": "instance",
"componentId": 7412067,
"attributes": "{\n\timage: person.avatar,\n size: 128,\n alt: person.name\n}",
"id": 4474689,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "image",
"value": "person.avatar",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "128",
"isString": false,
"type": "NumericLiteral"
},
{
"key": "alt",
"value": "person.name",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 2904923,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"children": [
{
"type": "element",
"tagName": "p",
"children": [
{
"type": "text",
"text": "{person.name}",
"id": 830353,
"isVisible": true,
"children": []
}
],
"name": "Name",
"classNames": [
"is-size-5"
],
"id": 5156861,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "p",
"children": [
{
"type": "text",
"text": "{person.role}",
"id": 6516408,
"isVisible": true,
"children": []
}
],
"name": "Role",
"classNames": [
"is-size-7",
"is-uppercase",
"has-text-weight-semibold"
],
"id": 8657684,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "p",
"children": [
{
"type": "text",
"text": "{person.bio}",
"id": 4499683,
"isVisible": true,
"children": []
}
],
"name": "Bio",
"style": "margin-top: 20px;",
"id": 9988572,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
}
],
"name": "Details",
"style": "margin-top: 20px;",
"id": 7698527,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
}
],
"style": "flex-direction: column;\nheight: 100%;\npadding: 1.8rem;",
"id": 3357018,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"style": "flex-direction: column;",
"id": 6450664,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 287490,
"attributes": "{\n\tkey: index\n}",
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "key",
"value": "index",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 3706765,
"indexName": "index",
"isVisible": true,
"objectType": "array"
}
],
"id": 99593,
"isVisible": true,
"attributes": "{\n\n}",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "TeamBios",
"nameStyleModule": "TeamBios",
"modulePath": "src/components/TeamBios"
},
{
"type": "component",
"name": "Newsletter Section",
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-centered"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-12",
"is-10-fullhd"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-vcentered"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-half"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"title"
],
"children": [
{
"type": "text",
"text": "{props.title}",
"id": 4153440,
"isVisible": true,
"children": []
}
],
"id": 5227180,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"subtitle"
],
"children": [
{
"type": "text",
"text": "{props.subtitle}",
"id": 2994041,
"isVisible": true,
"children": []
}
],
"id": 180416,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 8254421,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"column",
"is-half"
],
"children": [
{
"type": "instance",
"componentId": 4938296,
"id": 6723650,
"attributes": "{\n parentColor: props.color,\n\tbuttonText: props.buttonText,\n inputPlaceholder: props.inputPlaceholder,\n subscribedMessage: props.subscribedMessage,\n\t// small, normal, medium, large\n size: \"medium\"\n}",
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "inputPlaceholder",
"value": "props.inputPlaceholder",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subscribedMessage",
"value": "props.subscribedMessage",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 4936903,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3334129,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 5195628,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 6212138,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 6031473,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 8188011,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 74477,
"code": " ",
"tags": [
"Popular",
"Newsletter"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"nameFormatted": "NewsletterSection",
"nameStyleModule": "NewsletterSection",
"modulePath": "src/components/NewsletterSection"
},
{
"type": "component",
"name": "Newsletter",
"children": [
{
"type": "if",
"js": "subscribed === false",
"children": [
{
"type": "element",
"tagName": "form",
"attributes": "{\n onSubmit: (e) => {\n e.preventDefault();\n handleSubmit();\n }\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field",
"is-grouped"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"control",
"is-expanded"
],
"children": [
{
"type": "element",
"tagName": "input",
"attributes": "{\n type: 'email',\n placeholder: props.inputPlaceholder,\n onChange: (event) => setEmail(event.target.value)\n}",
"classNames": [
"input",
"is-{props.size}"
],
"id": 2334275,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "type",
"value": "email",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "props.inputPlaceholder",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onChange",
"value": "(event) => setEmail(event.target.value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 5348542,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"control"
],
"children": [
{
"type": "instance",
"componentId": 8669042,
"attributes": "{\n\tparentColor: props.parentColor,\n size: props.size,\n onClick: props.buttonOnClick\n}",
"children": [
{
"type": "text",
"text": "{props.buttonText}",
"id": 751726,
"isVisible": true,
"children": []
}
],
"id": 7377433,
"isVisible": true,
"propsArray": [
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onClick",
"value": "props.buttonOnClick",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 568525,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 4088219,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 9147691,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "onSubmit",
"value": "(e) => {\n e.preventDefault();\n handleSubmit();\n}",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 2699611,
"isVisible": true
},
{
"type": "if",
"js": "subscribed === true",
"children": [
{
"type": "text",
"text": "{props.subscribedMessage}",
"id": 813004,
"isVisible": true,
"children": []
}
],
"id": 3854440,
"isVisible": true
}
],
"id": 4938296,
"code": " const [email, setEmail] = useState('');\n const [subscribed, setSubscribed] = useState(false);\n \n const handleSubmit = () => {\n if (email){\n setSubscribed(true);\n // Parent component can optionally\n // find out when subscribed.\n props.onSubscribed && props.onSubscribed();\n // Subscribe them\n newsletter.subscribe({ email });\n }\n }\n ",
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "Newsletter",
"nameStyleModule": "Newsletter",
"modulePath": "src/components/Newsletter"
},
{
"type": "component",
"subtype": "page-component",
"path": "faq",
"id": 327204,
"children": [
{
"type": "instance",
"componentId": 8074567,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"medium\",\n\ttitle: \"Frequently Asked Questions\",\n subtitle: \"\"\n}",
"id": 2798265,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Frequently Asked Questions",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "FaqPage",
"nameStyleModule": "FaqPage",
"modulePath": "src/pages/faq"
},
{
"type": "component",
"name": "FAQ Section",
"id": 8074567,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 4849694,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 8283571,
"attributes": "{\n items: [\n {\n question: 'Integer ornare neque mauris?',\n answer: 'Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus. Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'Lorem ipsum dolor sit amet?',\n answer: 'Nunc nulla mauris, laoreet vel cursus lacinia, consectetur sit amet tellus. Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'Suspendisse ut tincidunt?',\n answer: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. In lobortis, metus et mattis ullamcorper. Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'Ut enim ad minim veniam?',\n answer: 'Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'In velit mi, rhoncus dictum neque?',\n answer: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.'\n }\n ]\n}",
"id": 8641436,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "items",
"value": "[\n {\n question: 'Integer ornare neque mauris?',\n answer: 'Integer ornare neque mauris, ac vulputate lacus venenatis et. Pellentesque ut ultrices purus. Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'Lorem ipsum dolor sit amet?',\n answer: 'Nunc nulla mauris, laoreet vel cursus lacinia, consectetur sit amet tellus. Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'Suspendisse ut tincidunt?',\n answer: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. In lobortis, metus et mattis ullamcorper. Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'Ut enim ad minim veniam?',\n answer: 'Suspendisse ut tincidunt eros. In velit mi, rhoncus dictum neque a, tincidunt lobortis justo.'\n },\n {\n question: 'In velit mi, rhoncus dictum neque?',\n answer: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.'\n }\n]",
"isString": false,
"type": "ArrayExpression"
}
]
}
],
"id": 1107442,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3382393,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"FAQ",
"Popular"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "FaqSection",
"nameStyleModule": "FaqSection",
"modulePath": "src/components/FaqSection"
},
{
"type": "component",
"name": "FAQ",
"id": 8283571,
"children": [
{
"type": "foreach",
"valName": "item",
"objectName": "props.items",
"children": [
{
"type": "instance",
"componentId": 4138632,
"attributes": "{\n\tquestion: item.question,\n answer: item.answer,\n key: index\n}",
"id": 3188134,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "question",
"value": "item.question",
"isString": false,
"type": "MemberExpression"
},
{
"key": "answer",
"value": "item.answer",
"isString": false,
"type": "MemberExpression"
},
{
"key": "key",
"value": "index",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 3564997,
"indexName": "index",
"isVisible": true,
"objectType": "array"
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "Faq",
"nameStyleModule": "Faq",
"modulePath": "src/components/Faq"
},
{
"type": "component",
"name": "FAQ Item",
"code": "\tconst [expanded, setExpanded] = useState(false);\t\n",
"id": 4138632,
"children": [
{
"type": "element",
"tagName": "article",
"attributes": "{\n\tonClick: () => setExpanded(!expanded)\n}",
"style": "cursor: pointer;\npadding: 1.6rem 0;\nborder-bottom: 1px solid #efefef;\n&:last-child { \n border-bottom: none; \n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"title",
"is-spaced",
"is-4"
],
"children": [
{
"type": "element",
"tagName": "span",
"classNames": [
"icon",
"is-size-5",
"has-text-primary"
],
"children": [
{
"type": "element",
"tagName": "i",
"classNames": [
"fas"
],
"classNameExpressions": [
{
"js": "expanded",
"classNames": [
"fa-minus"
]
},
{
"js": "!expanded",
"classNames": [
"fa-plus"
]
}
],
"id": 7252241,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"children": [],
"propsArray": []
}
],
"style": "margin-right: 1rem;",
"id": 6314855,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
},
{
"type": "text",
"text": "{props.question}",
"id": 6690297,
"isVisible": true,
"children": []
}
],
"id": 3811440,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "if",
"js": "expanded",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"subtitle"
],
"children": [
{
"type": "text",
"text": "{props.answer}",
"id": 3624243,
"isVisible": true,
"children": []
}
],
"id": 6329152,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 9458739,
"isVisible": true
}
],
"id": 6868745,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": [
{
"key": "onClick",
"value": "() => setExpanded(!expanded)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "FaqItem",
"nameStyleModule": "FaqItem",
"modulePath": "src/components/FaqItem"
},
{
"type": "component",
"name": "Pricing Section",
"id": 4443176,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size,\n id: \"pricing\"\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 4598409,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 2167828,
"attributes": "{\n // text on button\n buttonText: 'Choose',\n // callback when plan chosen (button clicked)\n onChoosePlan: (planId) => {\n // Add your own payments logic here\n \talert(`You chose the plan \"${planId}\"`);\n },\n items: [\n { \n id: 'monthly',\n timespan: \"Monthly\",\n price: \"29\",\n description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam.'\n },\n { \n id: 'yearly',\n timespan: \"Yearly\",\n price: \"19\",\n description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae.'\n }\n ]\n}",
"id": 2641926,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "buttonText",
"value": "Choose",
"isString": true,
"type": "StringLiteral"
},
{
"key": "onChoosePlan",
"value": "(planId) => {\n // Add your own payments logic here\n alert(`You chose the plan \"${planId}\"`);\n}",
"isString": false,
"type": "ArrowFunctionExpression"
},
{
"key": "items",
"value": "[\n { \n id: 'monthly',\n timespan: \"Monthly\",\n price: \"29\",\n description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam.'\n },\n { \n id: 'yearly',\n timespan: \"Yearly\",\n price: \"19\",\n description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum consequatur numquam aliquam tenetur ad amet inventore hic beatae.'\n }\n]",
"isString": false,
"type": "ArrayExpression"
}
]
}
],
"style": "max-width: 800px;",
"id": 5908858,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 6822629,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
},
{
"key": "id",
"value": "pricing",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"tags": [
"Pricing",
"Popular"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "PricingSection",
"nameStyleModule": "PricingSection",
"modulePath": "src/components/PricingSection"
},
{
"type": "component",
"name": "Pricing",
"id": 2167828,
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"columns",
"is-centered",
"is-variable",
"is-5"
],
"children": [
{
"type": "foreach",
"valName": "item",
"indexName": "index",
"objectName": "props.items",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"column"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"card"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"card-content"
],
"children": [
{
"type": "element",
"tagName": "div",
"style": "font-size: 1.25rem;",
"classNames": [
"has-text-weight-bold"
],
"children": [
{
"type": "text",
"text": "{item.timespan}",
"id": 5672110,
"isVisible": true,
"children": []
}
],
"name": "Period",
"id": 2393390,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"style": "margin: 20px 0;",
"classNames": [
"has-text-weight-bold"
],
"children": [
{
"type": "element",
"tagName": "span",
"children": [
{
"type": "text",
"text": "$",
"id": 9593806,
"isVisible": true,
"children": []
}
],
"classNames": [
"is-size-3"
],
"name": "Price Symbol",
"style": "opacity: 0.4;",
"id": 1967626,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "span",
"children": [
{
"type": "text",
"text": "{item.price}",
"id": 8603056,
"isVisible": true,
"children": []
}
],
"classNames": [
"is-size-1"
],
"name": "Price Number",
"id": 1984251,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "span",
"children": [
{
"type": "text",
"text": "/m",
"id": 6524326,
"isVisible": true,
"children": []
}
],
"classNames": [
"is-size-4"
],
"name": "Price Month",
"style": "opacity: 0.4;",
"id": 8466525,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"propsArray": []
}
],
"name": "Price",
"id": 883311,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "p",
"children": [
{
"type": "text",
"text": "{item.description}",
"id": 5239080,
"isVisible": true,
"children": []
}
],
"name": "Description",
"style": "padding-bottom: 40px;",
"id": 999032,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
},
{
"type": "element",
"tagName": "button",
"classNames": [
"button",
"is-medium",
"is-primary"
],
"children": [
{
"type": "text",
"text": "{props.buttonText}",
"id": 9240044,
"isVisible": true,
"children": []
}
],
"style": "margin-top: auto;",
"attributes": "{\n\tonClick: () => props.onChoosePlan(item.id)\n}",
"id": 2606941,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": [
{
"key": "onClick",
"value": "() => props.onChoosePlan(item.id)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"style": "// Flex so that button can position self at \n// bottom of card using margin-top auto.\ndisplay: flex;\nflex-direction: column;\n// Stretch to fit column width\nwidth: 100%;\npadding: 2rem;",
"id": 2873169,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"style": "display: flex;\n// Stretch to fit column width\nwidth: 100%;\n// Ensure .card-content stretches to fit width\nalign-items: stretch;",
"classNameExpressions": [
{
"js": "item.emphasized === true",
"classNames": [
"emphasized"
]
}
],
"id": 1944025,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"propsArray": []
}
],
"style": "display: flex;\nalign-items: stretch;",
"attributes": "{\n key: index\n}",
"id": 9946607,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": [
{
"key": "key",
"value": "index",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 3852911,
"isVisible": true,
"objectType": "array"
}
],
"id": 7267633,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "Pricing",
"nameStyleModule": "Pricing",
"modulePath": "src/components/Pricing"
},
{
"type": "component",
"subtype": "page-component",
"path": "pricing",
"id": 9988735,
"children": [
{
"type": "instance",
"componentId": 4443176,
"attributes": "{\n\t// primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"white\",\n // normal, medium, large\n size: \"medium\",\n title: 'Pricing',\n subtitle: \"\"\n}",
"id": 6155292,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Pricing",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "PricingPage",
"nameStyleModule": "PricingPage",
"modulePath": "src/pages/pricing"
},
{
"type": "component",
"name": "Form Field",
"id": 2768808,
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"control"
],
"children": [
{
"type": "if",
"js": "props.type === \"textarea\"",
"children": [
{
"type": "element",
"tagName": "textarea",
"attributes": "{\n type: props.type,\n value: props.value,\n placeholder: props.placeholder,\n onChange: (e) => props.onChange(e.target.value)\n}",
"classNames": [
"textarea",
"is-medium"
],
"id": 398205,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "type",
"value": "props.type",
"isString": false,
"type": "MemberExpression"
},
{
"key": "value",
"value": "props.value",
"isString": false,
"type": "MemberExpression"
},
{
"key": "placeholder",
"value": "props.placeholder",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onChange",
"value": "(e) => props.onChange(e.target.value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 6549474,
"isVisible": true
},
{
"type": "if",
"js": "props.type !== \"textarea\"",
"children": [
{
"type": "element",
"tagName": "input",
"attributes": "{\n type: props.type,\n value: props.value,\n placeholder: props.placeholder,\n onChange: (e) => props.onChange(e.target.value)\n}",
"classNames": [
"input",
"is-medium"
],
"id": 889978,
"isVisible": true,
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"children": [],
"propsArray": [
{
"key": "type",
"value": "props.type",
"isString": false,
"type": "MemberExpression"
},
{
"key": "value",
"value": "props.value",
"isString": false,
"type": "MemberExpression"
},
{
"key": "placeholder",
"value": "props.placeholder",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onChange",
"value": "(e) => props.onChange(e.target.value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 6476692,
"isVisible": true
}
],
"id": 5235996,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "if",
"js": "props.error",
"children": [
{
"type": "element",
"tagName": "p",
"classNames": [
"help",
"is-danger"
],
"children": [
{
"type": "text",
"text": "{props.error.message}",
"id": 5299485,
"isVisible": true,
"children": []
}
],
"id": 9601294,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 1823889,
"isVisible": true
}
],
"id": 1060601,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "FormField",
"nameStyleModule": "FormField",
"modulePath": "src/components/FormField"
},
{
"type": "component",
"subtype": "page-component",
"path": "contact",
"id": 8532180,
"children": [
{
"type": "instance",
"componentId": 4150400,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"medium\",\n\ttitle: \"Contact Us\",\n subtitle: \"\",\n showNameField: true,\n buttonText: \"Send message\"\n}",
"id": 2665747,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Contact Us",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
},
{
"key": "showNameField",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "buttonText",
"value": "Send message",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "ContactPage",
"nameStyleModule": "ContactPage",
"modulePath": "src/pages/contact"
},
{
"type": "component",
"name": "Contact Section",
"id": 4150400,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 4071896,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 5469661,
"attributes": "{\n parentColor: props.color,\n showNameField: props.showNameField,\n buttonText: props.buttonText,\n}",
"id": 8209060,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "showNameField",
"value": "props.showNameField",
"isString": false,
"type": "MemberExpression"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"style": "max-width: 850px;",
"id": 2533263,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"propsArray": []
}
],
"id": 5180594,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Contact",
"Popular"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "ContactSection",
"nameStyleModule": "ContactSection",
"modulePath": "src/components/ContactSection"
},
{
"type": "component",
"name": "Contact Form",
"code": "\t// State for input values\n const [name, setName] = useState('');\n const [email, setEmail] = useState('');\n const [message, setMessage] = useState('');\n\n // Whether to show errors\n // We set to true if they submit and there are errors.\n // We only show errors after they submit because\n // it's annoying to see errors while typing.\n const [showErrors, setShowErrors] = useState(false);\n \n // Error array we'll populate\n let errors = [];\n\n // Function for fetching error for a field\n const getError = (field) => {\n return errors.find((e) => e.field === field);\n }\n \n // Function to see if field is empty\n const isEmpty = (val) => val.trim() === '';\n \n\t// Add error if email empty\n if (isEmpty(email)){\n errors.push({\n field: 'email',\n message: 'Please enter an email'\n });\n }\n \n// Add error if message empty\n if (isEmpty(message)){\n errors.push({\n field: 'message',\n message: 'Please enter a message'\n });\n }\n \n\t// Add error if name shown and empty\n if (props.showNameField){\n if (isEmpty(name)){\n errors.push({\n field: 'name',\n message: 'Please enter your name'\n });\n }\n }\n\n // Handle form submission\n const handleSubmit = (e) => {\n // If field errors then show them\n if (errors.length){\n setShowErrors(true);\n }else{\n // Otherwise call onSubmit with form data\n if (props.onSubmit){\n props.onSubmit({\n name,\n email,\n message\n });\n }\n }\n }\n ",
"id": 2896856,
"children": [
{
"type": "if",
"js": "props.status && props.status.message",
"children": [
{
"type": "instance",
"componentId": 8324765,
"attributes": "{\n\ttype: props.status.type,\n message: props.status.message\n}",
"id": 114896,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "type",
"value": "props.status.type",
"isString": false,
"type": "MemberExpression"
},
{
"key": "message",
"value": "props.status.message",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 1815689,
"isVisible": true
},
{
"type": "element",
"tagName": "form",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field",
"is-horizontal"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field-body"
],
"children": [
{
"type": "if",
"js": "props.showNameField",
"children": [
{
"type": "instance",
"componentId": 2768808,
"attributes": "{\n value: name,\n type: 'text',\n placeholder: 'Name',\n\terror: showErrors && getError('name'),\n onChange: (value) => setName(value)\n}",
"id": 4532532,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "value",
"value": "name",
"isString": false,
"type": "Identifier"
},
{
"key": "type",
"value": "text",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "Name",
"isString": true,
"type": "StringLiteral"
},
{
"key": "error",
"value": "showErrors && getError('name')",
"isString": false,
"type": "LogicalExpression"
},
{
"key": "onChange",
"value": "(value) => setName(value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 2002727,
"isVisible": true
},
{
"type": "instance",
"componentId": 2768808,
"attributes": "{\n value: email,\n type: 'email',\n placeholder: 'Email',\n\terror: showErrors && getError('email'),\n onChange: (value) => setEmail(value)\n}",
"id": 6729270,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "value",
"value": "email",
"isString": false,
"type": "Identifier"
},
{
"key": "type",
"value": "email",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "Email",
"isString": true,
"type": "StringLiteral"
},
{
"key": "error",
"value": "showErrors && getError('email')",
"isString": false,
"type": "LogicalExpression"
},
{
"key": "onChange",
"value": "(value) => setEmail(value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 8382708,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 365257,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"field",
"is-horizontal"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field-body"
],
"children": [
{
"type": "instance",
"componentId": 2768808,
"attributes": "{\n value: message,\n type: 'textarea',\n placeholder: 'Message',\n\terror: showErrors && getError('message'),\n onChange: (value) => setMessage(value)\n}",
"id": 8365187,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "value",
"value": "message",
"isString": false,
"type": "Identifier"
},
{
"key": "type",
"value": "textarea",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "Message",
"isString": true,
"type": "StringLiteral"
},
{
"key": "error",
"value": "showErrors && getError('message')",
"isString": false,
"type": "LogicalExpression"
},
{
"key": "onChange",
"value": "(value) => setMessage(value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 8359098,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 1359873,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "element",
"tagName": "div",
"classNames": [
"field",
"is-horizontal"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field-body"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"field"
],
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"control"
],
"children": [
{
"type": "instance",
"componentId": 8669042,
"attributes": "{\n\tparentColor: props.parentColor,\n size: \"medium\",\n state: props.status && \n props.status.type === \"pending\" ?\n 'loading' : 'normal'\n}",
"children": [
{
"type": "text",
"text": "{props.buttonText}",
"id": 9112618,
"isVisible": true,
"children": []
}
],
"id": 8423764,
"isVisible": true,
"propsArray": [
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "state",
"value": "props.status && \n props.status.type === \"pending\" ?\n 'loading' : 'normal'",
"isString": false,
"type": "ConditionalExpression"
}
]
}
],
"id": 2553172,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 4119607,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 7385159,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3883,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"attributes": "{\n onSubmit: (e) => {\n e.preventDefault();\n handleSubmit();\n }\n}",
"id": 980695,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "onSubmit",
"value": "(e) => {\n e.preventDefault();\n handleSubmit();\n}",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "ContactForm",
"nameStyleModule": "ContactForm",
"modulePath": "src/components/ContactForm"
},
{
"type": "component",
"name": "Contact",
"code": "\tconst [status, setStatus] = useState();\n \n const onSubmit = ({ name, email, message }) => {\n setStatus({ type: \"pending\" });\n \n contact.submit({ name, email, message })\n \t.then(() => {\n \tsetStatus({\n \ttype: \"success\",\n \tmessage: \"Your message has been sent! We'll get back to you soon.\"\n \t});\n \t})\n }",
"id": 5469661,
"children": [
{
"type": "instance",
"componentId": 2896856,
"attributes": "{\n parentColor: props.parentColor,\n showNameField: props.showNameField,\n buttonText: props.buttonText,\n onSubmit: onSubmit,\n status: status\n}",
"id": 7744584,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "showNameField",
"value": "props.showNameField",
"isString": false,
"type": "MemberExpression"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSubmit",
"value": "onSubmit",
"isString": false,
"type": "Identifier"
},
{
"key": "status",
"value": "status",
"isString": false,
"type": "Identifier"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "Contact",
"nameStyleModule": "Contact",
"modulePath": "src/components/Contact"
},
{
"type": "component",
"name": "Form Status",
"id": 8324765,
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"notification"
],
"classNameExpressions": [
{
"js": "props.type === \"error\"",
"classNames": [
"is-danger"
]
},
{
"js": "props.type === \"success\"",
"classNames": [
"is-success"
]
}
],
"children": [
{
"type": "text",
"text": "{props.message}",
"id": 6208534,
"isVisible": true,
"children": []
}
],
"id": 2491376,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"style": "",
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "FormStatus",
"nameStyleModule": "FormStatus",
"modulePath": "src/components/FormStatus"
},
{
"type": "component",
"subtype": "page-component",
"path": "dashboard",
"code": "\tconst auth = useAuth();\n\tconst router = useRouter();\n\n\t// Redirect to signin\n\t// if not signed in.\n\tuseEffect(() => {\n if (auth.user === false){\n \trouter.push('/signin');\n }\n }, [auth, router]);\n",
"id": 9447965,
"children": [
{
"type": "instance",
"componentId": 8384420,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"large\",\n title: \"Dashboard\",\n subtitle: \"Dashboard components are coming to the Divjoy library soon. For now, you can implement a custom dashboard here after exporting your code.\"\n}",
"id": 8433171,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "large",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Dashboard",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "Dashboard components are coming to the Divjoy library soon. For now, you can implement a custom dashboard here after exporting your code.",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"nameFormatted": "DashboardPage",
"nameStyleModule": "DashboardPage",
"modulePath": "src/pages/dashboard"
},
{
"type": "component",
"name": "Dashboard Section",
"id": 8384420,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 6816971,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
}
],
"id": 4452922,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 368304,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"code": "",
"nameFormatted": "DashboardSection",
"nameStyleModule": "DashboardSection",
"modulePath": "src/components/DashboardSection"
},
{
"type": "component",
"subtype": "page-component",
"path": "signin",
"id": 4045617,
"children": [
{
"type": "instance",
"componentId": 2902377,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"white\",\n // normal, medium, large\n size: \"large\",\n\ttitle: \"Welcome back\",\n subtitle: \"\",\n buttonText: \"Sign in\",\n}",
"id": 6038296,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "large",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Welcome back",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "Sign in",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "SigninPage",
"nameStyleModule": "SigninPage",
"modulePath": "src/pages/signin"
},
{
"type": "component",
"name": "Auth",
"code": "\t// State for all inputs\n const [email, setEmail] = useState('');\n const [pass, setPass] = useState('');\n const [confirmPass, setConfirmPass] = useState('');\n \n // Whether to show errors\n // We set to true if they submit and there are errors.\n // We only show errors after they submit because\n // it's annoying to see errors while typing.\n const [showErrors, setShowErrors] = useState(false);\n \n // Error array we'll populate\n let errors = [];\n\n // Function for fetching error for a field\n const getError = (field) => {\n return errors.find((e) => e.field === field);\n }\n \n // Function to see if field is empty\n const isEmpty = (val) => val.trim() === '';\n \n // Add error if email empty\n if (['signin','signup','forgotpass'].includes(props.mode)){\n if (isEmpty(email)){\n errors.push({\n field: 'email',\n message: 'Please enter an email'\n });\n }\n }\n \n // Add error if password empty\n if (['signin', 'signup', 'changepass'].includes(props.mode)){\n if (isEmpty(pass)){\n errors.push({\n field: 'pass',\n message: 'Please enter a password'\n });\n }\n }\n \n // Add error if confirmPass empty or\n\t// if it doesn't match pass.\n\t// Only for signup and changepass views.\n if (['signup', 'changepass'].includes(props.mode)){\n if (isEmpty(confirmPass)){\n errors.push({\n field: 'confirmPass',\n message: 'Please confirm password'\n });\n }else if (pass !== confirmPass){\n errors.push({\n field: 'confirmPass',\n message: `This doesn't match your password`\n });\n }\n }\n\n // Handle form submission\n const handleSubmit = () => {\n // If field errors then show them\n if (errors.length){\n setShowErrors(true);\n }else{\n // Otherwise call onSubmit with email/pass\n if (props.onSubmit){\n props.onSubmit({\n email,\n pass\n });\n }\n }\n }\n ",
"id": 63699,
"children": [
{
"type": "element",
"tagName": "div",
"children": [
{
"type": "if",
"js": "props.status && props.status.message",
"children": [
{
"type": "instance",
"componentId": 8324765,
"attributes": "{\n\ttype: props.status.type,\n message: props.status.message\n}",
"id": 5710328,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "type",
"value": "props.status.type",
"isString": false,
"type": "MemberExpression"
},
{
"key": "message",
"value": "props.status.message",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 5805610,
"isVisible": true
},
{
"type": "element",
"tagName": "form",
"children": [
{
"type": "if",
"js": "['signup', 'signin', 'forgotpass'].includes(props.mode)",
"children": [
{
"type": "instance",
"componentId": 2768808,
"attributes": "{\n value: email,\n type: 'email',\n placeholder: 'Email',\n\terror: showErrors && getError('email'),\n onChange: (value) => setEmail(value)\n}",
"id": 7961212,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "value",
"value": "email",
"isString": false,
"type": "Identifier"
},
{
"key": "type",
"value": "email",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "Email",
"isString": true,
"type": "StringLiteral"
},
{
"key": "error",
"value": "showErrors && getError('email')",
"isString": false,
"type": "LogicalExpression"
},
{
"key": "onChange",
"value": "(value) => setEmail(value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 9069362,
"isVisible": true
},
{
"type": "if",
"js": "['signup', 'signin', 'changepass'].includes(props.mode)",
"children": [
{
"type": "instance",
"componentId": 2768808,
"attributes": "{\n value: pass,\n type: 'password',\n placeholder: 'Password',\n\terror: showErrors && getError('pass'),\n onChange: (value) => setPass(value)\n}",
"id": 5398172,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "value",
"value": "pass",
"isString": false,
"type": "Identifier"
},
{
"key": "type",
"value": "password",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "Password",
"isString": true,
"type": "StringLiteral"
},
{
"key": "error",
"value": "showErrors && getError('pass')",
"isString": false,
"type": "LogicalExpression"
},
{
"key": "onChange",
"value": "(value) => setPass(value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 6566228,
"isVisible": true
},
{
"type": "if",
"js": "['signup', 'changepass'].includes(props.mode)",
"children": [
{
"type": "instance",
"componentId": 2768808,
"attributes": "{\n value: confirmPass,\n type: 'password',\n placeholder: 'Confirm Password',\n\terror: showErrors && getError('confirmPass'),\n onChange: (value) => setConfirmPass(value)\n}",
"id": 361947,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "value",
"value": "confirmPass",
"isString": false,
"type": "Identifier"
},
{
"key": "type",
"value": "password",
"isString": true,
"type": "StringLiteral"
},
{
"key": "placeholder",
"value": "Confirm Password",
"isString": true,
"type": "StringLiteral"
},
{
"key": "error",
"value": "showErrors && getError('confirmPass')",
"isString": false,
"type": "LogicalExpression"
},
{
"key": "onChange",
"value": "(value) => setConfirmPass(value)",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"id": 7858956,
"isVisible": true
},
{
"type": "element",
"tagName": "div",
"classNames": [
"field"
],
"children": [
{
"type": "element",
"tagName": "p",
"classNames": [
"control",
""
],
"children": [
{
"type": "instance",
"componentId": 8669042,
"attributes": "{\n\tparentColor: props.parentColor,\n size: \"medium\",\n fullWidth: true,\n state: props.status && \n \t\t\tprops.status.type === \"pending\" ?\n\t\t\t\t\t\t'loading' : 'normal'\n}",
"children": [
{
"type": "text",
"text": "{props.buttonText}",
"id": 7223197,
"isVisible": true,
"children": []
}
],
"id": 9599909,
"isVisible": true,
"propsArray": [
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "medium",
"isString": true,
"type": "StringLiteral"
},
{
"key": "fullWidth",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "state",
"value": "props.status && \n props.status.type === \"pending\" ?\n 'loading' : 'normal'",
"isString": false,
"type": "ConditionalExpression"
}
]
}
],
"id": 1976494,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"name": "Submit",
"id": 2933438,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
},
{
"type": "if",
"js": "['signup', 'signin'].includes(props.mode)",
"id": 4019975,
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"has-text-centered"
],
"children": [
{
"type": "if",
"js": "props.mode === \"signup\"",
"children": [
{
"type": "text",
"text": "Have an account already?",
"id": 405129,
"isVisible": true,
"children": []
},
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "text",
"text": "Sign in",
"id": 5532821,
"isVisible": true,
"children": []
}
],
"attributes": "{\n href: '/signin'\n}",
"id": 3021224,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/signin",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 1718561,
"isVisible": true
},
{
"type": "if",
"js": "props.mode === 'signin'",
"children": [
{
"type": "element",
"tagName": "a",
"children": [
{
"type": "text",
"text": "Create an account",
"id": 119509,
"isVisible": true,
"children": []
}
],
"attributes": "{\n href: '/signup'\n}",
"id": 3288573,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/signup",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "element",
"tagName": "a",
"attributes": "{\n href: '/forgotpass'\n}",
"children": [
{
"type": "text",
"text": "Forgot password",
"id": 5157568,
"isVisible": true,
"children": []
}
],
"id": 6632095,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "href",
"value": "/forgotpass",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"id": 4822433,
"isVisible": true
}
],
"name": "Bottom Link",
"style": "margin-top: 1rem;\nfont-size: 0.9rem;\na {\n margin: 0 0.5rem;\n}",
"id": 1854125,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"classNameExpressions": [],
"propsArray": []
}
],
"isVisible": true
}
],
"attributes": "{\n onSubmit: (e) => {\n e.preventDefault();\n handleSubmit();\n }\n}",
"id": 6086474,
"isVisible": true,
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"style": "",
"propsArray": [
{
"key": "onSubmit",
"value": "(e) => {\n e.preventDefault();\n handleSubmit();\n}",
"isString": false,
"type": "ArrowFunctionExpression"
}
]
}
],
"style": "width: 100%;\nmax-width: 450px;\nmargin: 0 auto;",
"id": 5859175,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNames": [],
"classNameExpressions": [],
"propsArray": []
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "Auth",
"nameStyleModule": "Auth",
"modulePath": "src/components/Auth"
},
{
"type": "component",
"name": "Sign In Section",
"id": 2902377,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 5988133,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 6850885,
"attributes": "{\n buttonText: props.buttonText,\n parentColor: props.color,\n onSignin: onSignin\n}",
"id": 2737557,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSignin",
"value": "onSignin",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 9088759,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3089850,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"code": "\t// Go to page after signin\n const onSignin = () => {\n router.push('/dashboard');\n }\n ",
"tags": [
"Signup"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"nameFormatted": "SignInSection",
"nameStyleModule": "SignInSection",
"modulePath": "src/components/SignInSection"
},
{
"type": "component",
"name": "Sign In",
"code": "\tconst auth = useAuth();\n\tconst [status, setStatus] = useState();\n \n const onSubmit = ({ email, pass }) => {\n setStatus({ type: \"pending\" });\n \tauth.signin(email, pass)\n \t.then(user => {\n \tprops.onSignin && props.onSignin();\n \t})\n .catch(error => {\n \tsetStatus({\n \ttype: \"error\",\n message: error.message\n \t});\n \t\t});\n }\n ",
"id": 6850885,
"children": [
{
"type": "instance",
"componentId": 63699,
"attributes": "{\n mode: 'signin',\n buttonText: props.buttonText,\n parentColor: props.parentColor,\n onSubmit: onSubmit,\n status: status\n}",
"id": 9415858,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "mode",
"value": "signin",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSubmit",
"value": "onSubmit",
"isString": false,
"type": "Identifier"
},
{
"key": "status",
"value": "status",
"isString": false,
"type": "Identifier"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "SignIn",
"nameStyleModule": "SignIn",
"modulePath": "src/components/SignIn"
},
{
"type": "component",
"subtype": "page-component",
"path": "signup",
"id": 4305746,
"children": [
{
"type": "instance",
"componentId": 6969772,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"white\",\n // normal, medium, large\n size: \"large\",\n\ttitle: \"Get yourself an account\",\n subtitle: \"\",\n buttonText: \"Sign up\",\n}",
"id": 5045478,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "large",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Get yourself an account",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "Sign up",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "SignupPage",
"nameStyleModule": "SignupPage",
"modulePath": "src/pages/signup"
},
{
"type": "component",
"name": "Sign Up Section",
"id": 6969772,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 8892414,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 6300485,
"attributes": "{\n\tbuttonText: props.buttonText,\n parentColor: props.color,\n onSignup: onSignup\n}",
"id": 1730012,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSignup",
"value": "onSignup",
"isString": false,
"type": "Identifier"
}
]
}
],
"id": 6557236,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3466550,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"code": "\t// Go to page after signup\n const onSignup = () => {\n \trouter.push('/dashboard');\n }\n ",
"tags": [
"Signup"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"nameFormatted": "SignUpSection",
"nameStyleModule": "SignUpSection",
"modulePath": "src/components/SignUpSection"
},
{
"type": "component",
"name": "Sign Up",
"code": "\tconst auth = useAuth();\n\tconst [status, setStatus] = useState();\n \n const onSubmit = ({ email, pass }) => {\n setStatus({ type: \"pending\" });\n auth.signup(email, pass)\n \t.then(user => {\n \tprops.onSignup && props.onSignup();\n \t})\n .catch(error => {\n \tsetStatus({\n \ttype: \"error\",\n message: error.message\n \t});\n \t});\n }\n ",
"id": 6300485,
"children": [
{
"type": "instance",
"componentId": 63699,
"attributes": "{\n mode: \"signup\",\n buttonText: props.buttonText,\n parentColor: props.parentColor,\n onSubmit: onSubmit,\n status: status\n}",
"id": 3564542,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "mode",
"value": "signup",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSubmit",
"value": "onSubmit",
"isString": false,
"type": "Identifier"
},
{
"key": "status",
"value": "status",
"isString": false,
"type": "Identifier"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "SignUp",
"nameStyleModule": "SignUp",
"modulePath": "src/components/SignUp"
},
{
"type": "component",
"subtype": "page-component",
"path": "forgotpass",
"id": 5642556,
"children": [
{
"type": "instance",
"componentId": 4632703,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"large\",\n\ttitle: \"Get a new password\",\n subtitle: \"\",\n buttonText: \"Reset password\",\n}",
"id": 377481,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "large",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Get a new password",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "Reset password",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "ForgotpassPage",
"nameStyleModule": "ForgotpassPage",
"modulePath": "src/pages/forgotpass"
},
{
"type": "component",
"name": "Forgot Pass Section",
"id": 4632703,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 4448198,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 8572589,
"attributes": "{\n\tbuttonText: props.buttonText,\n parentColor: props.color\n}",
"id": 5133597,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 8356221,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 3563592,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Signup"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "ForgotPassSection",
"nameStyleModule": "ForgotPassSection",
"modulePath": "src/components/ForgotPassSection"
},
{
"type": "component",
"name": "Forgot Pass",
"id": 8572589,
"children": [
{
"type": "instance",
"componentId": 63699,
"attributes": "{\n mode: 'forgotpass',\n buttonText: props.buttonText,\n parentColor: props.parentColor,\n onSubmit: onSubmit,\n status: status\n}",
"id": 9813654,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "mode",
"value": "forgotpass",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSubmit",
"value": "onSubmit",
"isString": false,
"type": "Identifier"
},
{
"key": "status",
"value": "status",
"isString": false,
"type": "Identifier"
}
]
}
],
"code": "\tconst auth = useAuth();\n\tconst [status, setStatus] = useState();\n\n\tconst onSubmit = ({ email }) => {\n setStatus({ type: \"pending\" });\n \tauth\n \t\t.sendPasswordResetEmail(email)\n .then(() => {\n setStatus({\n type: \"success\",\n message: \"Password reset email sent\"\n });\n })\n .catch(error => {\n setStatus({\n type: \"error\",\n message: error.message\n });\n });\n\t}\n",
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "ForgotPass",
"nameStyleModule": "ForgotPass",
"modulePath": "src/components/ForgotPass"
},
{
"type": "component",
"subtype": "page-component",
"path": "changepass",
"id": 83283,
"children": [
{
"type": "instance",
"componentId": 1634806,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n\tcolor: \"white\",\n // normal, medium, large\n size: \"large\",\n\ttitle: \"Choose a new password\",\n subtitle: \"\",\n buttonText: \"Change password\",\n}",
"id": 3926652,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "large",
"isString": true,
"type": "StringLiteral"
},
{
"key": "title",
"value": "Choose a new password",
"isString": true,
"type": "StringLiteral"
},
{
"key": "subtitle",
"value": "",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "Change password",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "ChangepassPage",
"nameStyleModule": "ChangepassPage",
"modulePath": "src/pages/changepass"
},
{
"type": "component",
"name": "Change Pass Section",
"id": 1634806,
"children": [
{
"type": "instance",
"componentId": 1079246,
"attributes": "{\n\tcolor: props.color,\n size: props.size\n}",
"children": [
{
"type": "element",
"tagName": "div",
"classNames": [
"container"
],
"children": [
{
"type": "instance",
"componentId": 5415335,
"attributes": "{\n\ttitle: props.title,\n subtitle: props.subtitle,\n centered: true,\n // value from 1-6\n size: 3\n}",
"id": 4614658,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "title",
"value": "props.title",
"isString": false,
"type": "MemberExpression"
},
{
"key": "subtitle",
"value": "props.subtitle",
"isString": false,
"type": "MemberExpression"
},
{
"key": "centered",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "size",
"value": "3",
"isString": false,
"type": "NumericLiteral"
}
]
},
{
"type": "instance",
"componentId": 2683725,
"attributes": "{\n buttonText: props.buttonText,\n parentColor: props.color\n}",
"id": 5378004,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"id": 3025936,
"isVisible": true,
"attributes": "{\n\n}",
"image": "",
"name": "",
"classNameExpressions": [],
"style": "",
"propsArray": []
}
],
"id": 7758873,
"isVisible": true,
"propsArray": [
{
"key": "color",
"value": "props.color",
"isString": false,
"type": "MemberExpression"
},
{
"key": "size",
"value": "props.size",
"isString": false,
"type": "MemberExpression"
}
]
}
],
"tags": [
"Signup"
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"code": "",
"nameFormatted": "ChangePassSection",
"nameStyleModule": "ChangePassSection",
"modulePath": "src/components/ChangePassSection"
},
{
"type": "component",
"name": "Change Pass",
"code": "\tconst auth = useAuth();\n\tconst [status, setStatus] = useState();\n \n const onSubmit = ({ pass }) => {\n setStatus({ type: \"pending\" });\n auth\n \t.confirmPasswordReset(pass)\n \t.then(() => {\n \tsetStatus({\n \ttype: \"success\",\n message: \"Your password has been changed\"\n });\n \t})\n \t.catch(error => {\n setStatus({\n \ttype: \"error\",\n message: error.message\n });\n \t});\n }\n ",
"id": 2683725,
"children": [
{
"type": "instance",
"componentId": 63699,
"attributes": "{\n mode: 'changepass',\n buttonText: props.buttonText,\n parentColor: props.parentColor,\n onSubmit: onSubmit,\n status: status\n}",
"id": 340607,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "mode",
"value": "changepass",
"isString": true,
"type": "StringLiteral"
},
{
"key": "buttonText",
"value": "props.buttonText",
"isString": false,
"type": "MemberExpression"
},
{
"key": "parentColor",
"value": "props.parentColor",
"isString": false,
"type": "MemberExpression"
},
{
"key": "onSubmit",
"value": "onSubmit",
"isString": false,
"type": "Identifier"
},
{
"key": "status",
"value": "status",
"isString": false,
"type": "Identifier"
}
]
}
],
"isVisible": true,
"nameLibrary": "",
"description": "",
"tags": [],
"nameFormatted": "ChangePass",
"nameStyleModule": "ChangePass",
"modulePath": "src/components/ChangePass"
},
{
"id": "app",
"type": "component",
"subtype": "app-component",
"globalStyle": "// COLORS\n$primary: #00d1b2;\n$info: #209CEE;\n$success: #23D160;\n$warning: #FFDD57;\n$danger: #FF3860;\n$light: #F5F5F5;\n$dark: #363636;\n\n// TEXT\n$text: #4A4A4A;\n$link: #3273DC;\n$body-family: BlinkMacSystemFont, -apple-system, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", \"Helvetica\", \"Arial\", sans-serif;\n$title-family: false;\n$button-family: false;\n\n// BREAKPOINTS\n$gap: 32px;\n$tablet: 769px;\n$desktop: 960px + (2*$gap);\n$widescreen: 1152px + (2*$gap);\n$fullhd: 1344px + (2*$gap);\n$widescreen-enabled: true;\n$fullhd-enabled: false;\n\n// LAYOUT\n$section-padding: 3rem 1.5rem;\n$section-padding-medium: 6rem 1.5rem;\n$section-padding-large: 9rem 1.5rem;\n\n// SEE DOCS FOR MORE: \n// https://bit.ly/30UvE5O\n\n// IMPORT BULMA\n@import \"~bulma/bulma.sass\";",
"children": [
{
"type": "instance",
"componentId": 9215568,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"white\",\n // add extra padding\n spaced: true,\n // logo image url\n logo: 'https://uploads.divjoy.com/logo.svg'\n}",
"id": 2069132,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "white",
"isString": true,
"type": "StringLiteral"
},
{
"key": "spaced",
"value": "true",
"isString": false,
"type": "BooleanLiteral"
},
{
"key": "logo",
"value": "https://uploads.divjoy.com/logo.svg",
"isString": true,
"type": "StringLiteral"
}
]
},
{
"type": "pages",
"id": 7407840,
"isVisible": true,
"children": [
{
"type": "instance",
"subtype": "page-instance",
"componentId": 1513260,
"id": 5876810,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 3773675,
"id": 8317181,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 327204,
"id": 2126949,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 9988735,
"id": 2201384,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 8532180,
"id": 6844142,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 9447965,
"id": 9711986,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 4045617,
"id": 5820999,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 4305746,
"id": 5610030,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 5642556,
"id": 6664312,
"isVisible": true,
"children": []
},
{
"type": "instance",
"subtype": "page-instance",
"componentId": 83283,
"id": 3098743,
"isVisible": true,
"children": []
}
]
},
{
"type": "instance",
"componentId": 203216,
"attributes": "{\n // primary, link, info, success, warning, \n // danger, white, light, dark, black\n color: \"light\",\n // normal, medium, large\n size: \"normal\",\n // logo image url\n logo: 'https://uploads.divjoy.com/logo.svg',\n copyright: '© 2019 Company'\n}",
"id": 9281365,
"isVisible": true,
"children": [],
"propsArray": [
{
"key": "color",
"value": "light",
"isString": true,
"type": "StringLiteral"
},
{
"key": "size",
"value": "normal",
"isString": true,
"type": "StringLiteral"
},
{
"key": "logo",
"value": "https://uploads.divjoy.com/logo.svg",
"isString": true,
"type": "StringLiteral"
},
{
"key": "copyright",
"value": "© 2019 Company",
"isString": true,
"type": "StringLiteral"
}
]
}
],
"isVisible": true,
"code": "",
"nameFormatted": "App",
"nameStyleModule": "App",
"modulePath": "src/pages/_app"
}
]
}
Reference in a new issue View git blame Copy permalink