@spotify/backstage-plugin-soundcheck 0.12.8 → 0.12.9

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @spotify/backstage-plugin-soundcheck
 
+## 0.12.9
+
+### Patch Changes
+
+- Fixed a potential edge case where checks cannot be added to a campaign in the form.
+
 ## 0.12.8
 
 ### Patch Changes

package/alpha/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spotify/backstage-plugin-soundcheck",
-  "version": "0.12.8",
+  "version": "0.12.9",
   "main": "../dist/alpha.esm.js",
   "module": "../dist/alpha.esm.js",
   "types": "../dist/alpha.d.ts"

package/dist/components/CampaignsTab/MutateCampaignsViews/CampaignForm.esm.js

@@ -1,2 +1,2 @@
-import{Typography as E}from"@material-ui/core";import e from"react";import{Controller as h}from"react-hook-form";import"../../../contexts/TrackFormContext.esm.js";import"../../../contexts/CheckFormContext.esm.js";import{useCampaignFormContext as v}from"../../../contexts/CampaignFormContext.esm.js";import"../../../contexts/UserProvider.esm.js";import{formStyles as y}from"../../../utils/formStyles.esm.js";import"@spotify/backstage-plugin-soundcheck-common";import{emptyFilters as F}from"../../Filter/types.esm.js";import{FilterComponent as L}from"../../Filter/FilterComponent.esm.js";import{FormStepper as k}from"../../FormStepper/FormStepper.esm.js";import{CampaignFormDescription as D}from"./CampaignFormDescription.esm.js";import{useCampaignForm as A}from"./hooks/useCampaignForm.esm.js";import{CampaignDetailsStep as M}from"./Steps/CampaignDetailsStep/CampaignDetailsStep.esm.js";import{CampaignTrackStep as N}from"./Steps/CampaignTrackStep.esm.js";import{CampaignMilestonesStep as O}from"./Steps/CampaignMilestonesStep.esm.js";import{StepNameMapping as x}from"./types/CampaignFormTypes.esm.js";import{CAMPAIGN_FIELDS as T}from"./utils/campaignFormUtils.esm.js";var c=(t=>(t.Details="Enter campaign details",t.Checks="Add checks",t.Entities="Choose the affected entities (Optional)",t.Milestones="Set campaign milestones",t))(c||{});const I=({onSave:t,onCancel:d,selectedCampaign:i})=>{const g=y(),{isLoading:r,isReadOnly:f}=v(),{control:o,handleSubmit:n,errors:a,trigger:C,getValues:S,onSubmit:m}=A(t,i),u=S().detailsStep.startDate,l=[{label:"Enter campaign details",content:()=>e.createElement(M,{control:o,isLoading:r,disabled:!1,errors:a.detailsStep,startDate:u})},{label:"Add checks",content:()=>e.createElement(N,{control:o,isLoading:r,disabled:!1,errors:a.tracksStep})},{label:"Choose the affected entities (Optional)",content:()=>e.createElement("div",{className:g.filters},e.createElement(E,{variant:"body2"},T.filter.description),e.createElement(h,{name:"filtersStep",control:o,render:({field:s})=>{var p;return e.createElement(L,{value:(p=s.value)!=null?p:F(),onChange:s.onChange})}}))},{label:"Set campaign milestones",content:()=>e.createElement(O,{control:o,isLoading:r,disabled:!1,errors:a.milestonesStep})}],b=i?[...Array(l.length).keys()]:[0];return e.createElement("form",{onSubmit:n(m)},e.createElement(k,{onClose:d,handleSubmit:n,trigger:C,onSubmit:m,initialVisited:b,stepNameMap:x,steps:l,isLoading:r,isReadOnly:f,saveButtonText:"Save Campaign",detailsComponent:e.createElement(D,null)}))};export{I as CampaignForm,c as CampaignStepLabel};
+import{Typography as v}from"@material-ui/core";import e from"react";import{Controller as y}from"react-hook-form";import"../../../contexts/TrackFormContext.esm.js";import"../../../contexts/CheckFormContext.esm.js";import{useCampaignFormContext as F}from"../../../contexts/CampaignFormContext.esm.js";import"../../../contexts/UserProvider.esm.js";import L from"../../../hooks/useFeatureFlag.esm.js";import{formStyles as D}from"../../../utils/formStyles.esm.js";import"@spotify/backstage-plugin-soundcheck-common";import{emptyFilters as M}from"../../Filter/types.esm.js";import{FilterComponent as A}from"../../Filter/FilterComponent.esm.js";import{FormStepper as N}from"../../FormStepper/FormStepper.esm.js";import{CampaignFormDescription as O}from"./CampaignFormDescription.esm.js";import{useCampaignForm as x}from"./hooks/useCampaignForm.esm.js";import{CampaignDetailsStep as T}from"./Steps/CampaignDetailsStep/CampaignDetailsStep.esm.js";import{CampaignTrackStep as I}from"./Steps/CampaignTrackStep.esm.js";import{CampaignMilestonesStep as R}from"./Steps/CampaignMilestonesStep.esm.js";import{StepNameMapping as V}from"./types/CampaignFormTypes.esm.js";import{CAMPAIGN_FIELDS as B}from"./utils/campaignFormUtils.esm.js";var d=(t=>(t.Details="Enter campaign details",t.Checks="Add checks",t.Entities="Choose the affected entities (Optional)",t.Milestones="Set campaign milestones",t))(d||{});const G=({onSave:t,onCancel:g,selectedCampaign:a})=>{const f=D(),{isLoading:o,isReadOnly:C}=F(),{control:r,handleSubmit:n,errors:i,trigger:S,getValues:h,onSubmit:m,checkChips:u,checksLoading:b}=x(t,a),l=h(),E=l.detailsStep.startDate;L("debugMode")&&console.log(l);const s=[{label:"Enter campaign details",content:()=>e.createElement(T,{control:r,isLoading:o,disabled:!1,errors:i.detailsStep,startDate:E})},{label:"Add checks",content:()=>e.createElement(I,{control:r,isLoading:o||b,disabled:!1,errors:i.tracksStep,checkChips:u})},{label:"Choose the affected entities (Optional)",content:()=>e.createElement("div",{className:f.filters},e.createElement(v,{variant:"body2"},B.filter.description),e.createElement(y,{name:"filtersStep",control:r,render:({field:p})=>{var c;return e.createElement(A,{value:(c=p.value)!=null?c:M(),onChange:p.onChange})}}))},{label:"Set campaign milestones",content:()=>e.createElement(R,{control:r,isLoading:o,disabled:!1,errors:i.milestonesStep})}],k=a?[...Array(s.length).keys()]:[0];return e.createElement("form",{onSubmit:n(m)},e.createElement(N,{onClose:g,handleSubmit:n,trigger:S,onSubmit:m,initialVisited:k,stepNameMap:V,steps:s,isLoading:o,isReadOnly:C,saveButtonText:"Save Campaign",detailsComponent:e.createElement(O,null)}))};export{G as CampaignForm,d as CampaignStepLabel};
 //# sourceMappingURL=CampaignForm.esm.js.map

