@pareto-engineering/design-system 5.3.0 → 5.5.0

package/src/stories/f/__generated__/QueryChoicesAllTaskStatusesQuery.graphql.js

@@ -1,122 +0,0 @@
-/**
- * @flow
- */
-
-/* eslint-disable */
-
-'use strict';
-
-/*::
-import type { ConcreteRequest } from 'relay-runtime';
-export type QueryChoicesAllTaskStatusesQueryVariables = {||};
-export type QueryChoicesAllTaskStatusesQueryResponse = {|
-  +allTaskStatuses: ?{|
-    +edges: $ReadOnlyArray<?{|
-      +node: ?{|
-        +id: string,
-        +status: string,
-      |}
-    |}>
-  |}
-|};
-export type QueryChoicesAllTaskStatusesQuery = {|
-  variables: QueryChoicesAllTaskStatusesQueryVariables,
-  response: QueryChoicesAllTaskStatusesQueryResponse,
-|};
-*/
-
-
-/*
-query QueryChoicesAllTaskStatusesQuery {
-  allTaskStatuses {
-    edges {
-      node {
-        id
-        status
-      }
-    }
-  }
-}
-*/
-
-const node/*: ConcreteRequest*/ = (function(){
-var v0 = [
-  {
-    "alias": null,
-    "args": null,
-    "concreteType": "TaskStatusNodeConnection",
-    "kind": "LinkedField",
-    "name": "allTaskStatuses",
-    "plural": false,
-    "selections": [
-      {
-        "alias": null,
-        "args": null,
-        "concreteType": "TaskStatusNodeEdge",
-        "kind": "LinkedField",
-        "name": "edges",
-        "plural": true,
-        "selections": [
-          {
-            "alias": null,
-            "args": null,
-            "concreteType": "TaskStatusNode",
-            "kind": "LinkedField",
-            "name": "node",
-            "plural": false,
-            "selections": [
-              {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "id",
-                "storageKey": null
-              },
-              {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "status",
-                "storageKey": null
-              }
-            ],
-            "storageKey": null
-          }
-        ],
-        "storageKey": null
-      }
-    ],
-    "storageKey": null
-  }
-];
-return {
-  "fragment": {
-    "argumentDefinitions": [],
-    "kind": "Fragment",
-    "metadata": null,
-    "name": "QueryChoicesAllTaskStatusesQuery",
-    "selections": (v0/*: any*/),
-    "type": "Query",
-    "abstractKey": null
-  },
-  "kind": "Request",
-  "operation": {
-    "argumentDefinitions": [],
-    "kind": "Operation",
-    "name": "QueryChoicesAllTaskStatusesQuery",
-    "selections": (v0/*: any*/)
-  },
-  "params": {
-    "cacheID": "6e05a3755df9f90893fa2a1a2759788b",
-    "id": null,
-    "metadata": {},
-    "name": "QueryChoicesAllTaskStatusesQuery",
-    "operationKind": "query",
-    "text": "query QueryChoicesAllTaskStatusesQuery {\n  allTaskStatuses {\n    edges {\n      node {\n        id\n        status\n      }\n    }\n  }\n}\n"
-  }
-};
-})();
-// prettier-ignore
-(node/*: any*/).hash = 'c71c37c5254bb38906c56c4ccd382a39';
-
-module.exports = node;

package/src/stories/f/__generated__/QueryComboboxAllTeamsQuery.graphql.js

