npm - @ynput/ayon-frontend-shared - Versions diffs - 0.4.2 → 0.4.4 - Mend

@ynput/ayon-frontend-shared 0.4.2 → 0.4.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2133) hide show

package/dist/shared/src/components/SettingsPanel/SettingsPanelItemTemplate.es.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { j as o } from "../../../../_virtual/jsx-runtime.es.js";
-import { Button as y, Icon as t } from "@ynput/ayon-react-components";
-import c from "clsx";
+import { Button as y, Icon as c } from "@ynput/ayon-react-components";
+import t from "clsx";
 import { forwardRef as j } from "react";
 import r from "styled-components";
 const w = r.li`
@@ -21,6 +21,11 @@ const w = r.li`
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+    min-width: 0;
+  }
+  .label-path {
+    color: var(--md-sys-color-outline);
   }
   &.highlighted {
@@ -52,8 +57,14 @@ const w = r.li`
   gap: var(--base-gap-small);
   margin-left: auto;
 `, N = r(y)`
-  background-color: unset;
-  padding: 4px;
+  && {
+    background-color: unset;
+    padding: 4px;
+    &:hover {
+      background-color: var(--md-sys-color-surface-container-highest-hover);
+    }
+  }
   &.active {
     .icon {
@@ -67,37 +78,43 @@ const w = r.li`
 `, z = j(
   ({
     item: e,
-    actions: i,
-    startContent: l,
+    actions: l,
+    startContent: i,
     endContent: d,
     isHighlighted: p,
     isDisabled: a,
-    disableHover: g,
-    className: h,
+    disableHover: h,
+    className: g,
     ...m
   }, u) => /* @__PURE__ */ o.jsxs(
     w,
     {
-      className: c("setting-item", h, {
+      className: t("setting-item", g, {
         highlighted: p,
         disabled: a,
-        "no-hover": g
+        "no-hover": h
       }),
       ...m,
       ref: u,
       children: [
-        l,
-        e.icon && /* @__PURE__ */ o.jsx(t, { icon: e.icon }),
-        /* @__PURE__ */ o.jsx("span", { className: "label", children: e.label }),
-        /* @__PURE__ */ o.jsx(k, { className: "actions", children: i?.map(({ icon: n, className: v, active: f, onClick: x, ...s }, b) => /* @__PURE__ */ o.jsxs(
+        i,
+        e.icon && /* @__PURE__ */ o.jsx(c, { icon: e.icon }),
+        /* @__PURE__ */ o.jsxs("span", { className: "label", children: [
+          e.path && /* @__PURE__ */ o.jsxs("span", { className: "label-path", children: [
+            e.path,
+            " / "
+          ] }),
+          e.label
+        ] }),
+        /* @__PURE__ */ o.jsx(k, { className: "actions", children: l?.map(({ icon: s, className: v, active: f, onClick: x, ...n }, b) => /* @__PURE__ */ o.jsxs(
           N,
           {
-            className: c("action", v, { active: f }),
+            className: t("action", v, { active: f }),
             onClick: a ? void 0 : x,
-            ...s,
+            ...n,
             children: [
-              n && /* @__PURE__ */ o.jsx(t, { icon: n }),
-              s.children
+              s && /* @__PURE__ */ o.jsx(c, { icon: s }),
+              n.children
             ]
           },
           b

package/dist/shared/src/components/SettingsPanel/SettingsPanelItemTemplate.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SettingsPanelItemTemplate.es.js","sources":["../../../../../src/components/SettingsPanel/SettingsPanelItemTemplate.tsx"],"sourcesContent":["import { Button, ButtonProps, Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef } from 'react'\nimport styled from 'styled-components'\n\nconst Item = styled.li`\n display: flex;\n padding: 2px;\n padding-left: 8px;\n height: 32px;\n justify-content: space-between;\n align-items: center;\n gap: var(--base-gap-large);\n cursor: pointer;\n border-radius: 4px;\n cursor: default;\n user-select: none;\n overflow: hidden;\n\n .label {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &.highlighted {\n background-color: var(--md-sys-color-secondary-container);\n color: var(--md-sys-color-on-secondary-container);\n\n &:hover {\n background-color: var(--md-sys-color-secondary-container-hover);\n }\n }\n\n &:hover {\n background-color: var(--md-sys-color-surface-container-high);\n }\n\n &.no-hover:hover {\n background-color: unset;\n }\n\n &.disabled {\n opacity: 0.5;\n user-select: none;\n &:hover {\n background-color: unset;\n }\n }\n`\n\nconst Actions = styled.div`\n display: flex;\n gap: var(--base-gap-small);\n margin-left: auto;\n`\n\nconst ActionButton = styled(Button)`\n background-color: unset;\n padding: 4px;\n\n &.active {\n .icon {\n font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 10;\n }\n }\n\n &.active {\n opacity: 1;\n }\n`\n\ninterface Action extends ButtonProps {\n active?: boolean\n ['data-tooltip']?: string\n ['data-shortcut']?: string\n}\n\nexport type SettingsPanelItem = {\n value: string\n label: string\n icon?: string\n}\n\nexport interface SettingsPanelItemTemplateProps extends React.HTMLAttributes<HTMLLIElement> {\n item: SettingsPanelItem\n isHighlighted?: boolean\n isDisabled?: boolean\n disableHover?: boolean\n startContent?: React.ReactNode\n endContent?: React.ReactNode\n actions?: Action[]\n}\n\nexport const SettingsPanelItemTemplate = forwardRef<HTMLLIElement, SettingsPanelItemTemplateProps>(\n (\n {\n item,\n actions,\n startContent,\n endContent,\n isHighlighted,\n isDisabled,\n disableHover,\n className,\n ...props\n },\n ref,\n ) => {\n return (\n <Item\n className={clsx('setting-item', className, {\n highlighted: isHighlighted,\n disabled: isDisabled,\n 'no-hover': disableHover,\n })}\n {...props}\n ref={ref}\n >\n {startContent}\n {item.icon && <Icon icon={item.icon} />}\n <span className=\"label\">{item.label}</span>\n <Actions className=\"actions\">\n {actions?.map(({ icon, className, active, onClick, ...action }, index) => (\n <ActionButton\n key={index}\n className={clsx('action', className, { active })}\n onClick={!isDisabled ? onClick : undefined}\n {...action}\n >\n {icon && <Icon icon={icon} />}\n {action.children}\n </ActionButton>\n ))}\n </Actions>\n {endContent}\n </Item>\n )\n },\n)\n"],"names":["Item","styled","Actions","ActionButton","Button","SettingsPanelItemTemplate","forwardRef","item","actions","startContent","endContent","isHighlighted","isDisabled","disableHover","className","props","ref","jsxs","clsx","jsx","Icon","icon","active","onClick","action","index"],"mappings":";;;;;AAKA,MAAMA,IAAOC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~GA8CdC~~,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA,GAMjBE,IAAeF,EAAOG,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~GAqCrBC~~,IAA4BC;AAAA,EACvC,CACE;AAAA,IACE,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGEC,gBAAAA,EAAAA;AAAAA,IAACjB;AAAA,IAAA;AAAA,MACC,WAAWkB,EAAK,gBAAgBJ,GAAW;AAAA,QACzC,aAAaH;AAAA,QACb,UAAUC;AAAA,QACV,YAAYC;AAAA,MAAA,CACb;AAAA,MACA,GAAGE;AAAA,MACJ,KAAAC;AAAA,MAEC,UAAA;AAAA,QAAAP;AAAA,QACAF,EAAK,QAAQY,gBAAAA,MAACC,GAAA,EAAK,MAAMb,EAAK,MAAM;AAAA,~~QACrCY~~,gBAAAA,EAAAA,~~IAAC~~,QAAA,EAAK,WAAU,~~SAAS~~,YAAK,~~OAAM~~;AAAA,~~8BACnCjB~~,GAAA,EAAQ,WAAU,WAChB,UAAAM,GAAS,IAAI,CAAC,EAAE,MAAAa,GAAM,WAAAP,GAAW,QAAAQ,GAAQ,SAAAC,GAAS,GAAGC,EAAA,GAAUC,MAC9DR,gBAAAA,EAAAA;AAAAA,UAACd;AAAA,UAAA;AAAA,YAEC,WAAWe,EAAK,UAAUJ,GAAW,EAAE,QAAAQ,GAAQ;AAAA,YAC/C,SAAUV,IAAuB,SAAVW;AAAA,YACtB,GAAGC;AAAA,YAEH,UAAA;AAAA,cAAAH,KAAQF,gBAAAA,EAAAA,IAACC,KAAK,MAAAC,EAAA,CAAY;AAAA,cAC1BG,EAAO;AAAA,YAAA;AAAA,UAAA;AAAA,UANHC;AAAA,QAAA,CAQR,GACH;AAAA,QACCf;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT;"}
1	+ {"version":3,"file":"SettingsPanelItemTemplate.es.js","sources":["../../../../../src/components/SettingsPanel/SettingsPanelItemTemplate.tsx"],"sourcesContent":["import { Button, ButtonProps, Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef } from 'react'\nimport styled from 'styled-components'\n\nconst Item = styled.li`\n display: flex;\n padding: 2px;\n padding-left: 8px;\n height: 32px;\n justify-content: space-between;\n align-items: center;\n gap: var(--base-gap-large);\n cursor: pointer;\n border-radius: 4px;\n cursor: default;\n user-select: none;\n overflow: hidden;\n\n .label {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n }\n\n .label-path {\n color: var(--md-sys-color-outline);\n }\n\n &.highlighted {\n background-color: var(--md-sys-color-secondary-container);\n color: var(--md-sys-color-on-secondary-container);\n\n &:hover {\n background-color: var(--md-sys-color-secondary-container-hover);\n }\n }\n\n &:hover {\n background-color: var(--md-sys-color-surface-container-high);\n }\n\n &.no-hover:hover {\n background-color: unset;\n }\n\n &.disabled {\n opacity: 0.5;\n user-select: none;\n &:hover {\n background-color: unset;\n }\n }\n`\n\nconst Actions = styled.div`\n display: flex;\n gap: var(--base-gap-small);\n margin-left: auto;\n`\n\nconst ActionButton = styled(Button)`\n && {\n background-color: unset;\n padding: 4px;\n\n &:hover {\n background-color: var(--md-sys-color-surface-container-highest-hover);\n }\n }\n\n &.active {\n .icon {\n font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 10;\n }\n }\n\n &.active {\n opacity: 1;\n }\n`\n\ninterface Action extends ButtonProps {\n active?: boolean\n ['data-tooltip']?: string\n ['data-shortcut']?: string\n}\n\nexport type SettingsPanelItem = {\n value: string\n label: string\n icon?: string\n path?: string\n}\n\nexport interface SettingsPanelItemTemplateProps extends React.HTMLAttributes<HTMLLIElement> {\n item: SettingsPanelItem\n isHighlighted?: boolean\n isDisabled?: boolean\n disableHover?: boolean\n startContent?: React.ReactNode\n endContent?: React.ReactNode\n actions?: Action[]\n}\n\nexport const SettingsPanelItemTemplate = forwardRef<HTMLLIElement, SettingsPanelItemTemplateProps>(\n (\n {\n item,\n actions,\n startContent,\n endContent,\n isHighlighted,\n isDisabled,\n disableHover,\n className,\n ...props\n },\n ref,\n ) => {\n return (\n <Item\n className={clsx('setting-item', className, {\n highlighted: isHighlighted,\n disabled: isDisabled,\n 'no-hover': disableHover,\n })}\n {...props}\n ref={ref}\n >\n {startContent}\n {item.icon && <Icon icon={item.icon} />}\n <span className=\"label\">\n {item.path && <span className=\"label-path\">{item.path} / </span>}\n {item.label}\n </span>\n <Actions className=\"actions\">\n {actions?.map(({ icon, className, active, onClick, ...action }, index) => (\n <ActionButton\n key={index}\n className={clsx('action', className, { active })}\n onClick={!isDisabled ? onClick : undefined}\n {...action}\n >\n {icon && <Icon icon={icon} />}\n {action.children}\n </ActionButton>\n ))}\n </Actions>\n {endContent}\n </Item>\n )\n },\n)\n"],"names":["Item","styled","Actions","ActionButton","Button","SettingsPanelItemTemplate","forwardRef","item","actions","startContent","endContent","isHighlighted","isDisabled","disableHover","className","props","ref","jsxs","clsx","jsx","Icon","icon","active","onClick","action","index"],"mappings":";;;;;AAKA,MAAMA,IAAOC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAmDdC,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA,GAMjBE,IAAeF,EAAOG,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA4CrBC,IAA4BC;AAAA,EACvC,CACE;AAAA,IACE,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MAGEC,gBAAAA,EAAAA;AAAAA,IAACjB;AAAA,IAAA;AAAA,MACC,WAAWkB,EAAK,gBAAgBJ,GAAW;AAAA,QACzC,aAAaH;AAAA,QACb,UAAUC;AAAA,QACV,YAAYC;AAAA,MAAA,CACb;AAAA,MACA,GAAGE;AAAA,MACJ,KAAAC;AAAA,MAEC,UAAA;AAAA,QAAAP;AAAA,QACAF,EAAK,QAAQY,gBAAAA,MAACC,GAAA,EAAK,MAAMb,EAAK,MAAM;AAAA,QACrCU,gBAAAA,EAAAA,KAAC,QAAA,EAAK,WAAU,SACb,UAAA;AAAA,UAAAV,EAAK,QAAQU,gBAAAA,OAAC,QAAA,EAAK,WAAU,cAAc,UAAA;AAAA,YAAAV,EAAK;AAAA,YAAK;AAAA,UAAA,GAAG;AAAA,UACxDA,EAAK;AAAA,QAAA,GACR;AAAA,8BACCL,GAAA,EAAQ,WAAU,WAChB,UAAAM,GAAS,IAAI,CAAC,EAAE,MAAAa,GAAM,WAAAP,GAAW,QAAAQ,GAAQ,SAAAC,GAAS,GAAGC,EAAA,GAAUC,MAC9DR,gBAAAA,EAAAA;AAAAA,UAACd;AAAA,UAAA;AAAA,YAEC,WAAWe,EAAK,UAAUJ,GAAW,EAAE,QAAAQ,GAAQ;AAAA,YAC/C,SAAUV,IAAuB,SAAVW;AAAA,YACtB,GAAGC;AAAA,YAEH,UAAA;AAAA,cAAAH,KAAQF,gBAAAA,EAAAA,IAACC,KAAK,MAAAC,EAAA,CAAY;AAAA,cAC1BG,EAAO;AAAA,YAAA;AAAA,UAAA;AAAA,UANHC;AAAA,QAAA,CAQR,GACH;AAAA,QACCf;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT;"}

package/dist/shared/src/components/ShareOptionIcon/ShareOptionIcon.cjs.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../../../../_virtual/jsx-runtime.cjs.js"),d=require("@ynput/ayon-react-components"),h=require("styled-components"),Y=require("../UserImage/UserImage.cjs.js"),I=require("clsx"),a="__everyone__",p="__guests__",n="group:",c="team:",E="user:",u="guest:",S=h(d.Icon)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../../../_virtual/jsx-runtime.cjs.js"),Y=require("@ynput/ayon-react-components"),I=require("styled-components"),h=require("../UserImage/UserImage.cjs.js"),S=require("clsx"),g="__everyone__",p="__guests__",c="group:",E="team:",u="user:",_="guest:",P=I(Y.Icon)`
   font-size: ${({$size:o})=>`${o}px`};
   &.withBackground {
     display: flex;
@@ -8,5 +8,5 @@
     background-color: var(--md-sys-color-surface-container-high);
     padding: 3px;
   }
-`,P=({shareType:o,name:e,label:g,size:i=24,withBackground:_=!1})=>{let t=o,s=e;t||(e.startsWith(E)?(t="user",s=e.slice(E.length)):e.startsWith(n)?(t="group",s=e.slice(n.length)):e.startsWith(c)?(t="team",s=e.slice(c.length)):e.startsWith(u)&&(t="guest",s=e.slice(u.length)));const r=(R,f)=>l.jsxRuntimeExports.jsx(S,{className:I({withBackground:_}),icon:R,"data-tooltip":f,"data-tooltip-delay":0,$size:_?i-6:i});return t==="user"?l.jsxRuntimeExports.jsx(Y.UserImage,{name:s,fullName:g,size:i}):t==="group"?r("shield_person","Access group"):t==="team"?r("groups","Team"):t==="guest"||e===p?r("badge","Guest user"):e===a?r("groups","Everyone with access to the project"):r("person")};exports.EVERYONE_GROUP_KEY=a;exports.EVERY_GUESTS_KEY=p;exports.GROUP_KEY_PREFIX=n;exports.GUEST_KEY_PREFIX=u;exports.ShareOptionIcon=P;exports.TEAM_KEY_PREFIX=c;exports.USER_KEY_PREFIX=E;
+`,y=({shareType:o,name:e,label:R,size:n=24,withBackground:l=!1,withTooltip:i=!0})=>{let t=o,s=e;t||(e.startsWith(u)?(t="user",s=e.slice(u.length)):e.startsWith(c)?(t="group",s=e.slice(c.length)):e.startsWith(E)?(t="team",s=e.slice(E.length)):e.startsWith(_)&&(t="guest",s=e.slice(_.length)));const r=(d,f)=>a.jsxRuntimeExports.jsx(P,{className:S({withBackground:l}),icon:d,"data-tooltip":i?f:void 0,"data-tooltip-delay":i?0:void 0,$size:l?n-6:n});return t==="user"?a.jsxRuntimeExports.jsx(h.UserImage,{name:s,fullName:i?R:void 0,size:n}):t==="group"?r("shield_person","Access group"):t==="team"?r("groups","Team"):t==="guest"||e===p?r("badge","Guest user"):e===g?r("groups","Everyone with access to the project"):r("person")};exports.EVERYONE_GROUP_KEY=g;exports.EVERY_GUESTS_KEY=p;exports.GROUP_KEY_PREFIX=c;exports.GUEST_KEY_PREFIX=_;exports.ShareOptionIcon=y;exports.TEAM_KEY_PREFIX=E;exports.USER_KEY_PREFIX=u;
 //# sourceMappingURL=ShareOptionIcon.cjs.js.map

package/dist/shared/src/components/ShareOptionIcon/ShareOptionIcon.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ShareOptionIcon.cjs.js","sources":["../../../../../src/components/ShareOptionIcon/ShareOptionIcon.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport { UserImage } from '../UserImage'\nimport clsx from 'clsx'\n\nexport const EVERYONE_GROUP_KEY = '__everyone__' as const\nexport const EVERY_GUESTS_KEY = '__guests__' as const\n\nexport const GROUP_KEY_PREFIX = 'group:'\nexport const TEAM_KEY_PREFIX = 'team:'\nexport const USER_KEY_PREFIX = 'user:'\nexport const GUEST_KEY_PREFIX = 'guest:'\n\ninterface StyledIconProps {\n $size: number\n}\n\nconst StyledIcon = styled(Icon)<StyledIconProps>`\n font-size: ${({ $size }) => `${$size}px`};\n &.withBackground {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background-color: var(--md-sys-color-surface-container-high);\n padding: 3px;\n }\n`\n\nexport interface ShareOptionIconProps {\n shareType?: string\n name: string\n label?: string\n icon?: string // For backwards compatibility (explicit icon override)\n size?: number\n withBackground?: boolean\n}\n\nexport const ShareOptionIcon: FC<ShareOptionIconProps> = ({\n shareType,\n name,\n label,\n size = 24,\n withBackground = false,\n}) => {\n // Fallback: infer shareType from name prefix if not provided\n let effectiveShareType = shareType\n let strippedName = name\n if (!effectiveShareType) {\n if (name.startsWith(USER_KEY_PREFIX)) {\n effectiveShareType = 'user'\n strippedName = name.slice(USER_KEY_PREFIX.length)\n } else if (name.startsWith(GROUP_KEY_PREFIX)) {\n effectiveShareType = 'group'\n strippedName = name.slice(GROUP_KEY_PREFIX.length)\n } else if (name.startsWith(TEAM_KEY_PREFIX)) {\n effectiveShareType = 'team'\n strippedName = name.slice(TEAM_KEY_PREFIX.length)\n } else if (name.startsWith(GUEST_KEY_PREFIX)) {\n effectiveShareType = 'guest'\n strippedName = name.slice(GUEST_KEY_PREFIX.length)\n }\n }\n\n // helper to render an icon name with centralized props\n const renderIcon = (iconName: string, tooltip?: string) => (\n <StyledIcon\n className={clsx({ withBackground })}\n icon={iconName}\n data-tooltip={tooltip}\n data-tooltip-delay={0}\n $size={withBackground ? size - 6 : size}\n />\n )\n\n // Use shareType-based logic\n if (effectiveShareType === 'user') {\n return <UserImage name={strippedName} fullName={label} size={size} />\n }\n\n if (effectiveShareType === 'group') return renderIcon('shield_person', 'Access group')\n if (effectiveShareType === 'team') return renderIcon('groups', 'Team')\n if (effectiveShareType === 'guest' \|\| name === EVERY_GUESTS_KEY)\n return renderIcon('badge', 'Guest user')\n if (name === EVERYONE_GROUP_KEY)\n return renderIcon('groups', 'Everyone with access to the project')\n\n // Default fallback\n return renderIcon('person')\n}\n"],"names":["EVERYONE_GROUP_KEY","EVERY_GUESTS_KEY","GROUP_KEY_PREFIX","TEAM_KEY_PREFIX","USER_KEY_PREFIX","GUEST_KEY_PREFIX","StyledIcon","styled","Icon","$size","ShareOptionIcon","shareType","name","label","size","withBackground","effectiveShareType","strippedName","renderIcon","iconName","tooltip","jsx","clsx","UserImage"],"mappings":"iRAMaA,EAAqB,eACrBC,EAAmB,aAEnBC,EAAmB,SACnBC,EAAkB,QAClBC,EAAkB,QAClBC,EAAmB,SAM1BC,EAAaC,EAAOC,MAAI;AAAA,eACf,CAAC,CAAE,MAAAC,CAAA,IAAY,GAAGA,CAAK,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~EAoB7BC~~,EAA4C,CAAC,CACxD,UAAAC,EACA,KAAAC,EACA,MAAAC,EACA,KAAAC,EAAO,GACP,eAAAC,EAAiB,~~EACnB~~,IAAM,CAEJ,IAAIC,~~EAAqBL~~,~~EACrBM~~,~~EAAeL~~,~~EACdI~~,~~IACCJ~~,EAAK,WAAWR,CAAe,~~GACjCY~~,EAAqB,OACrBC,~~EAAeL~~,EAAK,MAAMR,EAAgB,MAAM,GACvCQ,EAAK,WAAWV,CAAgB,~~GACzCc~~,EAAqB,QACrBC,~~EAAeL~~,EAAK,MAAMV,EAAiB,MAAM,GACxCU,EAAK,WAAWT,CAAe,~~GACxCa~~,EAAqB,OACrBC,~~EAAeL~~,EAAK,MAAMT,EAAgB,MAAM,GACvCS,EAAK,WAAWP,CAAgB,~~IACzCW~~,EAAqB,QACrBC,~~EAAeL~~,EAAK,MAAMP,EAAiB,MAAM,IAKrD,~~MAAMa~~,EAAa,CAACC,EAAkBC,IACpCC,EAAAA,kBAAAA,~~IAACf~~,EAAA,CACC,~~UAAWgB~~,EAAK,CAAE,~~eAAAP~~,EAAgB,EAClC,~~KAAMI~~,EACN,~~eAAcC~~,~~EACd~~,~~qBAAoB~~,~~EACpB~~,~~MAAOL~~,EAAiBD,EAAO,EAAIA,CAAA,CAAA,EAKvC,~~OAAIE~~,IAAuB~~,+BACjBO~~,EAAAA,~~UAAA~~,~~CAAU,~~KAAMN,EAAc,~~SAAUJ~~,~~EAAO~~,KAAAC,EAAY,~~EAGjEE~~,IAAuB,QAAgBE,EAAW,gBAAiB,cAAc,EACjFF,IAAuB,OAAeE,EAAW,SAAU,MAAM,EACjEF,IAAuB,~~SAAWJ~~,IAASX,~~EACtCiB~~,EAAW,QAAS,YAAY,~~EACrCN~~,IAASZ,~~EACJkB~~,EAAW,SAAU,qCAAqC,EAG5DA,EAAW,QAAQ,CAC5B"}
1	+ {"version":3,"file":"ShareOptionIcon.cjs.js","sources":["../../../../../src/components/ShareOptionIcon/ShareOptionIcon.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport { UserImage } from '../UserImage'\nimport clsx from 'clsx'\n\nexport const EVERYONE_GROUP_KEY = '__everyone__' as const\nexport const EVERY_GUESTS_KEY = '__guests__' as const\n\nexport const GROUP_KEY_PREFIX = 'group:'\nexport const TEAM_KEY_PREFIX = 'team:'\nexport const USER_KEY_PREFIX = 'user:'\nexport const GUEST_KEY_PREFIX = 'guest:'\n\ninterface StyledIconProps {\n $size: number\n}\n\nconst StyledIcon = styled(Icon)<StyledIconProps>`\n font-size: ${({ $size }) => `${$size}px`};\n &.withBackground {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background-color: var(--md-sys-color-surface-container-high);\n padding: 3px;\n }\n`\n\nexport interface ShareOptionIconProps {\n shareType?: string\n name: string\n label?: string\n icon?: string // For backwards compatibility (explicit icon override)\n size?: number\n withBackground?: boolean\n withTooltip?: boolean\n}\n\nexport const ShareOptionIcon: FC<ShareOptionIconProps> = ({\n shareType,\n name,\n label,\n size = 24,\n withBackground = false,\n withTooltip = true,\n}) => {\n // Fallback: infer shareType from name prefix if not provided\n let effectiveShareType = shareType\n let strippedName = name\n if (!effectiveShareType) {\n if (name.startsWith(USER_KEY_PREFIX)) {\n effectiveShareType = 'user'\n strippedName = name.slice(USER_KEY_PREFIX.length)\n } else if (name.startsWith(GROUP_KEY_PREFIX)) {\n effectiveShareType = 'group'\n strippedName = name.slice(GROUP_KEY_PREFIX.length)\n } else if (name.startsWith(TEAM_KEY_PREFIX)) {\n effectiveShareType = 'team'\n strippedName = name.slice(TEAM_KEY_PREFIX.length)\n } else if (name.startsWith(GUEST_KEY_PREFIX)) {\n effectiveShareType = 'guest'\n strippedName = name.slice(GUEST_KEY_PREFIX.length)\n }\n }\n\n // helper to render an icon name with centralized props\n const renderIcon = (iconName: string, tooltip?: string) => (\n <StyledIcon\n className={clsx({ withBackground })}\n icon={iconName}\n data-tooltip={withTooltip ? tooltip : undefined}\n data-tooltip-delay={withTooltip ? 0 : undefined}\n $size={withBackground ? size - 6 : size}\n />\n )\n\n // Use shareType-based logic\n if (effectiveShareType === 'user') {\n return <UserImage name={strippedName} fullName={withTooltip ? label : undefined} size={size} />\n }\n\n if (effectiveShareType === 'group') return renderIcon('shield_person', 'Access group')\n if (effectiveShareType === 'team') return renderIcon('groups', 'Team')\n if (effectiveShareType === 'guest' \|\| name === EVERY_GUESTS_KEY)\n return renderIcon('badge', 'Guest user')\n if (name === EVERYONE_GROUP_KEY)\n return renderIcon('groups', 'Everyone with access to the project')\n\n // Default fallback\n return renderIcon('person')\n}\n"],"names":["EVERYONE_GROUP_KEY","EVERY_GUESTS_KEY","GROUP_KEY_PREFIX","TEAM_KEY_PREFIX","USER_KEY_PREFIX","GUEST_KEY_PREFIX","StyledIcon","styled","Icon","$size","ShareOptionIcon","shareType","name","label","size","withBackground","withTooltip","effectiveShareType","strippedName","renderIcon","iconName","tooltip","jsx","clsx","UserImage"],"mappings":"iRAMaA,EAAqB,eACrBC,EAAmB,aAEnBC,EAAmB,SACnBC,EAAkB,QAClBC,EAAkB,QAClBC,EAAmB,SAM1BC,EAAaC,EAAOC,MAAI;AAAA,eACf,CAAC,CAAE,MAAAC,CAAA,IAAY,GAAGA,CAAK,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqB7BC,EAA4C,CAAC,CACxD,UAAAC,EACA,KAAAC,EACA,MAAAC,EACA,KAAAC,EAAO,GACP,eAAAC,EAAiB,GACjB,YAAAC,EAAc,EAChB,IAAM,CAEJ,IAAIC,EAAqBN,EACrBO,EAAeN,EACdK,IACCL,EAAK,WAAWR,CAAe,GACjCa,EAAqB,OACrBC,EAAeN,EAAK,MAAMR,EAAgB,MAAM,GACvCQ,EAAK,WAAWV,CAAgB,GACzCe,EAAqB,QACrBC,EAAeN,EAAK,MAAMV,EAAiB,MAAM,GACxCU,EAAK,WAAWT,CAAe,GACxCc,EAAqB,OACrBC,EAAeN,EAAK,MAAMT,EAAgB,MAAM,GACvCS,EAAK,WAAWP,CAAgB,IACzCY,EAAqB,QACrBC,EAAeN,EAAK,MAAMP,EAAiB,MAAM,IAKrD,MAAMc,EAAa,CAACC,EAAkBC,IACpCC,EAAAA,kBAAAA,IAAChB,EAAA,CACC,UAAWiB,EAAK,CAAE,eAAAR,EAAgB,EAClC,KAAMK,EACN,eAAcJ,EAAcK,EAAU,OACtC,qBAAoBL,EAAc,EAAI,OACtC,MAAOD,EAAiBD,EAAO,EAAIA,CAAA,CAAA,EAKvC,OAAIG,IAAuB,OAClBK,wBAACE,EAAAA,WAAU,KAAMN,EAAc,SAAUF,EAAcH,EAAQ,OAAW,KAAAC,EAAY,EAG3FG,IAAuB,QAAgBE,EAAW,gBAAiB,cAAc,EACjFF,IAAuB,OAAeE,EAAW,SAAU,MAAM,EACjEF,IAAuB,SAAWL,IAASX,EACtCkB,EAAW,QAAS,YAAY,EACrCP,IAASZ,EACJmB,EAAW,SAAU,qCAAqC,EAG5DA,EAAW,QAAQ,CAC5B"}

package/dist/shared/src/components/ShareOptionIcon/ShareOptionIcon.es.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { j as n } from "../../../../_virtual/jsx-runtime.es.js";
-import { Icon as g } from "@ynput/ayon-react-components";
-import d from "styled-components";
-import { UserImage as h } from "../UserImage/UserImage.es.js";
-import m from "clsx";
-const R = "__everyone__", x = "__guests__", l = "group:", u = "team:", p = "user:", a = "guest:", y = d(g)`
+import { j as u } from "../../../../_virtual/jsx-runtime.es.js";
+import { Icon as d } from "@ynput/ayon-react-components";
+import h from "styled-components";
+import { UserImage as m } from "../UserImage/UserImage.es.js";
+import R from "clsx";
+const x = "__everyone__", y = "__guests__", l = "group:", p = "team:", a = "user:", f = "guest:", I = h(d)`
   font-size: ${({ $size: o }) => `${o}px`};
   &.withBackground {
     display: flex;
@@ -15,32 +15,33 @@ const R = "__everyone__", x = "__guests__", l = "group:", u = "team:", p = "user
   }
 `, P = ({
   shareType: o,
-  name: t,
-  label: f,
+  name: e,
+  label: E,
   size: i = 24,
-  withBackground: c = !1
+  withBackground: n = !1,
+  withTooltip: c = !0
 }) => {
-  let e = o, s = t;
-  e || (t.startsWith(p) ? (e = "user", s = t.slice(p.length)) : t.startsWith(l) ? (e = "group", s = t.slice(l.length)) : t.startsWith(u) ? (e = "team", s = t.slice(u.length)) : t.startsWith(a) && (e = "guest", s = t.slice(a.length)));
-  const r = (E, _) => /* @__PURE__ */ n.jsx(
-    y,
+  let t = o, s = e;
+  t || (e.startsWith(a) ? (t = "user", s = e.slice(a.length)) : e.startsWith(l) ? (t = "group", s = e.slice(l.length)) : e.startsWith(p) ? (t = "team", s = e.slice(p.length)) : e.startsWith(f) && (t = "guest", s = e.slice(f.length)));
+  const r = (_, g) => /* @__PURE__ */ u.jsx(
+    I,
     {
-      className: m({ withBackground: c }),
-      icon: E,
-      "data-tooltip": _,
-      "data-tooltip-delay": 0,
-      $size: c ? i - 6 : i
+      className: R({ withBackground: n }),
+      icon: _,
+      "data-tooltip": c ? g : void 0,
+      "data-tooltip-delay": c ? 0 : void 0,
+      $size: n ? i - 6 : i
     }
   );
-  return e === "user" ? /* @__PURE__ */ n.jsx(h, { name: s, fullName: f, size: i }) : e === "group" ? r("shield_person", "Access group") : e === "team" ? r("groups", "Team") : e === "guest" || t === x ? r("badge", "Guest user") : t === R ? r("groups", "Everyone with access to the project") : r("person");
+  return t === "user" ? /* @__PURE__ */ u.jsx(m, { name: s, fullName: c ? E : void 0, size: i }) : t === "group" ? r("shield_person", "Access group") : t === "team" ? r("groups", "Team") : t === "guest" || e === y ? r("badge", "Guest user") : e === x ? r("groups", "Everyone with access to the project") : r("person");
 };
 export {
-  R as EVERYONE_GROUP_KEY,
-  x as EVERY_GUESTS_KEY,
+  x as EVERYONE_GROUP_KEY,
+  y as EVERY_GUESTS_KEY,
   l as GROUP_KEY_PREFIX,
-  a as GUEST_KEY_PREFIX,
+  f as GUEST_KEY_PREFIX,
   P as ShareOptionIcon,
-  u as TEAM_KEY_PREFIX,
-  p as USER_KEY_PREFIX
+  p as TEAM_KEY_PREFIX,
+  a as USER_KEY_PREFIX
 };
 //# sourceMappingURL=ShareOptionIcon.es.js.map

package/dist/shared/src/components/ShareOptionIcon/ShareOptionIcon.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ShareOptionIcon.es.js","sources":["../../../../../src/components/ShareOptionIcon/ShareOptionIcon.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport { UserImage } from '../UserImage'\nimport clsx from 'clsx'\n\nexport const EVERYONE_GROUP_KEY = '__everyone__' as const\nexport const EVERY_GUESTS_KEY = '__guests__' as const\n\nexport const GROUP_KEY_PREFIX = 'group:'\nexport const TEAM_KEY_PREFIX = 'team:'\nexport const USER_KEY_PREFIX = 'user:'\nexport const GUEST_KEY_PREFIX = 'guest:'\n\ninterface StyledIconProps {\n $size: number\n}\n\nconst StyledIcon = styled(Icon)<StyledIconProps>`\n font-size: ${({ $size }) => `${$size}px`};\n &.withBackground {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background-color: var(--md-sys-color-surface-container-high);\n padding: 3px;\n }\n`\n\nexport interface ShareOptionIconProps {\n shareType?: string\n name: string\n label?: string\n icon?: string // For backwards compatibility (explicit icon override)\n size?: number\n withBackground?: boolean\n}\n\nexport const ShareOptionIcon: FC<ShareOptionIconProps> = ({\n shareType,\n name,\n label,\n size = 24,\n withBackground = false,\n}) => {\n // Fallback: infer shareType from name prefix if not provided\n let effectiveShareType = shareType\n let strippedName = name\n if (!effectiveShareType) {\n if (name.startsWith(USER_KEY_PREFIX)) {\n effectiveShareType = 'user'\n strippedName = name.slice(USER_KEY_PREFIX.length)\n } else if (name.startsWith(GROUP_KEY_PREFIX)) {\n effectiveShareType = 'group'\n strippedName = name.slice(GROUP_KEY_PREFIX.length)\n } else if (name.startsWith(TEAM_KEY_PREFIX)) {\n effectiveShareType = 'team'\n strippedName = name.slice(TEAM_KEY_PREFIX.length)\n } else if (name.startsWith(GUEST_KEY_PREFIX)) {\n effectiveShareType = 'guest'\n strippedName = name.slice(GUEST_KEY_PREFIX.length)\n }\n }\n\n // helper to render an icon name with centralized props\n const renderIcon = (iconName: string, tooltip?: string) => (\n <StyledIcon\n className={clsx({ withBackground })}\n icon={iconName}\n data-tooltip={tooltip}\n data-tooltip-delay={0}\n $size={withBackground ? size - 6 : size}\n />\n )\n\n // Use shareType-based logic\n if (effectiveShareType === 'user') {\n return <UserImage name={strippedName} fullName={label} size={size} />\n }\n\n if (effectiveShareType === 'group') return renderIcon('shield_person', 'Access group')\n if (effectiveShareType === 'team') return renderIcon('groups', 'Team')\n if (effectiveShareType === 'guest' \|\| name === EVERY_GUESTS_KEY)\n return renderIcon('badge', 'Guest user')\n if (name === EVERYONE_GROUP_KEY)\n return renderIcon('groups', 'Everyone with access to the project')\n\n // Default fallback\n return renderIcon('person')\n}\n"],"names":["EVERYONE_GROUP_KEY","EVERY_GUESTS_KEY","GROUP_KEY_PREFIX","TEAM_KEY_PREFIX","USER_KEY_PREFIX","GUEST_KEY_PREFIX","StyledIcon","styled","Icon","$size","ShareOptionIcon","shareType","name","label","size","withBackground","effectiveShareType","strippedName","renderIcon","iconName","tooltip","jsx","clsx","UserImage"],"mappings":";;;;;AAMO,MAAMA,IAAqB,gBACrBC,IAAmB,cAEnBC,IAAmB,UACnBC,IAAkB,SAClBC,IAAkB,SAClBC,IAAmB,UAM1BC,IAAaC,EAAOC,CAAI;AAAA,eACf,CAAC,EAAE,OAAAC,EAAA,MAAY,GAAGA,CAAK,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~GAoB7BC~~,IAA4C,CAAC;AAAA,EACxD,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,gBAAAC,IAAiB;~~AACnB~~,MAAM;AAEJ,MAAIC,~~IAAqBL~~,~~GACrBM~~,~~IAAeL~~;AACnB,~~EAAKI~~,~~MACCJ~~,EAAK,WAAWR,CAAe,~~KACjCY~~,IAAqB,QACrBC,~~IAAeL~~,EAAK,MAAMR,EAAgB,MAAM,KACvCQ,EAAK,WAAWV,CAAgB,~~KACzCc~~,IAAqB,SACrBC,~~IAAeL~~,EAAK,MAAMV,EAAiB,MAAM,KACxCU,EAAK,WAAWT,CAAe,~~KACxCa~~,IAAqB,QACrBC,~~IAAeL~~,EAAK,MAAMT,EAAgB,MAAM,KACvCS,EAAK,WAAWP,CAAgB,~~MACzCW~~,IAAqB,SACrBC,~~IAAeL~~,EAAK,MAAMP,EAAiB,MAAM;AAKrD,~~QAAMa~~,IAAa,CAACC,GAAkBC,MACpCC,gBAAAA,EAAAA;AAAAA,~~IAACf~~;AAAA,IAAA;AAAA,MACC,~~WAAWgB~~,EAAK,EAAE,~~gBAAAP~~,GAAgB;AAAA,MAClC,~~MAAMI~~;AAAA,MACN,~~gBAAcC~~;AAAA,~~MACd~~,~~sBAAoB~~;AAAA,~~MACpB~~,~~OAAOL~~,IAAiBD,IAAO,IAAIA;AAAA,IAAA;AAAA,EAAA;AAKvC,~~SAAIE~~,MAAuB~~,+BACjBO~~,~~GAAA~~,~~EAAU~~,MAAMN,GAAc,~~UAAUJ~~,~~GAAO~~,MAAAC,GAAY,~~IAGjEE~~,MAAuB,UAAgBE,EAAW,iBAAiB,cAAc,IACjFF,MAAuB,SAAeE,EAAW,UAAU,MAAM,IACjEF,MAAuB,~~WAAWJ~~,MAASX,~~IACtCiB~~,EAAW,SAAS,YAAY,~~IACrCN~~,MAASZ,~~IACJkB~~,EAAW,UAAU,qCAAqC,IAG5DA,EAAW,QAAQ;AAC5B;"}
1	+ {"version":3,"file":"ShareOptionIcon.es.js","sources":["../../../../../src/components/ShareOptionIcon/ShareOptionIcon.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport { UserImage } from '../UserImage'\nimport clsx from 'clsx'\n\nexport const EVERYONE_GROUP_KEY = '__everyone__' as const\nexport const EVERY_GUESTS_KEY = '__guests__' as const\n\nexport const GROUP_KEY_PREFIX = 'group:'\nexport const TEAM_KEY_PREFIX = 'team:'\nexport const USER_KEY_PREFIX = 'user:'\nexport const GUEST_KEY_PREFIX = 'guest:'\n\ninterface StyledIconProps {\n $size: number\n}\n\nconst StyledIcon = styled(Icon)<StyledIconProps>`\n font-size: ${({ $size }) => `${$size}px`};\n &.withBackground {\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background-color: var(--md-sys-color-surface-container-high);\n padding: 3px;\n }\n`\n\nexport interface ShareOptionIconProps {\n shareType?: string\n name: string\n label?: string\n icon?: string // For backwards compatibility (explicit icon override)\n size?: number\n withBackground?: boolean\n withTooltip?: boolean\n}\n\nexport const ShareOptionIcon: FC<ShareOptionIconProps> = ({\n shareType,\n name,\n label,\n size = 24,\n withBackground = false,\n withTooltip = true,\n}) => {\n // Fallback: infer shareType from name prefix if not provided\n let effectiveShareType = shareType\n let strippedName = name\n if (!effectiveShareType) {\n if (name.startsWith(USER_KEY_PREFIX)) {\n effectiveShareType = 'user'\n strippedName = name.slice(USER_KEY_PREFIX.length)\n } else if (name.startsWith(GROUP_KEY_PREFIX)) {\n effectiveShareType = 'group'\n strippedName = name.slice(GROUP_KEY_PREFIX.length)\n } else if (name.startsWith(TEAM_KEY_PREFIX)) {\n effectiveShareType = 'team'\n strippedName = name.slice(TEAM_KEY_PREFIX.length)\n } else if (name.startsWith(GUEST_KEY_PREFIX)) {\n effectiveShareType = 'guest'\n strippedName = name.slice(GUEST_KEY_PREFIX.length)\n }\n }\n\n // helper to render an icon name with centralized props\n const renderIcon = (iconName: string, tooltip?: string) => (\n <StyledIcon\n className={clsx({ withBackground })}\n icon={iconName}\n data-tooltip={withTooltip ? tooltip : undefined}\n data-tooltip-delay={withTooltip ? 0 : undefined}\n $size={withBackground ? size - 6 : size}\n />\n )\n\n // Use shareType-based logic\n if (effectiveShareType === 'user') {\n return <UserImage name={strippedName} fullName={withTooltip ? label : undefined} size={size} />\n }\n\n if (effectiveShareType === 'group') return renderIcon('shield_person', 'Access group')\n if (effectiveShareType === 'team') return renderIcon('groups', 'Team')\n if (effectiveShareType === 'guest' \|\| name === EVERY_GUESTS_KEY)\n return renderIcon('badge', 'Guest user')\n if (name === EVERYONE_GROUP_KEY)\n return renderIcon('groups', 'Everyone with access to the project')\n\n // Default fallback\n return renderIcon('person')\n}\n"],"names":["EVERYONE_GROUP_KEY","EVERY_GUESTS_KEY","GROUP_KEY_PREFIX","TEAM_KEY_PREFIX","USER_KEY_PREFIX","GUEST_KEY_PREFIX","StyledIcon","styled","Icon","$size","ShareOptionIcon","shareType","name","label","size","withBackground","withTooltip","effectiveShareType","strippedName","renderIcon","iconName","tooltip","jsx","clsx","UserImage"],"mappings":";;;;;AAMO,MAAMA,IAAqB,gBACrBC,IAAmB,cAEnBC,IAAmB,UACnBC,IAAkB,SAClBC,IAAkB,SAClBC,IAAmB,UAM1BC,IAAaC,EAAOC,CAAI;AAAA,eACf,CAAC,EAAE,OAAAC,EAAA,MAAY,GAAGA,CAAK,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAqB7BC,IAA4C,CAAC;AAAA,EACxD,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,gBAAAC,IAAiB;AAAA,EACjB,aAAAC,IAAc;AAChB,MAAM;AAEJ,MAAIC,IAAqBN,GACrBO,IAAeN;AACnB,EAAKK,MACCL,EAAK,WAAWR,CAAe,KACjCa,IAAqB,QACrBC,IAAeN,EAAK,MAAMR,EAAgB,MAAM,KACvCQ,EAAK,WAAWV,CAAgB,KACzCe,IAAqB,SACrBC,IAAeN,EAAK,MAAMV,EAAiB,MAAM,KACxCU,EAAK,WAAWT,CAAe,KACxCc,IAAqB,QACrBC,IAAeN,EAAK,MAAMT,EAAgB,MAAM,KACvCS,EAAK,WAAWP,CAAgB,MACzCY,IAAqB,SACrBC,IAAeN,EAAK,MAAMP,EAAiB,MAAM;AAKrD,QAAMc,IAAa,CAACC,GAAkBC,MACpCC,gBAAAA,EAAAA;AAAAA,IAAChB;AAAA,IAAA;AAAA,MACC,WAAWiB,EAAK,EAAE,gBAAAR,GAAgB;AAAA,MAClC,MAAMK;AAAA,MACN,gBAAcJ,IAAcK,IAAU;AAAA,MACtC,sBAAoBL,IAAc,IAAI;AAAA,MACtC,OAAOD,IAAiBD,IAAO,IAAIA;AAAA,IAAA;AAAA,EAAA;AAKvC,SAAIG,MAAuB,SAClBK,gBAAAA,MAACE,KAAU,MAAMN,GAAc,UAAUF,IAAcH,IAAQ,QAAW,MAAAC,GAAY,IAG3FG,MAAuB,UAAgBE,EAAW,iBAAiB,cAAc,IACjFF,MAAuB,SAAeE,EAAW,UAAU,MAAM,IACjEF,MAAuB,WAAWL,MAASX,IACtCkB,EAAW,SAAS,YAAY,IACrCP,MAASZ,IACJmB,EAAW,UAAU,qCAAqC,IAG5DA,EAAW,QAAQ;AAC5B;"}

package/dist/shared/src/components/SimpleForm/FormField.cjs.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../../../_virtual/jsx-runtime.cjs.js"),l=require("@ynput/ayon-react-components"),c=require("../Badge/Badge.cjs.js"),i=require("./FormFile.cjs.js"),u=e=>{const t=r.jsxRuntimeExports.jsxs(r.jsxRuntimeExports.Fragment,{children:[r.jsxRuntimeExports.jsx("div",{style:{flex:1}}),e.badges&&e.badges.map((a,n)=>r.jsxRuntimeExports.jsx(c.Badge,{label:a},n))]});return r.jsxRuntimeExports.jsx(l.DefaultItemTemplate,{option:e,dataKey:"value",labelKey:"label",value:[`${e.value}`],endContent:t})},x=(e=[])=>e.map(t=>({...t,value:`${t.value}`})),d=(e=[],t)=>e.find(a=>`${a.value}`===t)?.value??t,m=({field:e,value:t,onChange:a})=>{const n=!!(e.disabled\|\|e.readOnly);if(e.type==="text"){const o=typeof t=="string"?t:"";return e.multiline?r.jsxRuntimeExports.jsx(l.InputTextarea,{value:o,onChange:s=>a(s.target.value),placeholder:e.placeholder\|\|"",disabled:n}):r.jsxRuntimeExports.jsx(l.InputText,{value:o,onChange:s=>a(s.target.value),placeholder:e.placeholder\|\|"",disabled:n})}if(e.type==="boolean"){const o=typeof t=="boolean"?t:!1,s=p=>{"target"in p&&"checked"in p.target&&a(p.target.checked)};return r.jsxRuntimeExports.jsx(l.InputSwitch,{checked:o,onChange:s,disabled:n})}if(e.type==="integer"){const o=typeof t=="number"?t:0;return r.jsxRuntimeExports.jsx(l.InputNumber,{value:o,onChange:s=>a(parseInt(s.target.value)),placeholder:e.placeholder\|\|"",disabled:n})}if(e.type==="float"){const o=typeof t=="number"?t:0;return r.jsxRuntimeExports.jsx(l.InputNumber,{type:"number",value:o,onChange:s=>a(parseFloat(s.target.value)),placeholder:e.placeholder\|\|"",disabled:n})}if(e.type==="select"){const o=t==null\|\|t===""?"":`${t}`;return r.jsxRuntimeExports.jsx(l.Dropdown,{widthExpand:!0,options:x(e.options),value:o?[o]:[],onSelectionChange:s=>a(d(e.options,s[0])),className:"form-field",multiSelect:!1,itemTemplate:u,placeholder:e.placeholder,disabled:n})}if(e.type==="multiselect"){const o=Array.isArray(t)?t.map(s=>`${s}`):[];return r.jsxRuntimeExports.jsx(l.Dropdown,{widthExpand:!0,options:x(e.options),value:o,onSelectionChange:s=>a(s.map(p=>d(e.options,p))),className:"form-field",multiSelect:!0,itemTemplate:u,placeholder:e.placeholder,disabled:n})}if(e.type==="file")return t&&t?.download?r.jsxRuntimeExports.jsx(i.FormFileDownload,{value:t}):r.jsxRuntimeExports.jsx(i.FormFileUpload,{value:t,onChange:a,validExtensions:e.valid_extensions})};exports.FormField=m;
2	+ //# sourceMappingURL=FormField.cjs.js.map

package/dist/shared/src/components/SimpleForm/FormField.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormField.cjs.js","sources":["../../../../../src/components/SimpleForm/FormField.tsx"],"sourcesContent":["import React from 'react'\nimport {\n InputNumber,\n InputText,\n InputTextarea,\n InputSwitch,\n Dropdown,\n DefaultItemTemplate,\n} from '@ynput/ayon-react-components'\nimport { Badge } from '../Badge'\nimport { FormFileUpload, FormFileDownload, type FormFileData } from './FormFile'\nimport type { FormOptionItem, SimpleFormField } from '@shared/api'\nimport type { SimpleFormValue } from './types'\n\nconst DropdownItemTemplate = (option: FormOptionItem) => {\n const endContent = (\n <>\n <div style={{ flex: 1 }} />\n {option.badges && option.badges.map((badge, index) => <Badge key={index} label={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\n// Dropdown works with string ids; option values can be numbers or booleans\nconst toDropdownOptions = (options: FormOptionItem[] = []) =>\n options.map((option) => ({ ...option, value: `${option.value}` }))\n\nconst toOptionValue = (options: FormOptionItem[] = [], selected: string) =>\n options.find((option) => `${option.value}` === selected)?.value ?? selected\n\nexport interface FormFieldProps {\n field: SimpleFormField\n value: SimpleFormValue\n onChange: (value: SimpleFormValue) => void\n}\n\n/**\n * Renders the input for a single (non-label) field. `field` is expected to\n * already be the *effective* field - static definition with any matching\n * rule's patch (readOnly/disabled/hidden/options/...) merged on top - SimpleForm\n * does that merging, this component just renders whatever it's handed.\n */\nexport const FormField = ({ field, value, onChange }: FormFieldProps) => {\n const isDisabled = !!(field.disabled || field.readOnly)\n\n if (field.type === 'text') {\n const parsedValue = typeof value === 'string' ? value : ''\n if (field.multiline) {\n return (\n <InputTextarea\n value={parsedValue}\n onChange={(e) => onChange(e.target.value)}\n placeholder={field.placeholder || ''}\n disabled={isDisabled}\n />\n )\n }\n return (\n <InputText\n value={parsedValue}\n onChange={(e) => onChange(e.target.value)}\n placeholder={field.placeholder || ''}\n disabled={isDisabled}\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 (\n <InputSwitch checked={parsedValue} onChange={handleCheckboxEvent} disabled={isDisabled} />\n )\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 disabled={isDisabled}\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 disabled={isDisabled}\n />\n )\n }\n\n if (field.type === 'select') {\n const parsedValue = value === undefined || value === null || value === '' ? '' : `${value}`\n return (\n <Dropdown\n widthExpand\n options={toDropdownOptions(field.options)}\n value={parsedValue ? [parsedValue] : []}\n onSelectionChange={(e) => onChange(toOptionValue(field.options, e[0]) as SimpleFormValue)}\n className={`form-field`}\n multiSelect={false}\n itemTemplate={DropdownItemTemplate}\n placeholder={field.placeholder}\n disabled={isDisabled}\n />\n )\n } // Handle select\n\n if (field.type === 'multiselect') {\n const parsedValue = Array.isArray(value) ? value.map((value) => `${value}`) : []\n return (\n <Dropdown\n widthExpand\n options={toDropdownOptions(field.options)}\n value={parsedValue}\n onSelectionChange={(e) =>\n onChange(e.map((selected) => toOptionValue(field.options, selected)) as SimpleFormValue)\n }\n className={`form-field`}\n multiSelect={true}\n itemTemplate={DropdownItemTemplate}\n placeholder={field.placeholder}\n disabled={isDisabled}\n />\n )\n }\n\n if (field.type === 'file') {\n if (value && (value as FormFileData)?.download) {\n return <FormFileDownload value={value as FormFileData} />\n }\n return (\n <FormFileUpload\n value={value as FormFileData}\n onChange={onChange}\n validExtensions={field.valid_extensions}\n />\n )\n }\n}\n"],"names":["DropdownItemTemplate","option","endContent","jsxs","Fragment","jsx","badge","index","Badge","DefaultItemTemplate","toDropdownOptions","options","toOptionValue","selected","FormField","field","value","onChange","isDisabled","parsedValue","InputTextarea","e","InputText","handleCheckboxEvent","event","InputSwitch","InputNumber","Dropdown","FormFileDownload","FormFileUpload"],"mappings":"uPAcMA,EAAwBC,GAA2B,CACvD,MAAMC,EACJC,EAAAA,kBAAAA,KAAAC,EAAAA,kBAAAA,SAAA,CACE,SAAA,CAAAC,EAAAA,kBAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,KAAM,GAAK,EACxBJ,EAAO,QAAUA,EAAO,OAAO,IAAI,CAACK,EAAOC,IAAUF,EAAAA,kBAAAA,IAACG,EAAAA,MAAA,CAAkB,MAAOF,CAAA,EAAdC,CAAqB,CAAE,CAAA,EAC3F,EAEF,OACEF,EAAAA,kBAAAA,IAACI,EAAAA,oBAAA,CACC,OAAAR,EACA,QAAS,QACT,SAAU,QACV,MAAO,CAAC,GAAGA,EAAO,KAAK,EAAE,EACzB,WAAAC,CAAA,CAAA,CAGN,EAGMQ,EAAoB,CAACC,EAA4B,CAAA,IACrDA,EAAQ,IAAKV,IAAY,CAAE,GAAGA,EAAQ,MAAO,GAAGA,EAAO,KAAK,IAAK,EAE7DW,EAAgB,CAACD,EAA4B,CAAA,EAAIE,IACrDF,EAAQ,KAAMV,GAAW,GAAGA,EAAO,KAAK,KAAOY,CAAQ,GAAG,OAASA,EAcxDC,EAAY,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,SAAAC,KAA+B,CACvE,MAAMC,EAAa,CAAC,EAAEH,EAAM,UAAYA,EAAM,UAE9C,GAAIA,EAAM,OAAS,OAAQ,CACzB,MAAMI,EAAc,OAAOH,GAAU,SAAWA,EAAQ,GACxD,OAAID,EAAM,UAENV,EAAAA,kBAAAA,IAACe,EAAAA,cAAA,CACC,MAAOD,EACP,SAAWE,GAAMJ,EAASI,EAAE,OAAO,KAAK,EACxC,YAAaN,EAAM,aAAe,GAClC,SAAUG,CAAA,CAAA,EAKdb,EAAAA,kBAAAA,IAACiB,EAAAA,UAAA,CACC,MAAOH,EACP,SAAWE,GAAMJ,EAASI,EAAE,OAAO,KAAK,EACxC,YAAaN,EAAM,aAAe,GAClC,SAAUG,CAAA,CAAA,CAGhB,CACA,GAAIH,EAAM,OAAS,UAAW,CAC5B,MAAMI,EAAc,OAAOH,GAAU,UAAYA,EAAQ,GAEnDO,EACJC,GACG,CACC,WAAYA,GAAS,YAAaA,EAAM,QAC1CP,EAAUO,EAAM,OAA4B,OAAO,CAEvD,EAEA,+BACGC,cAAA,CAAY,QAASN,EAAa,SAAUI,EAAqB,SAAUL,EAAY,CAE5F,CACA,GAAIH,EAAM,OAAS,UAAW,CAC5B,MAAMI,EAAc,OAAOH,GAAU,SAAWA,EAAQ,EACxD,OACEX,EAAAA,kBAAAA,IAACqB,EAAAA,YAAA,CACC,MAAOP,EACP,SAAWE,GAAMJ,EAAS,SAASI,EAAE,OAAO,KAAK,CAAC,EAClD,YAAaN,EAAM,aAAe,GAClC,SAAUG,CAAA,CAAA,CAGhB,CACA,GAAIH,EAAM,OAAS,QAAS,CAC1B,MAAMI,EAAc,OAAOH,GAAU,SAAWA,EAAQ,EACxD,OACEX,EAAAA,kBAAAA,IAACqB,EAAAA,YAAA,CACC,KAAK,SACL,MAAOP,EACP,SAAWE,GAAMJ,EAAS,WAAWI,EAAE,OAAO,KAAK,CAAC,EACpD,YAAaN,EAAM,aAAe,GAClC,SAAUG,CAAA,CAAA,CAGhB,CAEA,GAAIH,EAAM,OAAS,SAAU,CAC3B,MAAMI,EAAqCH,GAAU,MAAQA,IAAU,GAAK,GAAK,GAAGA,CAAK,GACzF,OACEX,EAAAA,kBAAAA,IAACsB,EAAAA,SAAA,CACC,YAAW,GACX,QAASjB,EAAkBK,EAAM,OAAO,EACxC,MAAOI,EAAc,CAACA,CAAW,EAAI,CAAA,EACrC,kBAAoBE,GAAMJ,EAASL,EAAcG,EAAM,QAASM,EAAE,CAAC,CAAC,CAAoB,EACxF,UAAW,aACX,YAAa,GACb,aAAcrB,EACd,YAAae,EAAM,YACnB,SAAUG,CAAA,CAAA,CAGhB,CAEA,GAAIH,EAAM,OAAS,cAAe,CAChC,MAAMI,EAAc,MAAM,QAAQH,CAAK,EAAIA,EAAM,IAAKA,GAAU,GAAGA,CAAK,EAAE,EAAI,CAAA,EAC9E,OACEX,EAAAA,kBAAAA,IAACsB,EAAAA,SAAA,CACC,YAAW,GACX,QAASjB,EAAkBK,EAAM,OAAO,EACxC,MAAOI,EACP,kBAAoBE,GAClBJ,EAASI,EAAE,IAAKR,GAAaD,EAAcG,EAAM,QAASF,CAAQ,CAAC,CAAoB,EAEzF,UAAW,aACX,YAAa,GACb,aAAcb,EACd,YAAae,EAAM,YACnB,SAAUG,CAAA,CAAA,CAGhB,CAEA,GAAIH,EAAM,OAAS,OACjB,OAAIC,GAAUA,GAAwB,SAC7BX,wBAACuB,EAAAA,kBAAiB,MAAAZ,EAA8B,EAGvDX,EAAAA,kBAAAA,IAACwB,EAAAA,eAAA,CACC,MAAAb,EACA,SAAAC,EACA,gBAAiBF,EAAM,gBAAA,CAAA,CAI/B"}

package/dist/shared/src/components/SimpleForm/FormField.es.js ADDED Viewed

@@ -0,0 +1,120 @@
+import { j as r } from "../../../../_virtual/jsx-runtime.es.js";
+import { InputTextarea as u, InputText as x, InputSwitch as b, InputNumber as p, Dropdown as d, DefaultItemTemplate as h } from "@ynput/ayon-react-components";
+import { Badge as y } from "../Badge/Badge.es.js";
+import { FormFileDownload as j, FormFileUpload as g } from "./FormFile.es.js";
+const c = (e) => {
+  const t = /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+    /* @__PURE__ */ r.jsx("div", { style: { flex: 1 } }),
+    e.badges && e.badges.map((s, l) => /* @__PURE__ */ r.jsx(y, { label: s }, l))
+  ] });
+  return /* @__PURE__ */ r.jsx(
+    h,
+    {
+      option: e,
+      dataKey: "value",
+      labelKey: "label",
+      value: [`${e.value}`],
+      endContent: t
+    }
+  );
+}, i = (e = []) => e.map((t) => ({ ...t, value: `${t.value}` })), m = (e = [], t) => e.find((s) => `${s.value}` === t)?.value ?? t, V = ({ field: e, value: t, onChange: s }) => {
+  const l = !!(e.disabled || e.readOnly);
+  if (e.type === "text") {
+    const o = typeof t == "string" ? t : "";
+    return e.multiline ? /* @__PURE__ */ r.jsx(
+      u,
+      {
+        value: o,
+        onChange: (a) => s(a.target.value),
+        placeholder: e.placeholder || "",
+        disabled: l
+      }
+    ) : /* @__PURE__ */ r.jsx(
+      x,
+      {
+        value: o,
+        onChange: (a) => s(a.target.value),
+        placeholder: e.placeholder || "",
+        disabled: l
+      }
+    );
+  }
+  if (e.type === "boolean") {
+    const o = typeof t == "boolean" ? t : !1, a = (n) => {
+      "target" in n && "checked" in n.target && s(n.target.checked);
+    };
+    return /* @__PURE__ */ r.jsx(b, { checked: o, onChange: a, disabled: l });
+  }
+  if (e.type === "integer") {
+    const o = typeof t == "number" ? t : 0;
+    return /* @__PURE__ */ r.jsx(
+      p,
+      {
+        value: o,
+        onChange: (a) => s(parseInt(a.target.value)),
+        placeholder: e.placeholder || "",
+        disabled: l
+      }
+    );
+  }
+  if (e.type === "float") {
+    const o = typeof t == "number" ? t : 0;
+    return /* @__PURE__ */ r.jsx(
+      p,
+      {
+        type: "number",
+        value: o,
+        onChange: (a) => s(parseFloat(a.target.value)),
+        placeholder: e.placeholder || "",
+        disabled: l
+      }
+    );
+  }
+  if (e.type === "select") {
+    const o = t == null || t === "" ? "" : `${t}`;
+    return /* @__PURE__ */ r.jsx(
+      d,
+      {
+        widthExpand: !0,
+        options: i(e.options),
+        value: o ? [o] : [],
+        onSelectionChange: (a) => s(m(e.options, a[0])),
+        className: "form-field",
+        multiSelect: !1,
+        itemTemplate: c,
+        placeholder: e.placeholder,
+        disabled: l
+      }
+    );
+  }
+  if (e.type === "multiselect") {
+    const o = Array.isArray(t) ? t.map((a) => `${a}`) : [];
+    return /* @__PURE__ */ r.jsx(
+      d,
+      {
+        widthExpand: !0,
+        options: i(e.options),
+        value: o,
+        onSelectionChange: (a) => s(a.map((n) => m(e.options, n))),
+        className: "form-field",
+        multiSelect: !0,
+        itemTemplate: c,
+        placeholder: e.placeholder,
+        disabled: l
+      }
+    );
+  }
+  if (e.type === "file")
+    return t && t?.download ? /* @__PURE__ */ r.jsx(j, { value: t }) : /* @__PURE__ */ r.jsx(
+      g,
+      {
+        value: t,
+        onChange: s,
+        validExtensions: e.valid_extensions
+      }
+    );
+};
+export {
+  V as FormField
+};
+//# sourceMappingURL=FormField.es.js.map

package/dist/shared/src/components/SimpleForm/FormField.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormField.es.js","sources":["../../../../../src/components/SimpleForm/FormField.tsx"],"sourcesContent":["import React from 'react'\nimport {\n InputNumber,\n InputText,\n InputTextarea,\n InputSwitch,\n Dropdown,\n DefaultItemTemplate,\n} from '@ynput/ayon-react-components'\nimport { Badge } from '../Badge'\nimport { FormFileUpload, FormFileDownload, type FormFileData } from './FormFile'\nimport type { FormOptionItem, SimpleFormField } from '@shared/api'\nimport type { SimpleFormValue } from './types'\n\nconst DropdownItemTemplate = (option: FormOptionItem) => {\n const endContent = (\n <>\n <div style={{ flex: 1 }} />\n {option.badges && option.badges.map((badge, index) => <Badge key={index} label={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\n// Dropdown works with string ids; option values can be numbers or booleans\nconst toDropdownOptions = (options: FormOptionItem[] = []) =>\n options.map((option) => ({ ...option, value: `${option.value}` }))\n\nconst toOptionValue = (options: FormOptionItem[] = [], selected: string) =>\n options.find((option) => `${option.value}` === selected)?.value ?? selected\n\nexport interface FormFieldProps {\n field: SimpleFormField\n value: SimpleFormValue\n onChange: (value: SimpleFormValue) => void\n}\n\n/**\n * Renders the input for a single (non-label) field. `field` is expected to\n * already be the *effective* field - static definition with any matching\n * rule's patch (readOnly/disabled/hidden/options/...) merged on top - SimpleForm\n * does that merging, this component just renders whatever it's handed.\n */\nexport const FormField = ({ field, value, onChange }: FormFieldProps) => {\n const isDisabled = !!(field.disabled || field.readOnly)\n\n if (field.type === 'text') {\n const parsedValue = typeof value === 'string' ? value : ''\n if (field.multiline) {\n return (\n <InputTextarea\n value={parsedValue}\n onChange={(e) => onChange(e.target.value)}\n placeholder={field.placeholder || ''}\n disabled={isDisabled}\n />\n )\n }\n return (\n <InputText\n value={parsedValue}\n onChange={(e) => onChange(e.target.value)}\n placeholder={field.placeholder || ''}\n disabled={isDisabled}\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 (\n <InputSwitch checked={parsedValue} onChange={handleCheckboxEvent} disabled={isDisabled} />\n )\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 disabled={isDisabled}\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 disabled={isDisabled}\n />\n )\n }\n\n if (field.type === 'select') {\n const parsedValue = value === undefined || value === null || value === '' ? '' : `${value}`\n return (\n <Dropdown\n widthExpand\n options={toDropdownOptions(field.options)}\n value={parsedValue ? [parsedValue] : []}\n onSelectionChange={(e) => onChange(toOptionValue(field.options, e[0]) as SimpleFormValue)}\n className={`form-field`}\n multiSelect={false}\n itemTemplate={DropdownItemTemplate}\n placeholder={field.placeholder}\n disabled={isDisabled}\n />\n )\n } // Handle select\n\n if (field.type === 'multiselect') {\n const parsedValue = Array.isArray(value) ? value.map((value) => `${value}`) : []\n return (\n <Dropdown\n widthExpand\n options={toDropdownOptions(field.options)}\n value={parsedValue}\n onSelectionChange={(e) =>\n onChange(e.map((selected) => toOptionValue(field.options, selected)) as SimpleFormValue)\n }\n className={`form-field`}\n multiSelect={true}\n itemTemplate={DropdownItemTemplate}\n placeholder={field.placeholder}\n disabled={isDisabled}\n />\n )\n }\n\n if (field.type === 'file') {\n if (value && (value as FormFileData)?.download) {\n return <FormFileDownload value={value as FormFileData} />\n }\n return (\n <FormFileUpload\n value={value as FormFileData}\n onChange={onChange}\n validExtensions={field.valid_extensions}\n />\n )\n }\n}\n"],"names":["DropdownItemTemplate","option","endContent","jsxs","Fragment","jsx","badge","index","Badge","DefaultItemTemplate","toDropdownOptions","options","toOptionValue","selected","FormField","field","value","onChange","isDisabled","parsedValue","InputTextarea","e","InputText","handleCheckboxEvent","event","InputSwitch","InputNumber","Dropdown","FormFileDownload","FormFileUpload"],"mappings":"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"}

package/dist/shared/src/components/SimpleForm/FormFile.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormFile.cjs.js","sources":["../../../../../src/components/SimpleForm/FormFile.tsx"],"sourcesContent":["import { useMemo, useCallback, useRef, DragEvent } from 'react'\nimport { toast } from 'react-toastify'\nimport styled from 'styled-components'\nimport { parseFilename } from '@shared/util/parseFilename'\n\nexport interface FormFileData {\n payload: string\n filename: string\n download?: boolean\n}\n\nconst LinkButton = styled.button`\n width: auto;\n background: none;\n border: none;\n border-bottom: 1px dashed var(--md-sys-color-primary);\n color: var(--md-sys-color-primary);\n cursor: pointer;\n padding: 2px;\n font: inherit;\n`\n\n//\n// File upload\n//\n\nconst DropArea = styled.div`\n border: 2px dashed var(--md-sys-color-outline);\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-width: 200px;\n min-height: 100px;\n\n input {\n display: none;\n }\n`\n\ninterface FormFileUploadProps {\n value?: FormFileData\n onChange: (value: FormFileData) => void\n validExtensions?: string[]\n}\n\nexport const FormFileUpload = (props: FormFileUploadProps) => {\n // widget that displays a file upload input (and drop area)\n // and when user selects a file, it reads the file as base64 and calls setFieldValue with the base64 string\n\n const inputRef = useRef<HTMLInputElement>(null)\n\n const validExtensions = useMemo(\n () =>\n props.validExtensions?.map((ext) =>\n ext.startsWith('.') ? ext.toLowerCase() : `.${ext.toLowerCase()}`,\n ),\n [props.validExtensions],\n )\n\n const handleFileChange = useCallback(\n (file?: File) => {\n if (!file) {\n return\n }\n\n if (file.size === 0) {\n toast.error('Cannot upload empty file.')\n return\n }\n\n if (file.size > 2 * 1024 * 1024) {\n // 2 MB limit, because we're sending it in JSON as base64\n toast.error('File size exceeds the 2 MB limit.')\n return\n }\n\n if (validExtensions) {\n const fileExtension = `.${file.name.split('.').pop()?.toLowerCase()}`\n if (!validExtensions.includes(fileExtension)) {\n toast.error(`Invalid file type. Supported formats: ${validExtensions.join(', ')}`)\n return\n }\n }\n\n if (file) {\n const fileName = parseFilename(file.name)\n const reader = new FileReader()\n reader.onload = () => {\n const base64String = (reader.result as string).split(',')[1] // remove data:*/*;base64, prefix\n props.onChange({ payload: base64String, filename: fileName })\n }\n reader.readAsDataURL(file)\n }\n },\n [props, validExtensions],\n )\n\n const handleDragOver = (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault()\n }\n\n const handleDragLeave = (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault()\n }\n\n const handleDrop = (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault()\n\n const files = [...e.dataTransfer.files]\n if (files.length === 1) {\n handleFileChange(files[0])\n }\n }\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const file = event.target.files?.[0]\n handleFileChange(file)\n }\n\n return (\n <DropArea onDragOver={handleDragOver} onDragLeave={handleDragLeave} onDrop={handleDrop}>\n <input\n type=\"file\"\n ref={inputRef}\n onChange={handleInputChange}\n accept={validExtensions?.join(',')}\n multiple={false}\n style={{ display: 'none' }}\n />\n\n <LinkButton type=\"button\" onClick={() => inputRef.current?.click()}>\n {props.value ? `Change file (${props.value.filename})` : 'Upload file'}\n </LinkButton>\n </DropArea>\n )\n}\n\n//\n// File download\n//\n\nconst DownloadLink = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n background: none;\n border: none;\n`\n\ninterface FormFileDownloadProps {\n value: FormFileData\n}\n\nexport const FormFileDownload = (props: FormFileDownloadProps) => {\n const handleDownload = () => {\n const link = document.createElement('a')\n link.href = `data:application/octet-stream;base64,${props.value.payload}`\n link.download = props.value.filename\n document.body.appendChild(link)\n link.click()\n document.body.removeChild(link)\n }\n\n return (\n <DownloadLink>\n <LinkButton onClick={handleDownload}>{props.value.filename}</LinkButton>\n </DownloadLink>\n )\n}\n"],"names":["LinkButton","styled","DropArea","FormFileUpload","props","inputRef","useRef","validExtensions","useMemo","ext","handleFileChange","useCallback","file","toast","fileExtension","fileName","parseFilename","reader","base64String","handleDragOver","handleDragLeave","handleDrop","files","handleInputChange","event","jsx","DownloadLink","FormFileDownload","handleDownload","link"],"mappings":"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"}

package/dist/shared/src/components/SimpleForm/FormFile.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormFile.es.js","sources":["../../../../../src/components/SimpleForm/FormFile.tsx"],"sourcesContent":["import { useMemo, useCallback, useRef, DragEvent } from 'react'\nimport { toast } from 'react-toastify'\nimport styled from 'styled-components'\nimport { parseFilename } from '@shared/util/parseFilename'\n\nexport interface FormFileData {\n payload: string\n filename: string\n download?: boolean\n}\n\nconst LinkButton = styled.button`\n width: auto;\n background: none;\n border: none;\n border-bottom: 1px dashed var(--md-sys-color-primary);\n color: var(--md-sys-color-primary);\n cursor: pointer;\n padding: 2px;\n font: inherit;\n`\n\n//\n// File upload\n//\n\nconst DropArea = styled.div`\n border: 2px dashed var(--md-sys-color-outline);\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-width: 200px;\n min-height: 100px;\n\n input {\n display: none;\n }\n`\n\ninterface FormFileUploadProps {\n value?: FormFileData\n onChange: (value: FormFileData) => void\n validExtensions?: string[]\n}\n\nexport const FormFileUpload = (props: FormFileUploadProps) => {\n // widget that displays a file upload input (and drop area)\n // and when user selects a file, it reads the file as base64 and calls setFieldValue with the base64 string\n\n const inputRef = useRef<HTMLInputElement>(null)\n\n const validExtensions = useMemo(\n () =>\n props.validExtensions?.map((ext) =>\n ext.startsWith('.') ? ext.toLowerCase() : `.${ext.toLowerCase()}`,\n ),\n [props.validExtensions],\n )\n\n const handleFileChange = useCallback(\n (file?: File) => {\n if (!file) {\n return\n }\n\n if (file.size === 0) {\n toast.error('Cannot upload empty file.')\n return\n }\n\n if (file.size > 2 * 1024 * 1024) {\n // 2 MB limit, because we're sending it in JSON as base64\n toast.error('File size exceeds the 2 MB limit.')\n return\n }\n\n if (validExtensions) {\n const fileExtension = `.${file.name.split('.').pop()?.toLowerCase()}`\n if (!validExtensions.includes(fileExtension)) {\n toast.error(`Invalid file type. Supported formats: ${validExtensions.join(', ')}`)\n return\n }\n }\n\n if (file) {\n const fileName = parseFilename(file.name)\n const reader = new FileReader()\n reader.onload = () => {\n const base64String = (reader.result as string).split(',')[1] // remove data:*/*;base64, prefix\n props.onChange({ payload: base64String, filename: fileName })\n }\n reader.readAsDataURL(file)\n }\n },\n [props, validExtensions],\n )\n\n const handleDragOver = (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault()\n }\n\n const handleDragLeave = (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault()\n }\n\n const handleDrop = (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault()\n\n const files = [...e.dataTransfer.files]\n if (files.length === 1) {\n handleFileChange(files[0])\n }\n }\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n const file = event.target.files?.[0]\n handleFileChange(file)\n }\n\n return (\n <DropArea onDragOver={handleDragOver} onDragLeave={handleDragLeave} onDrop={handleDrop}>\n <input\n type=\"file\"\n ref={inputRef}\n onChange={handleInputChange}\n accept={validExtensions?.join(',')}\n multiple={false}\n style={{ display: 'none' }}\n />\n\n <LinkButton type=\"button\" onClick={() => inputRef.current?.click()}>\n {props.value ? `Change file (${props.value.filename})` : 'Upload file'}\n </LinkButton>\n </DropArea>\n )\n}\n\n//\n// File download\n//\n\nconst DownloadLink = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n background: none;\n border: none;\n`\n\ninterface FormFileDownloadProps {\n value: FormFileData\n}\n\nexport const FormFileDownload = (props: FormFileDownloadProps) => {\n const handleDownload = () => {\n const link = document.createElement('a')\n link.href = `data:application/octet-stream;base64,${props.value.payload}`\n link.download = props.value.filename\n document.body.appendChild(link)\n link.click()\n document.body.removeChild(link)\n }\n\n return (\n <DownloadLink>\n <LinkButton onClick={handleDownload}>{props.value.filename}</LinkButton>\n </DownloadLink>\n )\n}\n"],"names":["LinkButton","styled","DropArea","FormFileUpload","props","inputRef","useRef","validExtensions","useMemo","ext","handleFileChange","useCallback","file","toast","fileExtension","fileName","parseFilename","reader","base64String","handleDragOver","handleDragLeave","handleDrop","files","handleInputChange","event","jsx","DownloadLink","FormFileDownload","handleDownload","link"],"mappings":";;;;;AAWA,MAAMA,IAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAepBC,IAAWD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAqBXE,IAAiB,CAACC,MAA+B;AAI5D,QAAMC,IAAWC,EAAyB,IAAI,GAExCC,IAAkBC;AAAA,IACtB,MACEJ,EAAM,iBAAiB;AAAA,MAAI,CAACK,MAC1BA,EAAI,WAAW,GAAG,IAAIA,EAAI,YAAA,IAAgB,IAAIA,EAAI,YAAA,CAAa;AAAA,IAAA;AAAA,IAEnE,CAACL,EAAM,eAAe;AAAA,EAAA,GAGlBM,IAAmBC;AAAA,IACvB,CAACC,MAAgB;AACf,UAAKA,GAIL;AAAA,YAAIA,EAAK,SAAS,GAAG;AACnB,UAAAC,EAAM,MAAM,2BAA2B;AACvC;AAAA,QACF;AAEA,YAAID,EAAK,OAAO,IAAI,OAAO,MAAM;AAE/B,UAAAC,EAAM,MAAM,mCAAmC;AAC/C;AAAA,QACF;AAEA,YAAIN,GAAiB;AACnB,gBAAMO,IAAgB,IAAIF,EAAK,KAAK,MAAM,GAAG,EAAE,OAAO,YAAA,CAAa;AACnE,cAAI,CAACL,EAAgB,SAASO,CAAa,GAAG;AAC5C,YAAAD,EAAM,MAAM,yCAAyCN,EAAgB,KAAK,IAAI,CAAC,EAAE;AACjF;AAAA,UACF;AAAA,QACF;AAEA,YAAIK,GAAM;AACR,gBAAMG,IAAWC,EAAcJ,EAAK,IAAI,GAClCK,IAAS,IAAI,WAAA;AACnB,UAAAA,EAAO,SAAS,MAAM;AACpB,kBAAMC,IAAgBD,EAAO,OAAkB,MAAM,GAAG,EAAE,CAAC;AAC3D,YAAAb,EAAM,SAAS,EAAE,SAASc,GAAc,UAAUH,GAAU;AAAA,UAC9D,GACAE,EAAO,cAAcL,CAAI;AAAA,QAC3B;AAAA;AAAA,IACF;AAAA,IACA,CAACR,GAAOG,CAAe;AAAA,EAAA,GAGnBY,IAAiB,CAAC,MAAiC;AACvD,MAAE,eAAA;AAAA,EACJ,GAEMC,IAAkB,CAAC,MAAiC;AACxD,MAAE,eAAA;AAAA,EACJ,GAEMC,IAAa,CAAC,MAAiC;AACnD,MAAE,eAAA;AAEF,UAAMC,IAAQ,CAAC,GAAG,EAAE,aAAa,KAAK;AACtC,IAAIA,EAAM,WAAW,KACnBZ,EAAiBY,EAAM,CAAC,CAAC;AAAA,EAE7B,GAEMC,IAAoB,CAACC,MAA+C;AACxE,UAAMZ,IAAOY,EAAM,OAAO,QAAQ,CAAC;AACnC,IAAAd,EAAiBE,CAAI;AAAA,EACvB;AAEA,gCACGV,GAAA,EAAS,YAAYiB,GAAgB,aAAaC,GAAiB,QAAQC,GAC1E,UAAA;AAAA,IAAAI,gBAAAA,EAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAKpB;AAAA,QACL,UAAUkB;AAAA,QACV,QAAQhB,GAAiB,KAAK,GAAG;AAAA,QACjC,UAAU;AAAA,QACV,OAAO,EAAE,SAAS,OAAA;AAAA,MAAO;AAAA,IAAA;AAAA,0BAG1BP,GAAA,EAAW,MAAK,UAAS,SAAS,MAAMK,EAAS,SAAS,MAAA,GACxD,YAAM,QAAQ,gBAAgBD,EAAM,MAAM,QAAQ,MAAM,cAAA,CAC3D;AAAA,EAAA,GACF;AAEJ,GAMMsB,IAAezB,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAaf0B,IAAmB,CAACvB,MAAiC;AAChE,QAAMwB,IAAiB,MAAM;AAC3B,UAAMC,IAAO,SAAS,cAAc,GAAG;AACvC,IAAAA,EAAK,OAAO,wCAAwCzB,EAAM,MAAM,OAAO,IACvEyB,EAAK,WAAWzB,EAAM,MAAM,UAC5B,SAAS,KAAK,YAAYyB,CAAI,GAC9BA,EAAK,MAAA,GACL,SAAS,KAAK,YAAYA,CAAI;AAAA,EAChC;AAEA,SACEJ,gBAAAA,EAAAA,IAACC,KACC,UAAAD,gBAAAA,EAAAA,IAACzB,GAAA,EAAW,SAAS4B,GAAiB,UAAAxB,EAAM,MAAM,SAAA,CAAS,EAAA,CAC7D;AAEJ;"}

package/dist/shared/src/components/SimpleForm/FormLabel.cjs.js ADDED Viewed

@@ -0,0 +1,25 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../../../_virtual/jsx-runtime.cjs.js"),n=require("styled-components"),a=require("react-markdown"),t=n.div`
+  &.normal {
+    // maybe something here
+  }
+  &.info,
+  &.warning,
+  &.error {
+    padding: 0.5rem;
+    text-align: center;
+    font-weight: bold;
+    margin: 1rem 0;
+  }
+  &.info {
+    background-color: var(--md-sys-color-on-secondary-dark);
+  }
+  &.warning {
+    background-color: var(--md-sys-color-warning-container-dark);
+  }
+  &.error {
+    background-color: var(--md-sys-color-on-error-dark);
+  }
+`,s=({field:r})=>{const e=typeof r.value=="string"?r.value:"Invalid label value";return o.jsxRuntimeExports.jsx(t,{className:r.highlight||"normal",children:o.jsxRuntimeExports.jsx(a,{children:e})})};exports.FormLabel=s;
+//# sourceMappingURL=FormLabel.cjs.js.map

package/dist/shared/src/components/SimpleForm/FormLabel.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormLabel.cjs.js","sources":["../../../../../src/components/SimpleForm/FormLabel.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport ReactMarkdown from 'react-markdown'\nimport type { SimpleFormField } from '@shared/api'\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\nexport interface FormLabelProps {\n field: SimpleFormField\n}\n\nexport const 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"],"names":["LabelContainer","styled","FormLabel","field","text","jsx","ReactMarkdown"],"mappings":"sMAIMA,EAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA6BjBC,EAAY,CAAC,CAAE,MAAAC,KAA4B,CACtD,MAAMC,EAAO,OAAOD,EAAM,OAAU,SAAWA,EAAM,MAAQ,sBAE7D,OACEE,EAAAA,kBAAAA,IAACL,GAAe,UAAWG,EAAM,WAAa,SAC5C,SAAAE,EAAAA,kBAAAA,IAACC,EAAA,CAAe,SAAAF,CAAA,CAAK,CAAA,CACvB,CAEJ"}

package/dist/shared/src/components/SimpleForm/FormLabel.es.js ADDED Viewed

@@ -0,0 +1,34 @@
+import { j as o } from "../../../../_virtual/jsx-runtime.es.js";
+import a from "styled-components";
+import e from "react-markdown";
+const t = a.div`
+  &.normal {
+    // maybe something here
+  }
+  &.info,
+  &.warning,
+  &.error {
+    padding: 0.5rem;
+    text-align: center;
+    font-weight: bold;
+    margin: 1rem 0;
+  }
+  &.info {
+    background-color: var(--md-sys-color-on-secondary-dark);
+  }
+  &.warning {
+    background-color: var(--md-sys-color-warning-container-dark);
+  }
+  &.error {
+    background-color: var(--md-sys-color-on-error-dark);
+  }
+`, c = ({ field: r }) => {
+  const n = typeof r.value == "string" ? r.value : "Invalid label value";
+  return /* @__PURE__ */ o.jsx(t, { className: r.highlight || "normal", children: /* @__PURE__ */ o.jsx(e, { children: n }) });
+};
+export {
+  c as FormLabel
+};
+//# sourceMappingURL=FormLabel.es.js.map

package/dist/shared/src/components/SimpleForm/FormLabel.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FormLabel.es.js","sources":["../../../../../src/components/SimpleForm/FormLabel.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport ReactMarkdown from 'react-markdown'\nimport type { SimpleFormField } from '@shared/api'\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\nexport interface FormLabelProps {\n field: SimpleFormField\n}\n\nexport const 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"],"names":["LabelContainer","styled","FormLabel","field","text","jsx","ReactMarkdown"],"mappings":";;;AAIA,MAAMA,IAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6BjBC,IAAY,CAAC,EAAE,OAAAC,QAA4B;AACtD,QAAMC,IAAO,OAAOD,EAAM,SAAU,WAAWA,EAAM,QAAQ;AAE7D,SACEE,gBAAAA,EAAAA,IAACL,KAAe,WAAWG,EAAM,aAAa,UAC5C,UAAAE,gBAAAA,EAAAA,IAACC,GAAA,EAAe,UAAAF,EAAA,CAAK,EAAA,CACvB;AAEJ;"}

package/dist/shared/src/components/SimpleForm/SimpleForm.cjs.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../../../_virtual/jsx-runtime.cjs.js"),j=require("react"),u=require("@ynput/ayon-react-components"),y=require("./useFormState.cjs.js"),h=require("./getFieldOptions.cjs.js"),R=require("./FormLabel.cjs.js"),b=require("./FormField.cjs.js"),q=({fields:r,values:c,onChange:p,className:F,style:d})=>{const{formData:t,patches:x,resolvedOptions:s,setFieldValue:g}=y.useFormState(r,c);return j.useEffect(()=>{t&&p?.(t)},[t]),t?n.jsxRuntimeExports.jsx(u.FormLayout,{className:F,style:d,onKeyDown:e=>{e.stopPropagation()},children:r.map(e=>{const i=x[e.name],a=h.getFieldOptions(e,i,s),o={...e,...i};a!==void 0&&(o.options=a,e.enum_resolver&&s[e.name]?.loading&&o.placeholder===void 0&&(o.placeholder="Loading..."));const l={};return o.hidden&&(l.display="none"),o.type==="label"?n.jsxRuntimeExports.jsx(R.FormLabel,{field:o},e.name):n.jsxRuntimeExports.jsx(u.FormRow,{label:o.label\|\|"",style:l,children:n.jsxRuntimeExports.jsx(b.FormField,{field:o,value:t[e.name],onChange:m=>g(e.name,m)})},e.name)})}):null};exports.SimpleForm=q;
2	+ //# sourceMappingURL=SimpleForm.cjs.js.map

package/dist/shared/src/components/SimpleForm/SimpleForm.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"SimpleForm.cjs.js","sources":["../../../../../src/components/SimpleForm/SimpleForm.tsx"],"sourcesContent":["import React, { useEffect } from 'react'\nimport { FormLayout, FormRow } from '@ynput/ayon-react-components'\nimport { useFormState } from './useFormState'\nimport { getFieldOptions } from './getFieldOptions'\nimport { FormLabel } from './FormLabel'\nimport { FormField } from './FormField'\nimport type { SimpleFormField } from '@shared/api'\nimport type { SimpleFormValueDict } from './types'\n\nexport interface SimpleFormProps {\n fields: SimpleFormField[]\n /** Initial/seed values - keyed by field name, same shape as onChange emits */\n values?: SimpleFormValueDict\n /** Called with the full value dict whenever anything changes - a direct\n * edit, a rule forcing a value, or a stale select value getting cleared */\n onChange?: (values: SimpleFormValueDict) => void\n className?: string\n style?: React.CSSProperties\n}\n\n/**\n * The embeddable AYON simple form: renders `fields` (as built by\n * ayon_server.forms.SimpleForm) with live rule evaluation and enum_resolver\n * fetching. Owns its own field state - drop it in a dialog, a page, a\n * sidebar, wherever; `onChange` is how a parent reads the current values.\n *\n * See useFormState for the rule/resolver \"engine\"; this component is just\n * the render loop over its output.\n */\nexport const SimpleForm = ({ fields, values, onChange, className, style }: SimpleFormProps) => {\n const { formData, patches, resolvedOptions, setFieldValue } = useFormState(fields, values)\n\n useEffect(() => {\n if (formData) onChange?.(formData)\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [formData])\n\n if (!formData) return null\n\n return (\n <FormLayout\n className={className}\n style={style}\n onKeyDown={(e) => {\n e.stopPropagation()\n }}\n >\n {fields.map((field: SimpleFormField) => {\n const patch = patches[field.name]\n const options = getFieldOptions(field, patch, resolvedOptions)\n\n // `patch.value` (if a rule forces one) isn't read from here - FormField\n // uses the `value` prop below, not field.value - only the display-affecting\n // properties matter for `effectiveField`.\n const effectiveField = { ...field, ...patch } as SimpleFormField\n if (options !== undefined) {\n effectiveField.options = options\n const loading = field.enum_resolver && resolvedOptions[field.name]?.loading\n if (loading && effectiveField.placeholder === undefined) {\n effectiveField.placeholder = 'Loading...'\n }\n }\n\n const rowStyle: React.CSSProperties = {}\n\n if (effectiveField.hidden) {\n rowStyle.display = 'none'\n }\n\n if (effectiveField.type === 'label') {\n return <FormLabel key={field.name} field={effectiveField} />\n }\n\n return (\n <FormRow key={field.name} label={effectiveField.label || ''} style={rowStyle}>\n <FormField\n field={effectiveField}\n value={formData[field.name]}\n onChange={(value) => setFieldValue(field.name, value)}\n />\n </FormRow>\n )\n })}\n </FormLayout>\n )\n}\n"],"names":["SimpleForm","fields","values","onChange","className","style","formData","patches","resolvedOptions","setFieldValue","useFormState","useEffect","jsx","FormLayout","field","patch","options","getFieldOptions","effectiveField","rowStyle","FormLabel","FormRow","FormField","value"],"mappings":"iVA6BaA,EAAa,CAAC,CAAE,OAAAC,EAAQ,OAAAC,EAAQ,SAAAC,EAAU,UAAAC,EAAW,MAAAC,KAA6B,CAC7F,KAAM,CAAE,SAAAC,EAAU,QAAAC,EAAS,gBAAAC,EAAiB,cAAAC,GAAkBC,EAAAA,aAAaT,EAAQC,CAAM,EAOzF,OALAS,EAAAA,UAAU,IAAM,CACVL,OAAqBA,CAAQ,CAEnC,EAAG,CAACA,CAAQ,CAAC,EAERA,EAGHM,EAAAA,kBAAAA,IAACC,EAAAA,WAAA,CACC,UAAAT,EACA,MAAAC,EACA,UAAY,GAAM,CAChB,EAAE,gBAAA,CACJ,EAEC,SAAAJ,EAAO,IAAKa,GAA2B,CACtC,MAAMC,EAAQR,EAAQO,EAAM,IAAI,EAC1BE,EAAUC,EAAAA,gBAAgBH,EAAOC,EAAOP,CAAe,EAKvDU,EAAiB,CAAE,GAAGJ,EAAO,GAAGC,CAAA,EAClCC,IAAY,SACdE,EAAe,QAAUF,EACTF,EAAM,eAAiBN,EAAgBM,EAAM,IAAI,GAAG,SACrDI,EAAe,cAAgB,SAC5CA,EAAe,YAAc,eAIjC,MAAMC,EAAgC,CAAA,EAMtC,OAJID,EAAe,SACjBC,EAAS,QAAU,QAGjBD,EAAe,OAAS,QACnBN,EAAAA,kBAAAA,IAACQ,EAAAA,UAAA,CAA2B,MAAOF,CAAA,EAAnBJ,EAAM,IAA6B,0BAIzDO,EAAAA,QAAA,CAAyB,MAAOH,EAAe,OAAS,GAAI,MAAOC,EAClE,SAAAP,EAAAA,kBAAAA,IAACU,EAAAA,UAAA,CACC,MAAOJ,EACP,MAAOZ,EAASQ,EAAM,IAAI,EAC1B,SAAWS,GAAUd,EAAcK,EAAM,KAAMS,CAAK,CAAA,CAAA,CACtD,EALYT,EAAM,IAMpB,CAEJ,CAAC,CAAA,CAAA,EA7CiB,IAgDxB"}