package/dist/components/CampaignsTab/MutateCampaignsViews/Steps/CampaignDetailsStep/CampaignScheduleField/EndDateChips.esm.js

@@ -1,2 +1,2 @@
-import{makeStyles as d,Grid as n,Chip as h}from"@material-ui/core";import{DatePickerToolbar as g}from"@material-ui/pickers/DatePicker/DatePickerToolbar";import{DateTime as b}from"luxon";import a from"react";const u=d(e=>({chip:{backgroundColor:e.palette.primary.main,color:e.palette.primary.contrastText},chips:{width:"310px",marginLeft:e.spacing(1)},chipContainer:{paddingBottom:"0 !important",paddingTop:"0 !important",marginBottom:e.spacing(.75)},noPadding:{padding:e.spacing(0)}})),v=[{value:{days:7},label:"1 week"},{value:{days:14},label:"2 weeks"},{value:{month:1},label:"1 month"},{value:{months:3},label:"3 months"},{value:{months:6},label:"6 months"},{value:{year:1},label:"1 year"}],y=({props:e,startDate:l,selectedDuration:i,setSelectedDuration:m,isLoading:s,disabled:c})=>{const t=u();return a.createElement(n,{container:!0,direction:"column"},a.createElement(n,{item:!0,className:t.noPadding},a.createElement(g,{...e})),a.createElement(n,{container:!0,item:!0,className:t.chips},v.map(({value:o,label:r})=>a.createElement(n,{item:!0,className:t.chipContainer},a.createElement(h,{key:r,label:r,className:i===o?t.chip:void 0,color:i===o?"primary":void 0,size:"small",onClick:()=>{if(l){m(o);const p=b.fromISO(l.toString()).plus(o);e.onChange(p,!1)}},disabled:s||c})))))};export{y as EndDateChips};
+import{makeStyles as d,Grid as n,Chip as h}from"@material-ui/core";import{DatePickerToolbar as g}from"@material-ui/pickers/DatePicker/DatePickerToolbar";import{DateTime as b}from"luxon";import a from"react";const u=d(e=>({chip:{backgroundColor:e.palette.primary.main,color:e.palette.primary.contrastText},chips:{width:"310px",marginLeft:e.spacing(1)},chipContainer:{paddingBottom:"0 !important",paddingTop:"0 !important",marginBottom:e.spacing(.75)},noPadding:{padding:e.spacing(0)}})),v=[{value:{days:7},label:"1 week"},{value:{days:14},label:"2 weeks"},{value:{month:1},label:"1 month"},{value:{months:3},label:"3 months"},{value:{months:6},label:"6 months"},{value:{year:1},label:"1 year"}],y=({props:e,startDate:l,selectedDuration:i,setSelectedDuration:m,isLoading:s,disabled:c})=>{const t=u();return a.createElement(n,{container:!0,direction:"column"},a.createElement(n,{item:!0,className:t.noPadding},a.createElement(g,{...e})),a.createElement(n,{container:!0,item:!0,className:t.chips},v.map(({value:o,label:r})=>a.createElement(n,{key:r,item:!0,className:t.chipContainer},a.createElement(h,{label:r,className:i===o?t.chip:void 0,color:i===o?"primary":void 0,size:"small",onClick:()=>{if(l){m(o);const p=b.fromISO(l.toString()).plus(o);e.onChange(p,!1)}},disabled:s||c})))))};export{y as EndDateChips};
 //# sourceMappingURL=EndDateChips.esm.js.map