@@ -1,139 +0,0 @@
-/**
- * @flow
- */
-
-/* eslint-disable */
-
-'use strict';
-
-/*::
-import type { ConcreteRequest } from 'relay-runtime';
-export type QueryComboboxAllTeamsQueryVariables = {|
-  name_Icontains?: ?string
-|};
-export type QueryComboboxAllTeamsQueryResponse = {|
-  +allTeams: ?{|
-    +edges: $ReadOnlyArray<?{|
-      +node: ?{|
-        +id: string,
-        +name: string,
-      |}
-    |}>
-  |}
-|};
-export type QueryComboboxAllTeamsQuery = {|
-  variables: QueryComboboxAllTeamsQueryVariables,
-  response: QueryComboboxAllTeamsQueryResponse,
-|};
-*/
-
-
-/*
-query QueryComboboxAllTeamsQuery(
-  $name_Icontains: String
-) {
-  allTeams(name_Icontains: $name_Icontains) {
-    edges {
-      node {
-        id
-        name
-      }
-    }
-  }
-}
-*/
-
-const node/*: ConcreteRequest*/ = (function(){
-var v0 = [
-  {
-    "defaultValue": null,
-    "kind": "LocalArgument",
-    "name": "name_Icontains"
-  }
-],
-v1 = [
-  {
-    "alias": null,
-    "args": [
-      {
-        "kind": "Variable",
-        "name": "name_Icontains",
-        "variableName": "name_Icontains"
-      }
-    ],
-    "concreteType": "TeamNodeConnection",
-    "kind": "LinkedField",
-    "name": "allTeams",
-    "plural": false,
-    "selections": [
-      {
-        "alias": null,
-        "args": null,
-        "concreteType": "TeamNodeEdge",
-        "kind": "LinkedField",
-        "name": "edges",
-        "plural": true,
-        "selections": [
-          {
-            "alias": null,
-            "args": null,
-            "concreteType": "TeamNode",
-            "kind": "LinkedField",
-            "name": "node",
-            "plural": false,
-            "selections": [
-              {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "id",
-                "storageKey": null
-              },
-              {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "name",
-                "storageKey": null
-              }
-            ],
-            "storageKey": null
-          }
-        ],
-        "storageKey": null
-      }
-    ],
-    "storageKey": null
-  }
-];
-return {
-  "fragment": {
-    "argumentDefinitions": (v0/*: any*/),
-    "kind": "Fragment",
-    "metadata": null,
-    "name": "QueryComboboxAllTeamsQuery",
-    "selections": (v1/*: any*/),
-    "type": "Query",
-    "abstractKey": null
-  },
-  "kind": "Request",
-  "operation": {
-    "argumentDefinitions": (v0/*: any*/),
-    "kind": "Operation",
-    "name": "QueryComboboxAllTeamsQuery",
-    "selections": (v1/*: any*/)
-  },
-  "params": {
-    "cacheID": "a507170c1616920d93ea7ceb061097d1",
-    "id": null,
-    "metadata": {},
-    "name": "QueryComboboxAllTeamsQuery",
-    "operationKind": "query",
-    "text": "query QueryComboboxAllTeamsQuery(\n  $name_Icontains: String\n) {\n  allTeams(name_Icontains: $name_Icontains) {\n    edges {\n      node {\n        id\n        name\n      }\n    }\n  }\n}\n"
-  }
-};
-})();
-// prettier-ignore
-(node/*: any*/).hash = '243f007a2e8d0c359ad2976f1c68a472';
-
-module.exports = node;

package/src/stories/f/__generated__/QuerySelectAllTaskStatusesQuery.graphql.js

