@fixefy/fixefy-ui-components 0.0.8 → 0.0.10

package/package.json

@@ -1,66 +1,73 @@
 {
-	"author": "Fixefy Inc Team",
-	"browser": {
-		"fs": false
-	},
-	"dependencies": {
-		"@apollo/client": "^3.8.4",
-		"@fixefy/fixefy-ui-utils": "^0.0.6",
-		"@mui/icons-material": "^5.14.11",
-		"@mui/material": "^5.14.11",
-		"@mui/styled-engine": "^5.14.11",
-		"@mui/styles": "^5.14.11",
-		"@react-spring/web": "^9.7.3",
-		"graphql-tag": "^2.12.6",
-		"next": "^13.5.3",
-		"react": "^18.2.0",
-		"react-dom": "^18.2.0"
-	},
-	"devDependencies": {
-		"@svgr/webpack": "^8.1.0",
-		"@types/node": "^20.7.1",
-		"@types/react": "^18.2.23",
-		"@typescript-eslint/eslint-plugin": "^6.7.3",
-		"@typescript-eslint/parser": "^6.7.3",
-		"eslint": "^8.50.0"
-	},
-	"license": "MIT",
-	"name": "@fixefy/fixefy-ui-components",
-	"repository": {
-		"type": "git",
-		"url": "https://github.com/Fixefy/fixefy-ui-components.git"
-	},
-	"scripts": {
-		"build": "tsc -p ./tsconfig.cjs.json && tsc -p ./tsconfig.es.json && tsc -p ./tsconfig.types.json && yarn build:copy",
-		"build:copy": "node ../../scripts/copy-files-ex.js",
-		"pre_release": "yarn clean && yarn && yarn build",
-		"r": "yarn release",
-		"release": "yarn pre_release && npm pack && npm publish",
-		"release:config": "yarn pre_release && npm publish --userconfig ./.npmrc",
-		"clean": "rm -rf build && rm -rf dist-* && yarn clean:node",
-		"clean:node": "rm -rf node_modules",
-		"release_patch": "yarn patch && yarn release",
-		"release_minor": "yarn minor && yarn release",
-		"release_major": "yarn major && yarn release",
-		"patch": "yarn version --patch && git push --follow-tags",
-		"minor": "yarn version --minor && git push --follow-tags",
-		"major": "yarn version --major && git push --follow-tags"
-	},
-	"engines": {
-		"node": "18.17.1"
-	},
-	"files": [
-		"dist-*/**/*"
-	],
-	"private": false,
-	"main": "./dist-cjs/index.js",
-	"module": "./dist-es/index.js",
-	"exports": {
-		".": {
-			"import": "./dist-es/index.js",
-			"require": "./dist-cjs/index.js"
-		}
-	},
-	"types": "./dist-types/index.d.ts",
-	"version": "0.0.8"
+  "author": "Fixefy Inc Team",
+  "browser": {
+    "fs": false
+  },
+  "dependencies": {
+    "@apollo/client": "^3.8.4",
+    "@fixefy/fixefy-ui-utils": "^0.0.10",
+    "@mui/icons-material": "^5.14.11",
+    "@mui/material": "^5.14.11",
+    "@mui/styled-engine": "^5.14.11",
+    "@mui/styles": "^5.14.11",
+    "@react-spring/web": "^9.7.3",
+    "graphql-tag": "^2.12.6",
+    "next": "^13.5.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^25.0.4",
+    "@rollup/plugin-node-resolve": "^15.2.1",
+    "@rollup/plugin-typescript": "^11.1.4",
+    "@svgr/webpack": "^8.1.0",
+    "@types/node": "^20.7.1",
+    "@types/react": "^18.2.23",
+    "@typescript-eslint/eslint-plugin": "^6.7.3",
+    "@typescript-eslint/parser": "^6.7.3",
+    "eslint": "^8.50.0",
+    "rollup": "^3.29.4",
+    "rollup-plugin-dts": "^6.0.2",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-terser": "^7.0.2"
+  },
+  "license": "MIT",
+  "name": "@fixefy/fixefy-ui-components",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Fixefy/fixefy-ui-components.git"
+  },
+  "scripts": {
+	"build": "rollup -c --bundleConfigAsCjs",
+    "pre_release": "yarn clean && yarn && yarn build",
+    "r": "yarn release",
+    "release": "yarn pre_release && npm pack && npm publish",
+    "release:config": "yarn pre_release && npm publish --userconfig ./.npmrc",
+    "clean": "rm -rf build && rm -rf dist-* && yarn clean:node",
+    "clean:node": "rm -rf node_modules",
+    "release_patch": "yarn patch && yarn release",
+    "release_minor": "yarn minor && yarn release",
+    "release_major": "yarn major && yarn release",
+    "patch": "yarn version --patch && git push --follow-tags",
+    "minor": "yarn version --minor && git push --follow-tags",
+    "major": "yarn version --major && git push --follow-tags"
+  },
+  "engines": {
+    "node": "18.17.1"
+  },
+  "files": [
+    "dist-*/**/*"
+  ],
+  "private": false,
+  "source": "src/index.ts",
+  "main": "./dist/cjs/index.js",
+  "module": "./dist/esm/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist-es/index.js",
+      "require": "./dist-cjs/index.js"
+    }
+  },
+  "version": "0.0.10"
 }