package/dist/components/CampaignsTab/MutateCampaignsViews/Steps/CampaignTrackStep.esm.js

@@ -1,2 +1,2 @@
-import{makeStyles as x,FormControl as b,Typography as p,Grid as n}from"@material-ui/core";import{findIndex as v}from"lodash";import e,{useCallback as d}from"react";import{DndProvider as y}from"react-dnd";import{HTML5Backend as S}from"react-dnd-html5-backend";import{useFieldArray as T,Controller as D}from"react-hook-form";import{useGetChecksMap as N}from"../../../../hooks/tracks/useGetChecksMap.esm.js";import{ChecksErrors as L}from"../../../ChecksErrors/ChecksErrors.esm.js";import{DroppableInput as w}from"../../../DroppableInput/DroppableInput.esm.js";import{ChecksSection as I}from"../../../TrackForm/Steps/LevelsStep/ChecksSection/ChecksSection.esm.js";const M=x(t=>({columnHeader:{display:"flex",justifyContent:"space-between",alignItems:"center"},subtitle:{color:t.palette.text.primary,marginLeft:"-16px"},helperText:{fontSize:t.typography.subtitle2.fontSize,color:t.palette.textSubtle,marginBottom:t.spacing(1)},levelsContainer:{marginTop:"0",flexDirection:"column"},errorText:{marginTop:t.spacing(3),marginLeft:t.spacing(-4)},formContainer:{width:"100%"}})),H=({control:t,disabled:l,isLoading:m,errors:a})=>{const o=M(),{checkChips:h}=N(),{fields:c,remove:s,append:i}=T({control:t,name:"tracksStep.checks"}),f=new Set(c.flatMap(({name:r})=>r)),k=h.filter(r=>!f.has(r.name)),g=d(r=>{i(r)},[i]),u=d(r=>{const C=v(c,E=>E.id===r.id);s(C)},[s,c]);return e.createElement(D,{control:t,name:"tracksStep.checks",render:()=>e.createElement(b,{error:!!(a!=null&&a.checks),disabled:l||m,variant:"outlined",className:o.formContainer},e.createElement(p,{className:o.helperText},"Drag or right-click on a check to add it to the Campaign."),e.createElement(n,{item:!0,xs:12},e.createElement(n,{container:!0,spacing:4},e.createElement(y,{backend:S},e.createElement(n,{item:!0,xs:5},e.createElement(I,{chips:k,isLoading:m,disabled:l,label:"Campaign Checks",onContextMenuAdd:r=>i(r)})),e.createElement(n,{item:!0,xs:7},e.createElement(n,{container:!0},e.createElement(n,{item:!0,xs:12,className:o.columnHeader},e.createElement(p,{variant:"subtitle1",className:o.subtitle},"Included Checks")),e.createElement(n,{container:!0,item:!0,spacing:5,className:o.levelsContainer},e.createElement(w,{chips:c,onDelete:u,onDrop:g,error:!!(a!=null&&a.checks),placeholder:"Drag and drop checks here to include them in this level",disabled:l}))),(a==null?void 0:a.checks)&&e.createElement("div",{className:o.errorText},e.createElement(L,{checksErrors:a.checks})))))))})};export{H as CampaignTrackStep};
+import{makeStyles as E,FormControl as x,Typography as d,Grid as o}from"@material-ui/core";import{findIndex as b}from"lodash";import e,{useCallback as y}from"react";import{DndProvider as v}from"react-dnd";import{HTML5Backend as S}from"react-dnd-html5-backend";import{useFieldArray as T,Controller as D}from"react-hook-form";import N from"../../../../hooks/useFeatureFlag.esm.js";import{ChecksErrors as L}from"../../../ChecksErrors/ChecksErrors.esm.js";import{DroppableInput as M}from"../../../DroppableInput/DroppableInput.esm.js";import{ChecksSection as I}from"../../../TrackForm/Steps/LevelsStep/ChecksSection/ChecksSection.esm.js";const w=E(t=>({columnHeader:{display:"flex",justifyContent:"space-between",alignItems:"center"},subtitle:{color:t.palette.text.primary,marginLeft:"-16px"},helperText:{fontSize:t.typography.subtitle2.fontSize,color:t.palette.textSubtle,marginBottom:t.spacing(1)},levelsContainer:{marginTop:"0",flexDirection:"column"},errorText:{marginTop:t.spacing(3),marginLeft:t.spacing(-4)},formContainer:{width:"100%"}})),H=({control:t,disabled:l,isLoading:i,errors:r,checkChips:m})=>{const a=w(),{fields:c,remove:s,replace:h}=T({control:t,name:"tracksStep.checks",keyName:"key"});N("debugMode")&&(console.log(m),console.log(c));const g=new Set(c.flatMap(({id:n})=>n)),f=m.filter(n=>!g.has(n.id)),p=n=>{h([...c,n])},k=y(n=>{const u=b(c,C=>C.id===n.id);s(u)},[s,c]);return e.createElement(D,{control:t,name:"tracksStep.checks",render:()=>e.createElement(x,{error:!!(r!=null&&r.checks),disabled:l||i,variant:"outlined",className:a.formContainer},e.createElement(d,{className:a.helperText},"Drag or right-click on a check to add it to the Campaign."),e.createElement(o,{item:!0,xs:12},e.createElement(o,{container:!0,spacing:4},e.createElement(v,{backend:S},e.createElement(o,{item:!0,xs:5},e.createElement(I,{chips:f,isLoading:i,disabled:l,label:"Campaign Checks",onContextMenuAdd:p})),e.createElement(o,{item:!0,xs:7},e.createElement(o,{container:!0},e.createElement(o,{item:!0,xs:12,className:a.columnHeader},e.createElement(d,{variant:"subtitle1",className:a.subtitle},"Included Checks")),e.createElement(o,{container:!0,item:!0,spacing:5,className:a.levelsContainer},e.createElement(M,{chips:c,onDelete:k,onDrop:p,error:!!(r!=null&&r.checks),placeholder:"Drag and drop checks here to include them in this level",disabled:l}))),(r==null?void 0:r.checks)&&e.createElement("div",{className:a.errorText},e.createElement(L,{checksErrors:r.checks})))))))})};export{H as CampaignTrackStep};
 //# sourceMappingURL=CampaignTrackStep.esm.js.map