@@ -1,122 +0,0 @@
-/**
- * @flow
- */
-
-/* eslint-disable */
-
-'use strict';
-
-/*::
-import type { ConcreteRequest } from 'relay-runtime';
-export type QuerySelectAllTaskStatusesQueryVariables = {||};
-export type QuerySelectAllTaskStatusesQueryResponse = {|
-  +allTaskStatuses: ?{|
-    +edges: $ReadOnlyArray<?{|
-      +node: ?{|
-        +id: string,
-        +status: string,
-      |}
-    |}>
-  |}
-|};
-export type QuerySelectAllTaskStatusesQuery = {|
-  variables: QuerySelectAllTaskStatusesQueryVariables,
-  response: QuerySelectAllTaskStatusesQueryResponse,
-|};
-*/
-
-
-/*
-query QuerySelectAllTaskStatusesQuery {
-  allTaskStatuses {
-    edges {
-      node {
-        id
-        status
-      }
-    }
-  }
-}
-*/
-
-const node/*: ConcreteRequest*/ = (function(){
-var v0 = [
-  {
-    "alias": null,
-    "args": null,
-    "concreteType": "TaskStatusNodeConnection",
-    "kind": "LinkedField",
-    "name": "allTaskStatuses",
-    "plural": false,
-    "selections": [
-      {
-        "alias": null,
-        "args": null,
-        "concreteType": "TaskStatusNodeEdge",
-        "kind": "LinkedField",
-        "name": "edges",
-        "plural": true,
-        "selections": [
-          {
-            "alias": null,
-            "args": null,
-            "concreteType": "TaskStatusNode",
-            "kind": "LinkedField",
-            "name": "node",
-            "plural": false,
-            "selections": [
-              {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "id",
-                "storageKey": null
-              },
-              {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "status",
-                "storageKey": null
-              }
-            ],
-            "storageKey": null
-          }
-        ],
-        "storageKey": null
-      }
-    ],
-    "storageKey": null
-  }
-];
-return {
-  "fragment": {
-    "argumentDefinitions": [],
-    "kind": "Fragment",
-    "metadata": null,
-    "name": "QuerySelectAllTaskStatusesQuery",
-    "selections": (v0/*: any*/),
-    "type": "Query",
-    "abstractKey": null
-  },
-  "kind": "Request",
-  "operation": {
-    "argumentDefinitions": [],
-    "kind": "Operation",
-    "name": "QuerySelectAllTaskStatusesQuery",
-    "selections": (v0/*: any*/)
-  },
-  "params": {
-    "cacheID": "bd929dd60893f2a67f23d8cd2fb003de",
-    "id": null,
-    "metadata": {},
-    "name": "QuerySelectAllTaskStatusesQuery",
-    "operationKind": "query",
-    "text": "query QuerySelectAllTaskStatusesQuery {\n  allTaskStatuses {\n    edges {\n      node {\n        id\n        status\n      }\n    }\n  }\n}\n"
-  }
-};
-})();
-// prettier-ignore
-(node/*: any*/).hash = '31d9d1e820e814f7cee8ef7b273074ab';
-
-module.exports = node;

package/src/stories/g/DragAndDrop.stories.jsx

@@ -1,114 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import { useRef } from 'react'
-
-import { TextInput, DragAndDrop, FormDebugger } from 'ui'
-
-import { Formik, Form } from 'formik'
-
-export default {
-  title        :'g/DragAndDrop',
-  component    :DragAndDrop,
-  subcomponents:{
-    // Item:DragAndDrop.Item
-  },
-  decorators:[
-    // storyfn => <div className="">{ storyfn() }</div>,
-  ],
-  argTypes:{
-    backgroundColor:{ control: 'color' },
-  },
-}
-
-const DummyContent = ({ children }) => (
-  <div
-    style={{
-      padding        :'1rem',
-      backgroundColor:'white',
-      border         :'1px solid black',
-    }}
-  >
-    {children}
-  </div>
-)
-
-export const Base = {
-  args:{
-    items:Array(8).fill().map((_, index) => ({
-      disabled:index === 0,
-      Content :(
-        <DummyContent>
-          Item
-          {index + 1}
-        </DummyContent>
-      ),
-      key:`Item ${index + 1}`,
-    })),
-  },
-}
-
-const DummyContentWithInput = ({ index }) => (
-  <div
-    style={{
-      display   :'flex',
-      alignItems:'center',
-      width     :'100%',
-      gap       :'var(--gap)',
-    }}
-  >
-    <span className="ai-icon">H</span>
-    <div
-      style={{
-        borderBottom:'1px solid var(--ui-lines)',
-        padding     :'calc(var(--theme-default-padding) / 2)',
-        display     :'flex',
-        alignItems  :'center',
-        width       :'100%',
-        gap         :'var(--gap)',
-      }}
-    >
-      <p
-        style={{
-          margin:'0',
-        }}
-      >
-        Input
-        {index + 1}
-      </p>
-      <TextInput name={`input-${index + 1}`} />
-    </div>
-  </div>
-)
-
-export const WithFormikInputs = {
-  render:({ items }) => {
-    const formikRef = useRef()
-
-    const handleReorder = (orderedItems) => {
-      const { values, setFieldValue } = formikRef.current || {}
-      const orderedInputValues = orderedItems.map(({ identifier }) => values?.[identifier])
-
-      setFieldValue('items', orderedInputValues)
-    }
-    return (
-      <Formik
-        initialValues={{ items: [] }}
-        innerRef={formikRef}
-      >
-        <Form>
-          <DragAndDrop onOrderChange={handleReorder} items={items} />
-          <FormDebugger />
-        </Form>
-      </Formik>
-    )
-  },
-  args:{
-    items:Array(8).fill().map((_, index) => ({
-      Content:(
-        <DummyContentWithInput index={index} />
-      ),
-      identifier:`input-${index + 1}`,
-    })),
-  },
-}

