@ynput/ayon-frontend-shared 0.2.20 → 0.2.21

package/dist/shared/src/components/SimpleFormDialog/SimpleFormDialog.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleFormDialog.cjs.js","sources":["../../../../../src/components/SimpleFormDialog/SimpleFormDialog.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport React, { useState, useEffect } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport {\n  Button,\n  Spacer,\n  Dialog,\n  FormLayout,\n  FormRow,\n  InputNumber,\n  InputText,\n  InputSwitch,\n  Dropdown,\n  DefaultItemTemplate,\n} from '@ynput/ayon-react-components'\nimport { Badge } from '@shared/components'\n\nimport type { FormSelectOption, SimpleFormField } from '@shared/api'\n\nexport type SimpleFormValue = string | number | boolean | string[] | null | undefined\nexport type SimpleFormValueDict = Record<string, SimpleFormValue>\n\nconst getDefaults = (fields: SimpleFormField[], values: SimpleFormValueDict) => {\n  const defaults: SimpleFormValueDict = {}\n  fields.forEach((field) => {\n    if (field.name in values) {\n      defaults[field.name] = values[field.name]\n    } else if (field.value) {\n      defaults[field.name] = field.value\n    } else if (field.type === 'boolean') {\n      defaults[field.name] = false\n    } else if (field.type === 'integer') {\n      defaults[field.name] = 0\n    } else if (field.type === 'float') {\n      defaults[field.name] = 0.0\n    } else if (field.type === 'text') {\n      defaults[field.name] = ''\n    } else if (field.type === 'multiselect') {\n      defaults[field.name] = []\n    }\n  })\n  return defaults\n}\n\nconst LabelContainer = styled.div`\n  &.normal {\n    // maybe something here\n  }\n\n  &.info,\n  &.warning,\n  &.error {\n    padding: 0.5rem;\n    text-align: center;\n    font-weight: bold;\n    margin: 1rem 0;\n  }\n\n  &.info {\n    background-color: var(--md-sys-color-on-secondary-dark);\n  }\n  &.warning {\n    background-color: var(--md-sys-color-warning-container-dark);\n  }\n  &.error {\n    background-color: var(--md-sys-color-on-error-dark);\n  }\n`\n\ntype FormLabelProps = {\n  field: SimpleFormField\n}\n\nconst FormLabel = ({ field }: FormLabelProps) => {\n  const text = typeof field.value === 'string' ? field.value : 'Invalid label value'\n\n  return (\n    <LabelContainer className={field.highlight || 'normal'}>\n      <ReactMarkdown>{text}</ReactMarkdown>\n    </LabelContainer>\n  )\n}\n\ntype FormFieldProps = {\n  field: SimpleFormField\n  value: SimpleFormValue\n  onChange: (value: SimpleFormValue) => void\n}\n\nconst DropdownItemTemplate = (option: FormSelectOption) => {\n  const endContent = (\n    <>\n      <div style={{ flex: 1 }} />\n      {option.badges && option.badges.map((badge, index) => <Badge key={index}>{badge}</Badge>)}\n    </>\n  )\n  return (\n    <DefaultItemTemplate\n      option={option}\n      dataKey={'value'}\n      labelKey={'label'}\n      value={[option.value]}\n      endContent={endContent}\n    />\n  )\n}\n\nconst FormField = ({ field, value, onChange }: FormFieldProps) => {\n  if (field.type === 'text') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <InputText\n        value={parsedValue}\n        onChange={(e) => onChange(e.target.value)}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'boolean') {\n    const parsedValue = typeof value === 'boolean' ? value : false\n\n    const handleCheckboxEvent = (\n      event: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>,\n    ) => {\n      if ('target' in event && 'checked' in event.target) {\n        onChange((event.target as HTMLInputElement).checked)\n      }\n    }\n\n    return <InputSwitch checked={parsedValue} onChange={handleCheckboxEvent} />\n  }\n  if (field.type === 'integer') {\n    const parsedValue = typeof value === 'number' ? value : 0\n    return (\n      <InputNumber\n        value={parsedValue}\n        onChange={(e) => onChange(parseInt(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'float') {\n    const parsedValue = typeof value === 'number' ? value : 0.0\n    return (\n      <InputNumber\n        type=\"number\"\n        value={parsedValue}\n        onChange={(e) => onChange(parseFloat(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n\n  if (field.type === 'select') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue ? [parsedValue] : []}\n        onSelectionChange={(e) => onChange(e[0])}\n        className={`form-field`}\n        multiSelect={false}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  } // Handle select\n\n  if (field.type === 'multiselect') {\n    const parsedValue = Array.isArray(value) ? value : []\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue}\n        onSelectionChange={(e) => onChange(e)}\n        className={`form-field`}\n        multiSelect={true}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  }\n}\n\nexport interface SimpleFormDialogProps {\n  title: string\n  fields: SimpleFormField[]\n  values?: SimpleFormValueDict\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n  onClose: () => void\n  onSubmit: (values: SimpleFormValueDict) => void\n  isOpen: boolean\n}\n\nexport const SimpleFormDialog = ({\n  fields,\n  values,\n  onClose,\n  onSubmit,\n  isOpen,\n  title,\n  submitLabel,\n  cancelLabel,\n  submitIcon,\n  cancelIcon,\n}: SimpleFormDialogProps) => {\n  const [formData, setFormData] = useState<SimpleFormValueDict | null>(null)\n\n  useEffect(() => {\n    if (isOpen) {\n      const defaults = getDefaults(fields, values || {})\n      setFormData(defaults)\n    }\n  }, [isOpen, fields, values])\n\n  if (!isOpen) return null\n  if (!formData) return null\n\n  const footer = (\n    <div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n      <Spacer />\n      {cancelLabel && <Button onClick={() => onClose()} label={cancelLabel} icon={cancelIcon} />}\n      {submitLabel && (\n        <Button\n          onClick={() => onSubmit(formData)}\n          label={submitLabel}\n          icon={submitIcon}\n          variant=\"filled\"\n        />\n      )}\n    </div>\n  )\n\n  return (\n    <Dialog\n      isOpen={isOpen}\n      onClose={onClose}\n      header={title}\n      footer={footer}\n      style={{ minHeight: 500, minWidth: 600 }}\n    >\n      <FormLayout\n        style={{ width: '95%' }}\n        onKeyDown={(e) => {\n          e.stopPropagation()\n        }}\n      >\n        {fields.map((field: SimpleFormField) => {\n          if (field.type === 'label') {\n            return <FormLabel key={field.name} field={field} />\n          }\n\n          return (\n            <FormRow key={field.name} label={field.label || ''}>\n              <FormField\n                field={field}\n                value={formData[field.name]}\n                onChange={(value) => {\n                  setFormData((prev) => ({\n                    ...prev,\n                    [field.name]: value,\n                  }))\n                }}\n              />\n            </FormRow>\n          )\n        })}\n      </FormLayout>\n    </Dialog>\n  )\n}\n"],"names":["jsx","jsxs","Fragment","Badge","DefaultItemTemplate","InputText","InputSwitch","InputNumber","Dropdown","useState","useEffect","Spacer","Button","Dialog","FormLayout","FormRow"],"mappings":"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"}
+{"version":3,"file":"SimpleFormDialog.cjs.js","sources":["../../../../../src/components/SimpleFormDialog/SimpleFormDialog.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport React, { useState, useEffect } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport {\n  Button,\n  Spacer,\n  Dialog,\n  FormLayout,\n  FormRow,\n  InputNumber,\n  InputText,\n  InputSwitch,\n  Dropdown,\n  DefaultItemTemplate,\n} from '@ynput/ayon-react-components'\nimport { Badge } from '@shared/components'\n\nimport type { FormSelectOption, SimpleFormField } from '@shared/api'\n\nexport type SimpleFormValue = string | number | boolean | string[] | null | undefined\nexport type SimpleFormValueDict = Record<string, SimpleFormValue>\n\nconst getDefaults = (fields: SimpleFormField[], values: SimpleFormValueDict) => {\n  const defaults: SimpleFormValueDict = {}\n  fields.forEach((field) => {\n    if (field.name in values) {\n      defaults[field.name] = values[field.name]\n    } else if (field.value) {\n      defaults[field.name] = field.value\n    } else if (field.type === 'boolean') {\n      defaults[field.name] = false\n    } else if (field.type === 'integer') {\n      defaults[field.name] = 0\n    } else if (field.type === 'float') {\n      defaults[field.name] = 0.0\n    } else if (field.type === 'text') {\n      defaults[field.name] = ''\n    } else if (field.type === 'multiselect') {\n      defaults[field.name] = []\n    }\n  })\n  return defaults\n}\n\nconst LabelContainer = styled.div`\n  &.normal {\n    // maybe something here\n  }\n\n  &.info,\n  &.warning,\n  &.error {\n    padding: 0.5rem;\n    text-align: center;\n    font-weight: bold;\n    margin: 1rem 0;\n  }\n\n  &.info {\n    background-color: var(--md-sys-color-on-secondary-dark);\n  }\n  &.warning {\n    background-color: var(--md-sys-color-warning-container-dark);\n  }\n  &.error {\n    background-color: var(--md-sys-color-on-error-dark);\n  }\n`\n\ntype FormLabelProps = {\n  field: SimpleFormField\n}\n\nconst FormLabel = ({ field }: FormLabelProps) => {\n  const text = typeof field.value === 'string' ? field.value : 'Invalid label value'\n\n  return (\n    <LabelContainer className={field.highlight || 'normal'}>\n      <ReactMarkdown>{text}</ReactMarkdown>\n    </LabelContainer>\n  )\n}\n\ntype FormFieldProps = {\n  field: SimpleFormField\n  value: SimpleFormValue\n  onChange: (value: SimpleFormValue) => void\n}\n\nconst DropdownItemTemplate = (option: FormSelectOption) => {\n  const endContent = (\n    <>\n      <div style={{ flex: 1 }} />\n      {option.badges && option.badges.map((badge, index) => <Badge key={index}>{badge}</Badge>)}\n    </>\n  )\n  return (\n    <DefaultItemTemplate\n      option={option}\n      dataKey={'value'}\n      labelKey={'label'}\n      value={[option.value]}\n      endContent={endContent}\n    />\n  )\n}\n\nconst FormField = ({ field, value, onChange }: FormFieldProps) => {\n  if (field.type === 'text') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <InputText\n        value={parsedValue}\n        onChange={(e) => onChange(e.target.value)}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'boolean') {\n    const parsedValue = typeof value === 'boolean' ? value : false\n\n    const handleCheckboxEvent = (\n      event: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>,\n    ) => {\n      if ('target' in event && 'checked' in event.target) {\n        onChange((event.target as HTMLInputElement).checked)\n      }\n    }\n\n    return <InputSwitch checked={parsedValue} onChange={handleCheckboxEvent} />\n  }\n  if (field.type === 'integer') {\n    const parsedValue = typeof value === 'number' ? value : 0\n    return (\n      <InputNumber\n        value={parsedValue}\n        onChange={(e) => onChange(parseInt(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'float') {\n    const parsedValue = typeof value === 'number' ? value : 0.0\n    return (\n      <InputNumber\n        type=\"number\"\n        value={parsedValue}\n        onChange={(e) => onChange(parseFloat(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n\n  if (field.type === 'select') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue ? [parsedValue] : []}\n        onSelectionChange={(e) => onChange(e[0])}\n        className={`form-field`}\n        multiSelect={false}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  } // Handle select\n\n  if (field.type === 'multiselect') {\n    const parsedValue = Array.isArray(value) ? value : []\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue}\n        onSelectionChange={(e) => onChange(e)}\n        className={`form-field`}\n        multiSelect={true}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  }\n}\n\nexport interface SimpleFormDialogProps {\n  title: string\n  fields: SimpleFormField[]\n  values?: SimpleFormValueDict\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n  onClose: () => void\n  onSubmit: (values: SimpleFormValueDict) => void\n  isOpen: boolean\n}\n\nexport const SimpleFormDialog = ({\n  fields,\n  values,\n  onClose,\n  onSubmit,\n  isOpen,\n  title,\n  submitLabel,\n  cancelLabel,\n  submitIcon,\n  cancelIcon,\n}: SimpleFormDialogProps) => {\n  const [formData, setFormData] = useState<SimpleFormValueDict | null>(null)\n\n  useEffect(() => {\n    if (isOpen) {\n      const defaults = getDefaults(fields, values || {})\n      setFormData(defaults)\n    }\n  }, [isOpen, fields, values])\n\n  if (!isOpen) return null\n  if (!formData) return null\n\n  const footer = (\n    <div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n      <Spacer />\n      {cancelLabel && <Button onClick={() => onClose()} label={cancelLabel} icon={cancelIcon} />}\n      {submitLabel && (\n        <Button\n          onClick={() => onSubmit(formData)}\n          label={submitLabel}\n          icon={submitIcon}\n          variant=\"filled\"\n        />\n      )}\n    </div>\n  )\n\n  return (\n    <Dialog\n      isOpen={isOpen}\n      onClose={onClose}\n      header={title}\n      footer={footer}\n      style={{ minHeight: 500, minWidth: 600 }}\n    >\n      <FormLayout\n        style={{ width: '95%' }}\n        onKeyDown={(e) => {\n          e.stopPropagation()\n        }}\n      >\n        {fields.map((field: SimpleFormField) => {\n          if (field.type === 'label') {\n            return <FormLabel key={field.name} field={field} />\n          }\n\n          return (\n            <FormRow key={field.name} label={field.label || ''}>\n              <FormField\n                field={field}\n                value={formData[field.name]}\n                onChange={(value) => {\n                  setFormData((prev) => ({\n                    ...prev,\n                    [field.name]: value,\n                  }))\n                }}\n              />\n            </FormRow>\n          )\n        })}\n      </FormLayout>\n    </Dialog>\n  )\n}\n"],"names":["jsx","jsxs","Fragment","Badge","DefaultItemTemplate","InputText","InputSwitch","InputNumber","Dropdown","useState","useEffect","Spacer","Button","Dialog","FormLayout","FormRow"],"mappings":"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"}

package/dist/shared/src/components/SimpleFormDialog/SimpleFormDialog.es.js

@@ -170,6 +170,10 @@ import "../../containers/DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.
 import "../../containers/Actions/Actions.styled.es.js";
 import "../../containers/Actions/ActionsDropdown/ActionsDropdown.es.js";
 import "../../containers/Actions/ActionIcon.es.js";
+import "../../containers/Views/context/ViewsContext.es.js";
+import "../../containers/Views/Views.styled.es.js";
+import "../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
+import "../../containers/Views/ViewsMenu/ViewsMenu.es.js";
 import "../EntityPanelUploader/EntityPanelUploader.styled.es.js";
 import "../EntityPath/EntityPath.styled.es.js";
 import "../EntityPath/SegmentProvider.es.js";
@@ -190,9 +194,6 @@ import "../VersionUploader/components/UploadVersionDialog.es.js";
 import "../VersionUploader/context/VersionUploadContext.es.js";
 import "../Feedback/FeedbackContext.es.js";
 import "../Feedback/SupportBubble.es.js";
-import "../Views/context/ViewsContext.es.js";
-import "../Views/Views.styled.es.js";
-import "../Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
 const getDefaults = (fields, values) => {
   const defaults = {};
   fields.forEach((field) => {

package/dist/shared/src/components/SimpleFormDialog/SimpleFormDialog.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SimpleFormDialog.es.js","sources":["../../../../../src/components/SimpleFormDialog/SimpleFormDialog.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport React, { useState, useEffect } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport {\n  Button,\n  Spacer,\n  Dialog,\n  FormLayout,\n  FormRow,\n  InputNumber,\n  InputText,\n  InputSwitch,\n  Dropdown,\n  DefaultItemTemplate,\n} from '@ynput/ayon-react-components'\nimport { Badge } from '@shared/components'\n\nimport type { FormSelectOption, SimpleFormField } from '@shared/api'\n\nexport type SimpleFormValue = string | number | boolean | string[] | null | undefined\nexport type SimpleFormValueDict = Record<string, SimpleFormValue>\n\nconst getDefaults = (fields: SimpleFormField[], values: SimpleFormValueDict) => {\n  const defaults: SimpleFormValueDict = {}\n  fields.forEach((field) => {\n    if (field.name in values) {\n      defaults[field.name] = values[field.name]\n    } else if (field.value) {\n      defaults[field.name] = field.value\n    } else if (field.type === 'boolean') {\n      defaults[field.name] = false\n    } else if (field.type === 'integer') {\n      defaults[field.name] = 0\n    } else if (field.type === 'float') {\n      defaults[field.name] = 0.0\n    } else if (field.type === 'text') {\n      defaults[field.name] = ''\n    } else if (field.type === 'multiselect') {\n      defaults[field.name] = []\n    }\n  })\n  return defaults\n}\n\nconst LabelContainer = styled.div`\n  &.normal {\n    // maybe something here\n  }\n\n  &.info,\n  &.warning,\n  &.error {\n    padding: 0.5rem;\n    text-align: center;\n    font-weight: bold;\n    margin: 1rem 0;\n  }\n\n  &.info {\n    background-color: var(--md-sys-color-on-secondary-dark);\n  }\n  &.warning {\n    background-color: var(--md-sys-color-warning-container-dark);\n  }\n  &.error {\n    background-color: var(--md-sys-color-on-error-dark);\n  }\n`\n\ntype FormLabelProps = {\n  field: SimpleFormField\n}\n\nconst FormLabel = ({ field }: FormLabelProps) => {\n  const text = typeof field.value === 'string' ? field.value : 'Invalid label value'\n\n  return (\n    <LabelContainer className={field.highlight || 'normal'}>\n      <ReactMarkdown>{text}</ReactMarkdown>\n    </LabelContainer>\n  )\n}\n\ntype FormFieldProps = {\n  field: SimpleFormField\n  value: SimpleFormValue\n  onChange: (value: SimpleFormValue) => void\n}\n\nconst DropdownItemTemplate = (option: FormSelectOption) => {\n  const endContent = (\n    <>\n      <div style={{ flex: 1 }} />\n      {option.badges && option.badges.map((badge, index) => <Badge key={index}>{badge}</Badge>)}\n    </>\n  )\n  return (\n    <DefaultItemTemplate\n      option={option}\n      dataKey={'value'}\n      labelKey={'label'}\n      value={[option.value]}\n      endContent={endContent}\n    />\n  )\n}\n\nconst FormField = ({ field, value, onChange }: FormFieldProps) => {\n  if (field.type === 'text') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <InputText\n        value={parsedValue}\n        onChange={(e) => onChange(e.target.value)}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'boolean') {\n    const parsedValue = typeof value === 'boolean' ? value : false\n\n    const handleCheckboxEvent = (\n      event: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>,\n    ) => {\n      if ('target' in event && 'checked' in event.target) {\n        onChange((event.target as HTMLInputElement).checked)\n      }\n    }\n\n    return <InputSwitch checked={parsedValue} onChange={handleCheckboxEvent} />\n  }\n  if (field.type === 'integer') {\n    const parsedValue = typeof value === 'number' ? value : 0\n    return (\n      <InputNumber\n        value={parsedValue}\n        onChange={(e) => onChange(parseInt(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'float') {\n    const parsedValue = typeof value === 'number' ? value : 0.0\n    return (\n      <InputNumber\n        type=\"number\"\n        value={parsedValue}\n        onChange={(e) => onChange(parseFloat(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n\n  if (field.type === 'select') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue ? [parsedValue] : []}\n        onSelectionChange={(e) => onChange(e[0])}\n        className={`form-field`}\n        multiSelect={false}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  } // Handle select\n\n  if (field.type === 'multiselect') {\n    const parsedValue = Array.isArray(value) ? value : []\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue}\n        onSelectionChange={(e) => onChange(e)}\n        className={`form-field`}\n        multiSelect={true}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  }\n}\n\nexport interface SimpleFormDialogProps {\n  title: string\n  fields: SimpleFormField[]\n  values?: SimpleFormValueDict\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n  onClose: () => void\n  onSubmit: (values: SimpleFormValueDict) => void\n  isOpen: boolean\n}\n\nexport const SimpleFormDialog = ({\n  fields,\n  values,\n  onClose,\n  onSubmit,\n  isOpen,\n  title,\n  submitLabel,\n  cancelLabel,\n  submitIcon,\n  cancelIcon,\n}: SimpleFormDialogProps) => {\n  const [formData, setFormData] = useState<SimpleFormValueDict | null>(null)\n\n  useEffect(() => {\n    if (isOpen) {\n      const defaults = getDefaults(fields, values || {})\n      setFormData(defaults)\n    }\n  }, [isOpen, fields, values])\n\n  if (!isOpen) return null\n  if (!formData) return null\n\n  const footer = (\n    <div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n      <Spacer />\n      {cancelLabel && <Button onClick={() => onClose()} label={cancelLabel} icon={cancelIcon} />}\n      {submitLabel && (\n        <Button\n          onClick={() => onSubmit(formData)}\n          label={submitLabel}\n          icon={submitIcon}\n          variant=\"filled\"\n        />\n      )}\n    </div>\n  )\n\n  return (\n    <Dialog\n      isOpen={isOpen}\n      onClose={onClose}\n      header={title}\n      footer={footer}\n      style={{ minHeight: 500, minWidth: 600 }}\n    >\n      <FormLayout\n        style={{ width: '95%' }}\n        onKeyDown={(e) => {\n          e.stopPropagation()\n        }}\n      >\n        {fields.map((field: SimpleFormField) => {\n          if (field.type === 'label') {\n            return <FormLabel key={field.name} field={field} />\n          }\n\n          return (\n            <FormRow key={field.name} label={field.label || ''}>\n              <FormField\n                field={field}\n                value={formData[field.name]}\n                onChange={(value) => {\n                  setFormData((prev) => ({\n                    ...prev,\n                    [field.name]: value,\n                  }))\n                }}\n              />\n            </FormRow>\n          )\n        })}\n      </FormLayout>\n    </Dialog>\n  )\n}\n"],"names":["jsx","jsxs","Fragment"],"mappings":"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"}
+{"version":3,"file":"SimpleFormDialog.es.js","sources":["../../../../../src/components/SimpleFormDialog/SimpleFormDialog.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport React, { useState, useEffect } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport {\n  Button,\n  Spacer,\n  Dialog,\n  FormLayout,\n  FormRow,\n  InputNumber,\n  InputText,\n  InputSwitch,\n  Dropdown,\n  DefaultItemTemplate,\n} from '@ynput/ayon-react-components'\nimport { Badge } from '@shared/components'\n\nimport type { FormSelectOption, SimpleFormField } from '@shared/api'\n\nexport type SimpleFormValue = string | number | boolean | string[] | null | undefined\nexport type SimpleFormValueDict = Record<string, SimpleFormValue>\n\nconst getDefaults = (fields: SimpleFormField[], values: SimpleFormValueDict) => {\n  const defaults: SimpleFormValueDict = {}\n  fields.forEach((field) => {\n    if (field.name in values) {\n      defaults[field.name] = values[field.name]\n    } else if (field.value) {\n      defaults[field.name] = field.value\n    } else if (field.type === 'boolean') {\n      defaults[field.name] = false\n    } else if (field.type === 'integer') {\n      defaults[field.name] = 0\n    } else if (field.type === 'float') {\n      defaults[field.name] = 0.0\n    } else if (field.type === 'text') {\n      defaults[field.name] = ''\n    } else if (field.type === 'multiselect') {\n      defaults[field.name] = []\n    }\n  })\n  return defaults\n}\n\nconst LabelContainer = styled.div`\n  &.normal {\n    // maybe something here\n  }\n\n  &.info,\n  &.warning,\n  &.error {\n    padding: 0.5rem;\n    text-align: center;\n    font-weight: bold;\n    margin: 1rem 0;\n  }\n\n  &.info {\n    background-color: var(--md-sys-color-on-secondary-dark);\n  }\n  &.warning {\n    background-color: var(--md-sys-color-warning-container-dark);\n  }\n  &.error {\n    background-color: var(--md-sys-color-on-error-dark);\n  }\n`\n\ntype FormLabelProps = {\n  field: SimpleFormField\n}\n\nconst FormLabel = ({ field }: FormLabelProps) => {\n  const text = typeof field.value === 'string' ? field.value : 'Invalid label value'\n\n  return (\n    <LabelContainer className={field.highlight || 'normal'}>\n      <ReactMarkdown>{text}</ReactMarkdown>\n    </LabelContainer>\n  )\n}\n\ntype FormFieldProps = {\n  field: SimpleFormField\n  value: SimpleFormValue\n  onChange: (value: SimpleFormValue) => void\n}\n\nconst DropdownItemTemplate = (option: FormSelectOption) => {\n  const endContent = (\n    <>\n      <div style={{ flex: 1 }} />\n      {option.badges && option.badges.map((badge, index) => <Badge key={index}>{badge}</Badge>)}\n    </>\n  )\n  return (\n    <DefaultItemTemplate\n      option={option}\n      dataKey={'value'}\n      labelKey={'label'}\n      value={[option.value]}\n      endContent={endContent}\n    />\n  )\n}\n\nconst FormField = ({ field, value, onChange }: FormFieldProps) => {\n  if (field.type === 'text') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <InputText\n        value={parsedValue}\n        onChange={(e) => onChange(e.target.value)}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'boolean') {\n    const parsedValue = typeof value === 'boolean' ? value : false\n\n    const handleCheckboxEvent = (\n      event: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>,\n    ) => {\n      if ('target' in event && 'checked' in event.target) {\n        onChange((event.target as HTMLInputElement).checked)\n      }\n    }\n\n    return <InputSwitch checked={parsedValue} onChange={handleCheckboxEvent} />\n  }\n  if (field.type === 'integer') {\n    const parsedValue = typeof value === 'number' ? value : 0\n    return (\n      <InputNumber\n        value={parsedValue}\n        onChange={(e) => onChange(parseInt(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n  if (field.type === 'float') {\n    const parsedValue = typeof value === 'number' ? value : 0.0\n    return (\n      <InputNumber\n        type=\"number\"\n        value={parsedValue}\n        onChange={(e) => onChange(parseFloat(e.target.value))}\n        placeholder={field.placeholder || ''}\n      />\n    )\n  }\n\n  if (field.type === 'select') {\n    const parsedValue = typeof value === 'string' ? value : ''\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue ? [parsedValue] : []}\n        onSelectionChange={(e) => onChange(e[0])}\n        className={`form-field`}\n        multiSelect={false}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  } // Handle select\n\n  if (field.type === 'multiselect') {\n    const parsedValue = Array.isArray(value) ? value : []\n    return (\n      <Dropdown\n        widthExpand\n        options={field.options || []}\n        value={parsedValue}\n        onSelectionChange={(e) => onChange(e)}\n        className={`form-field`}\n        multiSelect={true}\n        itemTemplate={DropdownItemTemplate}\n      />\n    )\n  }\n}\n\nexport interface SimpleFormDialogProps {\n  title: string\n  fields: SimpleFormField[]\n  values?: SimpleFormValueDict\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n  onClose: () => void\n  onSubmit: (values: SimpleFormValueDict) => void\n  isOpen: boolean\n}\n\nexport const SimpleFormDialog = ({\n  fields,\n  values,\n  onClose,\n  onSubmit,\n  isOpen,\n  title,\n  submitLabel,\n  cancelLabel,\n  submitIcon,\n  cancelIcon,\n}: SimpleFormDialogProps) => {\n  const [formData, setFormData] = useState<SimpleFormValueDict | null>(null)\n\n  useEffect(() => {\n    if (isOpen) {\n      const defaults = getDefaults(fields, values || {})\n      setFormData(defaults)\n    }\n  }, [isOpen, fields, values])\n\n  if (!isOpen) return null\n  if (!formData) return null\n\n  const footer = (\n    <div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n      <Spacer />\n      {cancelLabel && <Button onClick={() => onClose()} label={cancelLabel} icon={cancelIcon} />}\n      {submitLabel && (\n        <Button\n          onClick={() => onSubmit(formData)}\n          label={submitLabel}\n          icon={submitIcon}\n          variant=\"filled\"\n        />\n      )}\n    </div>\n  )\n\n  return (\n    <Dialog\n      isOpen={isOpen}\n      onClose={onClose}\n      header={title}\n      footer={footer}\n      style={{ minHeight: 500, minWidth: 600 }}\n    >\n      <FormLayout\n        style={{ width: '95%' }}\n        onKeyDown={(e) => {\n          e.stopPropagation()\n        }}\n      >\n        {fields.map((field: SimpleFormField) => {\n          if (field.type === 'label') {\n            return <FormLabel key={field.name} field={field} />\n          }\n\n          return (\n            <FormRow key={field.name} label={field.label || ''}>\n              <FormField\n                field={field}\n                value={formData[field.name]}\n                onChange={(value) => {\n                  setFormData((prev) => ({\n                    ...prev,\n                    [field.name]: value,\n                  }))\n                }}\n              />\n            </FormRow>\n          )\n        })}\n      </FormLayout>\n    </Dialog>\n  )\n}\n"],"names":["jsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,cAAc,CAAC,QAA2B,WAAgC;AAC9E,QAAM,WAAgC,CAAC;AAChC,SAAA,QAAQ,CAAC,UAAU;AACpB,QAAA,MAAM,QAAQ,QAAQ;AACxB,eAAS,MAAM,IAAI,IAAI,OAAO,MAAM,IAAI;AAAA,IAAA,WAC/B,MAAM,OAAO;AACb,eAAA,MAAM,IAAI,IAAI,MAAM;AAAA,IAAA,WACpB,MAAM,SAAS,WAAW;AAC1B,eAAA,MAAM,IAAI,IAAI;AAAA,IAAA,WACd,MAAM,SAAS,WAAW;AAC1B,eAAA,MAAM,IAAI,IAAI;AAAA,IAAA,WACd,MAAM,SAAS,SAAS;AACxB,eAAA,MAAM,IAAI,IAAI;AAAA,IAAA,WACd,MAAM,SAAS,QAAQ;AACvB,eAAA,MAAM,IAAI,IAAI;AAAA,IAAA,WACd,MAAM,SAAS,eAAe;AAC9B,eAAA,MAAM,IAAI,IAAI,CAAC;AAAA,IAAA;AAAA,EAC1B,CACD;AACM,SAAA;AACT;AAEA,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6B9B,MAAM,YAAY,CAAC,EAAE,YAA4B;AAC/C,QAAM,OAAO,OAAO,MAAM,UAAU,WAAW,MAAM,QAAQ;AAG3D,SAAAA,kCAAA,IAAC,kBAAe,WAAW,MAAM,aAAa,UAC5C,UAAAA,kCAAAA,IAAC,eAAe,EAAA,UAAA,KAAA,CAAK,EACvB,CAAA;AAEJ;AAQA,MAAM,uBAAuB,CAAC,WAA6B;AACzD,QAAM,aAEFC,kCAAAA,KAAAC,kBAAA,UAAA,EAAA,UAAA;AAAA,IAAAF,kCAAA,IAAC,OAAI,EAAA,OAAO,EAAE,MAAM,KAAK;AAAA,IACxB,OAAO,UAAU,OAAO,OAAO,IAAI,CAAC,OAAO,UAAWA,kCAAAA,IAAA,OAAA,EAAmB,UAAR,MAAA,GAAA,KAAc,CAAQ;AAAA,EAAA,GAC1F;AAGA,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO,CAAC,OAAO,KAAK;AAAA,MACpB;AAAA,IAAA;AAAA,EACF;AAEJ;AAEA,MAAM,YAAY,CAAC,EAAE,OAAO,OAAO,eAA+B;AAC5D,MAAA,MAAM,SAAS,QAAQ;AACzB,UAAM,cAAc,OAAO,UAAU,WAAW,QAAQ;AAEtD,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,QACxC,aAAa,MAAM,eAAe;AAAA,MAAA;AAAA,IACpC;AAAA,EAAA;AAGA,MAAA,MAAM,SAAS,WAAW;AAC5B,UAAM,cAAc,OAAO,UAAU,YAAY,QAAQ;AAEnD,UAAA,sBAAsB,CAC1B,UACG;AACH,UAAI,YAAY,SAAS,aAAa,MAAM,QAAQ;AACxC,iBAAA,MAAM,OAA4B,OAAO;AAAA,MAAA;AAAA,IAEvD;AAEA,WAAQA,kCAAAA,IAAA,aAAA,EAAY,SAAS,aAAa,UAAU,qBAAqB;AAAA,EAAA;AAEvE,MAAA,MAAM,SAAS,WAAW;AAC5B,UAAM,cAAc,OAAO,UAAU,WAAW,QAAQ;AAEtD,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,SAAS,SAAS,EAAE,OAAO,KAAK,CAAC;AAAA,QAClD,aAAa,MAAM,eAAe;AAAA,MAAA;AAAA,IACpC;AAAA,EAAA;AAGA,MAAA,MAAM,SAAS,SAAS;AAC1B,UAAM,cAAc,OAAO,UAAU,WAAW,QAAQ;AAEtD,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU,CAAC,MAAM,SAAS,WAAW,EAAE,OAAO,KAAK,CAAC;AAAA,QACpD,aAAa,MAAM,eAAe;AAAA,MAAA;AAAA,IACpC;AAAA,EAAA;AAIA,MAAA,MAAM,SAAS,UAAU;AAC3B,UAAM,cAAc,OAAO,UAAU,WAAW,QAAQ;AAEtD,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,aAAW;AAAA,QACX,SAAS,MAAM,WAAW,CAAC;AAAA,QAC3B,OAAO,cAAc,CAAC,WAAW,IAAI,CAAC;AAAA,QACtC,mBAAmB,CAAC,MAAM,SAAS,EAAE,CAAC,CAAC;AAAA,QACvC,WAAW;AAAA,QACX,aAAa;AAAA,QACb,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA,EAAA;AAIA,MAAA,MAAM,SAAS,eAAe;AAChC,UAAM,cAAc,MAAM,QAAQ,KAAK,IAAI,QAAQ,CAAC;AAElD,WAAAA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,aAAW;AAAA,QACX,SAAS,MAAM,WAAW,CAAC;AAAA,QAC3B,OAAO;AAAA,QACP,mBAAmB,CAAC,MAAM,SAAS,CAAC;AAAA,QACpC,WAAW;AAAA,QACX,aAAa;AAAA,QACb,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA,EAAA;AAGN;AAeO,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA6B;AAC3B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAqC,IAAI;AAEzE,YAAU,MAAM;AACd,QAAI,QAAQ;AACV,YAAM,WAAW,YAAY,QAAQ,UAAU,CAAA,CAAE;AACjD,kBAAY,QAAQ;AAAA,IAAA;AAAA,EAErB,GAAA,CAAC,QAAQ,QAAQ,MAAM,CAAC;AAEvB,MAAA,CAAC,OAAe,QAAA;AAChB,MAAA,CAAC,SAAiB,QAAA;AAEhB,QAAA,SACHC,kCAAA,KAAA,OAAA,EAAI,OAAO,EAAE,SAAS,QAAQ,eAAe,OAAO,KAAK,EAAA,GACxD,UAAA;AAAA,IAAAD,kCAAA,IAAC,QAAO,EAAA;AAAA,IACP,eAAgBA,kCAAA,IAAA,QAAA,EAAO,SAAS,MAAM,QAAW,GAAA,OAAO,aAAa,MAAM,WAAY,CAAA;AAAA,IACvF,eACCA,kCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAS,MAAM,SAAS,QAAQ;AAAA,QAChC,OAAO;AAAA,QACP,MAAM;AAAA,QACN,SAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EACV,GAEJ;AAIA,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MACA,OAAO,EAAE,WAAW,KAAK,UAAU,IAAI;AAAA,MAEvC,UAAAA,kCAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO,EAAE,OAAO,MAAM;AAAA,UACtB,WAAW,CAAC,MAAM;AAChB,cAAE,gBAAgB;AAAA,UACpB;AAAA,UAEC,UAAA,OAAO,IAAI,CAAC,UAA2B;AAClC,gBAAA,MAAM,SAAS,SAAS;AAC1B,qBAAQA,kCAAAA,IAAA,WAAA,EAA2B,MAAZ,GAAA,MAAM,IAAoB;AAAA,YAAA;AAGnD,mBACGA,kCAAA,IAAA,SAAA,EAAyB,OAAO,MAAM,SAAS,IAC9C,UAAAA,kCAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC;AAAA,gBACA,OAAO,SAAS,MAAM,IAAI;AAAA,gBAC1B,UAAU,CAAC,UAAU;AACnB,8BAAY,CAAC,UAAU;AAAA,oBACrB,GAAG;AAAA,oBACH,CAAC,MAAM,IAAI,GAAG;AAAA,kBAAA,EACd;AAAA,gBAAA;AAAA,cACJ;AAAA,YAAA,EACF,GAVY,MAAM,IAWpB;AAAA,UAEH,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EACF;AAEJ;"}

package/dist/shared/src/components/VersionUploader/components/UploadVersionForm.cjs.js

@@ -173,6 +173,10 @@ require("../../../containers/DetailsPanel/DetailsPanelFloating/DetailsPanelFloat
 require("../../../containers/Actions/Actions.styled.cjs.js");
 require("../../../containers/Actions/ActionsDropdown/ActionsDropdown.cjs.js");
 require("../../../containers/Actions/ActionIcon.cjs.js");
+require("../../../containers/Views/context/ViewsContext.cjs.js");
+require("../../../containers/Views/Views.styled.cjs.js");
+require("../../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
+require("../../../containers/Views/ViewsMenu/ViewsMenu.cjs.js");
 require("../../EntityPanelUploader/EntityPanelUploader.styled.cjs.js");
 require("../../SimpleFormDialog/SimpleFormDialog.cjs.js");
 require("../../EntityPath/EntityPath.styled.cjs.js");
@@ -194,9 +198,6 @@ require("./UploadVersionDialog.cjs.js");
 const VersionUploadContext = require("../context/VersionUploadContext.cjs.js");
 require("../../Feedback/FeedbackContext.cjs.js");
 require("../../Feedback/SupportBubble.cjs.js");
-require("../../Views/context/ViewsContext.cjs.js");
-require("../../Views/Views.styled.cjs.js");
-require("../../Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
 const StyledForm = styled.form`
   display: flex;
   flex-direction: column;

package/dist/shared/src/components/VersionUploader/components/UploadVersionForm.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadVersionForm.cjs.js","sources":["../../../../../../src/components/VersionUploader/components/UploadVersionForm.tsx"],"sourcesContent":["import { FC, FormEvent, useEffect, useRef } from 'react'\nimport styled from 'styled-components'\nimport { FormLayout, FormRow, InputText, InputNumber, Dropdown } from '@ynput/ayon-react-components'\nimport { productTypes } from '@shared/util'\nimport type { DropdownRef } from '@ynput/ayon-react-components'\nimport { ReviewableUpload } from '@shared/components'\nimport { useVersionUploadContext } from '../context/VersionUploadContext'\n\nconst StyledForm = styled.form`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n  padding: var(--padding-m);\n  width: 100%;\n`\n\nconst StyledFormLayout = styled(FormLayout)`\n  width: 100%;\n  margin: auto;\n\n  & > div {\n    align-items: start;\n  }\n\n  input {\n    width: 100%;\n  }\n`\n\nconst RecommendationNote = styled.div`\n  font-size: var(--font-size-xs);\n  color: var(--md-sys-color-outline);\n  margin-top: var(--base-gap-small);\n  line-height: 1.3;\n`\n\nconst InlineButton = styled.button`\n  background: none;\n  border: none;\n  color: var(--md-sys-color-primary);\n  text-decoration: underline;\n  cursor: pointer;\n  padding: 0;\n  font-size: inherit;\n  font-family: inherit;\n\n  &:hover {\n    color: var(--md-sys-color-primary-dark);\n  }\n`\n\nconst StyledUpload = styled.div`\n  position: relative;\n  min-height: 80px;\n`\n\ntype FormData = {\n  version: number\n  name: string\n  productType: string\n}\n\ninterface UploadVersionFormProps {\n  formData: FormData\n  onChange: (key: keyof FormData, value: string | number) => void\n  onSubmit: (formData: FormData) => void\n  hidden?: (keyof FormData)[]\n  projectName: string\n  minVersion?: number\n  versionId?: string | null\n  productId?: string | null\n}\n\nexport const UploadVersionForm: FC<UploadVersionFormProps> = ({\n  formData,\n  onChange,\n  onSubmit,\n  hidden = [],\n  projectName,\n  minVersion = 1,\n  versionId,\n  productId,\n}) => {\n  const previousProductTypeRef = useRef<string>(formData.productType)\n  const dropdownRef = useRef<DropdownRef>(null)\n  const formRef = useRef<HTMLFormElement>(null)\n  const {\n    pendingFiles,\n    setPendingFiles,\n    onCloseVersionUpload,\n    extractAndSetVersionFromFiles,\n    dispatch,\n  } = useVersionUploadContext()\n\n  const productTypeOptions = Object.entries(productTypes).map(([key, value]) => ({\n    value: key,\n    label: value.name,\n    icon: value.icon,\n  }))\n\n  useEffect(() => {\n    // Check if the current name starts with the previous product type name\n    const previousProductType = previousProductTypeRef.current\n    const previousProductTypeName = productTypes[previousProductType]?.name || ''\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n\n    // Only sync if the product type actually changed\n    if (formData.productType !== previousProductType && previousProductTypeName) {\n      // Check if the current name starts with the previous product type name\n      if (formData.name.startsWith(previousProductTypeName)) {\n        // Extract the suffix after the previous product type name\n        const suffix = formData.name.slice(previousProductTypeName.length)\n        // Create the new name with the current product type + suffix\n        const newName = currentProductTypeName + suffix\n        onChange('name', newName)\n      }\n    }\n\n    // Update the ref to the current product type\n    previousProductTypeRef.current = formData.productType\n  }, [formData.productType, formData.name, onChange])\n\n  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    // @ts-expect-error - submitter is not defined in the type\n    const submitter = e.nativeEvent.submitter as HTMLButtonElement | null\n    // if the submitter is a button, check it's parent does not have the dropdown class\n    if (submitter && submitter.closest('.dropdown')) {\n      // if the submitter is a button inside a dropdown, do not submit the form\n      return\n    }\n\n    onSubmit(formData)\n  }\n\n  const handleVersionChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = parseInt(e.target.value, 10)\n    if (!isNaN(value)) {\n      onChange('version', value)\n    }\n  }\n\n  const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange('name', e.target.value)\n  }\n\n  const handleProductTypeChange = (value: string[]) => {\n    if (value.length > 0) {\n      onChange('productType', value[0])\n      //   focus the name input after changing product type\n    }\n  }\n\n  const handleApplyPrefix = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    const currentName = formData.name || ''\n\n    // Capitalize the first letter of the existing name for camelCase\n    const capitalizedName = currentName.charAt(0).toUpperCase() + currentName.slice(1)\n    const newName = currentProductTypeName + capitalizedName\n    onChange('name', newName)\n  }\n\n  const shouldShowRecommendation = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    return formData.name && !formData.name.startsWith(currentProductTypeName)\n  }\n\n  // Disable form fields if version has been created\n  const isFormSubmitted = Boolean(versionId)\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLFormElement>) => {\n    // Submit form on Cmd/Ctrl + Enter\n    if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n      e.preventDefault()\n      onSubmit(formData)\n      return\n    }\n  }\n\n  return (\n    <StyledForm\n      id=\"upload-version-form\"\n      ref={formRef}\n      onSubmit={handleSubmit}\n      noValidate\n      onKeyDown={handleKeyDown}\n    >\n      <StyledFormLayout>\n        {!hidden.includes('productType') && (\n          <FormRow label=\"Product Type\">\n            <Dropdown\n              ref={dropdownRef}\n              options={productTypeOptions}\n              value={[formData.productType]}\n              onChange={handleProductTypeChange}\n              widthExpand\n              multiSelect={false}\n              aria-label=\"Product Type\"\n              search\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n\n        {!hidden.includes('name') && (\n          <FormRow label=\"Product Name\">\n            <div>\n              <InputText\n                value={formData.name}\n                onChange={handleNameChange}\n                placeholder=\"Enter product name\"\n                minLength={1}\n                autoFocus\n                aria-label=\"Product Name\"\n                aria-describedby={shouldShowRecommendation() ? 'name-recommendation' : undefined}\n                disabled={isFormSubmitted}\n              />\n              {shouldShowRecommendation() && (\n                <RecommendationNote id=\"name-recommendation\">\n                  We recommend prefixing with \"{productTypes[formData.productType]?.name}\".{' '}\n                  <InlineButton type=\"button\" onClick={handleApplyPrefix}>\n                    Apply prefix\n                  </InlineButton>\n                </RecommendationNote>\n              )}\n            </div>\n          </FormRow>\n        )}\n\n        {!hidden.includes('version') && (\n          <FormRow label=\"Version\">\n            <InputNumber\n              value={formData.version}\n              onChange={handleVersionChange}\n              min={minVersion}\n              step={1}\n              aria-label=\"Version Number\"\n              autoFocus={hidden.includes('name')}\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n      </StyledFormLayout>\n\n      <FormRow label=\"Reviewable files\" />\n      <StyledUpload>\n        <ReviewableUpload\n          projectName={projectName}\n          versionId={versionId}\n          productId={productId}\n          dispatch={dispatch}\n          pendingFiles={pendingFiles}\n          setPendingFiles={setPendingFiles}\n          onUpload={onCloseVersionUpload}\n          onFilesAdded={extractAndSetVersionFromFiles}\n          pt={{\n            upload: {\n              style: { minHeight: 80 },\n            },\n            dropzone: {\n              style: { inset: 0 },\n            },\n          }}\n        />\n      </StyledUpload>\n    </StyledForm>\n  )\n}\n"],"names":["FormLayout","useRef","useVersionUploadContext","useEffect","_a","jsxs","jsx","FormRow","Dropdown","InputText","InputNumber","ReviewableUpload"],"mappings":"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"}
+{"version":3,"file":"UploadVersionForm.cjs.js","sources":["../../../../../../src/components/VersionUploader/components/UploadVersionForm.tsx"],"sourcesContent":["import { FC, FormEvent, useEffect, useRef } from 'react'\nimport styled from 'styled-components'\nimport { FormLayout, FormRow, InputText, InputNumber, Dropdown } from '@ynput/ayon-react-components'\nimport { productTypes } from '@shared/util'\nimport type { DropdownRef } from '@ynput/ayon-react-components'\nimport { ReviewableUpload } from '@shared/components'\nimport { useVersionUploadContext } from '../context/VersionUploadContext'\n\nconst StyledForm = styled.form`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n  padding: var(--padding-m);\n  width: 100%;\n`\n\nconst StyledFormLayout = styled(FormLayout)`\n  width: 100%;\n  margin: auto;\n\n  & > div {\n    align-items: start;\n  }\n\n  input {\n    width: 100%;\n  }\n`\n\nconst RecommendationNote = styled.div`\n  font-size: var(--font-size-xs);\n  color: var(--md-sys-color-outline);\n  margin-top: var(--base-gap-small);\n  line-height: 1.3;\n`\n\nconst InlineButton = styled.button`\n  background: none;\n  border: none;\n  color: var(--md-sys-color-primary);\n  text-decoration: underline;\n  cursor: pointer;\n  padding: 0;\n  font-size: inherit;\n  font-family: inherit;\n\n  &:hover {\n    color: var(--md-sys-color-primary-dark);\n  }\n`\n\nconst StyledUpload = styled.div`\n  position: relative;\n  min-height: 80px;\n`\n\ntype FormData = {\n  version: number\n  name: string\n  productType: string\n}\n\ninterface UploadVersionFormProps {\n  formData: FormData\n  onChange: (key: keyof FormData, value: string | number) => void\n  onSubmit: (formData: FormData) => void\n  hidden?: (keyof FormData)[]\n  projectName: string\n  minVersion?: number\n  versionId?: string | null\n  productId?: string | null\n}\n\nexport const UploadVersionForm: FC<UploadVersionFormProps> = ({\n  formData,\n  onChange,\n  onSubmit,\n  hidden = [],\n  projectName,\n  minVersion = 1,\n  versionId,\n  productId,\n}) => {\n  const previousProductTypeRef = useRef<string>(formData.productType)\n  const dropdownRef = useRef<DropdownRef>(null)\n  const formRef = useRef<HTMLFormElement>(null)\n  const {\n    pendingFiles,\n    setPendingFiles,\n    onCloseVersionUpload,\n    extractAndSetVersionFromFiles,\n    dispatch,\n  } = useVersionUploadContext()\n\n  const productTypeOptions = Object.entries(productTypes).map(([key, value]) => ({\n    value: key,\n    label: value.name,\n    icon: value.icon,\n  }))\n\n  useEffect(() => {\n    // Check if the current name starts with the previous product type name\n    const previousProductType = previousProductTypeRef.current\n    const previousProductTypeName = productTypes[previousProductType]?.name || ''\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n\n    // Only sync if the product type actually changed\n    if (formData.productType !== previousProductType && previousProductTypeName) {\n      // Check if the current name starts with the previous product type name\n      if (formData.name.startsWith(previousProductTypeName)) {\n        // Extract the suffix after the previous product type name\n        const suffix = formData.name.slice(previousProductTypeName.length)\n        // Create the new name with the current product type + suffix\n        const newName = currentProductTypeName + suffix\n        onChange('name', newName)\n      }\n    }\n\n    // Update the ref to the current product type\n    previousProductTypeRef.current = formData.productType\n  }, [formData.productType, formData.name, onChange])\n\n  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    // @ts-expect-error - submitter is not defined in the type\n    const submitter = e.nativeEvent.submitter as HTMLButtonElement | null\n    // if the submitter is a button, check it's parent does not have the dropdown class\n    if (submitter && submitter.closest('.dropdown')) {\n      // if the submitter is a button inside a dropdown, do not submit the form\n      return\n    }\n\n    onSubmit(formData)\n  }\n\n  const handleVersionChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = parseInt(e.target.value, 10)\n    if (!isNaN(value)) {\n      onChange('version', value)\n    }\n  }\n\n  const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange('name', e.target.value)\n  }\n\n  const handleProductTypeChange = (value: string[]) => {\n    if (value.length > 0) {\n      onChange('productType', value[0])\n      //   focus the name input after changing product type\n    }\n  }\n\n  const handleApplyPrefix = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    const currentName = formData.name || ''\n\n    // Capitalize the first letter of the existing name for camelCase\n    const capitalizedName = currentName.charAt(0).toUpperCase() + currentName.slice(1)\n    const newName = currentProductTypeName + capitalizedName\n    onChange('name', newName)\n  }\n\n  const shouldShowRecommendation = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    return formData.name && !formData.name.startsWith(currentProductTypeName)\n  }\n\n  // Disable form fields if version has been created\n  const isFormSubmitted = Boolean(versionId)\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLFormElement>) => {\n    // Submit form on Cmd/Ctrl + Enter\n    if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n      e.preventDefault()\n      onSubmit(formData)\n      return\n    }\n  }\n\n  return (\n    <StyledForm\n      id=\"upload-version-form\"\n      ref={formRef}\n      onSubmit={handleSubmit}\n      noValidate\n      onKeyDown={handleKeyDown}\n    >\n      <StyledFormLayout>\n        {!hidden.includes('productType') && (\n          <FormRow label=\"Product Type\">\n            <Dropdown\n              ref={dropdownRef}\n              options={productTypeOptions}\n              value={[formData.productType]}\n              onChange={handleProductTypeChange}\n              widthExpand\n              multiSelect={false}\n              aria-label=\"Product Type\"\n              search\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n\n        {!hidden.includes('name') && (\n          <FormRow label=\"Product Name\">\n            <div>\n              <InputText\n                value={formData.name}\n                onChange={handleNameChange}\n                placeholder=\"Enter product name\"\n                minLength={1}\n                autoFocus\n                aria-label=\"Product Name\"\n                aria-describedby={shouldShowRecommendation() ? 'name-recommendation' : undefined}\n                disabled={isFormSubmitted}\n              />\n              {shouldShowRecommendation() && (\n                <RecommendationNote id=\"name-recommendation\">\n                  We recommend prefixing with \"{productTypes[formData.productType]?.name}\".{' '}\n                  <InlineButton type=\"button\" onClick={handleApplyPrefix}>\n                    Apply prefix\n                  </InlineButton>\n                </RecommendationNote>\n              )}\n            </div>\n          </FormRow>\n        )}\n\n        {!hidden.includes('version') && (\n          <FormRow label=\"Version\">\n            <InputNumber\n              value={formData.version}\n              onChange={handleVersionChange}\n              min={minVersion}\n              step={1}\n              aria-label=\"Version Number\"\n              autoFocus={hidden.includes('name')}\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n      </StyledFormLayout>\n\n      <FormRow label=\"Reviewable files\" />\n      <StyledUpload>\n        <ReviewableUpload\n          projectName={projectName}\n          versionId={versionId}\n          productId={productId}\n          dispatch={dispatch}\n          pendingFiles={pendingFiles}\n          setPendingFiles={setPendingFiles}\n          onUpload={onCloseVersionUpload}\n          onFilesAdded={extractAndSetVersionFromFiles}\n          pt={{\n            upload: {\n              style: { minHeight: 80 },\n            },\n            dropzone: {\n              style: { inset: 0 },\n            },\n          }}\n        />\n      </StyledUpload>\n    </StyledForm>\n  )\n}\n"],"names":["FormLayout","useRef","useVersionUploadContext","useEffect","_a","jsxs","jsx","FormRow","Dropdown","InputText","InputNumber","ReviewableUpload"],"mappings":"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"}

package/dist/shared/src/components/VersionUploader/components/UploadVersionForm.es.js

@@ -171,6 +171,10 @@ import "../../../containers/DetailsPanel/DetailsPanelFloating/DetailsPanelFloati
 import "../../../containers/Actions/Actions.styled.es.js";
 import "../../../containers/Actions/ActionsDropdown/ActionsDropdown.es.js";
 import "../../../containers/Actions/ActionIcon.es.js";
+import "../../../containers/Views/context/ViewsContext.es.js";
+import "../../../containers/Views/Views.styled.es.js";
+import "../../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
+import "../../../containers/Views/ViewsMenu/ViewsMenu.es.js";
 import "../../EntityPanelUploader/EntityPanelUploader.styled.es.js";
 import "../../SimpleFormDialog/SimpleFormDialog.es.js";
 import "../../EntityPath/EntityPath.styled.es.js";
@@ -192,9 +196,6 @@ import "./UploadVersionDialog.es.js";
 import { useVersionUploadContext } from "../context/VersionUploadContext.es.js";
 import "../../Feedback/FeedbackContext.es.js";
 import "../../Feedback/SupportBubble.es.js";
-import "../../Views/context/ViewsContext.es.js";
-import "../../Views/Views.styled.es.js";
-import "../../Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
 const StyledForm = styled.form`
   display: flex;
   flex-direction: column;

package/dist/shared/src/components/VersionUploader/components/UploadVersionForm.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadVersionForm.es.js","sources":["../../../../../../src/components/VersionUploader/components/UploadVersionForm.tsx"],"sourcesContent":["import { FC, FormEvent, useEffect, useRef } from 'react'\nimport styled from 'styled-components'\nimport { FormLayout, FormRow, InputText, InputNumber, Dropdown } from '@ynput/ayon-react-components'\nimport { productTypes } from '@shared/util'\nimport type { DropdownRef } from '@ynput/ayon-react-components'\nimport { ReviewableUpload } from '@shared/components'\nimport { useVersionUploadContext } from '../context/VersionUploadContext'\n\nconst StyledForm = styled.form`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n  padding: var(--padding-m);\n  width: 100%;\n`\n\nconst StyledFormLayout = styled(FormLayout)`\n  width: 100%;\n  margin: auto;\n\n  & > div {\n    align-items: start;\n  }\n\n  input {\n    width: 100%;\n  }\n`\n\nconst RecommendationNote = styled.div`\n  font-size: var(--font-size-xs);\n  color: var(--md-sys-color-outline);\n  margin-top: var(--base-gap-small);\n  line-height: 1.3;\n`\n\nconst InlineButton = styled.button`\n  background: none;\n  border: none;\n  color: var(--md-sys-color-primary);\n  text-decoration: underline;\n  cursor: pointer;\n  padding: 0;\n  font-size: inherit;\n  font-family: inherit;\n\n  &:hover {\n    color: var(--md-sys-color-primary-dark);\n  }\n`\n\nconst StyledUpload = styled.div`\n  position: relative;\n  min-height: 80px;\n`\n\ntype FormData = {\n  version: number\n  name: string\n  productType: string\n}\n\ninterface UploadVersionFormProps {\n  formData: FormData\n  onChange: (key: keyof FormData, value: string | number) => void\n  onSubmit: (formData: FormData) => void\n  hidden?: (keyof FormData)[]\n  projectName: string\n  minVersion?: number\n  versionId?: string | null\n  productId?: string | null\n}\n\nexport const UploadVersionForm: FC<UploadVersionFormProps> = ({\n  formData,\n  onChange,\n  onSubmit,\n  hidden = [],\n  projectName,\n  minVersion = 1,\n  versionId,\n  productId,\n}) => {\n  const previousProductTypeRef = useRef<string>(formData.productType)\n  const dropdownRef = useRef<DropdownRef>(null)\n  const formRef = useRef<HTMLFormElement>(null)\n  const {\n    pendingFiles,\n    setPendingFiles,\n    onCloseVersionUpload,\n    extractAndSetVersionFromFiles,\n    dispatch,\n  } = useVersionUploadContext()\n\n  const productTypeOptions = Object.entries(productTypes).map(([key, value]) => ({\n    value: key,\n    label: value.name,\n    icon: value.icon,\n  }))\n\n  useEffect(() => {\n    // Check if the current name starts with the previous product type name\n    const previousProductType = previousProductTypeRef.current\n    const previousProductTypeName = productTypes[previousProductType]?.name || ''\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n\n    // Only sync if the product type actually changed\n    if (formData.productType !== previousProductType && previousProductTypeName) {\n      // Check if the current name starts with the previous product type name\n      if (formData.name.startsWith(previousProductTypeName)) {\n        // Extract the suffix after the previous product type name\n        const suffix = formData.name.slice(previousProductTypeName.length)\n        // Create the new name with the current product type + suffix\n        const newName = currentProductTypeName + suffix\n        onChange('name', newName)\n      }\n    }\n\n    // Update the ref to the current product type\n    previousProductTypeRef.current = formData.productType\n  }, [formData.productType, formData.name, onChange])\n\n  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    // @ts-expect-error - submitter is not defined in the type\n    const submitter = e.nativeEvent.submitter as HTMLButtonElement | null\n    // if the submitter is a button, check it's parent does not have the dropdown class\n    if (submitter && submitter.closest('.dropdown')) {\n      // if the submitter is a button inside a dropdown, do not submit the form\n      return\n    }\n\n    onSubmit(formData)\n  }\n\n  const handleVersionChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = parseInt(e.target.value, 10)\n    if (!isNaN(value)) {\n      onChange('version', value)\n    }\n  }\n\n  const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange('name', e.target.value)\n  }\n\n  const handleProductTypeChange = (value: string[]) => {\n    if (value.length > 0) {\n      onChange('productType', value[0])\n      //   focus the name input after changing product type\n    }\n  }\n\n  const handleApplyPrefix = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    const currentName = formData.name || ''\n\n    // Capitalize the first letter of the existing name for camelCase\n    const capitalizedName = currentName.charAt(0).toUpperCase() + currentName.slice(1)\n    const newName = currentProductTypeName + capitalizedName\n    onChange('name', newName)\n  }\n\n  const shouldShowRecommendation = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    return formData.name && !formData.name.startsWith(currentProductTypeName)\n  }\n\n  // Disable form fields if version has been created\n  const isFormSubmitted = Boolean(versionId)\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLFormElement>) => {\n    // Submit form on Cmd/Ctrl + Enter\n    if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n      e.preventDefault()\n      onSubmit(formData)\n      return\n    }\n  }\n\n  return (\n    <StyledForm\n      id=\"upload-version-form\"\n      ref={formRef}\n      onSubmit={handleSubmit}\n      noValidate\n      onKeyDown={handleKeyDown}\n    >\n      <StyledFormLayout>\n        {!hidden.includes('productType') && (\n          <FormRow label=\"Product Type\">\n            <Dropdown\n              ref={dropdownRef}\n              options={productTypeOptions}\n              value={[formData.productType]}\n              onChange={handleProductTypeChange}\n              widthExpand\n              multiSelect={false}\n              aria-label=\"Product Type\"\n              search\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n\n        {!hidden.includes('name') && (\n          <FormRow label=\"Product Name\">\n            <div>\n              <InputText\n                value={formData.name}\n                onChange={handleNameChange}\n                placeholder=\"Enter product name\"\n                minLength={1}\n                autoFocus\n                aria-label=\"Product Name\"\n                aria-describedby={shouldShowRecommendation() ? 'name-recommendation' : undefined}\n                disabled={isFormSubmitted}\n              />\n              {shouldShowRecommendation() && (\n                <RecommendationNote id=\"name-recommendation\">\n                  We recommend prefixing with \"{productTypes[formData.productType]?.name}\".{' '}\n                  <InlineButton type=\"button\" onClick={handleApplyPrefix}>\n                    Apply prefix\n                  </InlineButton>\n                </RecommendationNote>\n              )}\n            </div>\n          </FormRow>\n        )}\n\n        {!hidden.includes('version') && (\n          <FormRow label=\"Version\">\n            <InputNumber\n              value={formData.version}\n              onChange={handleVersionChange}\n              min={minVersion}\n              step={1}\n              aria-label=\"Version Number\"\n              autoFocus={hidden.includes('name')}\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n      </StyledFormLayout>\n\n      <FormRow label=\"Reviewable files\" />\n      <StyledUpload>\n        <ReviewableUpload\n          projectName={projectName}\n          versionId={versionId}\n          productId={productId}\n          dispatch={dispatch}\n          pendingFiles={pendingFiles}\n          setPendingFiles={setPendingFiles}\n          onUpload={onCloseVersionUpload}\n          onFilesAdded={extractAndSetVersionFromFiles}\n          pt={{\n            upload: {\n              style: { minHeight: 80 },\n            },\n            dropzone: {\n              style: { inset: 0 },\n            },\n          }}\n        />\n      </StyledUpload>\n    </StyledForm>\n  )\n}\n"],"names":["_a","jsxs","jsx"],"mappings":"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"}
+{"version":3,"file":"UploadVersionForm.es.js","sources":["../../../../../../src/components/VersionUploader/components/UploadVersionForm.tsx"],"sourcesContent":["import { FC, FormEvent, useEffect, useRef } from 'react'\nimport styled from 'styled-components'\nimport { FormLayout, FormRow, InputText, InputNumber, Dropdown } from '@ynput/ayon-react-components'\nimport { productTypes } from '@shared/util'\nimport type { DropdownRef } from '@ynput/ayon-react-components'\nimport { ReviewableUpload } from '@shared/components'\nimport { useVersionUploadContext } from '../context/VersionUploadContext'\n\nconst StyledForm = styled.form`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n  padding: var(--padding-m);\n  width: 100%;\n`\n\nconst StyledFormLayout = styled(FormLayout)`\n  width: 100%;\n  margin: auto;\n\n  & > div {\n    align-items: start;\n  }\n\n  input {\n    width: 100%;\n  }\n`\n\nconst RecommendationNote = styled.div`\n  font-size: var(--font-size-xs);\n  color: var(--md-sys-color-outline);\n  margin-top: var(--base-gap-small);\n  line-height: 1.3;\n`\n\nconst InlineButton = styled.button`\n  background: none;\n  border: none;\n  color: var(--md-sys-color-primary);\n  text-decoration: underline;\n  cursor: pointer;\n  padding: 0;\n  font-size: inherit;\n  font-family: inherit;\n\n  &:hover {\n    color: var(--md-sys-color-primary-dark);\n  }\n`\n\nconst StyledUpload = styled.div`\n  position: relative;\n  min-height: 80px;\n`\n\ntype FormData = {\n  version: number\n  name: string\n  productType: string\n}\n\ninterface UploadVersionFormProps {\n  formData: FormData\n  onChange: (key: keyof FormData, value: string | number) => void\n  onSubmit: (formData: FormData) => void\n  hidden?: (keyof FormData)[]\n  projectName: string\n  minVersion?: number\n  versionId?: string | null\n  productId?: string | null\n}\n\nexport const UploadVersionForm: FC<UploadVersionFormProps> = ({\n  formData,\n  onChange,\n  onSubmit,\n  hidden = [],\n  projectName,\n  minVersion = 1,\n  versionId,\n  productId,\n}) => {\n  const previousProductTypeRef = useRef<string>(formData.productType)\n  const dropdownRef = useRef<DropdownRef>(null)\n  const formRef = useRef<HTMLFormElement>(null)\n  const {\n    pendingFiles,\n    setPendingFiles,\n    onCloseVersionUpload,\n    extractAndSetVersionFromFiles,\n    dispatch,\n  } = useVersionUploadContext()\n\n  const productTypeOptions = Object.entries(productTypes).map(([key, value]) => ({\n    value: key,\n    label: value.name,\n    icon: value.icon,\n  }))\n\n  useEffect(() => {\n    // Check if the current name starts with the previous product type name\n    const previousProductType = previousProductTypeRef.current\n    const previousProductTypeName = productTypes[previousProductType]?.name || ''\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n\n    // Only sync if the product type actually changed\n    if (formData.productType !== previousProductType && previousProductTypeName) {\n      // Check if the current name starts with the previous product type name\n      if (formData.name.startsWith(previousProductTypeName)) {\n        // Extract the suffix after the previous product type name\n        const suffix = formData.name.slice(previousProductTypeName.length)\n        // Create the new name with the current product type + suffix\n        const newName = currentProductTypeName + suffix\n        onChange('name', newName)\n      }\n    }\n\n    // Update the ref to the current product type\n    previousProductTypeRef.current = formData.productType\n  }, [formData.productType, formData.name, onChange])\n\n  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    // @ts-expect-error - submitter is not defined in the type\n    const submitter = e.nativeEvent.submitter as HTMLButtonElement | null\n    // if the submitter is a button, check it's parent does not have the dropdown class\n    if (submitter && submitter.closest('.dropdown')) {\n      // if the submitter is a button inside a dropdown, do not submit the form\n      return\n    }\n\n    onSubmit(formData)\n  }\n\n  const handleVersionChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = parseInt(e.target.value, 10)\n    if (!isNaN(value)) {\n      onChange('version', value)\n    }\n  }\n\n  const handleNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange('name', e.target.value)\n  }\n\n  const handleProductTypeChange = (value: string[]) => {\n    if (value.length > 0) {\n      onChange('productType', value[0])\n      //   focus the name input after changing product type\n    }\n  }\n\n  const handleApplyPrefix = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    const currentName = formData.name || ''\n\n    // Capitalize the first letter of the existing name for camelCase\n    const capitalizedName = currentName.charAt(0).toUpperCase() + currentName.slice(1)\n    const newName = currentProductTypeName + capitalizedName\n    onChange('name', newName)\n  }\n\n  const shouldShowRecommendation = () => {\n    const currentProductTypeName = productTypes[formData.productType]?.name || ''\n    return formData.name && !formData.name.startsWith(currentProductTypeName)\n  }\n\n  // Disable form fields if version has been created\n  const isFormSubmitted = Boolean(versionId)\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLFormElement>) => {\n    // Submit form on Cmd/Ctrl + Enter\n    if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {\n      e.preventDefault()\n      onSubmit(formData)\n      return\n    }\n  }\n\n  return (\n    <StyledForm\n      id=\"upload-version-form\"\n      ref={formRef}\n      onSubmit={handleSubmit}\n      noValidate\n      onKeyDown={handleKeyDown}\n    >\n      <StyledFormLayout>\n        {!hidden.includes('productType') && (\n          <FormRow label=\"Product Type\">\n            <Dropdown\n              ref={dropdownRef}\n              options={productTypeOptions}\n              value={[formData.productType]}\n              onChange={handleProductTypeChange}\n              widthExpand\n              multiSelect={false}\n              aria-label=\"Product Type\"\n              search\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n\n        {!hidden.includes('name') && (\n          <FormRow label=\"Product Name\">\n            <div>\n              <InputText\n                value={formData.name}\n                onChange={handleNameChange}\n                placeholder=\"Enter product name\"\n                minLength={1}\n                autoFocus\n                aria-label=\"Product Name\"\n                aria-describedby={shouldShowRecommendation() ? 'name-recommendation' : undefined}\n                disabled={isFormSubmitted}\n              />\n              {shouldShowRecommendation() && (\n                <RecommendationNote id=\"name-recommendation\">\n                  We recommend prefixing with \"{productTypes[formData.productType]?.name}\".{' '}\n                  <InlineButton type=\"button\" onClick={handleApplyPrefix}>\n                    Apply prefix\n                  </InlineButton>\n                </RecommendationNote>\n              )}\n            </div>\n          </FormRow>\n        )}\n\n        {!hidden.includes('version') && (\n          <FormRow label=\"Version\">\n            <InputNumber\n              value={formData.version}\n              onChange={handleVersionChange}\n              min={minVersion}\n              step={1}\n              aria-label=\"Version Number\"\n              autoFocus={hidden.includes('name')}\n              disabled={isFormSubmitted}\n            />\n          </FormRow>\n        )}\n      </StyledFormLayout>\n\n      <FormRow label=\"Reviewable files\" />\n      <StyledUpload>\n        <ReviewableUpload\n          projectName={projectName}\n          versionId={versionId}\n          productId={productId}\n          dispatch={dispatch}\n          pendingFiles={pendingFiles}\n          setPendingFiles={setPendingFiles}\n          onUpload={onCloseVersionUpload}\n          onFilesAdded={extractAndSetVersionFromFiles}\n          pt={{\n            upload: {\n              style: { minHeight: 80 },\n            },\n            dropzone: {\n              style: { inset: 0 },\n            },\n          }}\n        />\n      </StyledUpload>\n    </StyledForm>\n  )\n}\n"],"names":["_a","jsxs","jsx"],"mappings":"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"}

package/dist/shared/src/containers/Actions/ActionConfigDialog.cjs.js

@@ -171,6 +171,10 @@ require("../DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js
 require("./Actions.styled.cjs.js");
 require("./ActionsDropdown/ActionsDropdown.cjs.js");
 require("./ActionIcon.cjs.js");
+require("../Views/context/ViewsContext.cjs.js");
+require("../Views/Views.styled.cjs.js");
+require("../Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
+require("../Views/ViewsMenu/ViewsMenu.cjs.js");
 require("../../components/EntityPanelUploader/EntityPanelUploader.styled.cjs.js");
 const SimpleFormDialog = require("../../components/SimpleFormDialog/SimpleFormDialog.cjs.js");
 require("../../components/EntityPath/EntityPath.styled.cjs.js");
@@ -192,9 +196,6 @@ require("../../components/VersionUploader/components/UploadVersionDialog.cjs.js"
 require("../../components/VersionUploader/context/VersionUploadContext.cjs.js");
 require("../../components/Feedback/FeedbackContext.cjs.js");
 require("../../components/Feedback/SupportBubble.cjs.js");
-require("../../components/Views/context/ViewsContext.cjs.js");
-require("../../components/Views/Views.styled.cjs.js");
-require("../../components/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
 const ActionConfigDialog = ({ action, onClose, context }) => {
   const requestParams = React.useMemo(() => {
     if (!action) return null;

package/dist/shared/src/containers/Actions/ActionConfigDialog.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionConfigDialog.cjs.js","sources":["../../../../../src/containers/Actions/ActionConfigDialog.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { toast } from 'react-toastify'\nimport { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormValueDict } from '@shared/components'\n\nimport { useGetActionConfigQuery, useSetActionConfigMutation } from '@shared/api'\nimport type { ActionContext, BaseActionManifest } from '@shared/api'\n\ntype ConfigData = Record<string, any>\n\ninterface ActionConfigDialogProps {\n  action: BaseActionManifest\n  context: ActionContext\n  onClose: () => void\n}\n\ninterface ActionConfigRequestQueryParams {\n  addonName: string\n  addonVersion: string\n  variant?: string\n  identifier: string\n}\n\nexport const ActionConfigDialog = ({ action, onClose, context }: ActionConfigDialogProps) => {\n  const requestParams: ActionConfigRequestQueryParams | null =\n    useMemo<ActionConfigRequestQueryParams | null>(() => {\n      if (!action) return null\n      if (!(action.addonName && action.addonVersion)) return null // this should never happen\n      return {\n        addonName: action.addonName,\n        addonVersion: action.addonVersion,\n        variant: action.variant,\n        identifier: action.identifier,\n      }\n    }, [action])\n\n  const [configureAction] = useSetActionConfigMutation()\n\n  // make typescript happily unknowing about the type\n  // because even if we pass skip, arguments are still required in the right type. that's cursed\n  const qp: any = { actionConfig: context, ...(requestParams || {}) }\n  const { data: initValues } = useGetActionConfigQuery(qp, { skip: !requestParams })\n\n  // it would be sooo cool if i could do this BEFORE the query and ommit that\n  // qp thing, but i can't. because it would change the hook order. ffs\n  if (!(initValues && action?.configFields && action && requestParams)) {\n    return null\n  }\n\n  const handleSubmit = async (data: ConfigData) => {\n    try {\n      await configureAction({\n        actionConfig: { ...context, value: data },\n        ...requestParams,\n      }).unwrap()\n      onClose()\n    } catch (error) {\n      console.warn('Error configuring action', error)\n      toast.error('Unable to set the action configuration')\n    }\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`Configure action ${action.label}`}\n      fields={action.configFields}\n      values={initValues as SimpleFormValueDict}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n      submitLabel=\"Save action config\"\n      cancelLabel=\"Cancel\"\n      submitIcon=\"check\"\n      cancelIcon=\"close\"\n    />\n  )\n}\n"],"names":["useMemo","useSetActionConfigMutation","useGetActionConfigQuery","toast","jsx","SimpleFormDialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBO,MAAM,qBAAqB,CAAC,EAAE,QAAQ,SAAS,cAAuC;AACrF,QAAA,gBACJA,MAAAA,QAA+C,MAAM;AAC/C,QAAA,CAAC,OAAe,QAAA;AACpB,QAAI,EAAE,OAAO,aAAa,OAAO,cAAsB,QAAA;AAChD,WAAA;AAAA,MACL,WAAW,OAAO;AAAA,MAClB,cAAc,OAAO;AAAA,MACrB,SAAS,OAAO;AAAA,MAChB,YAAY,OAAO;AAAA,IACrB;AAAA,EAAA,GACC,CAAC,MAAM,CAAC;AAEP,QAAA,CAAC,eAAe,IAAIC,sCAA2B;AAIrD,QAAM,KAAU,EAAE,cAAc,SAAS,GAAI,iBAAiB,CAAA,EAAI;AAC5D,QAAA,EAAE,MAAM,eAAeC,WAAAA,wBAAwB,IAAI,EAAE,MAAM,CAAC,eAAe;AAIjF,MAAI,EAAE,eAAc,iCAAQ,iBAAgB,UAAU,gBAAgB;AAC7D,WAAA;AAAA,EAAA;AAGH,QAAA,eAAe,OAAO,SAAqB;AAC3C,QAAA;AACF,YAAM,gBAAgB;AAAA,QACpB,cAAc,EAAE,GAAG,SAAS,OAAO,KAAK;AAAA,QACxC,GAAG;AAAA,MACJ,CAAA,EAAE,OAAO;AACF,cAAA;AAAA,aACD,OAAO;AACN,cAAA,KAAK,4BAA4B,KAAK;AAC9CC,oBAAA,MAAM,MAAM,wCAAwC;AAAA,IAAA;AAAA,EAExD;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,oBAAoB,OAAO,KAAK;AAAA,MACvC,QAAQ,OAAO;AAAA,MACf,QAAQ;AAAA,MACR;AAAA,MACA,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,aAAY;AAAA,MACZ,YAAW;AAAA,MACX,YAAW;AAAA,IAAA;AAAA,EACb;AAEJ;;"}
+{"version":3,"file":"ActionConfigDialog.cjs.js","sources":["../../../../../src/containers/Actions/ActionConfigDialog.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { toast } from 'react-toastify'\nimport { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormValueDict } from '@shared/components'\n\nimport { useGetActionConfigQuery, useSetActionConfigMutation } from '@shared/api'\nimport type { ActionContext, BaseActionManifest } from '@shared/api'\n\ntype ConfigData = Record<string, any>\n\ninterface ActionConfigDialogProps {\n  action: BaseActionManifest\n  context: ActionContext\n  onClose: () => void\n}\n\ninterface ActionConfigRequestQueryParams {\n  addonName: string\n  addonVersion: string\n  variant?: string\n  identifier: string\n}\n\nexport const ActionConfigDialog = ({ action, onClose, context }: ActionConfigDialogProps) => {\n  const requestParams: ActionConfigRequestQueryParams | null =\n    useMemo<ActionConfigRequestQueryParams | null>(() => {\n      if (!action) return null\n      if (!(action.addonName && action.addonVersion)) return null // this should never happen\n      return {\n        addonName: action.addonName,\n        addonVersion: action.addonVersion,\n        variant: action.variant,\n        identifier: action.identifier,\n      }\n    }, [action])\n\n  const [configureAction] = useSetActionConfigMutation()\n\n  // make typescript happily unknowing about the type\n  // because even if we pass skip, arguments are still required in the right type. that's cursed\n  const qp: any = { actionConfig: context, ...(requestParams || {}) }\n  const { data: initValues } = useGetActionConfigQuery(qp, { skip: !requestParams })\n\n  // it would be sooo cool if i could do this BEFORE the query and ommit that\n  // qp thing, but i can't. because it would change the hook order. ffs\n  if (!(initValues && action?.configFields && action && requestParams)) {\n    return null\n  }\n\n  const handleSubmit = async (data: ConfigData) => {\n    try {\n      await configureAction({\n        actionConfig: { ...context, value: data },\n        ...requestParams,\n      }).unwrap()\n      onClose()\n    } catch (error) {\n      console.warn('Error configuring action', error)\n      toast.error('Unable to set the action configuration')\n    }\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`Configure action ${action.label}`}\n      fields={action.configFields}\n      values={initValues as SimpleFormValueDict}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n      submitLabel=\"Save action config\"\n      cancelLabel=\"Cancel\"\n      submitIcon=\"check\"\n      cancelIcon=\"close\"\n    />\n  )\n}\n"],"names":["useMemo","useSetActionConfigMutation","useGetActionConfigQuery","toast","jsx","SimpleFormDialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBO,MAAM,qBAAqB,CAAC,EAAE,QAAQ,SAAS,cAAuC;AACrF,QAAA,gBACJA,MAAAA,QAA+C,MAAM;AAC/C,QAAA,CAAC,OAAe,QAAA;AACpB,QAAI,EAAE,OAAO,aAAa,OAAO,cAAsB,QAAA;AAChD,WAAA;AAAA,MACL,WAAW,OAAO;AAAA,MAClB,cAAc,OAAO;AAAA,MACrB,SAAS,OAAO;AAAA,MAChB,YAAY,OAAO;AAAA,IACrB;AAAA,EAAA,GACC,CAAC,MAAM,CAAC;AAEP,QAAA,CAAC,eAAe,IAAIC,sCAA2B;AAIrD,QAAM,KAAU,EAAE,cAAc,SAAS,GAAI,iBAAiB,CAAA,EAAI;AAC5D,QAAA,EAAE,MAAM,eAAeC,WAAAA,wBAAwB,IAAI,EAAE,MAAM,CAAC,eAAe;AAIjF,MAAI,EAAE,eAAc,iCAAQ,iBAAgB,UAAU,gBAAgB;AAC7D,WAAA;AAAA,EAAA;AAGH,QAAA,eAAe,OAAO,SAAqB;AAC3C,QAAA;AACF,YAAM,gBAAgB;AAAA,QACpB,cAAc,EAAE,GAAG,SAAS,OAAO,KAAK;AAAA,QACxC,GAAG;AAAA,MACJ,CAAA,EAAE,OAAO;AACF,cAAA;AAAA,aACD,OAAO;AACN,cAAA,KAAK,4BAA4B,KAAK;AAC9CC,oBAAA,MAAM,MAAM,wCAAwC;AAAA,IAAA;AAAA,EAExD;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,oBAAoB,OAAO,KAAK;AAAA,MACvC,QAAQ,OAAO;AAAA,MACf,QAAQ;AAAA,MACR;AAAA,MACA,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,aAAY;AAAA,MACZ,YAAW;AAAA,MACX,YAAW;AAAA,IAAA;AAAA,EACb;AAEJ;;"}

package/dist/shared/src/containers/Actions/ActionConfigDialog.es.js

@@ -169,6 +169,10 @@ import "../DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.es.js";
 import "./Actions.styled.es.js";
 import "./ActionsDropdown/ActionsDropdown.es.js";
 import "./ActionIcon.es.js";
+import "../Views/context/ViewsContext.es.js";
+import "../Views/Views.styled.es.js";
+import "../Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
+import "../Views/ViewsMenu/ViewsMenu.es.js";
 import "../../components/EntityPanelUploader/EntityPanelUploader.styled.es.js";
 import { SimpleFormDialog } from "../../components/SimpleFormDialog/SimpleFormDialog.es.js";
 import "../../components/EntityPath/EntityPath.styled.es.js";
@@ -190,9 +194,6 @@ import "../../components/VersionUploader/components/UploadVersionDialog.es.js";
 import "../../components/VersionUploader/context/VersionUploadContext.es.js";
 import "../../components/Feedback/FeedbackContext.es.js";
 import "../../components/Feedback/SupportBubble.es.js";
-import "../../components/Views/context/ViewsContext.es.js";
-import "../../components/Views/Views.styled.es.js";
-import "../../components/Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
 const ActionConfigDialog = ({ action, onClose, context }) => {
   const requestParams = useMemo(() => {
     if (!action) return null;

package/dist/shared/src/containers/Actions/ActionConfigDialog.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionConfigDialog.es.js","sources":["../../../../../src/containers/Actions/ActionConfigDialog.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { toast } from 'react-toastify'\nimport { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormValueDict } from '@shared/components'\n\nimport { useGetActionConfigQuery, useSetActionConfigMutation } from '@shared/api'\nimport type { ActionContext, BaseActionManifest } from '@shared/api'\n\ntype ConfigData = Record<string, any>\n\ninterface ActionConfigDialogProps {\n  action: BaseActionManifest\n  context: ActionContext\n  onClose: () => void\n}\n\ninterface ActionConfigRequestQueryParams {\n  addonName: string\n  addonVersion: string\n  variant?: string\n  identifier: string\n}\n\nexport const ActionConfigDialog = ({ action, onClose, context }: ActionConfigDialogProps) => {\n  const requestParams: ActionConfigRequestQueryParams | null =\n    useMemo<ActionConfigRequestQueryParams | null>(() => {\n      if (!action) return null\n      if (!(action.addonName && action.addonVersion)) return null // this should never happen\n      return {\n        addonName: action.addonName,\n        addonVersion: action.addonVersion,\n        variant: action.variant,\n        identifier: action.identifier,\n      }\n    }, [action])\n\n  const [configureAction] = useSetActionConfigMutation()\n\n  // make typescript happily unknowing about the type\n  // because even if we pass skip, arguments are still required in the right type. that's cursed\n  const qp: any = { actionConfig: context, ...(requestParams || {}) }\n  const { data: initValues } = useGetActionConfigQuery(qp, { skip: !requestParams })\n\n  // it would be sooo cool if i could do this BEFORE the query and ommit that\n  // qp thing, but i can't. because it would change the hook order. ffs\n  if (!(initValues && action?.configFields && action && requestParams)) {\n    return null\n  }\n\n  const handleSubmit = async (data: ConfigData) => {\n    try {\n      await configureAction({\n        actionConfig: { ...context, value: data },\n        ...requestParams,\n      }).unwrap()\n      onClose()\n    } catch (error) {\n      console.warn('Error configuring action', error)\n      toast.error('Unable to set the action configuration')\n    }\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`Configure action ${action.label}`}\n      fields={action.configFields}\n      values={initValues as SimpleFormValueDict}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n      submitLabel=\"Save action config\"\n      cancelLabel=\"Cancel\"\n      submitIcon=\"check\"\n      cancelIcon=\"close\"\n    />\n  )\n}\n"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBO,MAAM,qBAAqB,CAAC,EAAE,QAAQ,SAAS,cAAuC;AACrF,QAAA,gBACJ,QAA+C,MAAM;AAC/C,QAAA,CAAC,OAAe,QAAA;AACpB,QAAI,EAAE,OAAO,aAAa,OAAO,cAAsB,QAAA;AAChD,WAAA;AAAA,MACL,WAAW,OAAO;AAAA,MAClB,cAAc,OAAO;AAAA,MACrB,SAAS,OAAO;AAAA,MAChB,YAAY,OAAO;AAAA,IACrB;AAAA,EAAA,GACC,CAAC,MAAM,CAAC;AAEP,QAAA,CAAC,eAAe,IAAI,2BAA2B;AAIrD,QAAM,KAAU,EAAE,cAAc,SAAS,GAAI,iBAAiB,CAAA,EAAI;AAC5D,QAAA,EAAE,MAAM,eAAe,wBAAwB,IAAI,EAAE,MAAM,CAAC,eAAe;AAIjF,MAAI,EAAE,eAAc,iCAAQ,iBAAgB,UAAU,gBAAgB;AAC7D,WAAA;AAAA,EAAA;AAGH,QAAA,eAAe,OAAO,SAAqB;AAC3C,QAAA;AACF,YAAM,gBAAgB;AAAA,QACpB,cAAc,EAAE,GAAG,SAAS,OAAO,KAAK;AAAA,QACxC,GAAG;AAAA,MACJ,CAAA,EAAE,OAAO;AACF,cAAA;AAAA,aACD,OAAO;AACN,cAAA,KAAK,4BAA4B,KAAK;AAC9C,YAAM,MAAM,wCAAwC;AAAA,IAAA;AAAA,EAExD;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,oBAAoB,OAAO,KAAK;AAAA,MACvC,QAAQ,OAAO;AAAA,MACf,QAAQ;AAAA,MACR;AAAA,MACA,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,aAAY;AAAA,MACZ,YAAW;AAAA,MACX,YAAW;AAAA,IAAA;AAAA,EACb;AAEJ;"}
+{"version":3,"file":"ActionConfigDialog.es.js","sources":["../../../../../src/containers/Actions/ActionConfigDialog.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { toast } from 'react-toastify'\nimport { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormValueDict } from '@shared/components'\n\nimport { useGetActionConfigQuery, useSetActionConfigMutation } from '@shared/api'\nimport type { ActionContext, BaseActionManifest } from '@shared/api'\n\ntype ConfigData = Record<string, any>\n\ninterface ActionConfigDialogProps {\n  action: BaseActionManifest\n  context: ActionContext\n  onClose: () => void\n}\n\ninterface ActionConfigRequestQueryParams {\n  addonName: string\n  addonVersion: string\n  variant?: string\n  identifier: string\n}\n\nexport const ActionConfigDialog = ({ action, onClose, context }: ActionConfigDialogProps) => {\n  const requestParams: ActionConfigRequestQueryParams | null =\n    useMemo<ActionConfigRequestQueryParams | null>(() => {\n      if (!action) return null\n      if (!(action.addonName && action.addonVersion)) return null // this should never happen\n      return {\n        addonName: action.addonName,\n        addonVersion: action.addonVersion,\n        variant: action.variant,\n        identifier: action.identifier,\n      }\n    }, [action])\n\n  const [configureAction] = useSetActionConfigMutation()\n\n  // make typescript happily unknowing about the type\n  // because even if we pass skip, arguments are still required in the right type. that's cursed\n  const qp: any = { actionConfig: context, ...(requestParams || {}) }\n  const { data: initValues } = useGetActionConfigQuery(qp, { skip: !requestParams })\n\n  // it would be sooo cool if i could do this BEFORE the query and ommit that\n  // qp thing, but i can't. because it would change the hook order. ffs\n  if (!(initValues && action?.configFields && action && requestParams)) {\n    return null\n  }\n\n  const handleSubmit = async (data: ConfigData) => {\n    try {\n      await configureAction({\n        actionConfig: { ...context, value: data },\n        ...requestParams,\n      }).unwrap()\n      onClose()\n    } catch (error) {\n      console.warn('Error configuring action', error)\n      toast.error('Unable to set the action configuration')\n    }\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`Configure action ${action.label}`}\n      fields={action.configFields}\n      values={initValues as SimpleFormValueDict}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n      submitLabel=\"Save action config\"\n      cancelLabel=\"Cancel\"\n      submitIcon=\"check\"\n      cancelIcon=\"close\"\n    />\n  )\n}\n"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBO,MAAM,qBAAqB,CAAC,EAAE,QAAQ,SAAS,cAAuC;AACrF,QAAA,gBACJ,QAA+C,MAAM;AAC/C,QAAA,CAAC,OAAe,QAAA;AACpB,QAAI,EAAE,OAAO,aAAa,OAAO,cAAsB,QAAA;AAChD,WAAA;AAAA,MACL,WAAW,OAAO;AAAA,MAClB,cAAc,OAAO;AAAA,MACrB,SAAS,OAAO;AAAA,MAChB,YAAY,OAAO;AAAA,IACrB;AAAA,EAAA,GACC,CAAC,MAAM,CAAC;AAEP,QAAA,CAAC,eAAe,IAAI,2BAA2B;AAIrD,QAAM,KAAU,EAAE,cAAc,SAAS,GAAI,iBAAiB,CAAA,EAAI;AAC5D,QAAA,EAAE,MAAM,eAAe,wBAAwB,IAAI,EAAE,MAAM,CAAC,eAAe;AAIjF,MAAI,EAAE,eAAc,iCAAQ,iBAAgB,UAAU,gBAAgB;AAC7D,WAAA;AAAA,EAAA;AAGH,QAAA,eAAe,OAAO,SAAqB;AAC3C,QAAA;AACF,YAAM,gBAAgB;AAAA,QACpB,cAAc,EAAE,GAAG,SAAS,OAAO,KAAK;AAAA,QACxC,GAAG;AAAA,MACJ,CAAA,EAAE,OAAO;AACF,cAAA;AAAA,aACD,OAAO;AACN,cAAA,KAAK,4BAA4B,KAAK;AAC9C,YAAM,MAAM,wCAAwC;AAAA,IAAA;AAAA,EAExD;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,oBAAoB,OAAO,KAAK;AAAA,MACvC,QAAQ,OAAO;AAAA,MACf,QAAQ;AAAA,MACR;AAAA,MACA,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,aAAY;AAAA,MACZ,YAAW;AAAA,MACX,YAAW;AAAA,IAAA;AAAA,EACb;AAEJ;"}

package/dist/shared/src/containers/Actions/InteractiveActionDialog.cjs.js

@@ -171,6 +171,10 @@ require("../DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js
 require("./Actions.styled.cjs.js");
 require("./ActionsDropdown/ActionsDropdown.cjs.js");
 require("./ActionIcon.cjs.js");
+require("../Views/context/ViewsContext.cjs.js");
+require("../Views/Views.styled.cjs.js");
+require("../Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
+require("../Views/ViewsMenu/ViewsMenu.cjs.js");
 require("../../components/EntityPanelUploader/EntityPanelUploader.styled.cjs.js");
 const SimpleFormDialog = require("../../components/SimpleFormDialog/SimpleFormDialog.cjs.js");
 require("../../components/EntityPath/EntityPath.styled.cjs.js");
@@ -192,9 +196,6 @@ require("../../components/VersionUploader/components/UploadVersionDialog.cjs.js"
 require("../../components/VersionUploader/context/VersionUploadContext.cjs.js");
 require("../../components/Feedback/FeedbackContext.cjs.js");
 require("../../components/Feedback/SupportBubble.cjs.js");
-require("../../components/Views/context/ViewsContext.cjs.js");
-require("../../components/Views/Views.styled.cjs.js");
-require("../../components/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
 const InteractiveActionDialog = ({
   interactiveForm,
   onClose,

package/dist/shared/src/containers/Actions/InteractiveActionDialog.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"InteractiveActionDialog.cjs.js","sources":["../../../../../src/containers/Actions/InteractiveActionDialog.tsx"],"sourcesContent":["import { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormField } from '@shared/api'\n\nexport interface InteractiveForm {\n  identifier: string\n  title: string\n  fields: SimpleFormField[]\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n}\n\nexport interface InteractiveActionDialogProps {\n  interactiveForm: InteractiveForm | null\n  onClose: () => void\n  onSubmit: (identifier: string, formData: Record<string, any>) => void\n}\n\nexport const InteractiveActionDialog = ({\n  interactiveForm,\n  onClose,\n  onSubmit,\n}: InteractiveActionDialogProps) => {\n  if (!interactiveForm) return null\n\n  const handleSubmit = (formData: Record<string, any>) => {\n    onSubmit(interactiveForm.identifier, formData)\n    onClose()\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`${interactiveForm.title}`}\n      fields={interactiveForm.fields}\n      submitLabel={interactiveForm.submitLabel}\n      cancelLabel={interactiveForm.cancelLabel}\n      submitIcon={interactiveForm.submitIcon}\n      cancelIcon={interactiveForm.cancelIcon}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n    />\n  )\n}\n"],"names":["jsx","SimpleFormDialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,0BAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AACF,MAAoC;AAC9B,MAAA,CAAC,gBAAwB,QAAA;AAEvB,QAAA,eAAe,CAAC,aAAkC;AAC7C,aAAA,gBAAgB,YAAY,QAAQ;AACrC,YAAA;AAAA,EACV;AAGE,SAAAA,2BAAA,kBAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,GAAG,gBAAgB,KAAK;AAAA,MAC/B,QAAQ,gBAAgB;AAAA,MACxB,aAAa,gBAAgB;AAAA,MAC7B,aAAa,gBAAgB;AAAA,MAC7B,YAAY,gBAAgB;AAAA,MAC5B,YAAY,gBAAgB;AAAA,MAC5B;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EACZ;AAEJ;;"}
+{"version":3,"file":"InteractiveActionDialog.cjs.js","sources":["../../../../../src/containers/Actions/InteractiveActionDialog.tsx"],"sourcesContent":["import { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormField } from '@shared/api'\n\nexport interface InteractiveForm {\n  identifier: string\n  title: string\n  fields: SimpleFormField[]\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n}\n\nexport interface InteractiveActionDialogProps {\n  interactiveForm: InteractiveForm | null\n  onClose: () => void\n  onSubmit: (identifier: string, formData: Record<string, any>) => void\n}\n\nexport const InteractiveActionDialog = ({\n  interactiveForm,\n  onClose,\n  onSubmit,\n}: InteractiveActionDialogProps) => {\n  if (!interactiveForm) return null\n\n  const handleSubmit = (formData: Record<string, any>) => {\n    onSubmit(interactiveForm.identifier, formData)\n    onClose()\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`${interactiveForm.title}`}\n      fields={interactiveForm.fields}\n      submitLabel={interactiveForm.submitLabel}\n      cancelLabel={interactiveForm.cancelLabel}\n      submitIcon={interactiveForm.submitIcon}\n      cancelIcon={interactiveForm.cancelIcon}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n    />\n  )\n}\n"],"names":["jsx","SimpleFormDialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,0BAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AACF,MAAoC;AAC9B,MAAA,CAAC,gBAAwB,QAAA;AAEvB,QAAA,eAAe,CAAC,aAAkC;AAC7C,aAAA,gBAAgB,YAAY,QAAQ;AACrC,YAAA;AAAA,EACV;AAGE,SAAAA,2BAAA,kBAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,GAAG,gBAAgB,KAAK;AAAA,MAC/B,QAAQ,gBAAgB;AAAA,MACxB,aAAa,gBAAgB;AAAA,MAC7B,aAAa,gBAAgB;AAAA,MAC7B,YAAY,gBAAgB;AAAA,MAC5B,YAAY,gBAAgB;AAAA,MAC5B;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EACZ;AAEJ;;"}

package/dist/shared/src/containers/Actions/InteractiveActionDialog.es.js

@@ -169,6 +169,10 @@ import "../DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.es.js";
 import "./Actions.styled.es.js";
 import "./ActionsDropdown/ActionsDropdown.es.js";
 import "./ActionIcon.es.js";
+import "../Views/context/ViewsContext.es.js";
+import "../Views/Views.styled.es.js";
+import "../Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
+import "../Views/ViewsMenu/ViewsMenu.es.js";
 import "../../components/EntityPanelUploader/EntityPanelUploader.styled.es.js";
 import { SimpleFormDialog } from "../../components/SimpleFormDialog/SimpleFormDialog.es.js";
 import "../../components/EntityPath/EntityPath.styled.es.js";
@@ -190,9 +194,6 @@ import "../../components/VersionUploader/components/UploadVersionDialog.es.js";
 import "../../components/VersionUploader/context/VersionUploadContext.es.js";
 import "../../components/Feedback/FeedbackContext.es.js";
 import "../../components/Feedback/SupportBubble.es.js";
-import "../../components/Views/context/ViewsContext.es.js";
-import "../../components/Views/Views.styled.es.js";
-import "../../components/Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
 const InteractiveActionDialog = ({
   interactiveForm,
   onClose,

package/dist/shared/src/containers/Actions/InteractiveActionDialog.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"InteractiveActionDialog.es.js","sources":["../../../../../src/containers/Actions/InteractiveActionDialog.tsx"],"sourcesContent":["import { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormField } from '@shared/api'\n\nexport interface InteractiveForm {\n  identifier: string\n  title: string\n  fields: SimpleFormField[]\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n}\n\nexport interface InteractiveActionDialogProps {\n  interactiveForm: InteractiveForm | null\n  onClose: () => void\n  onSubmit: (identifier: string, formData: Record<string, any>) => void\n}\n\nexport const InteractiveActionDialog = ({\n  interactiveForm,\n  onClose,\n  onSubmit,\n}: InteractiveActionDialogProps) => {\n  if (!interactiveForm) return null\n\n  const handleSubmit = (formData: Record<string, any>) => {\n    onSubmit(interactiveForm.identifier, formData)\n    onClose()\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`${interactiveForm.title}`}\n      fields={interactiveForm.fields}\n      submitLabel={interactiveForm.submitLabel}\n      cancelLabel={interactiveForm.cancelLabel}\n      submitIcon={interactiveForm.submitIcon}\n      cancelIcon={interactiveForm.cancelIcon}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n    />\n  )\n}\n"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,0BAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AACF,MAAoC;AAC9B,MAAA,CAAC,gBAAwB,QAAA;AAEvB,QAAA,eAAe,CAAC,aAAkC;AAC7C,aAAA,gBAAgB,YAAY,QAAQ;AACrC,YAAA;AAAA,EACV;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,GAAG,gBAAgB,KAAK;AAAA,MAC/B,QAAQ,gBAAgB;AAAA,MACxB,aAAa,gBAAgB;AAAA,MAC7B,aAAa,gBAAgB;AAAA,MAC7B,YAAY,gBAAgB;AAAA,MAC5B,YAAY,gBAAgB;AAAA,MAC5B;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EACZ;AAEJ;"}
+{"version":3,"file":"InteractiveActionDialog.es.js","sources":["../../../../../src/containers/Actions/InteractiveActionDialog.tsx"],"sourcesContent":["import { SimpleFormDialog } from '@shared/components'\nimport type { SimpleFormField } from '@shared/api'\n\nexport interface InteractiveForm {\n  identifier: string\n  title: string\n  fields: SimpleFormField[]\n  submitLabel?: string\n  cancelLabel?: string\n  submitIcon?: string\n  cancelIcon?: string\n}\n\nexport interface InteractiveActionDialogProps {\n  interactiveForm: InteractiveForm | null\n  onClose: () => void\n  onSubmit: (identifier: string, formData: Record<string, any>) => void\n}\n\nexport const InteractiveActionDialog = ({\n  interactiveForm,\n  onClose,\n  onSubmit,\n}: InteractiveActionDialogProps) => {\n  if (!interactiveForm) return null\n\n  const handleSubmit = (formData: Record<string, any>) => {\n    onSubmit(interactiveForm.identifier, formData)\n    onClose()\n  }\n\n  return (\n    <SimpleFormDialog\n      isOpen\n      title={`${interactiveForm.title}`}\n      fields={interactiveForm.fields}\n      submitLabel={interactiveForm.submitLabel}\n      cancelLabel={interactiveForm.cancelLabel}\n      submitIcon={interactiveForm.submitIcon}\n      cancelIcon={interactiveForm.cancelIcon}\n      onClose={onClose}\n      onSubmit={handleSubmit}\n    />\n  )\n}\n"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,0BAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AACF,MAAoC;AAC9B,MAAA,CAAC,gBAAwB,QAAA;AAEvB,QAAA,eAAe,CAAC,aAAkC;AAC7C,aAAA,gBAAgB,YAAY,QAAQ;AACrC,YAAA;AAAA,EACV;AAGE,SAAAA,kCAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAM;AAAA,MACN,OAAO,GAAG,gBAAgB,KAAK;AAAA,MAC/B,QAAQ,gBAAgB;AAAA,MACxB,aAAa,gBAAgB;AAAA,MAC7B,aAAa,gBAAgB;AAAA,MAC7B,YAAY,gBAAgB;AAAA,MAC5B,YAAY,gBAAgB;AAAA,MAC5B;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,EACZ;AAEJ;"}

package/dist/shared/src/containers/DetailsPanel/DetailsPanel.cjs.js

@@ -176,6 +176,10 @@ require("./DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js");
 require("../Actions/Actions.styled.cjs.js");
 require("../Actions/ActionsDropdown/ActionsDropdown.cjs.js");
 require("../Actions/ActionIcon.cjs.js");
+require("../Views/context/ViewsContext.cjs.js");
+require("../Views/Views.styled.cjs.js");
+require("../Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
+require("../Views/ViewsMenu/ViewsMenu.cjs.js");
 require("../../components/EntityPanelUploader/EntityPanelUploader.styled.cjs.js");
 require("../../components/SimpleFormDialog/SimpleFormDialog.cjs.js");
 const EntityPath = require("../../components/EntityPath/EntityPath.cjs.js");
@@ -197,9 +201,6 @@ require("../../components/VersionUploader/components/UploadVersionDialog.cjs.js"
 require("../../components/VersionUploader/context/VersionUploadContext.cjs.js");
 require("../../components/Feedback/FeedbackContext.cjs.js");
 require("../../components/Feedback/SupportBubble.cjs.js");
-require("../../components/Views/context/ViewsContext.cjs.js");
-require("../../components/Views/Views.styled.cjs.js");
-require("../../components/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");
 const entitiesWithoutFeed = ["product", "representation"];
 const DetailsPanel = ({
   entityType,

package/dist/shared/src/containers/DetailsPanel/DetailsPanel.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsPanel.cjs.js","sources":["../../../../../src/containers/DetailsPanel/DetailsPanel.tsx"],"sourcesContent":["import { Button, Panel } from '@ynput/ayon-react-components'\nimport React, { useEffect, useMemo } from 'react'\nimport * as Styled from './DetailsPanel.styled'\n\n// shared\nimport { useGetEntitiesDetailsPanelQuery, detailsPanelEntityTypes } from '@shared/api'\nimport type { ProjectModel, Tag, DetailsPanelEntityType } from '@shared/api'\nimport { DetailsPanelAttributes, EntityPath, Watchers } from '@shared/components'\nimport { usePiPWindow } from '@shared/context/pip/PiPProvider'\nimport { productTypes } from '@shared/util'\nimport { useDetailsPanelContext, useScopedDetailsPanel } from '@shared/context'\n\nimport DetailsPanelHeader from './DetailsPanelHeader/DetailsPanelHeader'\nimport DetailsPanelFiles from './DetailsPanelFiles'\nimport useGetEntityPath from './hooks/useGetEntityPath'\nimport getAllProjectStatuses from './helpers/getAllProjectsStatuses'\nimport FeedWrapper from './FeedWrapper'\nimport mergeProjectInfo from './helpers/mergeProjectInfo'\n\nexport const entitiesWithoutFeed = ['product', 'representation']\n\ntype User = { avatarUrl: string; name: string; fullName?: string }\n\nexport type DetailsPanelProps = {\n  entityType: DetailsPanelEntityType\n  entitySubTypes?: string[] // used to get actions before the entity has loaded\n  entitiesData?: { id: string; label: string; type: DetailsPanelEntityType }[]\n  entities?: { id: string; projectName: string }[]\n  tagsOptions?: Tag[]\n  disabledStatuses?: string[]\n  projectUsers?: User[]\n  disabledProjectUsers?: string[]\n  activeProjectUsers?: string[]\n  projectsInfo?: Record<string, ProjectModel>\n  projectNames?: string[]\n  isSlideOut?: boolean\n  style?: React.CSSProperties\n  scope: string\n  isCompact?: boolean\n  onClose?: () => void\n  onWatchersUpdate?: (added: any[], removed: any[]) => void\n  onOpenViewer?: (entity: any) => void\n  onEntityFocus?: (id: string, entityType: DetailsPanelEntityType) => void\n  // annotations\n  annotations?: any\n  removeAnnotation?: (id: string) => void\n  exportAnnotationComposite?: (id: string) => Promise<Blob | null>\n}\n\nexport const DetailsPanel = ({\n  entityType,\n  entitySubTypes = [],\n  // entities is data we already have from kanban\n  entitiesData = [],\n  // entityIds are used to get the full details data for the entities\n  entities = [],\n  tagsOptions = [],\n  disabledStatuses,\n  projectUsers,\n  disabledProjectUsers,\n  activeProjectUsers,\n  projectsInfo = {},\n  projectNames = [],\n  isSlideOut = false,\n  style = {},\n  scope,\n  isCompact = false,\n  onClose,\n  onWatchersUpdate,\n  onOpenViewer,\n  onEntityFocus,\n  // annotations\n  annotations,\n  removeAnnotation,\n  exportAnnotationComposite,\n}: DetailsPanelProps) => {\n  const { closeSlideOut, openPip, user } = useDetailsPanelContext()\n  const { currentTab, setTab, isFeed } = useScopedDetailsPanel(scope)\n\n  // Force attribs tab for specific entity types\n  useEffect(() => {\n    if (entitiesWithoutFeed.includes(entityType) && currentTab !== 'attribs') {\n      setTab('attribs')\n    }\n  }, [entityType, currentTab, setTab])\n\n  // reduce projectsInfo to selected projects and into one\n  const projectInfo = useMemo(\n    () => mergeProjectInfo(projectsInfo, projectNames),\n    [projectsInfo, projectNames],\n  )\n\n  // build icons for entity types\n  const entityTypeIcons = useMemo(\n    () => ({\n      task: projectInfo.taskTypes\n        .filter((task) => !!task.icon)\n        .reduce((acc, task) => ({ ...acc, [task.name]: task.icon }), {}),\n      folder: projectInfo.folderTypes\n        .filter((folder) => !!folder.icon)\n        .reduce((acc, folder) => ({ ...acc, [folder.name]: folder.icon }), {}),\n      product: Object.entries(productTypes).reduce(\n        (acc, [key, product]) => ({ ...acc, [key]: product.icon }),\n        {},\n      ),\n    }),\n    [projectInfo],\n  )\n\n  // check if tab needs to be updated when entity type changes\n  // for example when switching from version to task, task doesn't have reps tab\n  // if reps tab was selected, set default to feed\n  useEffect(() => {\n    if (currentTab === 'files') {\n      // check entity type is still version\n      if (entityType !== 'version') {\n        setTab('activity')\n      }\n    }\n  }, [entityType, currentTab, scope])\n\n  // now we get the full details data for selected entities\n  let entitiesToQuery = entities.length\n    ? entities.map((entity) => ({ id: entity.id, projectName: entity.projectName }))\n    : // @ts-expect-error = not sure what's going on with entitiesData, we should try and remove it\n      entitiesData.map((entity) => ({ id: entity.id, projectName: entity.projectName }))\n\n  entitiesToQuery = entitiesToQuery.filter((entity) => entity.id)\n\n  const {\n    data: entityDetailsData = [],\n    isFetching: isFetchingEntitiesDetails,\n    isError,\n    originalArgs,\n  } = useGetEntitiesDetailsPanelQuery(\n    { entityType, entities: entitiesToQuery },\n    {\n      skip: !entitiesToQuery.length || !detailsPanelEntityTypes.includes(entityType),\n    },\n  )\n\n  // the entity changes then we close the slide out\n  useEffect(() => {\n    if (!isSlideOut) {\n      closeSlideOut()\n    }\n  }, [originalArgs, isSlideOut])\n\n  // TODO:  merge current entities data with fresh details data\n\n  const allStatuses = getAllProjectStatuses(projectsInfo)\n\n  // get the first project name and info to be used in the feed.\n  const firstProject = projectNames[0]\n  const firstProjectInfo = projectsInfo[firstProject] || {}\n  const firstEntityData = entityDetailsData[0] || {}\n\n  // build the full entity path for the first entity\n  const [entityPathSegments, entityPathVersions] = useGetEntityPath({\n    entity: firstEntityData,\n    entityType,\n    projectName: firstProject,\n    isLoading: isFetchingEntitiesDetails,\n  })\n\n  useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      // Don't trigger if we're in an input element\n      const target = e.target as HTMLElement\n      const isInputElement =\n        ['INPUT', 'TEXTAREA', 'SELECT'].includes(target.tagName) || target.isContentEditable\n\n      if (e.key === 'Escape' && !isInputElement && onClose) {\n        onClose()\n      }\n    }\n\n    window.addEventListener('keydown', handleKeyDown)\n    return () => window.removeEventListener('keydown', handleKeyDown)\n  }, [onClose])\n\n  const { requestPipWindow } = usePiPWindow()\n\n  const handleOpenPip = () => {\n    openPip({\n      entityType: entityType,\n      entities: entitiesToQuery,\n      scope: scope,\n    })\n    requestPipWindow(500, 500)\n  }\n\n  return (\n    <>\n      <Panel\n        style={{\n          gap: 0,\n          height: '100%',\n          padding: 0,\n          boxShadow: '-2px 0 6px #00000047',\n          zIndex: 300,\n          ...style,\n        }}\n        className=\"details-panel\"\n      >\n        <Styled.Toolbar>\n          {/* TODO FIX PATH */}\n          <EntityPath\n            segments={entityPathSegments}\n            versions={entityPathVersions}\n            projectName={firstProject}\n            hideProjectName={isSlideOut}\n            isLoading={isFetchingEntitiesDetails || !entityPathSegments.length}\n            entityType={entityType}\n            scope={scope}\n            // @ts-ignore\n            entityTypeIcons={entityTypeIcons}\n          />\n          <Styled.RightTools className=\"right-tools\">\n            <Watchers\n              entities={entitiesToQuery}\n              entityType={entityType}\n              options={projectUsers || []}\n              onWatchersUpdate={onWatchersUpdate && onWatchersUpdate}\n              userName={user.name}\n            />\n            <Button\n              icon=\"picture_in_picture\"\n              variant={'text'}\n              data-tooltip=\"Picture in Picture\"\n              onClick={handleOpenPip}\n            />\n\n            {onClose && (\n              <Button\n                icon=\"close\"\n                variant={'text'}\n                onClick={() => onClose && onClose()}\n                data-shortcut={'Escape'}\n              />\n            )}\n          </Styled.RightTools>\n        </Styled.Toolbar>\n\n        <DetailsPanelHeader\n          entityType={entityType}\n          entitySubTypes={entitySubTypes}\n          entities={entityDetailsData}\n          users={projectUsers}\n          disabledAssignees={disabledProjectUsers}\n          disabledStatuses={disabledStatuses}\n          tagsOptions={tagsOptions}\n          isFetching={isFetchingEntitiesDetails}\n          isCompact={isCompact}\n          currentTab={currentTab}\n          onTabChange={setTab}\n          entityTypeIcons={entityTypeIcons}\n          onOpenViewer={(args) => onOpenViewer?.(args)}\n          onEntityFocus={onEntityFocus}\n        />\n        {isFeed && !isError && (\n          <FeedWrapper\n            entityType={entityType}\n            entities={entityDetailsData}\n            activeUsers={activeProjectUsers || []}\n            projectInfo={firstProjectInfo}\n            projectName={firstProject}\n            isMultiProjects={projectNames.length > 1}\n            scope={scope}\n            statuses={allStatuses}\n            readOnly={false}\n            annotations={annotations}\n            removeAnnotation={removeAnnotation}\n            exportAnnotationComposite={exportAnnotationComposite}\n          />\n        )}\n        {currentTab === 'files' && (\n          <DetailsPanelFiles\n            entities={entityDetailsData}\n            scope={scope}\n            isLoadingVersion={isFetchingEntitiesDetails}\n          />\n        )}\n        {currentTab === 'attribs' && (\n          <DetailsPanelAttributes\n            entities={entityDetailsData}\n            isLoading={isFetchingEntitiesDetails}\n          />\n        )}\n      </Panel>\n    </>\n  )\n}\n"],"names":["useDetailsPanelContext","useScopedDetailsPanel","useEffect","useMemo","useGetEntitiesDetailsPanelQuery","detailsPanelEntityTypes","getAllProjectStatuses","usePiPWindow","jsx","Fragment","jsxs","Panel","Styled.Toolbar","EntityPath","Styled.RightTools","Watchers","Button","DetailsPanelAttributes"],"mappings":"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"}
+{"version":3,"file":"DetailsPanel.cjs.js","sources":["../../../../../src/containers/DetailsPanel/DetailsPanel.tsx"],"sourcesContent":["import { Button, Panel } from '@ynput/ayon-react-components'\nimport React, { useEffect, useMemo } from 'react'\nimport * as Styled from './DetailsPanel.styled'\n\n// shared\nimport { useGetEntitiesDetailsPanelQuery, detailsPanelEntityTypes } from '@shared/api'\nimport type { ProjectModel, Tag, DetailsPanelEntityType } from '@shared/api'\nimport { DetailsPanelAttributes, EntityPath, Watchers } from '@shared/components'\nimport { usePiPWindow } from '@shared/context/pip/PiPProvider'\nimport { productTypes } from '@shared/util'\nimport { useDetailsPanelContext, useScopedDetailsPanel } from '@shared/context'\n\nimport DetailsPanelHeader from './DetailsPanelHeader/DetailsPanelHeader'\nimport DetailsPanelFiles from './DetailsPanelFiles'\nimport useGetEntityPath from './hooks/useGetEntityPath'\nimport getAllProjectStatuses from './helpers/getAllProjectsStatuses'\nimport FeedWrapper from './FeedWrapper'\nimport mergeProjectInfo from './helpers/mergeProjectInfo'\n\nexport const entitiesWithoutFeed = ['product', 'representation']\n\ntype User = { avatarUrl: string; name: string; fullName?: string }\n\nexport type DetailsPanelProps = {\n  entityType: DetailsPanelEntityType\n  entitySubTypes?: string[] // used to get actions before the entity has loaded\n  entitiesData?: { id: string; label: string; type: DetailsPanelEntityType }[]\n  entities?: { id: string; projectName: string }[]\n  tagsOptions?: Tag[]\n  disabledStatuses?: string[]\n  projectUsers?: User[]\n  disabledProjectUsers?: string[]\n  activeProjectUsers?: string[]\n  projectsInfo?: Record<string, ProjectModel>\n  projectNames?: string[]\n  isSlideOut?: boolean\n  style?: React.CSSProperties\n  scope: string\n  isCompact?: boolean\n  onClose?: () => void\n  onWatchersUpdate?: (added: any[], removed: any[]) => void\n  onOpenViewer?: (entity: any) => void\n  onEntityFocus?: (id: string, entityType: DetailsPanelEntityType) => void\n  // annotations\n  annotations?: any\n  removeAnnotation?: (id: string) => void\n  exportAnnotationComposite?: (id: string) => Promise<Blob | null>\n}\n\nexport const DetailsPanel = ({\n  entityType,\n  entitySubTypes = [],\n  // entities is data we already have from kanban\n  entitiesData = [],\n  // entityIds are used to get the full details data for the entities\n  entities = [],\n  tagsOptions = [],\n  disabledStatuses,\n  projectUsers,\n  disabledProjectUsers,\n  activeProjectUsers,\n  projectsInfo = {},\n  projectNames = [],\n  isSlideOut = false,\n  style = {},\n  scope,\n  isCompact = false,\n  onClose,\n  onWatchersUpdate,\n  onOpenViewer,\n  onEntityFocus,\n  // annotations\n  annotations,\n  removeAnnotation,\n  exportAnnotationComposite,\n}: DetailsPanelProps) => {\n  const { closeSlideOut, openPip, user } = useDetailsPanelContext()\n  const { currentTab, setTab, isFeed } = useScopedDetailsPanel(scope)\n\n  // Force attribs tab for specific entity types\n  useEffect(() => {\n    if (entitiesWithoutFeed.includes(entityType) && currentTab !== 'attribs') {\n      setTab('attribs')\n    }\n  }, [entityType, currentTab, setTab])\n\n  // reduce projectsInfo to selected projects and into one\n  const projectInfo = useMemo(\n    () => mergeProjectInfo(projectsInfo, projectNames),\n    [projectsInfo, projectNames],\n  )\n\n  // build icons for entity types\n  const entityTypeIcons = useMemo(\n    () => ({\n      task: projectInfo.taskTypes\n        .filter((task) => !!task.icon)\n        .reduce((acc, task) => ({ ...acc, [task.name]: task.icon }), {}),\n      folder: projectInfo.folderTypes\n        .filter((folder) => !!folder.icon)\n        .reduce((acc, folder) => ({ ...acc, [folder.name]: folder.icon }), {}),\n      product: Object.entries(productTypes).reduce(\n        (acc, [key, product]) => ({ ...acc, [key]: product.icon }),\n        {},\n      ),\n    }),\n    [projectInfo],\n  )\n\n  // check if tab needs to be updated when entity type changes\n  // for example when switching from version to task, task doesn't have reps tab\n  // if reps tab was selected, set default to feed\n  useEffect(() => {\n    if (currentTab === 'files') {\n      // check entity type is still version\n      if (entityType !== 'version') {\n        setTab('activity')\n      }\n    }\n  }, [entityType, currentTab, scope])\n\n  // now we get the full details data for selected entities\n  let entitiesToQuery = entities.length\n    ? entities.map((entity) => ({ id: entity.id, projectName: entity.projectName }))\n    : // @ts-expect-error = not sure what's going on with entitiesData, we should try and remove it\n      entitiesData.map((entity) => ({ id: entity.id, projectName: entity.projectName }))\n\n  entitiesToQuery = entitiesToQuery.filter((entity) => entity.id)\n\n  const {\n    data: entityDetailsData = [],\n    isFetching: isFetchingEntitiesDetails,\n    isError,\n    originalArgs,\n  } = useGetEntitiesDetailsPanelQuery(\n    { entityType, entities: entitiesToQuery },\n    {\n      skip: !entitiesToQuery.length || !detailsPanelEntityTypes.includes(entityType),\n    },\n  )\n\n  // the entity changes then we close the slide out\n  useEffect(() => {\n    if (!isSlideOut) {\n      closeSlideOut()\n    }\n  }, [originalArgs, isSlideOut])\n\n  // TODO:  merge current entities data with fresh details data\n\n  const allStatuses = getAllProjectStatuses(projectsInfo)\n\n  // get the first project name and info to be used in the feed.\n  const firstProject = projectNames[0]\n  const firstProjectInfo = projectsInfo[firstProject] || {}\n  const firstEntityData = entityDetailsData[0] || {}\n\n  // build the full entity path for the first entity\n  const [entityPathSegments, entityPathVersions] = useGetEntityPath({\n    entity: firstEntityData,\n    entityType,\n    projectName: firstProject,\n    isLoading: isFetchingEntitiesDetails,\n  })\n\n  useEffect(() => {\n    const handleKeyDown = (e: KeyboardEvent) => {\n      // Don't trigger if we're in an input element\n      const target = e.target as HTMLElement\n      const isInputElement =\n        ['INPUT', 'TEXTAREA', 'SELECT'].includes(target.tagName) || target.isContentEditable\n\n      if (e.key === 'Escape' && !isInputElement && onClose) {\n        onClose()\n      }\n    }\n\n    window.addEventListener('keydown', handleKeyDown)\n    return () => window.removeEventListener('keydown', handleKeyDown)\n  }, [onClose])\n\n  const { requestPipWindow } = usePiPWindow()\n\n  const handleOpenPip = () => {\n    openPip({\n      entityType: entityType,\n      entities: entitiesToQuery,\n      scope: scope,\n    })\n    requestPipWindow(500, 500)\n  }\n\n  return (\n    <>\n      <Panel\n        style={{\n          gap: 0,\n          height: '100%',\n          padding: 0,\n          boxShadow: '-2px 0 6px #00000047',\n          zIndex: 300,\n          ...style,\n        }}\n        className=\"details-panel\"\n      >\n        <Styled.Toolbar>\n          {/* TODO FIX PATH */}\n          <EntityPath\n            segments={entityPathSegments}\n            versions={entityPathVersions}\n            projectName={firstProject}\n            hideProjectName={isSlideOut}\n            isLoading={isFetchingEntitiesDetails || !entityPathSegments.length}\n            entityType={entityType}\n            scope={scope}\n            // @ts-ignore\n            entityTypeIcons={entityTypeIcons}\n          />\n          <Styled.RightTools className=\"right-tools\">\n            <Watchers\n              entities={entitiesToQuery}\n              entityType={entityType}\n              options={projectUsers || []}\n              onWatchersUpdate={onWatchersUpdate && onWatchersUpdate}\n              userName={user.name}\n            />\n            <Button\n              icon=\"picture_in_picture\"\n              variant={'text'}\n              data-tooltip=\"Picture in Picture\"\n              onClick={handleOpenPip}\n            />\n\n            {onClose && (\n              <Button\n                icon=\"close\"\n                variant={'text'}\n                onClick={() => onClose && onClose()}\n                data-shortcut={'Escape'}\n              />\n            )}\n          </Styled.RightTools>\n        </Styled.Toolbar>\n\n        <DetailsPanelHeader\n          entityType={entityType}\n          entitySubTypes={entitySubTypes}\n          entities={entityDetailsData}\n          users={projectUsers}\n          disabledAssignees={disabledProjectUsers}\n          disabledStatuses={disabledStatuses}\n          tagsOptions={tagsOptions}\n          isFetching={isFetchingEntitiesDetails}\n          isCompact={isCompact}\n          currentTab={currentTab}\n          onTabChange={setTab}\n          entityTypeIcons={entityTypeIcons}\n          onOpenViewer={(args) => onOpenViewer?.(args)}\n          onEntityFocus={onEntityFocus}\n        />\n        {isFeed && !isError && (\n          <FeedWrapper\n            entityType={entityType}\n            entities={entityDetailsData}\n            activeUsers={activeProjectUsers || []}\n            projectInfo={firstProjectInfo}\n            projectName={firstProject}\n            isMultiProjects={projectNames.length > 1}\n            scope={scope}\n            statuses={allStatuses}\n            readOnly={false}\n            annotations={annotations}\n            removeAnnotation={removeAnnotation}\n            exportAnnotationComposite={exportAnnotationComposite}\n          />\n        )}\n        {currentTab === 'files' && (\n          <DetailsPanelFiles\n            entities={entityDetailsData}\n            scope={scope}\n            isLoadingVersion={isFetchingEntitiesDetails}\n          />\n        )}\n        {currentTab === 'attribs' && (\n          <DetailsPanelAttributes\n            entities={entityDetailsData}\n            isLoading={isFetchingEntitiesDetails}\n          />\n        )}\n      </Panel>\n    </>\n  )\n}\n"],"names":["useDetailsPanelContext","useScopedDetailsPanel","useEffect","useMemo","useGetEntitiesDetailsPanelQuery","detailsPanelEntityTypes","getAllProjectStatuses","usePiPWindow","jsx","Fragment","jsxs","Panel","Styled.Toolbar","EntityPath","Styled.RightTools","Watchers","Button","DetailsPanelAttributes"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBa,MAAA,sBAAsB,CAAC,WAAW,gBAAgB;AA8BxD,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA,iBAAiB,CAAC;AAAA;AAAA,EAElB,eAAe,CAAC;AAAA;AAAA,EAEhB,WAAW,CAAC;AAAA,EACZ,cAAc,CAAC;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe,CAAC;AAAA,EAChB,eAAe,CAAC;AAAA,EAChB,aAAa;AAAA,EACb,QAAQ,CAAC;AAAA,EACT;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AACF,MAAyB;AACvB,QAAM,EAAE,eAAe,SAAS,KAAA,IAASA,oBAAAA,uBAAuB;AAChE,QAAM,EAAE,YAAY,QAAQ,OAAO,IAAIC,oBAAAA,sBAAsB,KAAK;AAGlEC,QAAAA,UAAU,MAAM;AACd,QAAI,oBAAoB,SAAS,UAAU,KAAK,eAAe,WAAW;AACxE,aAAO,SAAS;AAAA,IAAA;AAAA,EAEjB,GAAA,CAAC,YAAY,YAAY,MAAM,CAAC;AAGnC,QAAM,cAAcC,MAAA;AAAA,IAClB,MAAM,iBAAiB,cAAc,YAAY;AAAA,IACjD,CAAC,cAAc,YAAY;AAAA,EAC7B;AAGA,QAAM,kBAAkBA,MAAA;AAAA,IACtB,OAAO;AAAA,MACL,MAAM,YAAY,UACf,OAAO,CAAC,SAAS,CAAC,CAAC,KAAK,IAAI,EAC5B,OAAO,CAAC,KAAK,UAAU,EAAE,GAAG,KAAK,CAAC,KAAK,IAAI,GAAG,KAAK,SAAS,EAAE;AAAA,MACjE,QAAQ,YAAY,YACjB,OAAO,CAAC,WAAW,CAAC,CAAC,OAAO,IAAI,EAChC,OAAO,CAAC,KAAK,YAAY,EAAE,GAAG,KAAK,CAAC,OAAO,IAAI,GAAG,OAAO,SAAS,EAAE;AAAA,MACvE,SAAS,OAAO,QAAQ,YAAY,EAAE;AAAA,QACpC,CAAC,KAAK,CAAC,KAAK,OAAO,OAAO,EAAE,GAAG,KAAK,CAAC,GAAG,GAAG,QAAQ;QACnD,CAAA;AAAA,MAAC;AAAA,IACH;AAAA,IAEF,CAAC,WAAW;AAAA,EACd;AAKAD,QAAAA,UAAU,MAAM;AACd,QAAI,eAAe,SAAS;AAE1B,UAAI,eAAe,WAAW;AAC5B,eAAO,UAAU;AAAA,MAAA;AAAA,IACnB;AAAA,EAED,GAAA,CAAC,YAAY,YAAY,KAAK,CAAC;AAGlC,MAAI,kBAAkB,SAAS,SAC3B,SAAS,IAAI,CAAC,YAAY,EAAE,IAAI,OAAO,IAAI,aAAa,OAAO,YAAc,EAAA;AAAA;AAAA,IAE7E,aAAa,IAAI,CAAC,YAAY,EAAE,IAAI,OAAO,IAAI,aAAa,OAAO,cAAc;AAAA;AAErF,oBAAkB,gBAAgB,OAAO,CAAC,WAAW,OAAO,EAAE;AAExD,QAAA;AAAA,IACJ,MAAM,oBAAoB,CAAC;AAAA,IAC3B,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,EAAA,IACEE,eAAA;AAAA,IACF,EAAE,YAAY,UAAU,gBAAgB;AAAA,IACxC;AAAA,MACE,MAAM,CAAC,gBAAgB,UAAU,CAACC,0BAAA,wBAAwB,SAAS,UAAU;AAAA,IAAA;AAAA,EAEjF;AAGAH,QAAAA,UAAU,MAAM;AACd,QAAI,CAAC,YAAY;AACD,oBAAA;AAAA,IAAA;AAAA,EAChB,GACC,CAAC,cAAc,UAAU,CAAC;AAIvB,QAAA,cAAcI,uBAAsB,YAAY;AAGhD,QAAA,eAAe,aAAa,CAAC;AACnC,QAAM,mBAAmB,aAAa,YAAY,KAAK,CAAC;AACxD,QAAM,kBAAkB,kBAAkB,CAAC,KAAK,CAAC;AAGjD,QAAM,CAAC,oBAAoB,kBAAkB,IAAI,iBAAiB;AAAA,IAChE,QAAQ;AAAA,IACR;AAAA,IACA,aAAa;AAAA,IACb,WAAW;AAAA,EAAA,CACZ;AAEDJ,QAAAA,UAAU,MAAM;AACR,UAAA,gBAAgB,CAAC,MAAqB;AAE1C,YAAM,SAAS,EAAE;AACX,YAAA,iBACJ,CAAC,SAAS,YAAY,QAAQ,EAAE,SAAS,OAAO,OAAO,KAAK,OAAO;AAErE,UAAI,EAAE,QAAQ,YAAY,CAAC,kBAAkB,SAAS;AAC5C,gBAAA;AAAA,MAAA;AAAA,IAEZ;AAEO,WAAA,iBAAiB,WAAW,aAAa;AAChD,WAAO,MAAM,OAAO,oBAAoB,WAAW,aAAa;AAAA,EAAA,GAC/D,CAAC,OAAO,CAAC;AAEN,QAAA,EAAE,iBAAiB,IAAIK,yBAAa;AAE1C,QAAM,gBAAgB,MAAM;AAClB,YAAA;AAAA,MACN;AAAA,MACA,UAAU;AAAA,MACV;AAAA,IAAA,CACD;AACD,qBAAiB,KAAK,GAAG;AAAA,EAC3B;AAEA,SAEIC,iDAAAC,WAAAA,kBAAAA,UAAA,EAAA,UAAAC,2BAAA,kBAAA;AAAA,IAACC,oBAAA;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,KAAK;AAAA,QACL,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,GAAG;AAAA,MACL;AAAA,MACA,WAAU;AAAA,MAEV,UAAA;AAAA,QAACD,kDAAAE,oBAAAA,SAAA,EAEC,UAAA;AAAA,UAAAJ,2BAAA,kBAAA;AAAA,YAACK,WAAA;AAAA,YAAA;AAAA,cACC,UAAU;AAAA,cACV,UAAU;AAAA,cACV,aAAa;AAAA,cACb,iBAAiB;AAAA,cACjB,WAAW,6BAA6B,CAAC,mBAAmB;AAAA,cAC5D;AAAA,cACA;AAAA,cAEA;AAAA,YAAA;AAAA,UACF;AAAA,UACCH,2BAAAA,kBAAAA,KAAAI,oBAAAA,YAAA,EAAkB,WAAU,eAC3B,UAAA;AAAA,YAAAN,2BAAA,kBAAA;AAAA,cAACO,SAAA;AAAA,cAAA;AAAA,gBACC,UAAU;AAAA,gBACV;AAAA,gBACA,SAAS,gBAAgB,CAAC;AAAA,gBAC1B,kBAAkB,oBAAoB;AAAA,gBACtC,UAAU,KAAK;AAAA,cAAA;AAAA,YACjB;AAAA,YACAP,2BAAA,kBAAA;AAAA,cAACQ,oBAAA;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS;AAAA,gBACT,gBAAa;AAAA,gBACb,SAAS;AAAA,cAAA;AAAA,YACX;AAAA,YAEC,WACCR,2BAAA,kBAAA;AAAA,cAACQ,oBAAA;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS;AAAA,gBACT,SAAS,MAAM,WAAW,QAAQ;AAAA,gBAClC,iBAAe;AAAA,cAAA;AAAA,YAAA;AAAA,UACjB,EAEJ,CAAA;AAAA,QAAA,GACF;AAAA,QAEAR,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,UAAU;AAAA,YACV,OAAO;AAAA,YACP,mBAAmB;AAAA,YACnB;AAAA,YACA;AAAA,YACA,YAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA,aAAa;AAAA,YACb;AAAA,YACA,cAAc,CAAC,SAAS,6CAAe;AAAA,YACvC;AAAA,UAAA;AAAA,QACF;AAAA,QACC,UAAU,CAAC,WACVA,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA,UAAU;AAAA,YACV,aAAa,sBAAsB,CAAC;AAAA,YACpC,aAAa;AAAA,YACb,aAAa;AAAA,YACb,iBAAiB,aAAa,SAAS;AAAA,YACvC;AAAA,YACA,UAAU;AAAA,YACV,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QAED,eAAe,WACdA,2BAAA,kBAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,UAAU;AAAA,YACV;AAAA,YACA,kBAAkB;AAAA,UAAA;AAAA,QACpB;AAAA,QAED,eAAe,aACdA,2BAAA,kBAAA;AAAA,UAACS,uBAAA;AAAA,UAAA;AAAA,YACC,UAAU;AAAA,YACV,WAAW;AAAA,UAAA;AAAA,QAAA;AAAA,MACb;AAAA,IAAA;AAAA,EAAA,GAGN;AAEJ;;;"}