package/dist/components/CampaignsTab/MutateCampaignsViews/hooks/useCampaignForm.esm.js

@@ -1,2 +1,2 @@
-import{zodResolver as c}from"@hookform/resolvers/zod";import{useMemo as f}from"react";import{useForm as S}from"react-hook-form";import"@backstage/catalog-model";import"@backstage/core-plugin-api";import"@tanstack/react-query";import"../../../../api.esm.js";import"../../../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"../../../../hooks/useSoundcheckAlert.esm.js";import{useConfirmationModal as d}from"../../../../hooks/useConfirmationModal.esm.js";import"react-router-dom";import{useGetChecksMap as C}from"../../../../hooks/tracks/useGetChecksMap.esm.js";import{DEFAULT_FORM_VALUES as h}from"../utils/campaignFormUtils.esm.js";import{campaignFormSchema as F}from"../utils/validation.esm.js";import{mapCampaignToFormValues as V,mapCampaignFormDataToCampaignInput as M}from"./utils.esm.js";const v=(e,o)=>{const m=f(()=>o?V(o):h,[o]),{control:t,handleSubmit:a,getValues:i,setValue:p,trigger:s,formState:{errors:n}}=S({defaultValues:m,mode:"onChange",resolver:c(F)}),{showModal:u}=d(),{checksMap:l}=C();return{control:t,handleSubmit:a,getValues:i,setValue:p,trigger:s,errors:n,onSubmit:async r=>{if(!await u({title:"Save Campaign",message:`Are you sure you want to save campaign: ${r.detailsStep.name}?`,error:!1}))return;const g=M(r,o,l);e(g)}}};export{v as useCampaignForm};
+import{zodResolver as h}from"@hookform/resolvers/zod";import{useMemo as d}from"react";import{useForm as C}from"react-hook-form";import"@backstage/catalog-model";import"@backstage/core-plugin-api";import"@tanstack/react-query";import"../../../../api.esm.js";import"../../../../hooks/graphqlKeys.esm.js";import"@backstage/plugin-catalog-react";import"../../../../hooks/useSoundcheckAlert.esm.js";import{useConfirmationModal as S}from"../../../../hooks/useConfirmationModal.esm.js";import"react-router-dom";import{useGetChecksMap as F}from"../../../../hooks/tracks/useGetChecksMap.esm.js";import{DEFAULT_FORM_VALUES as V}from"../utils/campaignFormUtils.esm.js";import{campaignFormSchema as k}from"../utils/validation.esm.js";import{mapCampaignToFormValues as M,mapCampaignFormDataToCampaignInput as v}from"./utils.esm.js";const L=(e,o)=>{const a=d(()=>o?M(o):V,[o]),{control:m,handleSubmit:t,getValues:i,setValue:p,trigger:s,formState:{errors:n}}=C({defaultValues:a,mode:"onChange",resolver:h(k)}),{showModal:u}=S(),{checksMap:c,checkChips:g,checksLoading:l}=F();return{control:m,handleSubmit:t,getValues:i,setValue:p,trigger:s,errors:n,onSubmit:async r=>{if(!await u({title:"Save Campaign",message:`Are you sure you want to save campaign: ${r.detailsStep.name}?`,error:!1}))return;const f=v(r,o,c);e(f)},checkChips:g,checksLoading:l}};export{L as useCampaignForm};
 //# sourceMappingURL=useCampaignForm.esm.js.map