package/src/stories/g/ExpandableLexicalPreview.stories.jsx

@@ -1,37 +0,0 @@
-/* @pareto-engineering/generator-front 1.0.12 */
-import * as React from 'react'
-
-import { ExpandableLexicalPreview, AppContextProvider } from 'ui'
-
-export default {
-  title        :'g/ExpandableLexicalPreview',
-  component    :ExpandableLexicalPreview,
-  subcomponents:{
-    // Item:TextareaInput.Item
-  },
-  decorators:[
-    (storyfn) => (
-      <AppContextProvider>
-        { storyfn() }
-      </AppContextProvider>
-    ),
-  ],
-  argTypes:{
-    color:{ control: 'text' },
-  },
-}
-
-// eslint-disable-next-line no-useless-escape
-const nodes = '{\"root\":{\"children\":[{\"children\":[{\"children\":[{\"detail\":0,\"format\":1,\"mode\":\"normal\",\"style\":\"\",\"text\":\"This is bold.\",\"type\":\"text\",\"version\":1}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"listitem\",\"version\":1,\"value\":1},{\"children\":[{\"detail\":0,\"format\":2,\"mode\":\"normal\",\"style\":\"\",\"text\":\"This is italic.\",\"type\":\"text\",\"version\":1}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"listitem\",\"version\":1,\"value\":2},{\"children\":[{\"detail\":0,\"format\":8,\"mode\":\"normal\",\"style\":\"\",\"text\":\"This is underlined.\",\"type\":\"text\",\"version\":1}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"listitem\",\"version\":1,\"value\":3},{\"children\":[{\"children\":[{\"children\":[{\"detail\":0,\"format\":4,\"mode\":\"normal\",\"style\":\"\",\"text\":\"This is struck.\",\"type\":\"text\",\"version\":1}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":1,\"type\":\"listitem\",\"version\":1,\"value\":1}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"list\",\"version\":1,\"listType\":\"bullet\",\"start\":1,\"tag\":\"ul\"}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"listitem\",\"version\":1,\"value\":4}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"list\",\"version\":1,\"listType\":\"bullet\",\"start\":1,\"tag\":\"ul\"}],\"direction\":\"ltr\",\"format\":\"\",\"indent\":0,\"type\":\"root\",\"version\":1}}'
-
-const Template = (args) => (
-  <ExpandableLexicalPreview {...args} />
-)
-
-export const Base = Template.bind({})
-Base.args = {
-  nodes,
-  name     :'taskDescription',
-  pageTitle:'Task Instructions',
-  header   :'Task Instructions',
-}

package/src/stories/g/FormBuilder.stories.jsx