package/dist-cjs/FxActionsTray/FxActionsTray.jsx

@@ -1,146 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxActionsTray = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const image_1 = tslib_1.__importDefault(require("next/image"));
-const material_1 = require("@mui/material");
-const fixefy_ui_utils_1 = require("@fixefy/fixefy-ui-utils");
-const actions_tray_styles_1 = require("./styles/actions_tray.styles");
-function FxActionsTray({ type, onApprove, onChallenge, onClick, show, onClose, chargesCount, container, direction = 'up' }) {
-    const renderActions = () => {
-        switch (type) {
-            case 'approved':
-                return <ApprovedActions onChallenge={onChallenge}/>;
-            case 'challenge':
-                return <ChallengeActions onChallenge={onChallenge} onApprove={onApprove}/>;
-            case 'pending':
-                return <PendingActions onApprove={onApprove} onChallenge={onChallenge}/>;
-            case 'no_pricing':
-                return <NoPricingActions onApprove={onApprove} onChallenge={onChallenge}/>;
-            default:
-                return <ApprovedActions onChallenge={onChallenge}/>;
-        }
-    };
-    return (<div>
-      <material_1.Slide direction={direction} in={show} mountOnEnter unmountOnExit timeout={400} container={container}>
-        <actions_tray_styles_1.Container>
-          <actions_tray_styles_1.TitleWrapper>
-            <actions_tray_styles_1.ChargesCount>{chargesCount}</actions_tray_styles_1.ChargesCount>
-            <actions_tray_styles_1.ChargesTitle>charges selected</actions_tray_styles_1.ChargesTitle>
-          </actions_tray_styles_1.TitleWrapper>
-          <actions_tray_styles_1.Divider />
-          <div>
-            {renderActions()}
-            
-          </div>
-          <actions_tray_styles_1.Divider />
-          <div onClick={onClose}>
-            <actions_tray_styles_1.Close>close</actions_tray_styles_1.Close>
-          </div>
-        </actions_tray_styles_1.Container>
-      </material_1.Slide>
-    </div>);
-}
-exports.FxActionsTray = FxActionsTray;
-const ChallengeActions = ({ onChallenge, onApprove }) => {
-    return (<>
-      <actions_tray_styles_1.ActionBtn onClick={onChallenge} type="low">
-        <image_1.default alt="challenge" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/challenge.svg',
-        })} src={'actions/challenge.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>challenge</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onApprove}>
-        <image_1.default alt="approve" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/approve.svg',
-        })} src={'actions/approve.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>approve</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onApprove}>
-        <image_1.default alt="ignore and approve" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/ignore_and_approve.svg',
-        })} src={'actions/ignore_and_approve.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>ignore & approve</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onApprove}>
-        <image_1.default alt="change exception" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/change_exception.svg',
-        })} src={'actions/change_exception.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>Change exeption</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-    </>);
-};
-const PendingActions = ({ onApprove, onChallenge }) => {
-    return (<>
-      <actions_tray_styles_1.ActionBtn onClick={onApprove} type="excellent">
-        <image_1.default alt="approve" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/approve.svg',
-        })} src={'actions/approve.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>approve</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onChallenge}>
-        <image_1.default alt="challenge" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/challenge.svg',
-        })} src={'actions/challenge.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>challenge</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-
-      <actions_tray_styles_1.ActionBtn onClick={onChallenge}>
-        <image_1.default alt="dive in" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/dive_in.svg',
-        })} src={'actions/dive_in.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>dive in</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-    </>);
-};
-const NoPricingActions = ({ onApprove, onChallenge }) => {
-    return (<>
-      <actions_tray_styles_1.ActionBtn onClick={onChallenge}>
-        <image_1.default alt="dive in" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/dive_in.svg',
-        })} src={'actions/dive_in.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>dive in</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onApprove}>
-        <image_1.default alt="solve" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/solve.svg',
-        })} src={'actions/solve.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>solve</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onApprove}>
-        <image_1.default alt="ignore and approve" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/ignore_and_approve.svg',
-        })} src={'actions/ignore_and_approve.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>ignore & approve</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-    </>);
-};
-const ApprovedActions = ({ onChallenge }) => {
-    return (<>
-      <actions_tray_styles_1.ActionBtn onClick={onChallenge}>
-        <image_1.default alt="dive in" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actionsCards/check_exceptions.svg',
-        })} src={'actionsCards/check_exceptions.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>dive in</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-      <actions_tray_styles_1.ActionBtn onClick={onChallenge}>
-        <image_1.default alt="challenge" loader={() => (0, fixefy_ui_utils_1.imageLoader)({
-            root: 'https://cdn-dev.fixefy.me/',
-            src: 'actions/undo.svg',
-        })} src={'actions/undo.svg'} width={20} height={20} onLoad={() => console.log('loaded')} onError={(e) => console.log('error:', e)}/>
-        <actions_tray_styles_1.ActionTitle>undo</actions_tray_styles_1.ActionTitle>
-      </actions_tray_styles_1.ActionBtn>
-    </>);
-};