package/dist/components/CampaignsTab/MutateCampaignsViews/utils/validation.esm.js

@@ -1,2 +1,2 @@
-import{TrackCheckSchema as o,CampaignDetailsSchema as S}from"@spotify/backstage-plugin-soundcheck-common";import{z as e}from"zod";import{CHECK_IS_REQUIRED_MSG as l,FIELD_IS_REQUIRED_MSG as a}from"../../../../utils/validation.esm.js";const r=0,s=100,p=100,i=100,m="Ending date must come after the Starting Date",E=e.strictObject({selectedKinds:e.string().array(),selectedTypes:e.string().array(),selectedLifecycles:e.string().array(),selectedOwners:e.string().array(),selectedSystems:e.string().array(),selectedTags:e.string().array()}),g=e.strictObject({checks:e.array(o).min(1,l)}),_=e.strictObject({id:e.number().optional(),name:e.string().min(1,a).max(i,`Input must be less than ${i} characters`),description:e.string().min(1,a),passRate:e.coerce.number().min(r,`Minimum pass rate is ${r}%`).max(s,`Maximum pass rate is ${s}%`)}),D=e.strictObject({milestones:e.array(_).min(1,a)}),n=e.coerce.string().nullable().refine(t=>t!==null,{message:a}),M=e.strictObject({startDate:n,targetCompletionDate:n}),T=({startDate:t,targetCompletionDate:c})=>t&&c?new Date(t)<new Date(c):!0,A=S.merge(M),d=t=>t.refine(T,{message:m,path:["targetCompletionDate"]}),y=e.strictObject({detailsStep:d(A),tracksStep:g,filtersStep:E,milestonesStep:D});export{p as CAMPAIGN_NAME_MAX_LENGTH,m as END_AFTER_START_DATE_MSG,s as MILESTONE_MAX_PASS_RATE,r as MILESTONE_MIN_PASS_RATE,i as MILESTONE_NAME_MAX_LENGTH,n as campaignDateTimeSchema,y as campaignFormSchema};
+import{TrackCheckSchema as o,CampaignDetailsSchema as l}from"@spotify/backstage-plugin-soundcheck-common";import{z as e}from"zod";import{CHECK_IS_REQUIRED_MSG as p,FIELD_IS_REQUIRED_MSG as a}from"../../../../utils/validation.esm.js";const r=0,s=100,S=100,i=100,m="Ending date must come after the Starting Date",g=e.strictObject({selectedKinds:e.string().array(),selectedTypes:e.string().array(),selectedLifecycles:e.string().array(),selectedOwners:e.string().array(),selectedSystems:e.string().array(),selectedTags:e.string().array()}),E=e.strictObject({checks:e.array(o.extend({key:e.string().optional()})).min(1,p)}),_=e.strictObject({id:e.number().optional(),name:e.string().min(1,a).max(i,`Input must be less than ${i} characters`),description:e.string().min(1,a),passRate:e.coerce.number().min(r,`Minimum pass rate is ${r}%`).max(s,`Maximum pass rate is ${s}%`)}),D=e.strictObject({milestones:e.array(_).min(1,a)}),n=e.coerce.string().nullable().refine(t=>t!==null,{message:a}),M=e.strictObject({startDate:n,targetCompletionDate:n}),T=({startDate:t,targetCompletionDate:c})=>t&&c?new Date(t)<new Date(c):!0,A=l.merge(M),d=t=>t.refine(T,{message:m,path:["targetCompletionDate"]}),y=e.strictObject({detailsStep:d(A),tracksStep:E,filtersStep:g,milestonesStep:D});export{S as CAMPAIGN_NAME_MAX_LENGTH,m as END_AFTER_START_DATE_MSG,s as MILESTONE_MAX_PASS_RATE,r as MILESTONE_MIN_PASS_RATE,i as MILESTONE_NAME_MAX_LENGTH,n as campaignDateTimeSchema,y as campaignFormSchema};
 //# sourceMappingURL=validation.esm.js.map