@@ -1,114 +0,0 @@
-/* @pareto-engineering/generator-front 1.1.1-alpha.2 */
-import * as React from 'react'
-
-import { useState } from 'react'
-
-import { FormBuilder, Button } from 'ui'
-
-export default {
-  title        :'g/FormBuilder',
-  component    :FormBuilder,
-  subcomponents:{
-    // Item:FormBuilder.Item
-  },
-  decorators:[
-    // storyfn => <div className="">{ storyfn() }</div>,
-  ],
-  argTypes:{
-    backgroundColor:{ control: 'color' },
-  },
-}
-
-export const Builder = {
-  args:{
-    mode:'build',
-  },
-  render:(args) => {
-    const [values, setValues] = useState({})
-
-    const handleSampleSaveOnNext = (argsValues) => {
-      setValues(argsValues)
-    }
-
-    return (
-      <>
-        <FormBuilder {...args} onBuilderFormSave={handleSampleSaveOnNext} formBuilderId="some-sample-form-id" />
-        <Button form="some-sample-form-id" type="submit">
-          Sample Next Button in a Work flow
-        </Button>
-        <pre>{JSON.stringify(values, null, 2)}</pre>
-      </>
-    )
-  },
-}
-
-const sampleFormData = {
-  sections:[
-    {
-      title      :'Hello',
-      description:'{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Test file upload ","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
-      key        :'section-0',
-      inputs     :[
-        {
-          name                 :'section_0_input_0',
-          label                :'The file upload ',
-          type                 :'file',
-          required             :false,
-          options              :[],
-          conditionalLogic     :null,
-          description          :'',
-          maxCount             :3,
-          showSpecificFileTypes:true,
-          accept               :[
-            '.mp4,.ogg,.webm,video/mp4,video/ogg,video/webm',
-            '.pdf,application/pdf',
-          ],
-        },
-      ],
-      orderedInputDragIds:[],
-      navigation         :{
-        nextSection:'next',
-      },
-    },
-  ],
-}
-
-export const Renderer = {
-  args:{
-    mode    :'render',
-    formData:sampleFormData,
-  },
-  render:(args) => {
-    const [values, setValues] = useState({})
-
-    const handleFormDataUpdateWithValues = (argsValues) => {
-      setValues(argsValues)
-    }
-
-    return (
-      <>
-        <FormBuilder
-          {...args}
-          onRendererFormSave={handleFormDataUpdateWithValues}
-        />
-        <pre>{JSON.stringify(values, null, 2)}</pre>
-      </>
-    )
-  },
-}
-
-export const RendererWithSubmit = {
-  ...Renderer,
-  args:{
-    ...Renderer.args,
-    shouldSubmit:true,
-  },
-}
-
-export const RendererWithDisabled = {
-  ...Renderer,
-  args:{
-    ...Renderer.args,
-    readOnly:true,
-  },
-}

package/src/stories/original/Button.jsx

@@ -1,55 +0,0 @@
-import React, { useState } from 'react'
-import PropTypes from 'prop-types'
-import './button.css'
-
-/**
- * Primary UI component for user interaction
- */
-export const Button = ({
-  primary, backgroundColor, size, label, ...props
-}) => {
-  const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary'
-  const [state, setState] = useState('not clicked')
-  return (
-    <button
-      type="button"
-      className={['storybook-button', `storybook-button--${size}`, mode].join(' ')}
-      style={backgroundColor && { backgroundColor }}
-      {...props}
-      onClick={() => setState('clicked')}
-    >
-      { state }
-      {label}
-    </button>
-  )
-}
-
-Button.propTypes = {
-  /**
-   * Is this the principal call to action on the page?
-   */
-  primary        :PropTypes.bool,
-  /**
-   * What background color to use
-   */
-  backgroundColor:PropTypes.string,
-  /**
-   * How large should the button be?
-   */
-  size           :PropTypes.oneOf(['small', 'medium', 'large']),
-  /**
-   * Button contents
-   */
-  label          :PropTypes.string.isRequired,
-  /**
-   * Optional click handler
-   */
-  onClick        :PropTypes.func,
-}
-
-Button.defaultProps = {
-  backgroundColor:null,
-  primary        :false,
-  size           :'medium',
-  onClick        :undefined,
-}