@licklist/design 0.44.486-dev.32 → 0.44.486-dev.35
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.
- package/dist/product-set/control/DateAndRecurrenceInput.d.ts.map +1 -1
- package/dist/product-set/control/DateAndRecurrenceInput.js +1 -1
- package/dist/product-set/control/ProductSetRecurrenceControl.d.ts.map +1 -1
- package/dist/product-set/control/ProductSetRecurrenceControl.js +1 -1
- package/dist/recurring-date-picker-input/RecurrenceIntervalAndFrequencyInput.d.ts +2 -1
- package/dist/recurring-date-picker-input/RecurrenceIntervalAndFrequencyInput.d.ts.map +1 -1
- package/dist/recurring-date-picker-input/RecurrenceIntervalAndFrequencyInput.js +1 -1
- package/dist/recurring-date-picker-input/RecurringDatePickerInput.d.ts +3 -1
- package/dist/recurring-date-picker-input/RecurringDatePickerInput.d.ts.map +1 -1
- package/dist/recurring-date-picker-input/RecurringDatePickerInput.js +1 -1
- package/dist/styles/form/CustomCheckbox.scss +5 -0
- package/package.json +1 -1
- package/src/product-set/control/DateAndRecurrenceInput.tsx +1 -0
- package/src/product-set/control/ProductSetRecurrenceControl.tsx +8 -4
- package/src/recurring-date-picker-input/RecurrenceIntervalAndFrequencyInput.tsx +31 -3
- package/src/recurring-date-picker-input/RecurringDatePickerInput.tsx +13 -0
- package/src/styles/form/CustomCheckbox.scss +5 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateAndRecurrenceInput.d.ts","sourceRoot":"","sources":["../../../src/product-set/control/DateAndRecurrenceInput.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAM1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,uEAAuE,CAAC;AAiB7G,MAAM,WAAW,4BAA4B;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAE,CAAC;CACnD;AAED,UAAU,2BAA2B;IACnC,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,eAAO,MAAM,sBAAsB,+BAEhC,2BAA2B,
|
|
1
|
+
{"version":3,"file":"DateAndRecurrenceInput.d.ts","sourceRoot":"","sources":["../../../src/product-set/control/DateAndRecurrenceInput.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAM1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,uEAAuE,CAAC;AAiB7G,MAAM,WAAW,4BAA4B;IAC3C,eAAe,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAE,CAAC;CACnD;AAED,UAAU,2BAA2B;IACnC,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,eAAO,MAAM,sBAAsB,+BAEhC,2BAA2B,gBAoN7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,QAAQ,CAC5C,WAAW,EACX,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAsBxB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("tslib"),t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,i=require("react-i18next"),u=require("react-bootstrap"),a=require("../../static/Icon.js"),o=require("react-hook-form"),c=require("@react-aria/utils"),l=require("react-use");require("../../static/index.js");var d=require("@dnd-kit/core"),s=require("@dnd-kit/modifiers"),m=require("@dnd-kit/sortable"),f=require("../../modals/confirmation/ConfirmModal.js"),v=require("../../recurring-date-picker-input/RecurringDatePickerInput.js"),p=require("./ProductSetRecurrenceControl.js"),g={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:function(e){var r=e.state,t={width:"".concat(r.rects.reference.width+4,"px"),marginLeft:"-2px",maxWidth:"unset"};Object.assign(r.styles.popper,t)},effect:function(e){var r=e.state,t=r.elements.reference.getBoundingClientRect().width,n={width:"".concat(t,"px"),maxWidth:"unset"};Object.assign(r.elements.popper.style,n)}};exports.DateAndRecurrenceInput=function(e){var x,E,b=e.isEventEditProductSet,h=o.useFormContext(),q=h.control,y=h.register,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("tslib"),t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,i=require("react-i18next"),u=require("react-bootstrap"),a=require("../../static/Icon.js"),o=require("react-hook-form"),c=require("@react-aria/utils"),l=require("react-use");require("../../static/index.js");var d=require("@dnd-kit/core"),s=require("@dnd-kit/modifiers"),m=require("@dnd-kit/sortable"),f=require("../../modals/confirmation/ConfirmModal.js"),v=require("../../recurring-date-picker-input/RecurringDatePickerInput.js"),p=require("./ProductSetRecurrenceControl.js"),g={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:function(e){var r=e.state,t={width:"".concat(r.rects.reference.width+4,"px"),marginLeft:"-2px",maxWidth:"unset"};Object.assign(r.styles.popper,t)},effect:function(e){var r=e.state,t=r.elements.reference.getBoundingClientRect().width,n={width:"".concat(t,"px"),maxWidth:"unset"};Object.assign(r.elements.popper.style,n)}};exports.DateAndRecurrenceInput=function(e){var x,E,b=e.isEventEditProductSet,h=o.useFormContext(),q=h.control,y=h.register,S=h.formState.errors,C=h.getValues,R=h.setValue,_=h.clearErrors,D=o.useFieldArray({name:"menuRecurrences",control:q,keyName:"_id"}),k=D.fields,I=D.append,N=D.update,w=D.move,P=r.__read(t.useState(!1),2),T=P[0],j=P[1],A=r.__read(t.useState({index:null,values:null}),2),O=A[0],F=A[1],M=function(){return F({index:null,values:null})},V=t.useRef();l.useClickAway(V,(function(e){var r,t,n;f.CONFIRM_MODAL_ACTIONS.includes(null===(n=null===(t=null===(r=e.target)||void 0===r?void 0:r.attributes)||void 0===t?void 0:t.getNamedItem("data-id"))||void 0===n?void 0:n.value)||(j(!1),M())}));var W=c.useId(),L=i.useTranslation("Design").t,B=function(){M(),j((function(e){return!e}))};return t.useEffect((function(){k.length&&_("menuRecurrences")}),[k,_]),n.createElement(u.Form.Group,null,n.createElement(u.Form.Label,null,L(b?"whenOverridesAvailable":"productSetAvailable")),n.createElement(u.OverlayTrigger,{show:T,overlay:n.createElement(u.Popover,{id:W,className:"rounded"},n.createElement(u.Popover.Content,{className:"shadow-lg rounded",ref:V},n.createElement(v.RecurringDatePickerInput,{defaultValues:O.values,onChange:function(e){var r,t,n={rrule:e.rrule,startDate:e.startDate,endDate:e.endDate,startTime:e.startTime,endTime:e.endTime};(null===(r=O.values)||void 0===r?void 0:r.id)&&(n.id=null===(t=O.values)||void 0===t?void 0:t.id),null!==O.index?N(O.index,n):I(n),j((function(){return!1})),M()},onDelete:function(){var e=O.index;j(!1),M(),setTimeout((function(){var r=C().menuRecurrences;R("menuRecurrences",(void 0===r?[]:r).filter((function(r,t){return t!==e})))}),100)},isProductSet:!0}))),trigger:"click",placement:"bottom",popperConfig:{modifiers:[g]}},n.createElement("div",{className:"product-set-recurrences"},n.createElement(d.DndContext,{onDragEnd:function(e){var r=e.over,t=e.active;if(r.id!==t.id){var n=k.findIndex((function(e){return String(e._id)===t.id})),i=k.findIndex((function(e){return String(e._id)===r.id}));w(n,i)}},modifiers:[s.restrictToVerticalAxis]},n.createElement(m.SortableContext,{items:null!==(x=null==k?void 0:k.map((function(e){return String(e._id)})))&&void 0!==x?x:[],strategy:m.verticalListSortingStrategy},k.map((function(e,r){return n.createElement(p.ProductSetRecurrenceControl,{key:e._id,menuRecurrence:e,onEdit:function(){return function(e,r){M(),setTimeout((function(){F({index:r,values:e}),j((function(){return!0}))}),100)}(e,r)}})})))),(!b||(null==k?void 0:k.length)<1)&&n.createElement("div",{className:"product-set-recurrence-icon-wrapper",role:"button",tabIndex:0,onClick:B,onKeyDown:B},n.createElement(a.default,{type:"plus-circle",height:"1rem",className:"product-set-recurrence-icon-add mr-2"}),L("addDates")),n.createElement(u.Form.Control,r.__assign({type:"hidden"},y("menuRecurrences",{required:{value:!0,message:L("Validation:fieldMinNumber",{attribute:L("dates"),min:1})}}))),n.createElement("div",{className:"manual-form-error"},null===(E=S.menuRecurrences)||void 0===E?void 0:E.message))))},exports.sameWidthPopperModifier=g;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProductSetRecurrenceControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/control/ProductSetRecurrenceControl.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,uEAAuE,CAAC;AAM7G,MAAM,WAAW,gCAAgC;IAC/C,cAAc,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,OAAO,CAAC,oBAAoB,CAAC,CAAC;IACjE,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;CAC1D;AAED,eAAO,MAAM,2BAA2B,gCAGrC,gCAAgC,
|
|
1
|
+
{"version":3,"file":"ProductSetRecurrenceControl.d.ts","sourceRoot":"","sources":["../../../src/product-set/control/ProductSetRecurrenceControl.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,uEAAuE,CAAC;AAM7G,MAAM,WAAW,gCAAgC;IAC/C,cAAc,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,OAAO,CAAC,oBAAoB,CAAC,CAAC;IACjE,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;CAC1D;AAED,eAAO,MAAM,2BAA2B,gCAGrC,gCAAgC,gBAsElC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),r=e(require("react")),n=require("react-i18next"),a=require("../../static/Icon.js");require("../../static/index.js");var i=require("@dnd-kit/sortable"),
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),r=e(require("react")),n=require("react-i18next"),a=require("../../static/Icon.js");require("../../static/index.js");var i=require("@dnd-kit/sortable"),l=require("@dnd-kit/utilities"),c=e(require("rrule")),s=require("react-intl");exports.ProductSetRecurrenceControl=function(e){var u=e.menuRecurrence,o=e.onEdit,d=s.useIntl().formatDate,m=n.useTranslation("Design").t,f=i.useSortable({id:String(u._id)}),p=f.attributes,x=f.listeners,b=f.setNodeRef,g=f.transform,E=f.transition;return r.createElement("div",t.__assign({className:"sortable-tree-root",style:{transform:l.CSS.Translate.toString(g),transition:E}},p,x,{ref:b,role:"button",tabIndex:0}),r.createElement("div",{key:u.rrule,className:"product-set-recurrence d-flex flex-column mr-0 mb-3 p-3 px-4 flex-grow-1"},r.createElement("span",{className:"d-flex flex-row align-items-center"},r.createElement(a.default,{type:"calendar",height:"1rem",className:"product-set-recurrence-icon-calendar"}),r.createElement("span",{className:"product-set-recurrence-title d-flex flex-grow-1"},m("from")," ",d(u.startDate,{dateStyle:"medium"})," ",u.endDate&&r.createElement(r.Fragment,null,"- ",d(u.endDate,{dateStyle:"medium"}))),r.createElement("div",{className:"d-inline-flex",role:"button",tabIndex:0,onClick:function(){return o(u)},onKeyDown:function(){return o(u)}},r.createElement(a.default,{type:"ellipsis-h",height:"1rem",className:"product-set-recurrence-icon-more"}))),r.createElement("span",{className:"product-set-recurrence-description"},function(e){return c.fromString(e.rrule).toText()}(u))))};
|
|
@@ -5,11 +5,12 @@ interface RecurrenceIntervalAndFrequencyInputProps {
|
|
|
5
5
|
minDate?: string;
|
|
6
6
|
startDateLabel?: string;
|
|
7
7
|
startTimeLabel?: string;
|
|
8
|
+
isProductSet?: boolean;
|
|
8
9
|
endDateLabel?: string;
|
|
9
10
|
endTimeLabel?: string;
|
|
10
11
|
startTimeRules?: Pick<RegisterOptions, "max" | "min" | "validate" | "required" | "pattern">;
|
|
11
12
|
endTimeRules?: Pick<RegisterOptions, "max" | "min" | "validate" | "required" | "pattern">;
|
|
12
13
|
}
|
|
13
|
-
declare function RecurrenceIntervalAndFrequencyInput({ disabled, minDate, startDateLabel, startTimeLabel, endDateLabel, endTimeLabel, startTimeRules, endTimeRules, }: RecurrenceIntervalAndFrequencyInputProps): JSX.Element;
|
|
14
|
+
declare function RecurrenceIntervalAndFrequencyInput({ disabled, minDate, startDateLabel, startTimeLabel, endDateLabel, endTimeLabel, startTimeRules, endTimeRules, isProductSet, }: RecurrenceIntervalAndFrequencyInputProps): JSX.Element;
|
|
14
15
|
export default RecurrenceIntervalAndFrequencyInput;
|
|
15
16
|
//# sourceMappingURL=RecurrenceIntervalAndFrequencyInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RecurrenceIntervalAndFrequencyInput.d.ts","sourceRoot":"","sources":["../../src/recurring-date-picker-input/RecurrenceIntervalAndFrequencyInput.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAkB,MAAM,iBAAiB,CAAC;AAIlE,UAAU,wCAAwC;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,IAAI,CACnB,eAAe,EACf,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CACpD,CAAC;IACF,YAAY,CAAC,EAAE,IAAI,CACjB,eAAe,EACf,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CACpD,CAAC;CACH;AAED,iBAAS,mCAAmC,CAAC,EAC3C,QAAgB,EAChB,OAAO,EACP,cAAc,EACd,cAAc,EACd,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,YAAY,GACb,EAAE,wCAAwC,
|
|
1
|
+
{"version":3,"file":"RecurrenceIntervalAndFrequencyInput.d.ts","sourceRoot":"","sources":["../../src/recurring-date-picker-input/RecurrenceIntervalAndFrequencyInput.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAkB,MAAM,iBAAiB,CAAC;AAIlE,UAAU,wCAAwC;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,IAAI,CACnB,eAAe,EACf,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CACpD,CAAC;IACF,YAAY,CAAC,EAAE,IAAI,CACjB,eAAe,EACf,KAAK,GAAG,KAAK,GAAG,UAAU,GAAG,UAAU,GAAG,SAAS,CACpD,CAAC;CACH;AAED,iBAAS,mCAAmC,CAAC,EAC3C,QAAgB,EAChB,OAAO,EACP,cAAc,EACd,cAAc,EACd,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,YAAY,EACZ,YAAY,GACb,EAAE,wCAAwC,eA6K1C;AAED,eAAe,mCAAmC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),a=require("react"),l=(e=a)&&"object"==typeof e&&"default"in e?e.default:e,r=require("@licklist/core/dist/Config"),n=require("react-i18next"),i=require("react-bootstrap"),o=require("react-hook-form"),m=require("luxon");exports.default=function(e){var s,d,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),a=require("react"),l=(e=a)&&"object"==typeof e&&"default"in e?e.default:e,r=require("@licklist/core/dist/Config"),n=require("react-i18next"),i=require("react-bootstrap"),o=require("react-hook-form"),m=require("luxon");exports.default=function(e){var s,u,d,c,f=e.disabled,D=void 0!==f&&f,v=e.minDate,E=e.startDateLabel,F=e.startTimeLabel,b=e.endDateLabel,p=e.endTimeLabel,g=e.startTimeRules,T=e.endTimeRules,h=e.isProductSet,C=n.useTranslation(["Design","Notification","App"]).t,_=o.useFormContext(),k=_.getValues,y=_.setValue,x=_.formState.errors,q=_.register,L=_.trigger,S=k("startDate"),V=k("endDate"),I=k("startTime"),R=k("endTime"),A=t.__read(a.useState(!Boolean(V)),2),B=A[0],G=A[1],N=h&&B;return a.useEffect((function(){S&&V&&L("endDate")}),[S]),a.useEffect((function(){I&&R&&L("endTime")}),[I]),l.createElement(l.Fragment,null,l.createElement(i.Row,null,l.createElement(i.Col,{xs:12,sm:6},l.createElement(i.Form.Group,null,l.createElement(i.Form.Label,null,null!=E?E:C("Design:fromDate")),l.createElement(i.Form.Control,t.__assign({type:"date"},q("startDate",{required:!0}),{defaultValue:S,className:S&&"date-input-with-value",disabled:D,min:v,isInvalid:Boolean(x.startDate)})),l.createElement(i.Form.Control.Feedback,{type:"invalid"},null===(s=x.startDate)||void 0===s?void 0:s.message))),l.createElement(i.Col,{xs:12,sm:6},l.createElement(i.Form.Group,null,l.createElement(i.Form.Label,null,null!=b?b:C("Design:toDate")),l.createElement(i.Form.Control,t.__assign({type:"date"},q("endDate",{required:!N,validate:function(e){if(!S||!e)return!0;var t=m.DateTime.fromFormat(S,r.DATE_FORMAT);return m.DateTime.fromFormat(e,r.DATE_FORMAT).diff(t,["days"]).days>=0||"".concat(C("Validation:fieldLaterDate",{attribute:C("Design:endDateSmall"),min:C("Design:startDateSmall")}))}}),{defaultValue:V,className:V&&"date-input-with-value",disabled:D||N,min:S||void 0,isInvalid:Boolean(x.endDate)})),l.createElement(i.Form.Control.Feedback,{type:"invalid"},null===(u=x.endDate)||void 0===u?void 0:u.message)),h&&l.createElement(i.Form.Group,{className:"custom-checkbox"},l.createElement(i.Form.Check,{custom:!0,type:"checkbox"},l.createElement(i.Form.Check.Input,{type:"checkbox",className:"checkbox-input",checked:B,onChange:function(){y("endDate",""),G((function(e){return!e}))}}),l.createElement(i.Form.Check.Label,null,C("Design:infiniteProductSet")))))),l.createElement(i.Row,null,l.createElement(i.Col,{xs:12,sm:6},l.createElement(i.Form.Group,null,l.createElement(i.Form.Label,null,null!=F?F:C("Design:availableFrom")),l.createElement(i.Form.Control,t.__assign({type:"time"},q("startTime",t.__assign({required:!1},g)),{placeholder:"hh:mm",defaultValue:I,disabled:D,isInvalid:Boolean(x.startTime)})),l.createElement(i.Form.Control.Feedback,{type:"invalid"},null===(d=x.startTime)||void 0===d?void 0:d.message))),l.createElement(i.Col,{xs:12,sm:6},l.createElement(i.Form.Group,null,l.createElement(i.Form.Label,null,null!=p?p:C("Design:availableTo")),l.createElement(i.Form.Control,t.__assign({type:"time"},q("endTime",t.__assign({required:!1,validate:function(e){var t;if(!I||!e)return!0;var a=m.DateTime.fromISO(I),l=m.DateTime.fromISO(e);return(null===(t=null==l?void 0:l.diff(a,["minutes"]))||void 0===t?void 0:t.minutes)>=0||"".concat(C("Validation:fieldLaterDate",{attribute:C("Design:endTimeSmall"),min:C("Design:startTimeSmall")}))}},T)),{placeholder:"hh:mm",defaultValue:R,disabled:D,isInvalid:Boolean(x.endTime)})),l.createElement(i.Form.Control.Feedback,{type:"invalid"},null===(c=x.endTime)||void 0===c?void 0:c.message)))))};
|
|
@@ -9,6 +9,7 @@ export interface RecurringDatePickerInputProps {
|
|
|
9
9
|
initialFrequency?: Frequency;
|
|
10
10
|
setInitialStartDateAfterSelect?: boolean;
|
|
11
11
|
minDate?: string;
|
|
12
|
+
isProductSet?: boolean;
|
|
12
13
|
}
|
|
13
14
|
export interface RecurringDatePickerInputValues {
|
|
14
15
|
rrule?: string;
|
|
@@ -21,6 +22,7 @@ export interface RecurringDatePickerInputValues {
|
|
|
21
22
|
byweekday?: Weekday[];
|
|
22
23
|
until?: Date;
|
|
23
24
|
count?: number;
|
|
25
|
+
withOutEndDate?: boolean;
|
|
24
26
|
}
|
|
25
|
-
export declare function RecurringDatePickerInput({ disabled, onChange, onDelete, defaultValues, initialFrequency, setInitialStartDateAfterSelect, children, minDate, }: PropsWithChildren<RecurringDatePickerInputProps>): JSX.Element;
|
|
27
|
+
export declare function RecurringDatePickerInput({ disabled, onChange, onDelete, defaultValues, initialFrequency, setInitialStartDateAfterSelect, children, minDate, isProductSet, }: PropsWithChildren<RecurringDatePickerInputProps>): JSX.Element;
|
|
26
28
|
//# sourceMappingURL=RecurringDatePickerInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RecurringDatePickerInput.d.ts","sourceRoot":"","sources":["../../src/recurring-date-picker-input/RecurringDatePickerInput.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAsB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACrE,OAAc,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"RecurringDatePickerInput.d.ts","sourceRoot":"","sources":["../../src/recurring-date-picker-input/RecurringDatePickerInput.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAsB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACrE,OAAc,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAelD,OAAO,EAAyB,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAIpE,MAAM,WAAW,6BAA6B;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC,8BAA8B,CAAC,CAAC;IACxD,QAAQ,EAAE,CAAC,KAAK,EAAE,8BAA8B,KAAK,IAAI,CAAC;IAC1D,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,8BAA8B,CAAC,EAAE,OAAO,CAAC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,8BAA8B;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,kBAAkB,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,IAAI,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,wBAAwB,CAAC,EACvC,QAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,gBAAkC,EAClC,8BAAsC,EACtC,QAAQ,EACR,OAAO,EACP,YAAY,GACb,EAAE,iBAAiB,CAAC,6BAA6B,CAAC,eA4LlD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),n=require("react"),r=e(n),a=require("react-i18next"),i=e(require("react-bootstrap/Button")),l=require("react-bootstrap"),u=require("react-hook-form"),o=require("luxon"),
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),n=require("react"),r=e(n),a=require("react-i18next"),i=e(require("react-bootstrap/Button")),l=require("react-bootstrap"),u=require("react-hook-form"),o=require("luxon"),d=require("../modals/confirmation/ConfirmModal.js");require("../modals/dialog/Dialog.js"),require("../modals/dialog/DialogContext.js");var s=require("../product-set/elements/DeleteFieldButton.js"),c=require("rrule"),m=e(c),f=require("react-intl"),v=require("@licklist/core/dist/Config/Date"),D=require("@licklist/plugins/dist/hooks/Value/usePreviousValue"),y=require("./RecurrenceIntervalAndFrequencyInput.js"),T=require("./utils.js"),p=require("./RecurrenceWeekdaysInput.js");var q=function(e){var n=e.rrule,r=e.startDate,a=e.endDate,i=e.startTime,l=e.endTime,u=e.initialFrequency,o=void 0===u?c.Frequency.DAILY:u;return t.__assign({startDate:r,endDate:a,startTime:i,endTime:l,interval:1,freq:o},n&&T.parseAndValidateRRule({rrule:n,date:r}))},g=function(e){var r=e.startDate,a=e.endDate,i=e.startTime,l=e.endTime,u=e.byWeekDay,d=void 0===u?[]:u,s=k(r,i||"00:00:00"),c=k(a,l||"23:59:59"),m=f.useIntl(),v=m.formatList,D=m.formatNumber;return n.useMemo((function(){if(s instanceof o.DateTime&&c instanceof o.DateTime&&s.isValid&&c.isValid){var e=o.Interval.fromDateTimes(s.set({second:0}),c.set({second:0})).toDuration(["days","hours","minutes"]);if(e.isValid){var n=function(e,t){return D(e,{style:"unit",unit:t,unitDisplay:"long"})},r=o.Interval.fromDateTimes(s.minus({second:1}),c.plus({second:1})).splitBy({days:1});if(!(d.length?r.reduce((function(e,t){return d.some((function(e){return e.weekday+1===t.start.weekday}))?e+1:e}),0):1))return n(0,"minute");var a=[[e.days,"day"],[e.hours,"hour"],[e.minutes,"minute"]].filter((function(e){return t.__read(e,1)[0]}));return a.length||a.push([0,"minute"]),v(a.map((function(e){return n.apply(void 0,t.__spreadArray([],t.__read(e),!1))})),{style:"long",type:"unit"})}}}),[s,c,d,v,D])},k=function(e,t){var n=o.DateTime.fromFormat("".concat(e," ").concat(t),v.DATE_TIME_FORMAT);if(n.isValid)return n;var r=o.DateTime.fromFormat("".concat(e," ").concat(t),v.DATE_TIME_FULL_FORMAT);return r.isValid?r:""};exports.RecurringDatePickerInput=function(e){var f,T,_,b,F,E,w=e.disabled,h=void 0!==w&&w,I=e.onChange,A=e.onDelete,V=e.defaultValues,x=e.initialFrequency,L=void 0===x?c.Frequency.DAILY:x,S=e.setInitialStartDateAfterSelect,j=void 0!==S&&S,M=e.children,R=e.minDate,P=e.isProductSet,N=a.useTranslation(["Design"]).t,C=u.useForm({defaultValues:q({rrule:null!==(f=null==V?void 0:V.rrule)&&void 0!==f?f:"",startDate:null!==(T=null==V?void 0:V.startDate)&&void 0!==T?T:"",endDate:null!==(_=null==V?void 0:V.endDate)&&void 0!==_?_:"",startTime:null!==(b=null==V?void 0:V.startTime)&&void 0!==b?b:"",endTime:null!==(F=null==V?void 0:V.endTime)&&void 0!==F?F:"",initialFrequency:null!==(E=null==V?void 0:V.freq)&&void 0!==E?E:L}),mode:"onChange"}),W=C.watch,O=C.setValue,B=C.handleSubmit,Y=W("startDate"),U=W("endDate"),Q=W("startTime"),J=W("endTime"),K=W("byweekday"),z=D.usePreviousValue(Y),G=g({startDate:Y,endDate:U,startTime:Q,endTime:J,byWeekDay:K}),H=function(e){var n,r=k(U,J||"23:59:59"),a=Array.isArray(e.byweekday)?e.byweekday.map((function(e){return e instanceof c.Weekday?e:new c.Weekday(null==e?void 0:e.weekday)})):e.byweekday,i=(null==e?void 0:e.endTime)?o.DateTime.fromISO(null==e?void 0:e.endTime).toFormat(v.TIME_FULL_FORMAT):"",l=null!==(n=null==e?void 0:e.endDate)&&void 0!==n?n:"",u=m.optionsToString({until:r instanceof o.DateTime&&r.isValid?null==r?void 0:r.toJSDate():null,byweekday:a,count:e.count,freq:(null==a?void 0:a.length)?c.Frequency.WEEKLY:c.Frequency.DAILY,interval:e.interval}).replace("RRULE:","");I(t.__assign(t.__assign({},e),{endDate:l,endTime:i,rrule:u}))};return n.useEffect((function(){var e,t;if(j&&(!z||Y)&&!Y&&K&&K.length&&!Number.isNaN(null===(e=K[0])||void 0===e?void 0:e.weekday)){var n=(null===(t=K[0])||void 0===t?void 0:t.weekday)+1,r=o.DateTime.local(),a=o.DateTime.local().set({weekday:n});a>=r||n===r.weekday?O("startDate",a.toSQLDate()):O("startDate",a.plus({week:1}).toSQLDate())}}),[K,j]),r.createElement(u.FormProvider,t.__assign({},C),r.createElement(l.Form,{noValidate:!0,onSubmit:function(e){return e.preventDefault(),e.stopPropagation(),B(H)(e)}},r.createElement(p.default,{date:Y,disabled:h}),r.createElement(y.default,{disabled:h,minDate:R,isProductSet:P}),M,r.createElement("div",{className:"d-inline-flex align-items-center w-100"},r.createElement(i,{type:"submit"},N("Design:apply")),r.createElement("div",{className:"d-flex flex-grow-1 text-muted mx-3 flex-column"},r.createElement("div",null,G&&"lasts ".concat(G))),V&&r.createElement("div",{className:"d-flex justify-content-end delete-btn"},r.createElement(d.ConfirmModal,null,(function(e){return r.createElement(s.DeleteFieldButton,{onDelete:function(){return e(A)}})}))))))};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
.custom-checkbox {
|
|
2
2
|
margin-top: 1rem;
|
|
3
3
|
display: flex;
|
|
4
|
+
z-index: 2;
|
|
4
5
|
align-items: center;
|
|
5
6
|
|
|
6
7
|
.custom-checkbox .custom-control-label::before {
|
|
@@ -21,4 +22,8 @@
|
|
|
21
22
|
font-weight: 400;
|
|
22
23
|
font-size: 0.875rem;
|
|
23
24
|
}
|
|
25
|
+
|
|
26
|
+
.checkbox-input {
|
|
27
|
+
z-index: 2;
|
|
28
|
+
}
|
|
24
29
|
}
|
package/package.json
CHANGED
|
@@ -56,10 +56,14 @@ export const ProductSetRecurrenceControl = ({
|
|
|
56
56
|
{formatDate(menuRecurrence.startDate, {
|
|
57
57
|
dateStyle: "medium",
|
|
58
58
|
})}{" "}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
59
|
+
{menuRecurrence.endDate && (
|
|
60
|
+
<>
|
|
61
|
+
{"- "}
|
|
62
|
+
{formatDate(menuRecurrence.endDate, {
|
|
63
|
+
dateStyle: "medium",
|
|
64
|
+
})}
|
|
65
|
+
</>
|
|
66
|
+
)}
|
|
63
67
|
</span>
|
|
64
68
|
|
|
65
69
|
<div
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useEffect } from "react";
|
|
1
|
+
import React, { useEffect, useState } from "react";
|
|
2
2
|
import { DateTime } from "luxon";
|
|
3
3
|
import { Col, Form, Row } from "react-bootstrap";
|
|
4
4
|
import { useTranslation } from "react-i18next";
|
|
@@ -11,6 +11,7 @@ interface RecurrenceIntervalAndFrequencyInputProps {
|
|
|
11
11
|
minDate?: string;
|
|
12
12
|
startDateLabel?: string;
|
|
13
13
|
startTimeLabel?: string;
|
|
14
|
+
isProductSet?: boolean;
|
|
14
15
|
endDateLabel?: string;
|
|
15
16
|
endTimeLabel?: string;
|
|
16
17
|
startTimeRules?: Pick<
|
|
@@ -32,11 +33,13 @@ function RecurrenceIntervalAndFrequencyInput({
|
|
|
32
33
|
endTimeLabel,
|
|
33
34
|
startTimeRules,
|
|
34
35
|
endTimeRules,
|
|
36
|
+
isProductSet,
|
|
35
37
|
}: RecurrenceIntervalAndFrequencyInputProps) {
|
|
36
38
|
const { t } = useTranslation(["Design", "Notification", "App"]);
|
|
37
39
|
|
|
38
40
|
const {
|
|
39
41
|
getValues,
|
|
42
|
+
setValue,
|
|
40
43
|
formState: { errors },
|
|
41
44
|
register,
|
|
42
45
|
trigger,
|
|
@@ -47,6 +50,16 @@ function RecurrenceIntervalAndFrequencyInput({
|
|
|
47
50
|
const startTime = getValues("startTime");
|
|
48
51
|
const endTime = getValues("endTime");
|
|
49
52
|
|
|
53
|
+
const [withOutEndDate, setWithOutEndDate] = useState<boolean>(
|
|
54
|
+
!Boolean(endDate)
|
|
55
|
+
);
|
|
56
|
+
const isProductSetWithoutEndDate = isProductSet && withOutEndDate;
|
|
57
|
+
|
|
58
|
+
const handleWithoutEndDate = () => {
|
|
59
|
+
setValue("endDate", "");
|
|
60
|
+
setWithOutEndDate((prevWithOutEndDateValue) => !prevWithOutEndDateValue);
|
|
61
|
+
};
|
|
62
|
+
|
|
50
63
|
useEffect(() => {
|
|
51
64
|
if (!startDate || !endDate) {
|
|
52
65
|
return;
|
|
@@ -90,7 +103,7 @@ function RecurrenceIntervalAndFrequencyInput({
|
|
|
90
103
|
<Form.Control
|
|
91
104
|
type="date"
|
|
92
105
|
{...register("endDate", {
|
|
93
|
-
required:
|
|
106
|
+
required: !isProductSetWithoutEndDate,
|
|
94
107
|
validate: (date) => {
|
|
95
108
|
if (!startDate || !date) {
|
|
96
109
|
return true;
|
|
@@ -111,7 +124,7 @@ function RecurrenceIntervalAndFrequencyInput({
|
|
|
111
124
|
})}
|
|
112
125
|
defaultValue={endDate}
|
|
113
126
|
className={endDate && "date-input-with-value"}
|
|
114
|
-
disabled={disabled}
|
|
127
|
+
disabled={disabled || isProductSetWithoutEndDate}
|
|
115
128
|
min={startDate || undefined}
|
|
116
129
|
isInvalid={Boolean(errors.endDate)}
|
|
117
130
|
/>
|
|
@@ -119,6 +132,21 @@ function RecurrenceIntervalAndFrequencyInput({
|
|
|
119
132
|
{errors.endDate?.message}
|
|
120
133
|
</Form.Control.Feedback>
|
|
121
134
|
</Form.Group>
|
|
135
|
+
{isProductSet && (
|
|
136
|
+
<Form.Group className="custom-checkbox">
|
|
137
|
+
<Form.Check custom type="checkbox">
|
|
138
|
+
<Form.Check.Input
|
|
139
|
+
type="checkbox"
|
|
140
|
+
className="checkbox-input"
|
|
141
|
+
checked={withOutEndDate}
|
|
142
|
+
onChange={handleWithoutEndDate}
|
|
143
|
+
/>
|
|
144
|
+
<Form.Check.Label>
|
|
145
|
+
{t("Design:infiniteProductSet")}
|
|
146
|
+
</Form.Check.Label>
|
|
147
|
+
</Form.Check>
|
|
148
|
+
</Form.Group>
|
|
149
|
+
)}
|
|
122
150
|
</Col>
|
|
123
151
|
</Row>
|
|
124
152
|
|
|
@@ -7,6 +7,7 @@ import { useIntl } from "react-intl";
|
|
|
7
7
|
import {
|
|
8
8
|
DATE_TIME_FORMAT,
|
|
9
9
|
DATE_TIME_FULL_FORMAT,
|
|
10
|
+
TIME_FULL_FORMAT,
|
|
10
11
|
} from "@licklist/core/dist/Config/Date";
|
|
11
12
|
import { usePreviousValue } from "@licklist/plugins/dist/hooks/Value/usePreviousValue";
|
|
12
13
|
import { FormProvider, useForm } from "react-hook-form";
|
|
@@ -25,6 +26,7 @@ export interface RecurringDatePickerInputProps {
|
|
|
25
26
|
initialFrequency?: Frequency;
|
|
26
27
|
setInitialStartDateAfterSelect?: boolean;
|
|
27
28
|
minDate?: string;
|
|
29
|
+
isProductSet?: boolean;
|
|
28
30
|
}
|
|
29
31
|
|
|
30
32
|
export interface RecurringDatePickerInputValues {
|
|
@@ -38,6 +40,7 @@ export interface RecurringDatePickerInputValues {
|
|
|
38
40
|
byweekday?: Weekday[];
|
|
39
41
|
until?: Date;
|
|
40
42
|
count?: number;
|
|
43
|
+
withOutEndDate?: boolean;
|
|
41
44
|
}
|
|
42
45
|
|
|
43
46
|
export function RecurringDatePickerInput({
|
|
@@ -49,6 +52,7 @@ export function RecurringDatePickerInput({
|
|
|
49
52
|
setInitialStartDateAfterSelect = false,
|
|
50
53
|
children,
|
|
51
54
|
minDate,
|
|
55
|
+
isProductSet,
|
|
52
56
|
}: PropsWithChildren<RecurringDatePickerInputProps>) {
|
|
53
57
|
const { t } = useTranslation(["Design"]);
|
|
54
58
|
|
|
@@ -101,6 +105,12 @@ export function RecurringDatePickerInput({
|
|
|
101
105
|
})
|
|
102
106
|
: nextState.byweekday;
|
|
103
107
|
|
|
108
|
+
const endTimeNextState = nextState?.endTime
|
|
109
|
+
? DateTime.fromISO(nextState?.endTime).toFormat(TIME_FULL_FORMAT)
|
|
110
|
+
: "";
|
|
111
|
+
const endDateNextState = nextState?.endDate ?? "";
|
|
112
|
+
|
|
113
|
+
|
|
104
114
|
const rrule = RRule.optionsToString({
|
|
105
115
|
// @TODO: investigate if we need these fields
|
|
106
116
|
// dtstart: getDateTimeObject(startDate, startTime).toJSDate(),
|
|
@@ -115,6 +125,8 @@ export function RecurringDatePickerInput({
|
|
|
115
125
|
|
|
116
126
|
onChange({
|
|
117
127
|
...nextState,
|
|
128
|
+
endDate: endDateNextState,
|
|
129
|
+
endTime: endTimeNextState,
|
|
118
130
|
rrule,
|
|
119
131
|
});
|
|
120
132
|
};
|
|
@@ -179,6 +191,7 @@ export function RecurringDatePickerInput({
|
|
|
179
191
|
<RecurrenceIntervalAndFrequencyInput
|
|
180
192
|
disabled={disabled}
|
|
181
193
|
minDate={minDate}
|
|
194
|
+
isProductSet={isProductSet}
|
|
182
195
|
/>
|
|
183
196
|
|
|
184
197
|
{children}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
.custom-checkbox {
|
|
2
2
|
margin-top: 1rem;
|
|
3
3
|
display: flex;
|
|
4
|
+
z-index: 2;
|
|
4
5
|
align-items: center;
|
|
5
6
|
|
|
6
7
|
.custom-checkbox .custom-control-label::before {
|
|
@@ -21,4 +22,8 @@
|
|
|
21
22
|
font-weight: 400;
|
|
22
23
|
font-size: 0.875rem;
|
|
23
24
|
}
|
|
25
|
+
|
|
26
|
+
.checkbox-input {
|
|
27
|
+
z-index: 2;
|
|
28
|
+
}
|
|
24
29
|
}
|