package/dist/components/DroppableInput/DroppableInput.esm.js

@@ -1,2 +1,2 @@
-import{makeStyles as y,Chip as M}from"@material-ui/core";import D from"@material-ui/icons/DragIndicator";import r,{useState as E}from"react";import{useDrop as S}from"react-dnd";import{useContextMenu as B}from"../../hooks/useContextMenu.esm.js";import{ContextMenu as N}from"../ContextMenu/ContextMenu.esm.js";import{useChipStyles as O}from"../DraggableChip/chipStyles.esm.js";const z=y(e=>({input:{border:`1px solid ${e.palette.divider}`,borderRadius:4,padding:e.spacing(1),minHeight:80},hoverBackground:{background:e.palette.action.hover},normalBackground:{background:e.palette.background.default},error:{border:"1px solid red"},chipContainer:{display:"flex",flexDirection:"column",fontSize:e.typography.body1.fontSize,color:e.palette.text.primary,gap:e.spacing(.75)}})),I=({chips:e,onDelete:i,onDrop:p,error:c=!1,placeholder:m="",disabled:s})=>{const o=z(),d=O(),[{isOver:u},g]=S(()=>({accept:"chip",drop:t=>{p(t)},collect:t=>({isOver:t.isOver()})})),h=["Remove check"],{contextMenu:a,onContextMenu:x,onContextMenuClose:C,onContextMenuClick:f}=B(),[l,b]=E(null),k=(t,n)=>{x(t),b(n)},v=()=>{f(),l&&i(l)};return r.createElement("div",{ref:g,className:`${o.input} ${c?o.error:""} ${u?o.hoverBackground:o.normalBackground}`,"data-testid":"droppable-input"},r.createElement("div",{className:o.chipContainer},e!=null&&e.length?e.map(t=>r.createElement(M,{key:t.id,label:t.name,className:d.chip,icon:r.createElement(D,null),style:{cursor:"pointer"},onDelete:()=>i(t),disabled:s,onContextMenu:n=>k(n,t)})):m),r.createElement(N,{x:a.mouseX,y:a.mouseY,menuItems:h,onClose:C,onClick:v}))};export{I as DroppableInput};
+import{makeStyles as y,Chip as M}from"@material-ui/core";import D from"@material-ui/icons/DragIndicator";import r,{useState as E}from"react";import{useDrop as S}from"react-dnd";import{useContextMenu as B}from"../../hooks/useContextMenu.esm.js";import{ContextMenu as N}from"../ContextMenu/ContextMenu.esm.js";import{useChipStyles as O}from"../DraggableChip/chipStyles.esm.js";const z=y(e=>({input:{border:`1px solid ${e.palette.divider}`,borderRadius:4,padding:e.spacing(1),minHeight:80},hoverBackground:{background:e.palette.action.hover},normalBackground:{background:e.palette.background.default},error:{border:"1px solid red"},chipContainer:{display:"flex",flexDirection:"column",fontSize:e.typography.body1.fontSize,color:e.palette.text.primary,gap:e.spacing(.75)}})),I=({chips:e,onDelete:a,onDrop:i,error:c=!1,placeholder:m="",disabled:s})=>{const o=z(),d=O(),[{isOver:u},g]=S(()=>({accept:"chip",drop:t=>{i(t)},collect:t=>({isOver:t.isOver()})}),[i]),h=["Remove check"],{contextMenu:l,onContextMenu:x,onContextMenuClose:C,onContextMenuClick:f}=B(),[p,b]=E(null),k=(t,n)=>{x(t),b(n)},v=()=>{f(),p&&a(p)};return r.createElement("div",{ref:g,className:`${o.input} ${c?o.error:""} ${u?o.hoverBackground:o.normalBackground}`,"data-testid":"droppable-input"},r.createElement("div",{className:o.chipContainer},e!=null&&e.length?e.map(t=>r.createElement(M,{key:t.id,label:t.name,className:d.chip,icon:r.createElement(D,null),style:{cursor:"pointer"},onDelete:()=>a(t),disabled:s,onContextMenu:n=>k(n,t)})):m),r.createElement(N,{x:l.mouseX,y:l.mouseY,menuItems:h,onClose:C,onClick:v}))};export{I as DroppableInput};
 //# sourceMappingURL=DroppableInput.esm.js.map

package/dist/hooks/useFeatureFlag.esm.js

@@ -0,0 +1,2 @@
+import{useApi as e,configApiRef as n}from"@backstage/core-plugin-api";function r(i){return(e(n).getOptionalStringArray("soundcheck.flags")||[]).includes(i)}export{r as default};
+//# sourceMappingURL=useFeatureFlag.esm.js.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@spotify/backstage-plugin-soundcheck",
   "description": "Ensure quality, reliability and alignment of software development with codified checks and guidance.",
-  "version": "0.12.8",
+  "version": "0.12.9",
   "license": "SEE LICENSE IN LICENSE.md",
   "homepage": "https://backstage.spotify.com",
   "main": "./dist/index.esm.js",