package/dist-cjs/FxActionsTray/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxActionsTray = void 0;
-var FxActionsTray_1 = require("./FxActionsTray");
-Object.defineProperty(exports, "FxActionsTray", { enumerable: true, get: function () { return FxActionsTray_1.FxActionsTray; } });

package/dist-cjs/FxActionsTray/styles/actions_tray.styles.jsx

@@ -1,55 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ActionTitle = exports.ActionBtn = exports.Divider = exports.TitleWrapper = exports.Close = exports.ChargesTitle = exports.ChargesCount = exports.Container = void 0;
-const FxButton_1 = require("../../FxButton");
-const material_1 = require("@mui/material");
-const styles_1 = require("@mui/material/styles");
-const filterWhite = 'invert(99%) sepia(74%) saturate(0%) hue-rotate(253deg) brightness(108%) contrast(100%)';
-const filterPrimary = 'invert(46%) sepia(48%) saturate(297%) hue-rotate(145deg) brightness(97%) contrast(90%)';
-exports.Container = (0, styles_1.styled)('div')(({ theme }) => ({
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    background: theme.palette.common.white,
-    border: '1px solid #C6DDE2',
-    boxShadow: '0px 0px 10px rgba(86, 135, 147, 0.2)',
-    borderRadius: 8,
-    padding: '16px 24px',
-    height: 38,
-    width: 'fit-content',
-    margin: 4,
-}));
-exports.ChargesCount = (0, styles_1.styled)(material_1.Typography)(({ theme }) => (Object.assign(Object.assign({}, theme.typography.table), { color: theme.palette.typography.title, fontWeight: 700, marginRight: 4 })));
-exports.ChargesTitle = (0, styles_1.styled)(material_1.Typography)(({ theme }) => (Object.assign(Object.assign({}, theme.typography.table), { color: theme.palette.typography.title })));
-exports.Close = (0, styles_1.styled)(material_1.Typography)(({ theme }) => (Object.assign(Object.assign({}, theme.typography.body1), { color: theme.palette.primary['500'], textTransform: 'uppercase', fontWeight: 600, letterSpacing: '0.5px', cursor: 'pointer' })));
-exports.TitleWrapper = (0, styles_1.styled)('div')(({ theme }) => ({
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-}));
-exports.Divider = (0, styles_1.styled)('div')(({ theme }) => ({
-    width: 1,
-    height: '100%',
-    background: theme.palette.greyscale.contrastText,
-    marginRight: 24,
-    marginLeft: 24,
-}));
-exports.ActionBtn = (0, styles_1.styled)(FxButton_1.FxButton)(({ theme, type }) => ({
-    height: 40,
-    maxHeight: 40,
-    borderRadius: 100,
-    padding: '8px 16px',
-    color: type ? theme.palette.common.white : theme.palette.primary['500'],
-    borderColor: type ? theme.palette.score[type] : theme.palette.primary['500'],
-    background: type ? theme.palette.score[type] : theme.palette.common.white,
-    marginRight: 8,
-    ['& img']: {
-        filter: type ? 'none' : filterPrimary,
-    },
-    ['&:hover']: {
-        background: type ? theme.palette.score[type] : theme.palette.common.white,
-        color: type ? theme.palette.common.white : theme.palette.primary['500'],
-        borderColor: type ? theme.palette.score[type] : theme.palette.primary['500'],
-    },
-}));
-exports.ActionTitle = (0, styles_1.styled)('span')(({ theme }) => (Object.assign(Object.assign({}, theme.typography.body1), { color: 'inherit', textTransform: 'uppercase', fontWeight: 600, letterSpacing: '0.5px', cursor: 'pointer', marginLeft: 4, marginTop: 2 })));

package/dist-cjs/FxAggregationsBar/FxAggregations.jsx

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxAggregationsBar = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const Stack_1 = tslib_1.__importDefault(require("@mui/material/Stack"));
-const structureReader_1 = require("./helpers/structureReader");
-const FxAggregationsBar = (props) => {
-    const { structure, minWidth, mb, filter, initialValues } = props;
-    const { children, extended } = structure;
-    const { variables } = extended;
-    const { collapsed } = variables;
-    return (<Stack_1.default direction="row" spacing={1.5} sx={{
-            mb: mb ? mb : 0,
-            ['& div']: {
-                minWidth: minWidth,
-            },
-            ['& > span']: {
-                minWidth: minWidth,
-            },
-        }}>
-      {children.map((child, index) => {
-            return (0, structureReader_1.structureReader)(child, filter, collapsed, initialValues);
-        })}
-    </Stack_1.default>);
-};
-exports.FxAggregationsBar = FxAggregationsBar;

package/dist-cjs/FxAggregationsBar/helpers/structureReader.jsx

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.structureReader = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const material_1 = require("@mui/material");
-const FxScore_1 = require("../../FxScore");
-const FxStatisticsBar_1 = require("../../FxStatisticsBar");
-const FxProgressCounter_1 = require("../../FxProgressCounter");
-const structureReader = (structure, filter, collapsed, initialValues) => {
-    var _a;
-    const { extended, type } = structure;
-    switch (type) {
-        case 'aggregations_primary_container':
-            return structure.children.map((child, index) => {
-                var _a, _b, _c;
-                return ((_a = child.input_type) === null || _a === void 0 ? void 0 : _a.value) === 'percentage' ? (<FxScore_1.FxScore structure={child} key={index} filter={filter} value={initialValues === null || initialValues === void 0 ? void 0 : initialValues.score}/>) : ((_b = child.input_type) === null || _b === void 0 ? void 0 : _b.value) === 'progress' ? (<FxProgressCounter_1.FxProgressCounter structure={child} filter={filter} key={index} values={initialValues}/>) : (<material_1.Box sx={{
-                        display: 'flex',
-                        justifyContent: 'center',
-                        alignItems: 'center',
-                        width: 'fit-content',
-                        padding: 2,
-                        borderRadius: 2,
-                        backgroundColor: ((_c = extended === null || extended === void 0 ? void 0 : extended.variables) === null || _c === void 0 ? void 0 : _c.bg) || '#FFFFFF',
-                    }}>
-            <FxStatisticsBar_1.FxStatisticsBar structure={child} key={index} filter={filter} collapsed={collapsed} value={initialValues ? initialValues[child.extended.object_path] : null}/>
-          </material_1.Box>);
-            });
-        case 'aggregations_secondary_container':
-            return (<material_1.Stack direction="row" divider={<material_1.Divider orientation="vertical" flexItem/>} spacing={2} sx={{
-                    backgroundColor: ((_a = extended === null || extended === void 0 ? void 0 : extended.variables) === null || _a === void 0 ? void 0 : _a.bg) || '#FFFFFF',
-                    borderRadius: '8px',
-                    padding: '24px 16px',
-                }}>
-          {structure.children.map((child, index) => {
-                    return <FxStatisticsBar_1.FxStatisticsBar structure={child} key={index} filter={filter} collapsed={collapsed} value={initialValues ? initialValues[child.extended.object_path] : null}/>;
-                })}
-        </material_1.Stack>);
-    }
-};
-exports.structureReader = structureReader;

package/dist-cjs/FxAggregationsBar/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FxAggregationsBar = void 0;
-var FxAggregations_1 = require("./FxAggregations");
-Object.defineProperty(exports, "FxAggregationsBar", { enumerable: true, get: function () { return FxAggregations_1.FxAggregationsBar; } });

package/dist-cjs/FxAggregationsBar/operations/query.js

@@ -1,66 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.STRUCTURES = void 0;
-const graphql_tag_1 = require("graphql-tag");
-exports.STRUCTURES = (0, graphql_tag_1.gql) `
-  query STRUCTURES {
-    structure(where: { name: "aggregations_invoice" }) {
-      _id
-      bundle_name
-      name
-      title
-      type
-      input_type {
-        name
-        value
-      }
-      readable_id
-      extended {
-        format
-        gql_operation
-        title_path
-        object_path
-        filter
-        variables
-      }
-      children(sort: { index: 1 }) {
-        _id
-        name
-        title
-        type
-        input_type {
-          name
-          value
-        }
-        readable_id
-        extended {
-          format
-          gql_operation
-          title_path
-          object_path
-          filter
-          variables
-        }
-        children(sort: { index: 1 }) {
-          _id
-          name
-          title
-          type
-          input_type {
-            name
-            value
-          }
-          readable_id
-          extended {
-            format
-            gql_operation
-            title_path
-            object_path
-            filter
-            variables
-          }
-        }
-      }
-    }
-  }
-`;