@bikdotai/bik-component-library 0.0.867-beta.0 → 0.0.868-beta.0

package/dist/cjs/components/schedule-builder/ScheduleBuilder.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),s=require("./model.js"),n=require("./ScheduleBuilder.styled.js"),F=require("./ScheduleEndPicker.js"),T=require("./ScheduleFrequencyPicker.js"),E=require("./ScheduleHelper.js"),I=require("./SendModeSelector.js"),w=require("./StartDateTimePicker.js"),f=require("./UpcomingRunsPreview.js"),B=[{value:s.SEND_MODE.SEND_NOW,label:"Send now"},{value:s.SEND_MODE.SCHEDULE,label:"Schedule"},{value:s.SEND_MODE.RECURRING,label:"Set as recurring"}],G=({sendMode:u,onSendModeChange:h,sendModeOptions:D=B,date:c,onDateChange:N,previewStartDate:d,hours:g,minutes:R,isAm:_,onTimeChange:O,onMeridiemChange:j,onTimeInvalidBlur:p,timeErrorMessage:q,minDate:P,recurrence:r,onRecurrenceChange:a,previewCount:S=E.UPCOMING_RUNS_PREVIEW_COUNT,hideUpcomingRuns:x=!1,disabled:b=!1,frequencyMenuWidth:v,children:M,recurrenceFooter:U,"data-test":C="schedule-builder"})=>{const l=u===s.SEND_MODE.RECURRING,y=!!u&&u!==s.SEND_MODE.SEND_NOW,t=o.useMemo(()=>new E.ScheduleHelper(r),[r]),m=d===void 0?c:d,i=o.useMemo(()=>l?t.computeUpcomingRuns(m,S):[],[t,m,S,l]),k=o.useMemo(()=>t.buildSummary(i),[t,i]);return e.jsxs(n.Column,{gap:16,"data-test":C,children:[e.jsx(I.SendModeSelector,{options:D,value:u,onChange:h,disabled:b,"data-test":"schedule-builder-send-mode"}),M,y&&e.jsxs(e.Fragment,{children:[e.jsx(n.SectionDivider,{}),e.jsxs(n.Column,{gap:12,children:[e.jsx(w.StartDateTimePicker,{date:c,onDateChange:N,hours:g,minutes:R,isAm:_,onTimeChange:O,onMeridiemChange:j,onTimeInvalidBlur:p,timeErrorMessage:q,dateLabel:l?"Start date":"Date",minDate:P}),l&&e.jsxs(n.Column,{gap:12,"data-test":"schedule-builder-recurrence",children:[e.jsx(T.ScheduleFrequencyPicker,{value:r??{},onChange:a,frequencyMenuWidth:v}),e.jsx(F.ScheduleEndPicker,{value:r??{},onChange:a,minEndDate:c}),!x&&e.jsx(f.UpcomingRunsPreview,{runs:i,summary:k}),U]})]})]})]})};exports.ScheduleBuilder=G;
+//# sourceMappingURL=ScheduleBuilder.js.map

package/dist/cjs/components/schedule-builder/ScheduleBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScheduleBuilder.js","sources":["../../../../src/components/schedule-builder/ScheduleBuilder.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { RecurrenceValue, SEND_MODE } from './model';\nimport { Column, SectionDivider } from './ScheduleBuilder.styled';\nimport { ScheduleEndPicker } from './ScheduleEndPicker';\nimport { ScheduleFrequencyPicker } from './ScheduleFrequencyPicker';\nimport { ScheduleHelper, UPCOMING_RUNS_PREVIEW_COUNT } from './ScheduleHelper';\nimport { SendModeItem, SendModeSelector } from './SendModeSelector';\nimport { StartDateTimePicker } from './StartDateTimePicker';\nimport { UpcomingRunsPreview } from './UpcomingRunsPreview';\n\n/** The modes offered when the caller does not name its own. */\nconst DEFAULT_SEND_MODE_OPTIONS: SendModeItem<SEND_MODE>[] = [\n\t{ value: SEND_MODE.SEND_NOW, label: 'Send now' },\n\t{ value: SEND_MODE.SCHEDULE, label: 'Schedule' },\n\t{ value: SEND_MODE.RECURRING, label: 'Set as recurring' },\n];\n\nexport interface ScheduleBuilderProps {\n\t/** Which mode is selected. Drives what is rendered below the cards. */\n\tsendMode?: SEND_MODE;\n\tonSendModeChange: (mode: SEND_MODE) => void;\n\t/**\n\t * Modes on offer. Pass a subset to drop one — a screen that cannot send\n\t * immediately should not show a \"Send now\" card it will reject.\n\t */\n\tsendModeOptions?: SendModeItem<SEND_MODE>[];\n\n\t/** The date the schedule starts from. For RECURRING it is the first run. */\n\tdate?: Date;\n\tonDateChange: (date: Date) => void;\n\t/**\n\t * Date the runs preview counts from, when it should differ from `date`.\n\t *\n\t * `date` follows the picker and changes the instant a day is clicked, which is\n\t * usually too eager for the preview: a host validating the time separately does\n\t * not want runs listed at a time that has not passed validation. Pass the\n\t * validated value here and leave it undefined to hide the preview until then.\n\t * Defaults to `date`.\n\t */\n\tpreviewStartDate?: Date;\n\n\t/** 12-hour clock, \"1\"–\"12\". Empty while nothing is chosen. */\n\thours: string;\n\t/** \"0\"–\"59\". Empty while nothing is chosen. */\n\tminutes: string;\n\tisAm: boolean;\n\t/** Fires only for a parseable time, so partial typing does not clear state. */\n\tonTimeChange: (time: { hours: string; minutes: string }) => void;\n\tonMeridiemChange: (isAm: boolean) => void;\n\tonTimeInvalidBlur?: () => void;\n\t/** Shown under the time field. The caller owns validation. */\n\ttimeErrorMessage?: string;\n\t/** Earliest selectable date, normally now plus whatever lead time applies. */\n\tminDate?: Date;\n\n\t/** The recurrence. Only read when sendMode is RECURRING. */\n\trecurrence?: RecurrenceValue;\n\t/**\n\t * Receives only the fields that changed, so a caller holding this in redux can\n\t * dispatch one action per field instead of replacing the whole object.\n\t */\n\tonRecurrenceChange: (patch: Partial<RecurrenceValue>) => void;\n\n\t/** How many runs the preview lists. */\n\tpreviewCount?: number;\n\t/** Hide the runs preview, for a compact form that shows the summary elsewhere. */\n\thideUpcomingRuns?: boolean;\n\t/** Greys out every control — an in-flight campaign that can no longer be moved. */\n\tdisabled?: boolean;\n\t/** Menu width for the frequency dropdown; defaults to its button's width. */\n\tfrequencyMenuWidth?: string;\n\t/**\n\t * Rendered between the send-mode cards and the date/time fields. For a host\n\t * extra that belongs at the top — a best-time-to-send card, a warning banner.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * Rendered at the very bottom, after the runs preview, and only while the\n\t * schedule is recurring.\n\t *\n\t * Separate from `children` because position is the whole point: a\n\t * per-run setting like \"refresh the audience each time\" reads as a footnote to\n\t * the schedule it modifies, so it has to follow the runs rather than precede\n\t * the date.\n\t */\n\trecurrenceFooter?: React.ReactNode;\n\t'data-test'?: string;\n}\n\n/**\n * Picks when something sends — once, at a set time, or on a repeating schedule.\n *\n * Controlled and free of any app state: values in, change handlers out. It owns\n * the send-mode cards, the date and time, and — for a repeating schedule — the\n * frequency, what it repeats on, when it ends, and a preview of the next runs.\n *\n * Deliberately domain-neutral. Nothing about campaigns, audiences or sending\n * lives here, so anything that needs a schedule can use it. Host-specific extras\n * go through `children`, which renders below the mode cards.\n *\n * Every part is also exported on its own, for a screen that needs the end picker\n * or the runs preview without the rest.\n */\nexport const ScheduleBuilder: React.FC<ScheduleBuilderProps> = ({\n\tsendMode,\n\tonSendModeChange,\n\tsendModeOptions = DEFAULT_SEND_MODE_OPTIONS,\n\tdate,\n\tonDateChange,\n\tpreviewStartDate,\n\thours,\n\tminutes,\n\tisAm,\n\tonTimeChange,\n\tonMeridiemChange,\n\tonTimeInvalidBlur,\n\ttimeErrorMessage,\n\tminDate,\n\trecurrence,\n\tonRecurrenceChange,\n\tpreviewCount = UPCOMING_RUNS_PREVIEW_COUNT,\n\thideUpcomingRuns = false,\n\tdisabled = false,\n\tfrequencyMenuWidth,\n\tchildren,\n\trecurrenceFooter,\n\t'data-test': dataTest = 'schedule-builder',\n}) => {\n\tconst isRecurring = sendMode === SEND_MODE.RECURRING;\n\t// Send-now has no date to pick; the other modes do.\n\tconst showFields = !!sendMode && sendMode !== SEND_MODE.SEND_NOW;\n\n\tconst helper = useMemo(() => new ScheduleHelper(recurrence), [recurrence]);\n\n\t/**\n\t * Runs are previewed from the chosen date — or from `previewStartDate` when the\n\t * host validates separately — so the list stays empty rather than counting from\n\t * today and then jumping once a real date lands.\n\t */\n\tconst previewFrom = previewStartDate === undefined ? date : previewStartDate;\n\n\tconst upcomingRuns = useMemo(\n\t\t() =>\n\t\t\tisRecurring ? helper.computeUpcomingRuns(previewFrom, previewCount) : [],\n\t\t[helper, previewFrom, previewCount, isRecurring],\n\t);\n\n\tconst summary = useMemo(\n\t\t() => helper.buildSummary(upcomingRuns),\n\t\t[helper, upcomingRuns],\n\t);\n\n\treturn (\n\t\t<Column gap={16} data-test={dataTest}>\n\t\t\t<SendModeSelector\n\t\t\t\toptions={sendModeOptions}\n\t\t\t\tvalue={sendMode}\n\t\t\t\tonChange={onSendModeChange}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tdata-test=\"schedule-builder-send-mode\"\n\t\t\t/>\n\t\t\t{children}\n\t\t\t{showFields && (\n\t\t\t\t<>\n\t\t\t\t\t<SectionDivider />\n\t\t\t\t\t<Column gap={12}>\n\t\t\t\t\t\t<StartDateTimePicker\n\t\t\t\t\t\t\tdate={date}\n\t\t\t\t\t\t\tonDateChange={onDateChange}\n\t\t\t\t\t\t\thours={hours}\n\t\t\t\t\t\t\tminutes={minutes}\n\t\t\t\t\t\t\tisAm={isAm}\n\t\t\t\t\t\t\tonTimeChange={onTimeChange}\n\t\t\t\t\t\t\tonMeridiemChange={onMeridiemChange}\n\t\t\t\t\t\t\tonTimeInvalidBlur={onTimeInvalidBlur}\n\t\t\t\t\t\t\ttimeErrorMessage={timeErrorMessage}\n\t\t\t\t\t\t\t// \"Start date\" only reads right when runs follow it.\n\t\t\t\t\t\t\tdateLabel={isRecurring ? 'Start date' : 'Date'}\n\t\t\t\t\t\t\tminDate={minDate}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{isRecurring && (\n\t\t\t\t\t\t\t<Column gap={12} data-test=\"schedule-builder-recurrence\">\n\t\t\t\t\t\t\t\t<ScheduleFrequencyPicker\n\t\t\t\t\t\t\t\t\tvalue={recurrence ?? {}}\n\t\t\t\t\t\t\t\t\tonChange={onRecurrenceChange}\n\t\t\t\t\t\t\t\t\tfrequencyMenuWidth={frequencyMenuWidth}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<ScheduleEndPicker\n\t\t\t\t\t\t\t\t\tvalue={recurrence ?? {}}\n\t\t\t\t\t\t\t\t\tonChange={onRecurrenceChange}\n\t\t\t\t\t\t\t\t\tminEndDate={date}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{!hideUpcomingRuns && (\n\t\t\t\t\t\t\t\t\t<UpcomingRunsPreview runs={upcomingRuns} summary={summary} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{recurrenceFooter}\n\t\t\t\t\t\t\t</Column>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Column>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</Column>\n\t);\n};\n"],"names":["DEFAULT_SEND_MODE_OPTIONS","SEND_MODE","ScheduleBuilder","sendMode","onSendModeChange","sendModeOptions","date","onDateChange","previewStartDate","hours","minutes","isAm","onTimeChange","onMeridiemChange","onTimeInvalidBlur","timeErrorMessage","minDate","recurrence","onRecurrenceChange","previewCount","UPCOMING_RUNS_PREVIEW_COUNT","hideUpcomingRuns","disabled","frequencyMenuWidth","children","recurrenceFooter","dataTest","isRecurring","showFields","helper","useMemo","ScheduleHelper","previewFrom","upcomingRuns","summary","jsxs","Column","jsx","SendModeSelector","Fragment","SectionDivider","StartDateTimePicker","ScheduleFrequencyPicker","ScheduleEndPicker","UpcomingRunsPreview"],"mappings":"uaAWMA,EAAuD,CAC5D,CAAE,MAAOC,EAAAA,UAAU,SAAU,MAAO,UAAA,EACpC,CAAE,MAAOA,EAAAA,UAAU,SAAU,MAAO,UAAA,EACpC,CAAE,MAAOA,EAAAA,UAAU,UAAW,MAAO,kBAAA,CACtC,EAwFaC,EAAkD,CAAC,CAC/D,SAAAC,EACA,iBAAAC,EACA,gBAAAC,EAAkBL,EAClB,KAAAM,EACA,aAAAC,EACA,iBAAAC,EACA,MAAAC,EACA,QAAAC,EACA,KAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,kBAAAC,EACA,iBAAAC,EACA,QAAAC,EACA,WAAAC,EACA,mBAAAC,EACA,aAAAC,EAAeC,EAAAA,4BACf,iBAAAC,EAAmB,GACnB,SAAAC,EAAW,GACX,mBAAAC,EACA,SAAAC,EACA,iBAAAC,EACA,YAAaC,EAAW,kBACzB,IAAM,CACL,MAAMC,EAAcxB,IAAaF,EAAAA,UAAU,UAErC2B,EAAa,CAAC,CAACzB,GAAYA,IAAaF,EAAAA,UAAU,SAElD4B,EAASC,EAAAA,QAAQ,IAAM,IAAIC,EAAAA,eAAed,CAAU,EAAG,CAACA,CAAU,CAAC,EAOnEe,EAAcxB,IAAqB,OAAYF,EAAOE,EAEtDyB,EAAeH,EAAAA,QACpB,IACCH,EAAcE,EAAO,oBAAoBG,EAAab,CAAY,EAAI,CAAA,EACvE,CAACU,EAAQG,EAAab,EAAcQ,CAAW,CAAA,EAG1CO,EAAUJ,EAAAA,QACf,IAAMD,EAAO,aAAaI,CAAY,EACtC,CAACJ,EAAQI,CAAY,CAAA,EAGtB,OACCE,EAAAA,KAACC,EAAAA,OAAA,CAAO,IAAK,GAAI,YAAWV,EAC3B,SAAA,CAAAW,EAAAA,IAACC,EAAAA,iBAAA,CACA,QAASjC,EACT,MAAOF,EACP,SAAUC,EACV,SAAAkB,EACA,YAAU,4BAAA,CAAA,EAEVE,EACAI,GACAO,EAAAA,KAAAI,WAAA,CACC,SAAA,CAAAF,EAAAA,IAACG,EAAAA,eAAA,EAAe,EAChBL,EAAAA,KAACC,EAAAA,OAAA,CAAO,IAAK,GACZ,SAAA,CAAAC,EAAAA,IAACI,EAAAA,oBAAA,CACA,KAAAnC,EACA,aAAAC,EACA,MAAAE,EACA,QAAAC,EACA,KAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,kBAAAC,EACA,iBAAAC,EAEA,UAAWY,EAAc,aAAe,OACxC,QAAAX,CAAA,CAAA,EAEAW,GACAQ,EAAAA,KAACC,EAAAA,OAAA,CAAO,IAAK,GAAI,YAAU,8BAC1B,SAAA,CAAAC,EAAAA,IAACK,EAAAA,wBAAA,CACA,MAAOzB,GAAc,CAAA,EACrB,SAAUC,EACV,mBAAAK,CAAA,CAAA,EAEDc,EAAAA,IAACM,EAAAA,kBAAA,CACA,MAAO1B,GAAc,CAAA,EACrB,SAAUC,EACV,WAAYZ,CAAA,CAAA,EAEZ,CAACe,GACDgB,EAAAA,IAACO,EAAAA,oBAAA,CAAoB,KAAMX,EAAc,QAAAC,EAAkB,EAE3DT,CAAA,CAAA,CACF,CAAA,CAAA,CAEF,CAAA,CAAA,CACD,CAAA,EAEF,CAEF"}

package/dist/cjs/components/schedule-builder/ScheduleBuilder.styled.js

@@ -0,0 +1,138 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("styled-components"),i=require("../../constants/Theme.js"),a=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=a(l),n=84,d=8,o=e.default.div`
+	display: flex;
+	flex-direction: column;
+	min-width: 0;
+	gap: 6px;
+`,r=e.default(o)`
+	flex: 1 1 0;
+`,p=e.default(o)`
+	flex: 1 1 ${n+d}px;
+`,s=e.default.div`
+	display: flex;
+	flex-direction: row;
+	gap: 16px;
+	width: 100%;
+	align-items: flex-start;
+`,c=e.default.div`
+	height: 48px;
+`,f=e.default.div`
+	display: flex;
+	flex-direction: row;
+	gap: ${d}px;
+	align-items: flex-start;
+`,u=e.default.div`
+	flex: 1;
+	min-width: 0;
+`,x=e.default.div`
+	flex: 0 0 ${n}px;
+`,g=e.default.div`
+	width: 100%;
+	min-width: 0;
+`,m=e.default.div`
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+	width: 337px;
+	max-width: 100%;
+`,h=e.default.div`
+	display: flex;
+	flex-direction: row;
+	align-items: flex-start;
+	gap: 4px;
+
+	svg {
+		flex: 0 0 16px;
+		width: 16px;
+		height: 16px;
+	}
+`,w=e.default.div`
+	display: flex;
+	align-items: center;
+	gap: 2px;
+`,R=e.default.span`
+	font-weight: 600;
+`,S=e.default.span`
+	color: ${i.COLORS.content.negative};
+`,v=e.default.div`
+	box-sizing: border-box;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: 4px;
+	padding: 16px;
+	flex: 1;
+	height: 56px;
+	border-radius: 4px;
+	border: 1px solid
+		${t=>t.active?i.COLORS.background.inverseLight:i.COLORS.stroke.primary};
+	background: ${t=>t.active?i.COLORS.background.brandLight:i.COLORS.surface.standard};
+	cursor: ${t=>t.disabled?"not-allowed":"pointer"};
+	opacity: ${t=>t.disabled?.6:1};
+`,y=e.default.div`
+	display: flex;
+	flex-direction: row;
+	gap: 16px;
+	width: 100%;
+`,b=e.default.div`
+	height: 1px;
+	width: 100%;
+	background: ${i.COLORS.stroke.primary};
+`,C=e.default.div`
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: 12px;
+	flex-wrap: wrap;
+`,O=e.default.div`
+	width: 44px;
+`,D=e.default.div`
+	width: 168px;
+`,L=e.default.div`
+	position: relative;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: 8px;
+
+	/* connector spanning the 16px gap to the next run */
+	::before {
+		content: '';
+		position: absolute;
+		left: 4.5px;
+		top: 100%;
+		height: 16px;
+		width: 1px;
+		background: ${t=>t.isLast?"transparent":i.COLORS.stroke.brandLightAlt};
+	}
+`,k=e.default.div`
+	width: 10px;
+	height: 10px;
+	border-radius: 50%;
+	background: ${i.COLORS.background.inverseLight};
+	flex-shrink: 0;
+	z-index: 1;
+`,M=e.default.div`
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: 12px;
+	width: 100%;
+	justify-content: space-between;
+	padding-top: 16px;
+	border-top: 1px solid ${i.COLORS.stroke.primary};
+`,$=e.default.div`
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+`,F=e.default.div`
+	display: flex;
+	flex-direction: column;
+	gap: ${t=>t.gap??12}px;
+	width: 100%;
+`,I=e.default.div`
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	gap: ${t=>t.gap??8}px;
+`;exports.CaptionWithIcon=h;exports.Column=F;exports.DateFieldColumn=r;exports.DatePickerSlot=c;exports.EndDateWrapper=D;exports.EndsRow=C;exports.FieldColumn=o;exports.FieldLabel=w;exports.FieldsRow=s;exports.FrequencyDropdownSlot=g;exports.MeridiemDropdownSlot=x;exports.MonthDateGridSlot=m;exports.RefreshSegmentCopy=$;exports.RefreshSegmentRow=M;exports.RequiredMark=S;exports.Row=I;exports.RunCountInputWrapper=O;exports.SectionDivider=b;exports.SendModeOption=v;exports.SendModeRow=y;exports.SummaryHighlight=R;exports.TimeDropdownSlot=u;exports.TimeFieldColumn=p;exports.TimeInputRow=f;exports.UpcomingRunDot=k;exports.UpcomingRunItem=L;
+//# sourceMappingURL=ScheduleBuilder.styled.js.map

package/dist/cjs/components/schedule-builder/ScheduleBuilder.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScheduleBuilder.styled.js","sources":["../../../../src/components/schedule-builder/ScheduleBuilder.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '../../constants/Theme';\n\n/** Fixed width of the am/pm dropdown, and the gap separating it from the time box. */\nconst MERIDIEM_SLOT_WIDTH = 84;\nconst TIME_ROW_GAP = 8;\n\n/**\n * A labelled field column — \"Start date\" and \"Time\" sit side by side.\n * 6px label-to-input gap comes from the design's `input-large` component.\n */\nexport const FieldColumn = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 0;\n\tgap: 6px;\n`;\n\nexport const DateFieldColumn = styled(FieldColumn)`\n\tflex: 1 1 0;\n`;\n\n/**\n * Same share as the date column plus the am/pm dropdown's footprint (84px\n * wide + 8px gap), so the time box itself matches the date box rather than\n * being squeezed by the dropdown sitting beside it.\n */\nexport const TimeFieldColumn = styled(FieldColumn)`\n\tflex: 1 1 ${MERIDIEM_SLOT_WIDTH + TIME_ROW_GAP}px;\n`;\n\n/**\n * The Start date / Time row.\n *\n * Aligned to the top rather than centred: the time field grows taller when its\n * validation message appears, and a centred row would shift the date field up\n * and down with it.\n */\nexport const FieldsRow = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 16px;\n\twidth: 100%;\n\talign-items: flex-start;\n`;\n\n/** Wraps the date picker so its button matches the 48px input height. */\nexport const DatePickerSlot = styled.div`\n\theight: 48px;\n`;\n\n/**\n * The time box and its am/pm dropdown.\n *\n * Top-aligned rather than centred: the validation message renders inside the\n * time slot, so a centred row would push am/pm downward as the message appears.\n */\nexport const TimeInputRow = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: ${TIME_ROW_GAP}px;\n\talign-items: flex-start;\n`;\n\n/** The hh:mm dropdown takes the free space; am/pm is fixed beside it. */\nexport const TimeDropdownSlot = styled.div`\n\tflex: 1;\n\tmin-width: 0;\n`;\n\nexport const MeridiemDropdownSlot = styled.div`\n\tflex: 0 0 ${MERIDIEM_SLOT_WIDTH}px;\n`;\n\n/**\n * Frequency field. Fills its column, which is a DateFieldColumn so it takes the\n * same share as Start date above it — the design has both as 337px halves of the\n * 690px row, rather than a fixed 220px box that drifts as the panel resizes.\n */\nexport const FrequencyDropdownSlot = styled.div`\n\twidth: 100%;\n\tmin-width: 0;\n`;\n\n/**\n * Monthly date grid. Fixed at 337px so six CHIP_WIDTH chips and their 8px gaps\n * wrap onto a tidy 6-per-row grid rather than reflowing with the panel width.\n */\nexport const MonthDateGridSlot = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n\twidth: 337px;\n\tmax-width: 100%;\n`;\n\n/**\n * Icon + text caption under a picker, for both validation errors and the\n * skipped-month note. The icon is pinned to its 16px box and aligned to the\n * first line — as a bare flex child it would stretch and open a wide gap.\n */\nexport const CaptionWithIcon = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: flex-start;\n\tgap: 4px;\n\n\tsvg {\n\t\tflex: 0 0 16px;\n\t\twidth: 16px;\n\t\theight: 16px;\n\t}\n`;\n\n/** Field label row — holds the caption and its required asterisk. */\nexport const FieldLabel = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 2px;\n`;\n\n/** Frequency and time read in semibold inside the summary line. */\nexport const SummaryHighlight = styled.span`\n\tfont-weight: 600;\n`;\n\nexport const RequiredMark = styled.span`\n\tcolor: ${COLORS.content.negative};\n`;\n\n/** A single selectable send-mode card. */\nexport const SendModeOption = styled.div<{\n\tactive: boolean;\n\tdisabled: boolean;\n}>`\n\tbox-sizing: border-box;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 4px;\n\tpadding: 16px;\n\tflex: 1;\n\theight: 56px;\n\tborder-radius: 4px;\n\tborder: 1px solid\n\t\t${(props) =>\n\t\t\tprops.active ? COLORS.background.inverseLight : COLORS.stroke.primary};\n\tbackground: ${(props) =>\n\t\tprops.active ? COLORS.background.brandLight : COLORS.surface.standard};\n\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\topacity: ${(props) => (props.disabled ? 0.6 : 1)};\n`;\n\n/** The row of send-mode cards. */\nexport const SendModeRow = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 16px;\n\twidth: 100%;\n`;\n\n/** 1px rule between the send-mode radios and the fields below. */\nexport const SectionDivider = styled.div`\n\theight: 1px;\n\twidth: 100%;\n\tbackground: ${COLORS.stroke.primary};\n`;\n\n/** \"Ends\" row wraps when the three options do not fit on one line. */\nexport const EndsRow = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 12px;\n\tflex-wrap: wrap;\n`;\n\n/** 44px wide, 32px tall — the design's small input. */\nexport const RunCountInputWrapper = styled.div`\n\twidth: 44px;\n`;\n\nexport const EndDateWrapper = styled.div`\n\twidth: 168px;\n`;\n\nexport const UpcomingRunItem = styled.div<{ isLast: boolean }>`\n\tposition: relative;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 8px;\n\n\t/* connector spanning the 16px gap to the next run */\n\t::before {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\tleft: 4.5px;\n\t\ttop: 100%;\n\t\theight: 16px;\n\t\twidth: 1px;\n\t\tbackground: ${(props) =>\n\t\t\tprops.isLast ? 'transparent' : COLORS.stroke.brandLightAlt};\n\t}\n`;\n\nexport const UpcomingRunDot = styled.div`\n\twidth: 10px;\n\theight: 10px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.background.inverseLight};\n\tflex-shrink: 0;\n\tz-index: 1;\n`;\n\nexport const RefreshSegmentRow = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 12px;\n\twidth: 100%;\n\tjustify-content: space-between;\n\tpadding-top: 16px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const RefreshSegmentCopy = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n`;\n\n/** Generic vertical stack — the library cannot rely on the app's utility classes. */\nexport const Column = styled.div<{ gap?: number }>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: ${(props) => props.gap ?? 12}px;\n\twidth: 100%;\n`;\n\nexport const Row = styled.div<{ gap?: number }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: ${(props) => props.gap ?? 8}px;\n`;\n"],"names":["MERIDIEM_SLOT_WIDTH","TIME_ROW_GAP","FieldColumn","styled","DateFieldColumn","TimeFieldColumn","FieldsRow","DatePickerSlot","TimeInputRow","TimeDropdownSlot","MeridiemDropdownSlot","FrequencyDropdownSlot","MonthDateGridSlot","CaptionWithIcon","FieldLabel","SummaryHighlight","RequiredMark","COLORS","SendModeOption","props","SendModeRow","SectionDivider","EndsRow","RunCountInputWrapper","EndDateWrapper","UpcomingRunItem","UpcomingRunDot","RefreshSegmentRow","RefreshSegmentCopy","Column","Row"],"mappings":"0NAIMA,EAAsB,GACtBC,EAAe,EAMRC,EAAcC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOrBC,EAAkBD,EAAAA,QAAOD,CAAW;AAAA;AAAA,EASpCG,EAAkBF,EAAAA,QAAOD,CAAW;AAAA,aACpCF,EAAsBC,CAAY;AAAA,EAUlCK,EAAYH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASnBI,EAAiBJ,EAAAA,QAAO;AAAA;AAAA,EAUxBK,EAAeL,EAAAA,QAAO;AAAA;AAAA;AAAA,QAG3BF,CAAY;AAAA;AAAA,EAKPQ,EAAmBN,EAAAA,QAAO;AAAA;AAAA;AAAA,EAK1BO,EAAuBP,EAAAA,QAAO;AAAA,aAC9BH,CAAmB;AAAA,EAQnBW,EAAwBR,EAAAA,QAAO;AAAA;AAAA;AAAA,EAS/BS,EAAoBT,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAa3BU,EAAkBV,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAczBW,EAAaX,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAOpBY,EAAmBZ,EAAAA,QAAO;AAAA;AAAA,EAI1Ba,EAAeb,EAAAA,QAAO;AAAA,UACzBc,EAAAA,OAAO,QAAQ,QAAQ;AAAA,EAIpBC,EAAiBf,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAchCgB,GACFA,EAAM,OAASF,EAAAA,OAAO,WAAW,aAAeA,EAAAA,OAAO,OAAO,OAAO;AAAA,eACxDE,GACdA,EAAM,OAASF,EAAAA,OAAO,WAAW,WAAaA,EAAAA,OAAO,QAAQ,QAAQ;AAAA,WAC3DE,GAAWA,EAAM,SAAW,cAAgB,SAAU;AAAA,YACrDA,GAAWA,EAAM,SAAW,GAAM,CAAE;AAAA,EAIpCC,EAAcjB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAQrBkB,EAAiBlB,EAAAA,QAAO;AAAA;AAAA;AAAA,eAGtBc,EAAAA,OAAO,OAAO,OAAO;AAAA,EAIvBK,EAAUnB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASjBoB,EAAuBpB,EAAAA,QAAO;AAAA;AAAA,EAI9BqB,EAAiBrB,EAAAA,QAAO;AAAA;AAAA,EAIxBsB,EAAkBtB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAerBgB,GACdA,EAAM,OAAS,cAAgBF,EAAAA,OAAO,OAAO,aAAa;AAAA;AAAA,EAIhDS,EAAiBvB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,eAItBc,EAAAA,OAAO,WAAW,YAAY;AAAA;AAAA;AAAA,EAKhCU,EAAoBxB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAQfc,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGjCW,EAAqBzB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAO5B0B,EAAS1B,EAAAA,QAAO;AAAA;AAAA;AAAA,QAGpBgB,GAAUA,EAAM,KAAO,EAAE;AAAA;AAAA,EAIrBW,EAAM3B,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,QAIjBgB,GAAUA,EAAM,KAAO,CAAC;AAAA"}

package/dist/cjs/components/schedule-builder/ScheduleEndPicker.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("react/jsx-runtime"),a=require("../../constants/Theme.js"),N=require("../TypographyStyle.js"),e=require("./model.js"),R=require("./ScheduleBuilder.styled.js"),c=require("./ScheduleHelper.js"),d=require("../radioButton/RadioButton.js"),C=require("../input/Input.js"),u=require("../datePicker/DatePickerWrapper.js"),s=a.COLORS.background.inverseLight,O=({value:t,onChange:r,minEndDate:D,"data-test":_})=>{const n=t?.endMode??e.RECURRENCE_END_MODE.NEVER;return E.jsxs(R.FieldColumn,{"data-test":_,children:[E.jsx(R.FieldLabel,{children:E.jsx(N.BodySecondary,{color:a.COLORS.content.primary,children:"Ends"})}),E.jsxs(R.EndsRow,{children:[E.jsx(d.RadioButton,{isActive:n===e.RECURRENCE_END_MODE.NEVER,label:"Never",value:e.RECURRENCE_END_MODE.NEVER,onValueChange:()=>r({endMode:e.RECURRENCE_END_MODE.NEVER}),activeColor:s,skipSelectingOff:n===e.RECURRENCE_END_MODE.NEVER}),E.jsxs(R.Row,{gap:8,children:[E.jsx(d.RadioButton,{isActive:n===e.RECURRENCE_END_MODE.AFTER_RUNS,label:"After",value:e.RECURRENCE_END_MODE.AFTER_RUNS,onValueChange:()=>r({endMode:e.RECURRENCE_END_MODE.AFTER_RUNS}),activeColor:s,skipSelectingOff:n===e.RECURRENCE_END_MODE.AFTER_RUNS}),E.jsx(R.RunCountInputWrapper,{children:E.jsx(C.Input,{variant:"small",type:"number",placeholder:String(c.MAX_RECURRENCE_RUNS),value:t?.endAfterRuns?String(t.endAfterRuns):"",state:n===e.RECURRENCE_END_MODE.AFTER_RUNS?"none":"disabled",onChangeText:i=>{const o=i.replace(/\D/g,"");if(!o){r({endAfterRuns:void 0});return}r({endAfterRuns:Math.min(Number(o),c.MAX_RECURRENCE_RUNS)})}})}),E.jsx(N.BodySecondary,{color:a.COLORS.content.primary,children:"runs"})]}),E.jsxs(R.Row,{gap:8,children:[E.jsx(d.RadioButton,{isActive:n===e.RECURRENCE_END_MODE.ON_DATE,label:"On",value:e.RECURRENCE_END_MODE.ON_DATE,onValueChange:()=>r({endMode:e.RECURRENCE_END_MODE.ON_DATE}),activeColor:s,skipSelectingOff:n===e.RECURRENCE_END_MODE.ON_DATE}),E.jsx(R.EndDateWrapper,{children:E.jsx(u.DatePickerWrapper,{val:t?.endOnDate?new Date(t.endOnDate*1e3):void 0,disabled:n!==e.RECURRENCE_END_MODE.ON_DATE,onChange:i=>{const o=Array.isArray(i)?i[0]:i;if(!o)return;const l=new Date(o);l.setHours(23,59,59,0),r({endMode:e.RECURRENCE_END_MODE.ON_DATE,endOnDate:Math.floor(l.getTime()/1e3)})},calendarProps:{minDate:D},pickerStyles:{top:8,zIndex:4}})})]})]})]})};exports.ScheduleEndPicker=O;
+//# sourceMappingURL=ScheduleEndPicker.js.map

package/dist/cjs/components/schedule-builder/ScheduleEndPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScheduleEndPicker.js","sources":["../../../../src/components/schedule-builder/ScheduleEndPicker.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '../../constants/Theme';\nimport { DatePickerWrapper } from '../datePicker';\nimport { Input } from '../input';\nimport { RadioButton } from '../radioButton';\nimport { BodySecondary } from '../TypographyStyle';\nimport { RECURRENCE_END_MODE, RecurrenceValue } from './model';\nimport {\n\tEndDateWrapper,\n\tEndsRow,\n\tFieldColumn,\n\tFieldLabel,\n\tRow,\n\tRunCountInputWrapper,\n} from './ScheduleBuilder.styled';\nimport { MAX_RECURRENCE_RUNS } from './ScheduleHelper';\n\n/**\n * Radios in this section read brand purple when selected. The library defaults\n * to the positive green, which is not what the design shows.\n */\nconst RADIO_ACTIVE_COLOR = COLORS.background.inverseLight;\n\nexport interface ScheduleEndPickerProps {\n\tvalue: RecurrenceValue;\n\tonChange: (patch: Partial<RecurrenceValue>) => void;\n\t/** Earliest selectable end date — normally the series' own start date. */\n\tminEndDate?: Date;\n\t'data-test'?: string;\n}\n\n/**\n * \"Never / After N runs / On <date>\".\n *\n * The run-count input and the end-date picker stay mounted and go disabled with\n * their mode rather than unmounting, so the row keeps its width and the controls\n * do not jump as the merchant switches between them.\n */\nexport const ScheduleEndPicker: React.FC<ScheduleEndPickerProps> = ({\n\tvalue,\n\tonChange,\n\tminEndDate,\n\t'data-test': dataTest,\n}) => {\n\tconst endMode = value?.endMode ?? RECURRENCE_END_MODE.NEVER;\n\n\treturn (\n\t\t<FieldColumn data-test={dataTest}>\n\t\t\t<FieldLabel>\n\t\t\t\t<BodySecondary color={COLORS.content.primary}>Ends</BodySecondary>\n\t\t\t</FieldLabel>\n\t\t\t<EndsRow>\n\t\t\t\t<RadioButton\n\t\t\t\t\tisActive={endMode === RECURRENCE_END_MODE.NEVER}\n\t\t\t\t\tlabel=\"Never\"\n\t\t\t\t\tvalue={RECURRENCE_END_MODE.NEVER}\n\t\t\t\t\tonValueChange={() => onChange({ endMode: RECURRENCE_END_MODE.NEVER })}\n\t\t\t\t\tactiveColor={RADIO_ACTIVE_COLOR}\n\t\t\t\t\t// Inert only once selected — an end mode is always required, so the\n\t\t\t\t\t// active option cannot be clicked off.\n\t\t\t\t\tskipSelectingOff={endMode === RECURRENCE_END_MODE.NEVER}\n\t\t\t\t/>\n\n\t\t\t\t<Row gap={8}>\n\t\t\t\t\t<RadioButton\n\t\t\t\t\t\tisActive={endMode === RECURRENCE_END_MODE.AFTER_RUNS}\n\t\t\t\t\t\tlabel=\"After\"\n\t\t\t\t\t\tvalue={RECURRENCE_END_MODE.AFTER_RUNS}\n\t\t\t\t\t\tonValueChange={() =>\n\t\t\t\t\t\t\tonChange({ endMode: RECURRENCE_END_MODE.AFTER_RUNS })\n\t\t\t\t\t\t}\n\t\t\t\t\t\tactiveColor={RADIO_ACTIVE_COLOR}\n\t\t\t\t\t\tskipSelectingOff={endMode === RECURRENCE_END_MODE.AFTER_RUNS}\n\t\t\t\t\t/>\n\t\t\t\t\t<RunCountInputWrapper>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\t\tplaceholder={String(MAX_RECURRENCE_RUNS)}\n\t\t\t\t\t\t\tvalue={value?.endAfterRuns ? String(value.endAfterRuns) : ''}\n\t\t\t\t\t\t\tstate={\n\t\t\t\t\t\t\t\tendMode === RECURRENCE_END_MODE.AFTER_RUNS ? 'none' : 'disabled'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonChangeText={(input: string) => {\n\t\t\t\t\t\t\t\tconst digitsOnly = input.replace(/\\D/g, '');\n\t\t\t\t\t\t\t\tif (!digitsOnly) {\n\t\t\t\t\t\t\t\t\tonChange({ endAfterRuns: undefined });\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonChange({\n\t\t\t\t\t\t\t\t\tendAfterRuns: Math.min(\n\t\t\t\t\t\t\t\t\t\tNumber(digitsOnly),\n\t\t\t\t\t\t\t\t\t\tMAX_RECURRENCE_RUNS,\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</RunCountInputWrapper>\n\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>runs</BodySecondary>\n\t\t\t\t</Row>\n\n\t\t\t\t<Row gap={8}>\n\t\t\t\t\t<RadioButton\n\t\t\t\t\t\tisActive={endMode === RECURRENCE_END_MODE.ON_DATE}\n\t\t\t\t\t\tlabel=\"On\"\n\t\t\t\t\t\tvalue={RECURRENCE_END_MODE.ON_DATE}\n\t\t\t\t\t\tonValueChange={() =>\n\t\t\t\t\t\t\tonChange({ endMode: RECURRENCE_END_MODE.ON_DATE })\n\t\t\t\t\t\t}\n\t\t\t\t\t\tactiveColor={RADIO_ACTIVE_COLOR}\n\t\t\t\t\t\tskipSelectingOff={endMode === RECURRENCE_END_MODE.ON_DATE}\n\t\t\t\t\t/>\n\t\t\t\t\t<EndDateWrapper>\n\t\t\t\t\t\t<DatePickerWrapper\n\t\t\t\t\t\t\tval={\n\t\t\t\t\t\t\t\tvalue?.endOnDate ? new Date(value.endOnDate * 1000) : undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={endMode !== RECURRENCE_END_MODE.ON_DATE}\n\t\t\t\t\t\t\tonChange={(picked: Date | Date[]) => {\n\t\t\t\t\t\t\t\tconst dateValue = Array.isArray(picked) ? picked[0] : picked;\n\t\t\t\t\t\t\t\tif (!dateValue) return;\n\t\t\t\t\t\t\t\t// End of the chosen day, so a run landing that day still fires.\n\t\t\t\t\t\t\t\tconst endOfDay = new Date(dateValue);\n\t\t\t\t\t\t\t\tendOfDay.setHours(23, 59, 59, 0);\n\t\t\t\t\t\t\t\tonChange({\n\t\t\t\t\t\t\t\t\tendMode: RECURRENCE_END_MODE.ON_DATE,\n\t\t\t\t\t\t\t\t\tendOnDate: Math.floor(endOfDay.getTime() / 1000),\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tcalendarProps={{ minDate: minEndDate }}\n\t\t\t\t\t\t\tpickerStyles={{ top: 8, zIndex: 4 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</EndDateWrapper>\n\t\t\t\t</Row>\n\t\t\t</EndsRow>\n\t\t</FieldColumn>\n\t);\n};\n"],"names":["RADIO_ACTIVE_COLOR","COLORS","ScheduleEndPicker","value","onChange","minEndDate","dataTest","endMode","RECURRENCE_END_MODE","jsxs","FieldColumn","jsx","FieldLabel","BodySecondary","EndsRow","RadioButton","Row","RunCountInputWrapper","Input","MAX_RECURRENCE_RUNS","input","digitsOnly","EndDateWrapper","DatePickerWrapper","picked","dateValue","endOfDay"],"mappings":"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"}

package/dist/cjs/components/schedule-builder/ScheduleFrequencyPicker.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../constants/Theme.js"),u=require("../../icons/Informational/General/Info.js"),O=require("../chip-selector/ChipSelectorGroup.js"),i=require("../TypographyStyle.js"),r=require("./model.js"),t=require("./ScheduleBuilder.styled.js"),a=require("./ScheduleHelper.js"),S=require("../dropdown/Dropdown.js"),C=[{label:"Daily",value:r.RECURRENCE_FREQUENCY.DAILY},{label:"Weekly",value:r.RECURRENCE_FREQUENCY.WEEKLY},{label:"Monthly",value:r.RECURRENCE_FREQUENCY.MONTHLY}],R=[{label:"First",value:r.MONTHLY_REPEAT_OPTION.FIRST},{label:"Last",value:r.MONTHLY_REPEAT_OPTION.LAST},{label:"Custom",value:r.MONTHLY_REPEAT_OPTION.CUSTOM}],L=({value:s,onChange:d,frequencyMenuWidth:E,"data-test":x})=>{const c=new a.ScheduleHelper(s),y=c.frequency===r.RECURRENCE_FREQUENCY.WEEKLY,h=c.frequency===r.RECURRENCE_FREQUENCY.MONTHLY,j=h&&s?.monthlyRepeatOption===r.MONTHLY_REPEAT_OPTION.CUSTOM,p=a.getSkippedMonthCaption(s?.datesOfMonth),f=[...s?.datesOfMonth??[],...s?.lastDaySelected?[a.LAST_DAY_CHIP_VALUE]:[]];return e.jsxs(t.Column,{gap:12,"data-test":x,children:[e.jsxs(t.FieldsRow,{children:[e.jsxs(t.DateFieldColumn,{children:[e.jsx(t.FieldLabel,{children:e.jsx(i.BodySecondary,{color:n.COLORS.content.primary,children:"Select frequency"})}),e.jsx(t.FrequencyDropdownSlot,{children:e.jsx(S.Dropdown,{size:"default",isSearchable:!1,isMultiSelect:!1,options:C,buttonWidth:"100%",width:E||"100%",placeHolderHeight:"48px",placeHolder:"Select frequency",value:C.find(o=>o.value===c.frequency)?.label,onSelect:o=>{const l=Array.isArray(o)?o[0]:o;l?.value&&d({frequency:l.value})}})})]}),!y&&!h&&e.jsx(t.DateFieldColumn,{"aria-hidden":!0}),y&&e.jsxs(t.FieldColumn,{children:[e.jsx(t.FieldLabel,{children:e.jsx(i.BodySecondary,{color:n.COLORS.content.primary,children:"Repeat on"})}),e.jsx(O.ChipSelectorGroup,{"data-test":"recurrence-days-of-week",ariaLabel:"Repeat on",chipWidth:a.CHIP_WIDTH,options:a.DAY_CHIP_OPTIONS,value:s?.daysOfWeek??[],onChange:o=>d({daysOfWeek:o.filter(l=>typeof l=="number")})}),c.isMissingWeeklyDays&&e.jsxs(t.CaptionWithIcon,{children:[e.jsx(u.default,{size:16,color:n.COLORS.content.negative}),e.jsx(i.BodyCaption,{color:n.COLORS.content.negative,children:"Select day(s) above to send this weekly recurring"})]})]}),h&&e.jsxs(t.FieldColumn,{children:[e.jsx(t.FieldLabel,{children:e.jsx(i.BodySecondary,{color:n.COLORS.content.primary,children:"Repeat every"})}),e.jsxs(t.Row,{gap:8,children:[e.jsx(t.FrequencyDropdownSlot,{children:e.jsx(S.Dropdown,{size:"default",isSearchable:!1,isMultiSelect:!1,options:R,buttonWidth:"100%",width:"220px",placeHolderHeight:"48px",placeHolder:"Select",value:R.find(o=>o.value===s?.monthlyRepeatOption)?.label,onSelect:o=>{const l=Array.isArray(o)?o[0]:o;l?.value&&d({monthlyRepeatOption:l.value})}})}),e.jsx(i.BodySecondary,{color:n.COLORS.content.primary,children:"day of the month"})]})]})]}),j&&e.jsxs(t.MonthDateGridSlot,{children:[e.jsx(t.FieldLabel,{children:e.jsx(i.BodySecondary,{color:n.COLORS.content.primary,children:"Repeat on"})}),e.jsx(O.ChipSelectorGroup,{"data-test":"recurrence-dates-of-month",ariaLabel:"Repeat on dates",chipWidth:a.CHIP_WIDTH,options:a.DATE_CHIP_OPTIONS,size:"small",wrap:!0,value:f,onChange:o=>d({datesOfMonth:o.filter(l=>typeof l=="number"),lastDaySelected:o.includes(a.LAST_DAY_CHIP_VALUE)})}),!!p&&e.jsxs(t.CaptionWithIcon,{children:[e.jsx(u.default,{size:16,color:n.COLORS.content.secondary}),e.jsx(i.BodyCaption,{color:n.COLORS.content.secondary,children:p})]}),c.isMissingMonthlyDates&&e.jsxs(t.CaptionWithIcon,{children:[e.jsx(u.default,{size:16,color:n.COLORS.content.negative}),e.jsx(i.BodyCaption,{color:n.COLORS.content.negative,children:"Select day(s) above to send this monthly recurring"})]})]})]})};exports.ScheduleFrequencyPicker=L;
+//# sourceMappingURL=ScheduleFrequencyPicker.js.map

package/dist/cjs/components/schedule-builder/ScheduleFrequencyPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScheduleFrequencyPicker.js","sources":["../../../../src/components/schedule-builder/ScheduleFrequencyPicker.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '../../constants/Theme';\nimport Info from '../../icons/Informational/General/Info';\nimport { ChipSelectorGroup } from '../chip-selector';\nimport { Dropdown, DropdownOption, SingleOption } from '../dropdown';\nimport { BodyCaption, BodySecondary } from '../TypographyStyle';\nimport {\n\tMONTHLY_REPEAT_OPTION,\n\tRECURRENCE_FREQUENCY,\n\tRecurrenceValue,\n} from './model';\nimport {\n\tCaptionWithIcon,\n\tColumn,\n\tDateFieldColumn,\n\tFieldColumn,\n\tFieldLabel,\n\tFieldsRow,\n\tFrequencyDropdownSlot,\n\tMonthDateGridSlot,\n\tRow,\n} from './ScheduleBuilder.styled';\nimport {\n\tCHIP_WIDTH,\n\tDATE_CHIP_OPTIONS,\n\tDAY_CHIP_OPTIONS,\n\tgetSkippedMonthCaption,\n\tLAST_DAY_CHIP_VALUE,\n\tScheduleHelper,\n} from './ScheduleHelper';\n\nconst FREQUENCY_OPTIONS: SingleOption[] = [\n\t{ label: 'Daily', value: RECURRENCE_FREQUENCY.DAILY },\n\t{ label: 'Weekly', value: RECURRENCE_FREQUENCY.WEEKLY },\n\t{ label: 'Monthly', value: RECURRENCE_FREQUENCY.MONTHLY },\n];\n\n/** \"Repeat every\" presets for a monthly recurrence. */\nconst MONTHLY_REPEAT_OPTIONS: SingleOption[] = [\n\t{ label: 'First', value: MONTHLY_REPEAT_OPTION.FIRST },\n\t{ label: 'Last', value: MONTHLY_REPEAT_OPTION.LAST },\n\t{ label: 'Custom', value: MONTHLY_REPEAT_OPTION.CUSTOM },\n];\n\nexport interface ScheduleFrequencyPickerProps {\n\tvalue: RecurrenceValue;\n\tonChange: (patch: Partial<RecurrenceValue>) => void;\n\t/**\n\t * Width of the frequency menu. Defaults to matching its button — pass a\n\t * measured width when the button sits in a narrow column and the menu should\n\t * still be readable.\n\t */\n\tfrequencyMenuWidth?: string;\n\t'data-test'?: string;\n}\n\n/**\n * Frequency, plus whichever \"Repeat on\" picker that frequency needs.\n *\n * Daily needs no picker, weekly needs day chips, monthly needs a preset dropdown\n * and — for Custom — the 1-31 date grid. All three live here so a caller does not\n * have to know which control belongs to which frequency.\n */\nexport const ScheduleFrequencyPicker: React.FC<\n\tScheduleFrequencyPickerProps\n> = ({ value, onChange, frequencyMenuWidth, 'data-test': dataTest }) => {\n\tconst helper = new ScheduleHelper(value);\n\tconst isWeekly = helper.frequency === RECURRENCE_FREQUENCY.WEEKLY;\n\tconst isMonthly = helper.frequency === RECURRENCE_FREQUENCY.MONTHLY;\n\tconst isCustomMonthly =\n\t\tisMonthly && value?.monthlyRepeatOption === MONTHLY_REPEAT_OPTION.CUSTOM;\n\n\tconst skippedMonthCaption = getSkippedMonthCaption(value?.datesOfMonth);\n\n\t/** The last-day sentinel rides alongside the numeric dates in one chip group. */\n\tconst monthlyChipValue: (string | number)[] = [\n\t\t...(value?.datesOfMonth ?? []),\n\t\t...(value?.lastDaySelected ? [LAST_DAY_CHIP_VALUE] : []),\n\t];\n\n\treturn (\n\t\t<Column gap={12} data-test={dataTest}>\n\t\t\t<FieldsRow>\n\t\t\t\t{/*\n          Same flex share as the Start date column above it, per the design\n          where both fields are 337px halves of the 690px row.\n        */}\n\t\t\t\t<DateFieldColumn>\n\t\t\t\t\t<FieldLabel>\n\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\tSelect frequency\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</FieldLabel>\n\t\t\t\t\t<FrequencyDropdownSlot>\n\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t\t\tisSearchable={false}\n\t\t\t\t\t\t\tisMultiSelect={false}\n\t\t\t\t\t\t\toptions={FREQUENCY_OPTIONS}\n\t\t\t\t\t\t\tbuttonWidth=\"100%\"\n\t\t\t\t\t\t\twidth={frequencyMenuWidth || '100%'}\n\t\t\t\t\t\t\tplaceHolderHeight=\"48px\"\n\t\t\t\t\t\t\tplaceHolder=\"Select frequency\"\n\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\tFREQUENCY_OPTIONS.find(\n\t\t\t\t\t\t\t\t\t(option) => option.value === helper.frequency,\n\t\t\t\t\t\t\t\t)?.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonSelect={(\n\t\t\t\t\t\t\t\tselected: DropdownOption | DropdownOption[] | null,\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst normalized = (\n\t\t\t\t\t\t\t\t\tArray.isArray(selected) ? selected[0] : selected\n\t\t\t\t\t\t\t\t) as SingleOption | null;\n\t\t\t\t\t\t\t\tif (!normalized?.value) return;\n\t\t\t\t\t\t\t\tonChange({\n\t\t\t\t\t\t\t\t\tfrequency: normalized.value as RECURRENCE_FREQUENCY,\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FrequencyDropdownSlot>\n\t\t\t\t</DateFieldColumn>\n\t\t\t\t{/*\n          Holds the other half of the row when no picker follows, so the\n          frequency field stays the same width as Start date instead of\n          stretching across the whole row.\n        */}\n\t\t\t\t{!isWeekly && !isMonthly && <DateFieldColumn aria-hidden />}\n\t\t\t\t{isWeekly && (\n\t\t\t\t\t<FieldColumn>\n\t\t\t\t\t\t<FieldLabel>\n\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\tRepeat on\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</FieldLabel>\n\t\t\t\t\t\t<ChipSelectorGroup\n\t\t\t\t\t\t\tdata-test=\"recurrence-days-of-week\"\n\t\t\t\t\t\t\tariaLabel=\"Repeat on\"\n\t\t\t\t\t\t\tchipWidth={CHIP_WIDTH}\n\t\t\t\t\t\t\toptions={DAY_CHIP_OPTIONS}\n\t\t\t\t\t\t\tvalue={value?.daysOfWeek ?? []}\n\t\t\t\t\t\t\tonChange={(days) =>\n\t\t\t\t\t\t\t\tonChange({\n\t\t\t\t\t\t\t\t\tdaysOfWeek: days.filter(\n\t\t\t\t\t\t\t\t\t\t(day): day is number => typeof day === 'number',\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{helper.isMissingWeeklyDays && (\n\t\t\t\t\t\t\t<CaptionWithIcon>\n\t\t\t\t\t\t\t\t<Info size={16} color={COLORS.content.negative} />\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.negative}>\n\t\t\t\t\t\t\t\t\tSelect day(s) above to send this weekly recurring\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t</CaptionWithIcon>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</FieldColumn>\n\t\t\t\t)}\n\t\t\t\t{isMonthly && (\n\t\t\t\t\t<FieldColumn>\n\t\t\t\t\t\t<FieldLabel>\n\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\tRepeat every\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</FieldLabel>\n\t\t\t\t\t\t<Row gap={8}>\n\t\t\t\t\t\t\t<FrequencyDropdownSlot>\n\t\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t\t\t\t\tisSearchable={false}\n\t\t\t\t\t\t\t\t\tisMultiSelect={false}\n\t\t\t\t\t\t\t\t\toptions={MONTHLY_REPEAT_OPTIONS}\n\t\t\t\t\t\t\t\t\tbuttonWidth=\"100%\"\n\t\t\t\t\t\t\t\t\twidth=\"220px\"\n\t\t\t\t\t\t\t\t\tplaceHolderHeight=\"48px\"\n\t\t\t\t\t\t\t\t\tplaceHolder=\"Select\"\n\t\t\t\t\t\t\t\t\tvalue={\n\t\t\t\t\t\t\t\t\t\tMONTHLY_REPEAT_OPTIONS.find(\n\t\t\t\t\t\t\t\t\t\t\t(option) => option.value === value?.monthlyRepeatOption,\n\t\t\t\t\t\t\t\t\t\t)?.label\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonSelect={(\n\t\t\t\t\t\t\t\t\t\tselected: DropdownOption | DropdownOption[] | null,\n\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\tconst normalized = (\n\t\t\t\t\t\t\t\t\t\t\tArray.isArray(selected) ? selected[0] : selected\n\t\t\t\t\t\t\t\t\t\t) as SingleOption | null;\n\t\t\t\t\t\t\t\t\t\tif (!normalized?.value) return;\n\t\t\t\t\t\t\t\t\t\tonChange({\n\t\t\t\t\t\t\t\t\t\t\tmonthlyRepeatOption:\n\t\t\t\t\t\t\t\t\t\t\t\tnormalized.value as MONTHLY_REPEAT_OPTION,\n\t\t\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FrequencyDropdownSlot>\n\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\tday of the month\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</Row>\n\t\t\t\t\t</FieldColumn>\n\t\t\t\t)}\n\t\t\t</FieldsRow>\n\n\t\t\t{isCustomMonthly && (\n\t\t\t\t<MonthDateGridSlot>\n\t\t\t\t\t<FieldLabel>\n\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\tRepeat on\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</FieldLabel>\n\t\t\t\t\t<ChipSelectorGroup\n\t\t\t\t\t\tdata-test=\"recurrence-dates-of-month\"\n\t\t\t\t\t\tariaLabel=\"Repeat on dates\"\n\t\t\t\t\t\tchipWidth={CHIP_WIDTH}\n\t\t\t\t\t\toptions={DATE_CHIP_OPTIONS}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\twrap\n\t\t\t\t\t\tvalue={monthlyChipValue}\n\t\t\t\t\t\tonChange={(selected) =>\n\t\t\t\t\t\t\tonChange({\n\t\t\t\t\t\t\t\tdatesOfMonth: selected.filter(\n\t\t\t\t\t\t\t\t\t(item): item is number => typeof item === 'number',\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tlastDaySelected: selected.includes(LAST_DAY_CHIP_VALUE),\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t{!!skippedMonthCaption && (\n\t\t\t\t\t\t<CaptionWithIcon>\n\t\t\t\t\t\t\t<Info size={16} color={COLORS.content.secondary} />\n\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t{skippedMonthCaption}\n\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t</CaptionWithIcon>\n\t\t\t\t\t)}\n\t\t\t\t\t{helper.isMissingMonthlyDates && (\n\t\t\t\t\t\t<CaptionWithIcon>\n\t\t\t\t\t\t\t<Info size={16} color={COLORS.content.negative} />\n\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.negative}>\n\t\t\t\t\t\t\t\tSelect day(s) above to send this monthly recurring\n\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t</CaptionWithIcon>\n\t\t\t\t\t)}\n\t\t\t\t</MonthDateGridSlot>\n\t\t\t)}\n\t\t</Column>\n\t);\n};\n"],"names":["FREQUENCY_OPTIONS","RECURRENCE_FREQUENCY","MONTHLY_REPEAT_OPTIONS","MONTHLY_REPEAT_OPTION","ScheduleFrequencyPicker","value","onChange","frequencyMenuWidth","dataTest","helper","ScheduleHelper","isWeekly","isMonthly","isCustomMonthly","skippedMonthCaption","getSkippedMonthCaption","monthlyChipValue","LAST_DAY_CHIP_VALUE","jsxs","Column","FieldsRow","DateFieldColumn","jsx","FieldLabel","BodySecondary","COLORS","FrequencyDropdownSlot","Dropdown","option","selected","normalized","FieldColumn","ChipSelectorGroup","CHIP_WIDTH","DAY_CHIP_OPTIONS","days","day","CaptionWithIcon","Info","BodyCaption","Row","MonthDateGridSlot","DATE_CHIP_OPTIONS","item"],"mappings":"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"}

package/dist/cjs/components/schedule-builder/ScheduleHelper.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("date-fns"),r=require("./model.js"),R=3,N=999,f=44,_=31,D="LAST_DAY",C=1600,E=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],M=7,O=E.map((t,e)=>({value:e,label:t.charAt(0),ariaLabel:t})),g=[...Array.from({length:_},(t,e)=>({value:e+1,label:String(e+1)})),{value:D,label:"Last day of the month",fitContent:!0}],S=[1,2,3,4,5],A=[0,6],T=[1,2,3,4,5,6,0],U={29:"Skipped most Februaries.",30:"Skipped in February.",31:"Skipped in months without a 31st (Apr, Jun, Sep, Nov)."},y=t=>{if([11,12,13].includes(t%100))return`${t}th`;switch(t%10){case 1:return`${t}st`;case 2:return`${t}nd`;case 3:return`${t}rd`;default:return`${t}th`}},u=t=>t.length<=1?t[0]??"":t.length===2?`${t[0]} and ${t[1]}`:`${t.slice(0,-1).join(", ")} and ${t[t.length-1]}`,I=t=>{const e=(t??[]).map(n=>U[n]).filter(Boolean);return e.length?e.join(" "):null};class o{recurrence;constructor(e){this.recurrence=e??{}}get frequency(){return this.recurrence.frequency??r.RECURRENCE_FREQUENCY.DAILY}get endMode(){return this.recurrence.endMode??r.RECURRENCE_END_MODE.NEVER}get daysOfWeek(){return this.recurrence.daysOfWeek??[]}get datesOfMonth(){return this.recurrence.datesOfMonth??[]}get lastDaySelected(){return!!this.recurrence.lastDaySelected}get isMissingWeeklyDays(){return this.frequency===r.RECURRENCE_FREQUENCY.WEEKLY&&!this.daysOfWeek.length}get isMissingMonthlyDates(){return this.frequency===r.RECURRENCE_FREQUENCY.MONTHLY&&!this.datesOfMonth.length&&!this.lastDaySelected}get isMissingRunDays(){return this.isMissingWeeklyDays||this.isMissingMonthlyDates}addInterval(e){const n=new Date(e);return n.setDate(n.getDate()+1),n}static lastDateOfMonth(e){return new Date(e.getFullYear(),e.getMonth()+1,0).getDate()}isRunDay(e){if(this.frequency===r.RECURRENCE_FREQUENCY.WEEKLY)return this.daysOfWeek.includes(e.getDay());if(this.frequency===r.RECURRENCE_FREQUENCY.MONTHLY){const n=e.getDate();return this.datesOfMonth.includes(n)?!0:this.lastDaySelected&&n===o.lastDateOfMonth(e)}return!0}computeUpcomingRuns(e,n=R){if(!e||Number.isNaN(e.getTime()))return[];if(this.isMissingRunDays)return[];const a=[],{endAfterRuns:s}=this.recurrence,c=this.endMode===r.RECURRENCE_END_MODE.AFTER_RUNS&&typeof s=="number"&&s>0?Math.min(s,n):n,h=this.endMode===r.RECURRENCE_END_MODE.ON_DATE&&this.recurrence.endOnDate?this.recurrence.endOnDate*1e3:null;let i=new Date(e),l=0;for(;a.length<c&&l<=C&&!(h!==null&&i.getTime()>h);)this.isRunDay(i)&&a.push(new Date(i)),i=this.addInterval(i),l+=1;return a}get weeklyDayPhrase(){const e=this.daysOfWeek;if(!e.length)return"";const n=s=>e.length===s.length&&s.every(c=>e.includes(c));if(n(S))return"weekday";if(n(A))return"weekend";const a=T.filter(s=>e.includes(s)).map(s=>E[s]);return u(a)}get monthlyDatePhrase(){if(this.recurrence?.monthlyRepeatOption===r.MONTHLY_REPEAT_OPTION.FIRST)return"on the first day";const e=[...this.datesOfMonth].sort((n,a)=>n-a).map(y);return this.lastDaySelected?e.length?`on the ${u([...e,"the last day"])}`:"on the last day":e.length?`on the ${u(e)}`:""}get frequencyLabel(){switch(this.frequency){case r.RECURRENCE_FREQUENCY.WEEKLY:{const e=this.weeklyDayPhrase;return e?`every ${e}`:"weekly"}case r.RECURRENCE_FREQUENCY.MONTHLY:{const e=this.monthlyDatePhrase;return e?`${e} of every month`:"monthly"}default:return"daily"}}get endClause(){if(this.endMode===r.RECURRENCE_END_MODE.AFTER_RUNS){const e=this.recurrence.endAfterRuns;return e?` and ends after ${e} ${e===1?"run":"runs"}.`:"."}return this.endMode===r.RECURRENCE_END_MODE.ON_DATE?this.recurrence.endOnDate?` and ends on ${d.format(new Date(this.recurrence.endOnDate*1e3),"d MMM yyyy")}.`:".":" with no end date, you can cancel anytime."}buildSummary(e){return e.length?{frequencyLabel:this.frequencyLabel,timeLabel:d.format(e[0],"h:mm a"),tail:this.endClause}:null}}exports.CHIP_WIDTH=f;exports.DATE_CHIP_OPTIONS=g;exports.DAYS_IN_WEEK=M;exports.DAY_CHIP_OPTIONS=O;exports.DAY_LABELS=E;exports.LAST_DAY_CHIP_VALUE=D;exports.MAX_DATE_OF_MONTH=_;exports.MAX_RECURRENCE_RUNS=N;exports.ScheduleHelper=o;exports.UPCOMING_RUNS_PREVIEW_COUNT=R;exports.getSkippedMonthCaption=I;exports.joinList=u;exports.ordinal=y;
+//# sourceMappingURL=ScheduleHelper.js.map

package/dist/cjs/components/schedule-builder/ScheduleHelper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScheduleHelper.js","sources":["../../../../src/components/schedule-builder/ScheduleHelper.ts"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport { ChipOption } from '../chip-selector';\nimport {\n\tMONTHLY_REPEAT_OPTION,\n\tRECURRENCE_END_MODE,\n\tRECURRENCE_FREQUENCY,\n\tRecurrenceSummary,\n\tRecurrenceValue,\n} from './model';\n\n/** How many upcoming runs the preview shows by default. */\nexport const UPCOMING_RUNS_PREVIEW_COUNT = 3;\n\n/** Upper bound on `endAfterRuns`, matching the 3-digit input in the design. */\nexport const MAX_RECURRENCE_RUNS = 999;\n\n/**\n * Width of a single chip in the \"Repeat on\" pickers.\n *\n * Shared by the weekly day chips and the monthly date chips: both grids are\n * drawn to the same 44px square in the design, and the monthly grid's 337px\n * width assumes it, so the two cannot be sized independently.\n */\nexport const CHIP_WIDTH = 44;\n\n/** Highest date the monthly grid offers. */\nexport const MAX_DATE_OF_MONTH = 31;\n\n/** Sentinel chip value for \"Last day of the month\", which is not a date. */\nexport const LAST_DAY_CHIP_VALUE = 'LAST_DAY';\n\n/**\n * Safety bound for the day-by-day walk.\n *\n * Sized for the worst realistic case rather than the common one: three runs on\n * the 29th starting just after February in a non-leap year waits out three\n * Februaries, so roughly four years of scanning. Weekly needs at most 7 days\n * per run.\n */\nconst MAX_DAYS_SCANNED = 1600;\n\n/** Short day labels, indexed by JS day number (0 = Sunday). */\nexport const DAY_LABELS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];\n\n/** Selecting all seven days is stored as DAILY rather than a full weekly set. */\nexport const DAYS_IN_WEEK = 7;\n\n/**\n * Chips for the weekly \"Repeat on\" picker. Only the first letter is shown, so\n * each chip carries the full day name for screen readers — S, T and S repeat.\n */\nexport const DAY_CHIP_OPTIONS: ChipOption[] = DAY_LABELS.map(\n\t(label, dayIndex) => ({\n\t\tvalue: dayIndex,\n\t\tlabel: label.charAt(0),\n\t\tariaLabel: label,\n\t}),\n);\n\n/**\n * Chips for the monthly \"Repeat on\" grid — 1 to 31, then \"Last day of the\n * month\" as an independent option rather than an alias for the 31st.\n */\nexport const DATE_CHIP_OPTIONS: ChipOption[] = [\n\t...Array.from({ length: MAX_DATE_OF_MONTH }, (_, index) => ({\n\t\tvalue: index + 1,\n\t\tlabel: String(index + 1),\n\t})),\n\t{\n\t\tvalue: LAST_DAY_CHIP_VALUE,\n\t\tlabel: 'Last day of the month',\n\t\tfitContent: true,\n\t},\n];\n\n/** Mon–Fri, used to collapse a full working week into \"every weekday\". */\nconst WEEKDAY_INDICES = [1, 2, 3, 4, 5];\n\n/** Sat–Sun, collapsed into \"every weekend\". */\nconst WEEKEND_INDICES = [0, 6];\n\n/**\n * Weekly day order for the summary. Monday-first by design, which is not the\n * JS `getDay()` order the chips are indexed by (Sunday-first).\n */\nconst SUMMARY_DAY_ORDER = [1, 2, 3, 4, 5, 6, 0];\n\n/** Dates that do not exist in every month, with the months that skip them. */\nconst SKIPPED_MONTH_CAPTIONS: Record<number, string> = {\n\t29: 'Skipped most Februaries.',\n\t30: 'Skipped in February.',\n\t31: 'Skipped in months without a 31st (Apr, Jun, Sep, Nov).',\n};\n\n/**\n * \"1st\", \"22nd\", \"13th\" — the 11/12/13 exception is why this is not a plain\n * lookup on the last digit.\n */\nexport const ordinal = (value: number): string => {\n\tif ([11, 12, 13].includes(value % 100)) return `${value}th`;\n\n\tswitch (value % 10) {\n\t\tcase 1:\n\t\t\treturn `${value}st`;\n\t\tcase 2:\n\t\t\treturn `${value}nd`;\n\t\tcase 3:\n\t\t\treturn `${value}rd`;\n\t\tdefault:\n\t\t\treturn `${value}th`;\n\t}\n};\n\n/**\n * \"Mon\", \"Mon and Tue\", \"Mon, Tue and Thu\" — no Oxford comma, and always \"and\"\n * rather than \"&\". Shared by the weekly day names and the monthly ordinals.\n */\nexport const joinList = (items: string[]): string => {\n\tif (items.length <= 1) return items[0] ?? '';\n\tif (items.length === 2) return `${items[0]} and ${items[1]}`;\n\treturn `${items.slice(0, -1).join(', ')} and ${items[items.length - 1]}`;\n};\n\n/** Caption warning that a chosen date does not exist in every month. */\nexport const getSkippedMonthCaption = (\n\tdatesOfMonth: number[] | undefined,\n): string | null => {\n\tconst captions = (datesOfMonth ?? [])\n\t\t.map((date) => SKIPPED_MONTH_CAPTIONS[date])\n\t\t.filter(Boolean);\n\treturn captions.length ? captions.join(' ') : null;\n};\n\n/**\n * Works out when a recurring campaign actually runs.\n *\n * Kept free of React so the schedule preview and the eventual publish payload\n * can both read run dates from one place.\n */\nexport class ScheduleHelper {\n\tprivate readonly recurrence: RecurrenceValue;\n\n\tconstructor(recurrence: RecurrenceValue | undefined) {\n\t\tthis.recurrence = recurrence ?? {};\n\t}\n\n\tget frequency(): RECURRENCE_FREQUENCY {\n\t\treturn this.recurrence.frequency ?? RECURRENCE_FREQUENCY.DAILY;\n\t}\n\n\tget endMode(): RECURRENCE_END_MODE {\n\t\treturn this.recurrence.endMode ?? RECURRENCE_END_MODE.NEVER;\n\t}\n\n\t/** Days a weekly recurrence repeats on, as JS day indices. */\n\tget daysOfWeek(): number[] {\n\t\treturn this.recurrence.daysOfWeek ?? [];\n\t}\n\n\t/** Dates a monthly recurrence repeats on (1–31). */\n\tget datesOfMonth(): number[] {\n\t\treturn this.recurrence.datesOfMonth ?? [];\n\t}\n\n\t/** Whether a monthly recurrence also runs on the last day of every month. */\n\tget lastDaySelected(): boolean {\n\t\treturn !!this.recurrence.lastDaySelected;\n\t}\n\n\t/** A weekly recurrence cannot run until at least one day is picked. */\n\tget isMissingWeeklyDays(): boolean {\n\t\treturn (\n\t\t\tthis.frequency === RECURRENCE_FREQUENCY.WEEKLY && !this.daysOfWeek.length\n\t\t);\n\t}\n\n\t/** A monthly recurrence needs at least one date, or the last-day option. */\n\tget isMissingMonthlyDates(): boolean {\n\t\treturn (\n\t\t\tthis.frequency === RECURRENCE_FREQUENCY.MONTHLY &&\n\t\t\t!this.datesOfMonth.length &&\n\t\t\t!this.lastDaySelected\n\t\t);\n\t}\n\n\t/** True when the current selection cannot produce any run dates. */\n\tget isMissingRunDays(): boolean {\n\t\treturn this.isMissingWeeklyDays || this.isMissingMonthlyDates;\n\t}\n\n\t/**\n\t * Advances a date by one day.\n\t *\n\t * Every frequency walks day by day so `isRunDay` decides what counts. Monthly\n\t * cannot use `setMonth`: it rolls a 31st into the following month for shorter\n\t * months (31 Jan -> 3 Mar), whereas a missing date must skip that month\n\t * outright.\n\t */\n\tprivate addInterval(date: Date): Date {\n\t\tconst next = new Date(date);\n\t\tnext.setDate(next.getDate() + 1);\n\t\treturn next;\n\t}\n\n\t/** Last calendar date of the month the given date falls in. */\n\tprivate static lastDateOfMonth(date: Date): number {\n\t\treturn new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();\n\t}\n\n\t/** Whether a candidate date is one the campaign actually runs on. */\n\tprivate isRunDay(date: Date): boolean {\n\t\tif (this.frequency === RECURRENCE_FREQUENCY.WEEKLY) {\n\t\t\treturn this.daysOfWeek.includes(date.getDay());\n\t\t}\n\n\t\tif (this.frequency === RECURRENCE_FREQUENCY.MONTHLY) {\n\t\t\tconst dayOfMonth = date.getDate();\n\t\t\tif (this.datesOfMonth.includes(dayOfMonth)) return true;\n\t\t\treturn (\n\t\t\t\tthis.lastDaySelected &&\n\t\t\t\tdayOfMonth === ScheduleHelper.lastDateOfMonth(date)\n\t\t\t);\n\t\t}\n\n\t\treturn true;\n\t}\n\n\t/**\n\t * Next `limit` run dates from `startDate`, respecting the end rule.\n\t *\n\t * Returns fewer than `limit` when the recurrence ends first, which is what\n\t * lets the preview stop honestly instead of inventing runs.\n\t */\n\tcomputeUpcomingRuns(\n\t\tstartDate: Date | null | undefined,\n\t\tlimit: number = UPCOMING_RUNS_PREVIEW_COUNT,\n\t): Date[] {\n\t\tif (!startDate || Number.isNaN(startDate.getTime())) return [];\n\t\t// Weekly with no day picked, or monthly with no date, has no run dates yet.\n\t\tif (this.isMissingRunDays) return [];\n\n\t\tconst runs: Date[] = [];\n\n\t\t// AFTER_RUNS counts the start date as run 1, so the cap includes it.\n\t\tconst { endAfterRuns } = this.recurrence;\n\t\tconst maxRuns =\n\t\t\tthis.endMode === RECURRENCE_END_MODE.AFTER_RUNS &&\n\t\t\ttypeof endAfterRuns === 'number' &&\n\t\t\tendAfterRuns > 0\n\t\t\t\t? Math.min(endAfterRuns, limit)\n\t\t\t\t: limit;\n\n\t\tconst endDateMs =\n\t\t\tthis.endMode === RECURRENCE_END_MODE.ON_DATE && this.recurrence.endOnDate\n\t\t\t\t? this.recurrence.endOnDate * 1000\n\t\t\t\t: null;\n\n\t\tlet cursor = new Date(startDate);\n\t\t// Weekly walks a day at a time and skips days that are not selected, so\n\t\t// bound the walk rather than trusting it to land on `maxRuns` matches.\n\t\tlet daysScanned = 0;\n\n\t\twhile (runs.length < maxRuns && daysScanned <= MAX_DAYS_SCANNED) {\n\t\t\tif (endDateMs !== null && cursor.getTime() > endDateMs) break;\n\t\t\tif (this.isRunDay(cursor)) runs.push(new Date(cursor));\n\t\t\tcursor = this.addInterval(cursor);\n\t\t\tdaysScanned += 1;\n\t\t}\n\n\t\treturn runs;\n\t}\n\n\t/**\n\t * The days a weekly recurrence runs on, in Monday-first display order rather\n\t * than the Sunday-first order the chip values are indexed by.\n\t *\n\t * Mon–Fri exactly collapses to \"weekday\", Sat+Sun to \"weekend\". All seven is\n\t * not handled here — that is normalised to DAILY when the day is selected.\n\t */\n\tprivate get weeklyDayPhrase(): string {\n\t\tconst days = this.daysOfWeek;\n\t\tif (!days.length) return '';\n\n\t\tconst matchesExactly = (indices: number[]) =>\n\t\t\tdays.length === indices.length &&\n\t\t\tindices.every((day) => days.includes(day));\n\n\t\tif (matchesExactly(WEEKDAY_INDICES)) return 'weekday';\n\t\tif (matchesExactly(WEEKEND_INDICES)) return 'weekend';\n\n\t\tconst labels = SUMMARY_DAY_ORDER.filter((day) => days.includes(day)).map(\n\t\t\t(day) => DAY_LABELS[day],\n\t\t);\n\t\treturn joinList(labels);\n\t}\n\n\tprivate get monthlyDatePhrase(): string {\n\t\tif (this.recurrence?.monthlyRepeatOption === MONTHLY_REPEAT_OPTION.FIRST) {\n\t\t\treturn 'on the first day';\n\t\t}\n\n\t\tconst ordinals = [...this.datesOfMonth]\n\t\t\t.sort((left, right) => left - right)\n\t\t\t.map(ordinal);\n\n\t\tif (!this.lastDaySelected) {\n\t\t\treturn ordinals.length ? `on the ${joinList(ordinals)}` : '';\n\t\t}\n\n\t\tif (!ordinals.length) return 'on the last day';\n\t\treturn `on the ${joinList([...ordinals, 'the last day'])}`;\n\t}\n\n\t/**\n\t * The semibold phrase after \"Repeats\". Weekly and monthly name the days they\n\t * run on; daily is a plain adverb.\n\t */\n\tprivate get frequencyLabel(): string {\n\t\tswitch (this.frequency) {\n\t\t\tcase RECURRENCE_FREQUENCY.WEEKLY: {\n\t\t\t\tconst phrase = this.weeklyDayPhrase;\n\t\t\t\treturn phrase ? `every ${phrase}` : 'weekly';\n\t\t\t}\n\t\t\tcase RECURRENCE_FREQUENCY.MONTHLY: {\n\t\t\t\tconst phrase = this.monthlyDatePhrase;\n\t\t\t\treturn phrase ? `${phrase} of every month` : 'monthly';\n\t\t\t}\n\t\t\tdefault:\n\t\t\t\treturn 'daily';\n\t\t}\n\t}\n\n\t/** The text following the time, which differs per end mode. */\n\tprivate get endClause(): string {\n\t\tif (this.endMode === RECURRENCE_END_MODE.AFTER_RUNS) {\n\t\t\tconst totalRuns = this.recurrence.endAfterRuns;\n\t\t\tif (!totalRuns) return '.';\n\t\t\treturn ` and ends after ${totalRuns} ${\n\t\t\t\ttotalRuns === 1 ? 'run' : 'runs'\n\t\t\t}.`;\n\t\t}\n\n\t\tif (this.endMode === RECURRENCE_END_MODE.ON_DATE) {\n\t\t\tif (!this.recurrence.endOnDate) return '.';\n\t\t\tconst endLabel = formatDate(\n\t\t\t\tnew Date(this.recurrence.endOnDate * 1000),\n\t\t\t\t'd MMM yyyy',\n\t\t\t);\n\t\t\treturn ` and ends on ${endLabel}.`;\n\t\t}\n\n\t\treturn ' with no end date, you can cancel anytime.';\n\t}\n\n\t/**\n\t * Summary shown under the upcoming runs, split so the frequency and time can\n\t * be rendered in semibold as the design shows:\n\t * \"Repeats **daily** at **10:00 AM** with no end date, you can cancel anytime.\"\n\t */\n\tbuildSummary(runs: Date[]): RecurrenceSummary | null {\n\t\tif (!runs.length) return null;\n\n\t\treturn {\n\t\t\tfrequencyLabel: this.frequencyLabel,\n\t\t\ttimeLabel: formatDate(runs[0], 'h:mm a'),\n\t\t\ttail: this.endClause,\n\t\t};\n\t}\n}\n"],"names":["UPCOMING_RUNS_PREVIEW_COUNT","MAX_RECURRENCE_RUNS","CHIP_WIDTH","MAX_DATE_OF_MONTH","LAST_DAY_CHIP_VALUE","MAX_DAYS_SCANNED","DAY_LABELS","DAYS_IN_WEEK","DAY_CHIP_OPTIONS","label","dayIndex","DATE_CHIP_OPTIONS","_","index","WEEKDAY_INDICES","WEEKEND_INDICES","SUMMARY_DAY_ORDER","SKIPPED_MONTH_CAPTIONS","ordinal","value","joinList","items","getSkippedMonthCaption","datesOfMonth","captions","date","ScheduleHelper","recurrence","RECURRENCE_FREQUENCY","RECURRENCE_END_MODE","next","dayOfMonth","startDate","limit","runs","endAfterRuns","maxRuns","endDateMs","cursor","daysScanned","days","matchesExactly","indices","day","labels","MONTHLY_REPEAT_OPTION","ordinals","left","right","phrase","totalRuns","formatDate"],"mappings":"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"}

package/dist/cjs/components/schedule-builder/SendModeSelector.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("../../constants/Theme.js"),r=require("./ScheduleBuilder.styled.js"),i=require("../radioButton/RadioButton.js"),n=c.COLORS.background.inverseLight,v=({options:s,value:d,onChange:t,disabled:l=!1,"data-test":u})=>a.jsx(r.SendModeRow,{"data-test":u,children:s.map(e=>a.jsx(r.SendModeOption,{active:d===e.value,disabled:l||!!e.disabled,"data-test":`send-mode-${e.value}`,onClick:()=>{l||e.disabled||t(e.value)},children:a.jsx(i.RadioButton,{isActive:d===e.value,isDisabled:l||!!e.disabled,label:e.label,value:e.value,onValueChange:()=>{l||e.disabled||t(e.value)},alwaysBold:!0,activeColor:n,skipSelectingOff:!0})},e.value))});exports.SendModeSelector=v;
+//# sourceMappingURL=SendModeSelector.js.map

package/dist/cjs/components/schedule-builder/SendModeSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SendModeSelector.js","sources":["../../../../src/components/schedule-builder/SendModeSelector.tsx"],"sourcesContent":["import { COLORS } from '../../constants/Theme';\nimport { RadioButton } from '../radioButton';\nimport { SendModeOption, SendModeRow } from './ScheduleBuilder.styled';\n\n/** The purple of the selected radio, which is not the default brand colour. */\nconst RADIO_ACTIVE_COLOR = COLORS.background.inverseLight;\n\nexport interface SendModeItem<T extends string = string> {\n\tvalue: T;\n\tlabel: string;\n\t/**\n\t * Greys out this mode while leaving the others usable.\n\t *\n\t * Disabled rather than removed so the mode still reads as something the\n\t * product offers — a merchant who cannot use it here should see that it\n\t * exists, not wonder where it went.\n\t */\n\tdisabled?: boolean;\n}\n\nexport interface SendModeSelectorProps<T extends string = string> {\n\toptions: SendModeItem<T>[];\n\tvalue?: T;\n\tonChange: (value: T) => void;\n\tdisabled?: boolean;\n\t'data-test'?: string;\n}\n\n/**\n * The row of \"Send now / Schedule / Set as recurring\" cards.\n *\n * The whole card is the hit target, not just the radio — the radio's own\n * `onValueChange` fires too, so both routes land on the same handler.\n *\n * Options are passed in rather than hardcoded: the modes a screen offers are its\n * own business, and a caller with only two of them should not get a dead third.\n */\nexport const SendModeSelector = <T extends string = string>({\n\toptions,\n\tvalue,\n\tonChange,\n\tdisabled = false,\n\t'data-test': dataTest,\n}: SendModeSelectorProps<T>) => (\n\t<SendModeRow data-test={dataTest}>\n\t\t{options.map((option) => (\n\t\t\t<SendModeOption\n\t\t\t\tkey={option.value}\n\t\t\t\tactive={value === option.value}\n\t\t\t\tdisabled={disabled || !!option.disabled}\n\t\t\t\tdata-test={`send-mode-${option.value}`}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (disabled || option.disabled) return;\n\t\t\t\t\tonChange(option.value);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<RadioButton\n\t\t\t\t\tisActive={value === option.value}\n\t\t\t\t\tisDisabled={disabled || !!option.disabled}\n\t\t\t\t\tlabel={option.label}\n\t\t\t\t\tvalue={option.value}\n\t\t\t\t\tonValueChange={() => {\n\t\t\t\t\t\tif (disabled || option.disabled) return;\n\t\t\t\t\t\tonChange(option.value);\n\t\t\t\t\t}}\n\t\t\t\t\talwaysBold\n\t\t\t\t\tactiveColor={RADIO_ACTIVE_COLOR}\n\t\t\t\t\tskipSelectingOff\n\t\t\t\t/>\n\t\t\t</SendModeOption>\n\t\t))}\n\t</SendModeRow>\n);\n"],"names":["RADIO_ACTIVE_COLOR","COLORS","SendModeSelector","options","value","onChange","disabled","dataTest","SendModeRow","option","jsx","SendModeOption","RadioButton"],"mappings":"+OAKMA,EAAqBC,EAAAA,OAAO,WAAW,aAgChCC,EAAmB,CAA4B,CAC3D,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,GACX,YAAaC,CACd,UACEC,cAAA,CAAY,YAAWD,EACtB,SAAAJ,EAAQ,IAAKM,GACbC,EAAAA,IAACC,EAAAA,eAAA,CAEA,OAAQP,IAAUK,EAAO,MACzB,SAAUH,GAAY,CAAC,CAACG,EAAO,SAC/B,YAAW,aAAaA,EAAO,KAAK,GACpC,QAAS,IAAM,CACVH,GAAYG,EAAO,UACvBJ,EAASI,EAAO,KAAK,CACtB,EAEA,SAAAC,EAAAA,IAACE,EAAAA,YAAA,CACA,SAAUR,IAAUK,EAAO,MAC3B,WAAYH,GAAY,CAAC,CAACG,EAAO,SACjC,MAAOA,EAAO,MACd,MAAOA,EAAO,MACd,cAAe,IAAM,CAChBH,GAAYG,EAAO,UACvBJ,EAASI,EAAO,KAAK,CACtB,EACA,WAAU,GACV,YAAaT,EACb,iBAAgB,EAAA,CAAA,CACjB,EArBKS,EAAO,KAsBb,CACA,CAAA,CACF"}

package/dist/cjs/components/schedule-builder/StartDateTimePicker.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),v=require("react"),m=require("../../constants/Theme.js"),D=require("../combo-box/ComboBox.js"),p=require("../TypographyStyle.js"),i=require("./ScheduleBuilder.styled.js"),q=require("../datePicker/DatePickerWrapper.js"),P=require("../datePicker/model.js"),w=require("../dropdown/Dropdown.js"),R=30,d=c=>{const l=c.trim();if(!l)return null;const o=l.match(/^(\d{1,2})(?::(\d{1,2}))?$/);if(!o)return null;const s=Number(o[1]),a=o[2]===void 0?0:Number(o[2]);return s<1||s>12||a>59?null:{hours:String(s),minutes:String(a)}},k=({date:c,onDateChange:l,hours:o,minutes:s,isAm:a,onTimeChange:h,onMeridiemChange:S,onTimeInvalidBlur:y,timeErrorMessage:x,dateLabel:T="Start date",minDate:j,"data-test":M})=>{const f=v.useMemo(()=>{const e=[];for(let n=1;n<=12;n+=1)for(let u=0;u<60;u+=R)e.push(`${n}:${String(u).padStart(2,"0")}`);const t=e.filter(n=>n.startsWith("12:"));return[...t,...e.filter(n=>!t.includes(n))].map(n=>({value:n}))},[]),b=o!==""&&s!==""?`${o}:${String(s).padStart(2,"0")}`:void 0,g=[{label:"AM",value:"am",selected:a},{label:"PM",value:"pm",selected:!a}];return r.jsxs(i.FieldsRow,{"data-test":M,children:[r.jsxs(i.DateFieldColumn,{children:[r.jsx(i.FieldLabel,{children:r.jsxs(p.BodySecondary,{color:m.COLORS.content.primary,children:[T,r.jsx(i.RequiredMark,{children:" *"})]})}),r.jsx(i.DatePickerSlot,{children:r.jsx(q.DatePickerWrapper,{val:c,onChange:e=>{const t=Array.isArray(e)?e[0]:e;t&&l(t)},displayFormat:"dd MMM yyyy",dateButtonType:P.DateButtonType.LARGE,calendarProps:{minDate:j},pickerStyles:{top:8,zIndex:4}})})]}),r.jsxs(i.TimeFieldColumn,{children:[r.jsx(i.FieldLabel,{children:r.jsxs(p.BodySecondary,{color:m.COLORS.content.primary,children:["Time",r.jsx(i.RequiredMark,{children:" *"})]})}),r.jsxs(i.TimeInputRow,{children:[r.jsx(i.TimeDropdownSlot,{children:r.jsx(D.ComboBox,{"data-test":"recurrence-time",value:b??"",options:f,placeholder:"hh:mm",errorMessage:x||void 0,validate:e=>!!d(e),sanitize:e=>e.replace(/[^\d:]/g,"").slice(0,5),format:e=>{const t=d(e);return t?`${t.hours}:${t.minutes.padStart(2,"0")}`:e},onChange:e=>{const t=d(e);t&&h(t)},onInvalidBlur:y})}),r.jsx(i.MeridiemDropdownSlot,{"data-test":"recurrence-meridiem",children:r.jsx(w.Dropdown,{size:"default",isSearchable:!1,isMultiSelect:!1,options:g,value:a?"AM":"PM",buttonWidth:"100%",width:"84px",placeHolderHeight:"48px",placeHolder:"AM",onSelect:e=>{const t=Array.isArray(e)?e[0]:e;S(t?.value!=="pm")}})})]})]})]})};exports.StartDateTimePicker=k;exports.parseTimeText=d;
+//# sourceMappingURL=StartDateTimePicker.js.map

package/dist/cjs/components/schedule-builder/StartDateTimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StartDateTimePicker.js","sources":["../../../../src/components/schedule-builder/StartDateTimePicker.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { COLORS } from '../../constants/Theme';\nimport { ComboBox } from '../combo-box';\nimport { DateButtonType, DatePickerWrapper } from '../datePicker';\nimport { Dropdown, DropdownOption, SingleOption } from '../dropdown';\nimport { BodySecondary } from '../TypographyStyle';\nimport {\n\tDateFieldColumn,\n\tDatePickerSlot,\n\tFieldLabel,\n\tFieldsRow,\n\tMeridiemDropdownSlot,\n\tRequiredMark,\n\tTimeDropdownSlot,\n\tTimeFieldColumn,\n\tTimeInputRow,\n} from './ScheduleBuilder.styled';\n\n/** Step between offered times, in minutes. */\nconst TIME_STEP_MINUTES = 30;\n\n/**\n * Reads a typed 12-hour time.\n *\n * Accepts \"9\", \"9:5\" and \"09:05\" so the merchant can type naturally; am/pm sits\n * on its own dropdown, so only 1-12 is valid here. Returns null while the text is\n * incomplete, which is what keeps the field editable mid-entry.\n */\nexport const parseTimeText = (\n\ttext: string,\n): { hours: string; minutes: string } | null => {\n\tconst trimmed = text.trim();\n\tif (!trimmed) return null;\n\n\tconst match = trimmed.match(/^(\\d{1,2})(?::(\\d{1,2}))?$/);\n\tif (!match) return null;\n\n\tconst hours = Number(match[1]);\n\t// Minutes are optional: \"9\" means 9:00.\n\tconst minutes = match[2] === undefined ? 0 : Number(match[2]);\n\n\tif (hours < 1 || hours > 12) return null;\n\tif (minutes > 59) return null;\n\n\treturn { hours: String(hours), minutes: String(minutes) };\n};\n\nexport interface StartDateTimePickerProps {\n\t/** The chosen date. Time-of-day is carried separately by hours/minutes/isAm. */\n\tdate?: Date;\n\tonDateChange: (date: Date) => void;\n\t/** 12-hour clock, \"1\"–\"12\". Empty string while nothing is chosen. */\n\thours: string;\n\t/** \"0\"–\"59\". Empty string while nothing is chosen. */\n\tminutes: string;\n\tisAm: boolean;\n\t/** Fires only for a parseable time, so partial typing does not clear state. */\n\tonTimeChange: (time: { hours: string; minutes: string }) => void;\n\tonMeridiemChange: (isAm: boolean) => void;\n\t/** Called when focus leaves an unparseable time, for the caller to validate. */\n\tonTimeInvalidBlur?: () => void;\n\t/** Shown under the time field. The caller owns validation. */\n\ttimeErrorMessage?: string;\n\t/** \"Start date\" when a recurrence follows, plain \"Date\" otherwise. */\n\tdateLabel?: string;\n\tminDate?: Date;\n\t'data-test'?: string;\n}\n\n/**\n * The start date and time-of-day row.\n *\n * Date and time are separate props rather than one Date because the time is\n * edited as text and can be mid-entry (\"9:\" is not a time yet) — folding it into\n * a Date would force a guess about what an incomplete entry means.\n */\nexport const StartDateTimePicker: React.FC<StartDateTimePickerProps> = ({\n\tdate,\n\tonDateChange,\n\thours,\n\tminutes,\n\tisAm,\n\tonTimeChange,\n\tonMeridiemChange,\n\tonTimeInvalidBlur,\n\ttimeErrorMessage,\n\tdateLabel = 'Start date',\n\tminDate,\n\t'data-test': dataTest,\n}) => {\n\t/**\n\t * Times offered in the picker, at TIME_STEP_MINUTES steps. 12 leads the day in\n\t * 12-hour time, so it sorts to the front rather than after 11.\n\t */\n\tconst timeOptions = useMemo(() => {\n\t\tconst values: string[] = [];\n\t\tfor (let hour = 1; hour <= 12; hour += 1) {\n\t\t\tfor (let minute = 0; minute < 60; minute += TIME_STEP_MINUTES) {\n\t\t\t\tvalues.push(`${hour}:${String(minute).padStart(2, '0')}`);\n\t\t\t}\n\t\t}\n\t\tconst twelves = values.filter((value) => value.startsWith('12:'));\n\t\treturn [\n\t\t\t...twelves,\n\t\t\t...values.filter((value) => !twelves.includes(value)),\n\t\t].map((value) => ({ value }));\n\t}, []);\n\n\tconst selectedTimeLabel =\n\t\thours !== '' && minutes !== ''\n\t\t\t? `${hours}:${String(minutes).padStart(2, '0')}`\n\t\t\t: undefined;\n\n\tconst meridiemDropdownOptions: SingleOption[] = [\n\t\t{ label: 'AM', value: 'am', selected: isAm },\n\t\t{ label: 'PM', value: 'pm', selected: !isAm },\n\t];\n\n\treturn (\n\t\t<FieldsRow data-test={dataTest}>\n\t\t\t<DateFieldColumn>\n\t\t\t\t<FieldLabel>\n\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t{dateLabel}\n\t\t\t\t\t\t<RequiredMark> *</RequiredMark>\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</FieldLabel>\n\t\t\t\t<DatePickerSlot>\n\t\t\t\t\t<DatePickerWrapper\n\t\t\t\t\t\tval={date}\n\t\t\t\t\t\tonChange={(value: Date | Date[]) => {\n\t\t\t\t\t\t\tconst dateValue = Array.isArray(value) ? value[0] : value;\n\t\t\t\t\t\t\tif (dateValue) onDateChange(dateValue);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tdisplayFormat=\"dd MMM yyyy\"\n\t\t\t\t\t\tdateButtonType={DateButtonType.LARGE}\n\t\t\t\t\t\tcalendarProps={{ minDate }}\n\t\t\t\t\t\tpickerStyles={{ top: 8, zIndex: 4 }}\n\t\t\t\t\t/>\n\t\t\t\t</DatePickerSlot>\n\t\t\t</DateFieldColumn>\n\t\t\t<TimeFieldColumn>\n\t\t\t\t<FieldLabel>\n\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\tTime\n\t\t\t\t\t\t<RequiredMark> *</RequiredMark>\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</FieldLabel>\n\t\t\t\t{/*\n          Top-aligned: the time field's error message sits inside its own slot,\n          so centring would drop AM/PM as the message appears.\n        */}\n\t\t\t\t<TimeInputRow>\n\t\t\t\t\t<TimeDropdownSlot>\n\t\t\t\t\t\t<ComboBox\n\t\t\t\t\t\t\tdata-test=\"recurrence-time\"\n\t\t\t\t\t\t\tvalue={selectedTimeLabel ?? ''}\n\t\t\t\t\t\t\toptions={timeOptions}\n\t\t\t\t\t\t\tplaceholder=\"hh:mm\"\n\t\t\t\t\t\t\terrorMessage={timeErrorMessage || undefined}\n\t\t\t\t\t\t\tvalidate={(text) => !!parseTimeText(text)}\n\t\t\t\t\t\t\tsanitize={(text) => text.replace(/[^\\d:]/g, '').slice(0, 5)}\n\t\t\t\t\t\t\tformat={(text) => {\n\t\t\t\t\t\t\t\tconst parsed = parseTimeText(text);\n\t\t\t\t\t\t\t\tif (!parsed) return text;\n\t\t\t\t\t\t\t\treturn `${parsed.hours}:${parsed.minutes.padStart(2, '0')}`;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonChange={(text) => {\n\t\t\t\t\t\t\t\tconst parsed = parseTimeText(text);\n\t\t\t\t\t\t\t\tif (!parsed) return;\n\t\t\t\t\t\t\t\tonTimeChange(parsed);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonInvalidBlur={onTimeInvalidBlur}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TimeDropdownSlot>\n\t\t\t\t\t<MeridiemDropdownSlot data-test=\"recurrence-meridiem\">\n\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t\t\tisSearchable={false}\n\t\t\t\t\t\t\tisMultiSelect={false}\n\t\t\t\t\t\t\toptions={meridiemDropdownOptions}\n\t\t\t\t\t\t\tvalue={isAm ? 'AM' : 'PM'}\n\t\t\t\t\t\t\tbuttonWidth=\"100%\"\n\t\t\t\t\t\t\twidth=\"84px\"\n\t\t\t\t\t\t\tplaceHolderHeight=\"48px\"\n\t\t\t\t\t\t\tplaceHolder=\"AM\"\n\t\t\t\t\t\t\tonSelect={(\n\t\t\t\t\t\t\t\tselected: DropdownOption | DropdownOption[] | null,\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tconst normalized = (\n\t\t\t\t\t\t\t\t\tArray.isArray(selected) ? selected[0] : selected\n\t\t\t\t\t\t\t\t) as SingleOption | null;\n\t\t\t\t\t\t\t\tonMeridiemChange(normalized?.value !== 'pm');\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MeridiemDropdownSlot>\n\t\t\t\t</TimeInputRow>\n\t\t\t</TimeFieldColumn>\n\t\t</FieldsRow>\n\t);\n};\n"],"names":["TIME_STEP_MINUTES","parseTimeText","text","trimmed","match","hours","minutes","StartDateTimePicker","date","onDateChange","isAm","onTimeChange","onMeridiemChange","onTimeInvalidBlur","timeErrorMessage","dateLabel","minDate","dataTest","timeOptions","useMemo","values","hour","minute","twelves","value","selectedTimeLabel","meridiemDropdownOptions","jsxs","FieldsRow","DateFieldColumn","jsx","FieldLabel","BodySecondary","COLORS","RequiredMark","DatePickerSlot","DatePickerWrapper","dateValue","DateButtonType","TimeFieldColumn","TimeInputRow","TimeDropdownSlot","ComboBox","parsed","MeridiemDropdownSlot","Dropdown","selected","normalized"],"mappings":"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"}

package/dist/cjs/components/schedule-builder/UpcomingRunsPreview.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("date-fns"),i=require("../../constants/Theme.js"),o=require("../TypographyStyle.js"),t=require("./ScheduleBuilder.styled.js"),u=({runs:r,summary:n,dateFormat:c="EEE d MMM, yyyy","data-test":s})=>r.length?e.jsxs(t.Column,{gap:12,"data-test":s,children:[e.jsxs(t.Column,{gap:8,children:[e.jsx(o.TitleSmall,{color:i.COLORS.content.primary,children:"Upcoming runs"}),e.jsx(t.Column,{gap:16,children:r.map((l,a)=>e.jsxs(t.UpcomingRunItem,{isLast:a===r.length-1,children:[e.jsx(t.UpcomingRunDot,{}),e.jsx(o.BodyCaption,{color:i.COLORS.content.primary,children:d.format(l,c)})]},l.getTime()))})]}),!!n&&e.jsxs(o.BodyCaption,{color:i.COLORS.content.secondary,"data-test":"recurrence-summary",children:["Repeats ",e.jsx(t.SummaryHighlight,{children:n.frequencyLabel})," at ",e.jsx(t.SummaryHighlight,{children:n.timeLabel}),n.tail]})]}):null;exports.UpcomingRunsPreview=u;
+//# sourceMappingURL=UpcomingRunsPreview.js.map

package/dist/cjs/components/schedule-builder/UpcomingRunsPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpcomingRunsPreview.js","sources":["../../../../src/components/schedule-builder/UpcomingRunsPreview.tsx"],"sourcesContent":["import { format as formatDate } from 'date-fns';\nimport React from 'react';\nimport { COLORS } from '../../constants/Theme';\nimport { BodyCaption, TitleSmall } from '../TypographyStyle';\nimport { RecurrenceSummary } from './model';\nimport {\n\tColumn,\n\tSummaryHighlight,\n\tUpcomingRunDot,\n\tUpcomingRunItem,\n} from './ScheduleBuilder.styled';\n\nexport interface UpcomingRunsPreviewProps {\n\t/** Run dates to list. Renders nothing when empty. */\n\truns: Date[];\n\t/** Summary line under the list. Omit to show the list alone. */\n\tsummary?: RecurrenceSummary | null;\n\t/** date-fns pattern for each run. */\n\tdateFormat?: string;\n\t'data-test'?: string;\n}\n\n/**\n * The dated list of the next few runs, with the plain-English summary beneath.\n *\n * Read-only: it renders whatever run dates it is given rather than deriving them,\n * so a caller can preview a schedule it has not committed to. Pair it with\n * `ScheduleHelper.computeUpcomingRuns` to produce the dates.\n */\nexport const UpcomingRunsPreview: React.FC<UpcomingRunsPreviewProps> = ({\n\truns,\n\tsummary,\n\tdateFormat = 'EEE d MMM, yyyy',\n\t'data-test': dataTest,\n}) => {\n\tif (!runs.length) return null;\n\n\treturn (\n\t\t<Column gap={12} data-test={dataTest}>\n\t\t\t<Column gap={8}>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Upcoming runs</TitleSmall>\n\t\t\t\t<Column gap={16}>\n\t\t\t\t\t{runs.map((run, index) => (\n\t\t\t\t\t\t<UpcomingRunItem\n\t\t\t\t\t\t\tkey={run.getTime()}\n\t\t\t\t\t\t\tisLast={index === runs.length - 1}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<UpcomingRunDot />\n\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{formatDate(run, dateFormat)}\n\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t</UpcomingRunItem>\n\t\t\t\t\t))}\n\t\t\t\t</Column>\n\t\t\t</Column>\n\t\t\t{!!summary && (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\tdata-test=\"recurrence-summary\"\n\t\t\t\t>\n\t\t\t\t\t{'Repeats '}\n\t\t\t\t\t<SummaryHighlight>{summary.frequencyLabel}</SummaryHighlight>\n\t\t\t\t\t{' at '}\n\t\t\t\t\t<SummaryHighlight>{summary.timeLabel}</SummaryHighlight>\n\t\t\t\t\t{summary.tail}\n\t\t\t\t</BodyCaption>\n\t\t\t)}\n\t\t</Column>\n\t);\n};\n"],"names":["UpcomingRunsPreview","runs","summary","dateFormat","dataTest","jsxs","Column","jsx","TitleSmall","COLORS","run","index","UpcomingRunItem","UpcomingRunDot","BodyCaption","formatDate","SummaryHighlight"],"mappings":"6PA6BaA,EAA0D,CAAC,CACvE,KAAAC,EACA,QAAAC,EACA,WAAAC,EAAa,kBACb,YAAaC,CACd,IACMH,EAAK,OAGTI,EAAAA,KAACC,EAAAA,OAAA,CAAO,IAAK,GAAI,YAAWF,EAC3B,SAAA,CAAAC,EAAAA,KAACC,EAAAA,OAAA,CAAO,IAAK,EACZ,SAAA,CAAAC,MAACC,EAAAA,WAAA,CAAW,MAAOC,EAAAA,OAAO,QAAQ,QAAS,SAAA,gBAAa,EACxDF,EAAAA,IAACD,EAAAA,QAAO,IAAK,GACX,WAAK,IAAI,CAACI,EAAKC,IACfN,EAAAA,KAACO,EAAAA,gBAAA,CAEA,OAAQD,IAAUV,EAAK,OAAS,EAEhC,SAAA,CAAAM,EAAAA,IAACM,EAAAA,eAAA,EAAe,EAChBN,EAAAA,IAACO,EAAAA,aAAY,MAAOL,SAAO,QAAQ,QACjC,SAAAM,EAAAA,OAAWL,EAAKP,CAAU,CAAA,CAC5B,CAAA,CAAA,EANKO,EAAI,QAAA,CAAQ,CAQlB,CAAA,CACF,CAAA,EACD,EACC,CAAC,CAACR,GACFG,EAAAA,KAACS,EAAAA,YAAA,CACA,MAAOL,EAAAA,OAAO,QAAQ,UACtB,YAAU,qBAET,SAAA,CAAA,WACDF,EAAAA,IAACS,EAAAA,iBAAA,CAAkB,SAAAd,EAAQ,cAAA,CAAe,EACzC,OACDK,EAAAA,IAACS,EAAAA,iBAAA,CAAkB,SAAAd,EAAQ,SAAA,CAAU,EACpCA,EAAQ,IAAA,CAAA,CAAA,CACV,EAEF,EAhCwB"}

package/dist/cjs/components/schedule-builder/model.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var S=(r=>(r.SEND_NOW="SEND_NOW",r.SCHEDULE="SCHEDULE",r.RECURRING="RECURRING",r))(S||{}),e=(r=>(r.DAILY="DAILY",r.WEEKLY="WEEKLY",r.MONTHLY="MONTHLY",r))(e||{}),t=(r=>(r.NEVER="NEVER",r.AFTER_RUNS="AFTER_RUNS",r.ON_DATE="ON_DATE",r))(t||{}),T=(r=>(r.FIRST="FIRST",r.LAST="LAST",r.CUSTOM="CUSTOM",r))(T||{});exports.MONTHLY_REPEAT_OPTION=T;exports.RECURRENCE_END_MODE=t;exports.RECURRENCE_FREQUENCY=e;exports.SEND_MODE=S;
+//# sourceMappingURL=model.js.map

package/dist/cjs/components/schedule-builder/model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"model.js","sources":["../../../../src/components/schedule-builder/model.ts"],"sourcesContent":["/**\n * Types for the recurrence pickers.\n *\n * These enums are duplicated from the consuming app's campaign types on purpose:\n * a library component cannot import from an app, and the string values are what\n * both ends already send over the wire, so the two stay compatible without a\n * shared package. Cast at the boundary if your app has its own copy.\n */\n\n/**\n * When something sends. SEND_NOW hides the date and time; SCHEDULE shows them;\n * RECURRING adds the frequency, end rule and run preview beneath.\n */\nexport enum SEND_MODE {\n\tSEND_NOW = 'SEND_NOW',\n\tSCHEDULE = 'SCHEDULE',\n\tRECURRING = 'RECURRING',\n}\n\n/** How often the series repeats. */\nexport enum RECURRENCE_FREQUENCY {\n\tDAILY = 'DAILY',\n\tWEEKLY = 'WEEKLY',\n\tMONTHLY = 'MONTHLY',\n}\n\n/** What stops a series from running forever. */\nexport enum RECURRENCE_END_MODE {\n\tNEVER = 'NEVER',\n\tAFTER_RUNS = 'AFTER_RUNS',\n\tON_DATE = 'ON_DATE',\n}\n\n/**\n * The \"Repeat every\" choice shown for a monthly recurrence. FIRST and LAST are\n * presets over the same dates the CUSTOM grid picks, so all three resolve to one\n * set of dates plus a last-day flag rather than three separate code paths.\n */\nexport enum MONTHLY_REPEAT_OPTION {\n\tFIRST = 'FIRST',\n\tLAST = 'LAST',\n\tCUSTOM = 'CUSTOM',\n}\n\n/**\n * Everything the pickers below the start date own.\n *\n * The start date and time are deliberately not here — they belong to the\n * schedule the recurrence repeats from, which every send mode shares.\n * `ScheduleBuilder` holds those as its own `date`/`hours`/`minutes` props so\n * switching mode does not have to move them between two shapes.\n */\nexport interface RecurrenceValue {\n\tfrequency?: RECURRENCE_FREQUENCY;\n\tendMode?: RECURRENCE_END_MODE;\n\t/** Weekly only. JS day indices — 0 = Sunday, matching `Date.getDay()`. */\n\tdaysOfWeek?: number[];\n\t/** Monthly only. Calendar dates, 1–31. */\n\tdatesOfMonth?: number[];\n\t/** Monthly only. Runs on the last day of every month, whatever date that is. */\n\tlastDaySelected?: boolean;\n\tmonthlyRepeatOption?: MONTHLY_REPEAT_OPTION;\n\t/** AFTER_RUNS only. Counts the first run, so 1 means \"just the start date\". */\n\tendAfterRuns?: number;\n\t/** ON_DATE only. Epoch seconds at the end of the chosen day. */\n\tendOnDate?: number;\n\trefreshSegmentBeforeEachRun?: boolean;\n}\n\n/** Summary line split into its semibold parts and the plain text between them. */\nexport interface RecurrenceSummary {\n\tfrequencyLabel: string;\n\ttimeLabel: string;\n\ttail: string;\n}\n"],"names":["SEND_MODE","RECURRENCE_FREQUENCY","RECURRENCE_END_MODE","MONTHLY_REPEAT_OPTION"],"mappings":"gFAaO,IAAKA,GAAAA,IACXA,EAAA,SAAW,WACXA,EAAA,SAAW,WACXA,EAAA,UAAY,YAHDA,IAAAA,GAAA,CAAA,CAAA,EAOAC,GAAAA,IACXA,EAAA,MAAQ,QACRA,EAAA,OAAS,SACTA,EAAA,QAAU,UAHCA,IAAAA,GAAA,CAAA,CAAA,EAOAC,GAAAA,IACXA,EAAA,MAAQ,QACRA,EAAA,WAAa,aACbA,EAAA,QAAU,UAHCA,IAAAA,GAAA,CAAA,CAAA,EAWAC,GAAAA,IACXA,EAAA,MAAQ,QACRA,EAAA,KAAO,OACPA,EAAA,OAAS,SAHEA,IAAAA,GAAA,CAAA,CAAA"}

package/dist/cjs/components/tag/Tag.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),F=require("react"),B=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),G=require("./model.js"),J=require("./Tag.styled.js"),K=require("./themes.js"),Q=c=>c&&typeof c=="object"&&"default"in c?c:{default:c},h=Q(F),f=({tagText:c,LeadingIcon:u,TrailingIcon:j,onLeadingIconClicked:T=void 0,leadingIconId:s,trailingIconId:d,onTrailingIconClicked:N=void 0,theme:n="light",type:p="neutral",variant:o="regular",version:q,cursor:C,alignIcon:A,noBorder:E,tagHtmlText:a,contentPadding:_,padding:$,height:k,leadingIconTooltip:g,trailingIconTooltip:w,tagColor:x,numberOfLines:l,backgroundColor:R,borderRadius:S,size:t="regular",borderStyle:b,gap:M,hoverBackgroundColor:P,...D})=>{let i=c;const V=n;let m=p;G.ValidTagTypeMap[o][p]||(m="neutral"),o==="circle"&&typeof i=="number"&&i>99&&(i="99+");const v=K.getTagIconColor(n,m),y={height:o==="compressed"?12:16,width:o==="compressed"?12:16,color:v,style:{display:"block"}};return e.jsx(J.Tag,{cursor:C,theme:V,type:m,variant:o,version:q,alignIcon:A,noBorder:E,contentPadding:_,padding:$,height:k,backgroundColor:R,borderRadius:S,size:t,borderStyle:b,gap:M,tagColor:x,hoverBackgroundColor:P,...D,children:e.jsxs("div",{className:"container",children:[u&&(g?e.jsx(B.Tooltip,{...g,children:e.jsx("button",{className:"icon-leading",onClick:T,id:`${s}-wrapper`||"leading-icon-wrapper",children:h.default.createElement(u,{...y,id:s||"leading-icon"})})}):e.jsx("button",{className:"icon-leading",onClick:T,id:`${s}-wrapper`||"leading-icon-wrapper",children:h.default.createElement(u,{...y,id:s||"leading-icon"})})),a&&(p==="ai"&&n==="light"?t==="small"?e.jsx(r.AiBodyTiny,{numberOfLines:l,children:a}):e.jsx(r.AiBodyCaption,{numberOfLines:l,children:a}):t==="small"?e.jsx(r.BodyTiny,{className:"text",numberOfLines:l,children:a}):e.jsx(r.BodyCaption,{className:"text",numberOfLines:l,children:a})),!a&&i!==""&&(p==="ai"&&n==="light"?t==="small"?e.jsx(r.AiBodyTiny,{numberOfLines:l,children:i}):e.jsx(r.AiBodyCaption,{numberOfLines:l,children:i}):t==="small"?e.jsx(r.BodyTiny,{className:"text",color:x,numberOfLines:l,children:i}):e.jsx(r.BodyCaption,{className:"text",color:x,numberOfLines:l,children:i})),j&&(w?e.jsx(B.Tooltip,{...w,children:e.jsx("button",{className:"icon-trailing",onClick:N,id:`${d}-wrapper`||"trailing-icon-wrapper",children:h.default.createElement(j,{...y,id:d||"trailing-icon"})})}):e.jsx("button",{className:"icon-trailing",onClick:N,id:`${d}-wrapper`||"trailing-icon-wrapper",children:h.default.createElement(j,{...y,id:d||"trailing-icon"})}))]})})};f.displayName="Tag";exports.Tag=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),D=require("react"),B=require("../tooltips/Tooltip.js"),r=require("../TypographyStyle.js"),V=require("./model.js"),v=require("./Tag.styled.js"),F=require("./themes.js"),G=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},h=G(D),C=({tagText:o,LeadingIcon:u,TrailingIcon:j,onLeadingIconClicked:m=void 0,leadingIconId:s,trailingIconId:d,onTrailingIconClicked:T=void 0,theme:n="light",type:p="neutral",variant:c="regular",version:f,cursor:q,alignIcon:A,noBorder:E,tagHtmlText:a,contentPadding:_,padding:$,height:k,leadingIconTooltip:g,trailingIconTooltip:N,tagColor:w,numberOfLines:l,backgroundColor:R,borderRadius:S,size:t="regular",hoverBackgroundColor:b})=>{let i=o;const M=n;let x=p;V.ValidTagTypeMap[c][p]||(x="neutral"),c==="circle"&&typeof i=="number"&&i>99&&(i="99+");const P=F.getTagIconColor(n,x),y={height:c==="compressed"?12:16,width:c==="compressed"?12:16,color:P,style:{display:"block"}};return e.jsx(v.Tag,{cursor:q,theme:M,type:x,variant:c,version:f,alignIcon:A,noBorder:E,contentPadding:_,padding:$,height:k,backgroundColor:R,borderRadius:S,size:t,hoverBackgroundColor:b,children:e.jsxs("div",{className:"container",children:[u&&(g?e.jsx(B.Tooltip,{...g,children:e.jsx("button",{className:"icon-leading",onClick:m,id:`${s}-wrapper`||"leading-icon-wrapper",children:h.default.createElement(u,{...y,id:s||"leading-icon"})})}):e.jsx("button",{className:"icon-leading",onClick:m,id:`${s}-wrapper`||"leading-icon-wrapper",children:h.default.createElement(u,{...y,id:s||"leading-icon"})})),a&&(p==="ai"&&n==="light"?t==="small"?e.jsx(r.AiBodyTiny,{numberOfLines:l,children:a}):e.jsx(r.AiBodyCaption,{numberOfLines:l,children:a}):t==="small"?e.jsx(r.BodyTiny,{className:"text",numberOfLines:l,children:a}):e.jsx(r.BodyCaption,{className:"text",numberOfLines:l,children:a})),!a&&i!==""&&(p==="ai"&&n==="light"?t==="small"?e.jsx(r.AiBodyTiny,{numberOfLines:l,children:i}):e.jsx(r.AiBodyCaption,{numberOfLines:l,children:i}):t==="small"?e.jsx(r.BodyTiny,{className:"text",color:w,numberOfLines:l,children:i}):e.jsx(r.BodyCaption,{className:"text",color:w,numberOfLines:l,children:i})),j&&(N?e.jsx(B.Tooltip,{...N,children:e.jsx("button",{className:"icon-trailing",onClick:T,id:`${d}-wrapper`||"trailing-icon-wrapper",children:h.default.createElement(j,{...y,id:d||"trailing-icon"})})}):e.jsx("button",{className:"icon-trailing",onClick:T,id:`${d}-wrapper`||"trailing-icon-wrapper",children:h.default.createElement(j,{...y,id:d||"trailing-icon"})}))]})})};C.displayName="Tag";exports.Tag=C;
 //# sourceMappingURL=Tag.js.map

package/dist/cjs/components/tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../../src/components/tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport { Tooltip } from '../tooltips/Tooltip';\nimport {\n\tAiBodyCaption,\n\tAiBodyTiny,\n\tBodyCaption,\n\tBodyTiny,\n} from '../TypographyStyle';\nimport { TagProps, ValidTagTypeMap } from './model';\nimport * as Sc from './Tag.styled';\nimport { getTagIconColor } from './themes';\n\nexport const Tag = ({\n\ttagText,\n\tLeadingIcon,\n\tTrailingIcon,\n\tonLeadingIconClicked = undefined,\n\tleadingIconId,\n\ttrailingIconId,\n\tonTrailingIconClicked = undefined,\n\ttheme = 'light',\n\ttype = 'neutral',\n\tvariant = 'regular',\n\tversion,\n\tcursor,\n\talignIcon,\n\tnoBorder,\n\ttagHtmlText,\n\tcontentPadding,\n\tpadding,\n\theight,\n\tleadingIconTooltip,\n\ttrailingIconTooltip,\n\ttagColor,\n\tnumberOfLines,\n\tbackgroundColor,\n\tborderRadius,\n\tsize = 'regular',\n\tborderStyle,\n\tgap,\n\thoverBackgroundColor,\n\t...rest\n}: TagProps) => {\n\tlet displayTagText = tagText;\n\tconst displayTheme = theme;\n\tlet displayType = type;\n\n\tif (!ValidTagTypeMap[variant][type]) {\n\t\tdisplayType = 'neutral';\n\t}\n\n\tif (variant === 'circle') {\n\t\tif (typeof displayTagText === 'number' && displayTagText > 99) {\n\t\t\tdisplayTagText = '99+';\n\t\t}\n\t}\n\n\tconst iconColor = getTagIconColor(theme, displayType);\n\tconst iconProps = {\n\t\theight: variant === 'compressed' ? 12 : 16,\n\t\twidth: variant === 'compressed' ? 12 : 16,\n\t\tcolor: iconColor,\n\t\tstyle: { display: 'block' },\n\t};\n\n\treturn (\n\t\t<Sc.Tag\n\t\t\tcursor={cursor}\n\t\t\ttheme={displayTheme}\n\t\t\ttype={displayType}\n\t\t\tvariant={variant}\n\t\t\tversion={version}\n\t\t\talignIcon={alignIcon}\n\t\t\tnoBorder={noBorder}\n\t\t\tcontentPadding={contentPadding}\n\t\t\tpadding={padding}\n\t\t\theight={height}\n\t\t\tbackgroundColor={backgroundColor}\n\t\t\tborderRadius={borderRadius}\n\t\t\tsize={size}\n\t\t\tborderStyle={borderStyle}\n\t\t\tgap={gap}\n\t\t\ttagColor={tagColor}\n\t\t\thoverBackgroundColor={hoverBackgroundColor}\n\t\t\t{...rest}\n\t\t>\n\t\t\t<div className=\"container\">\n\t\t\t\t{LeadingIcon &&\n\t\t\t\t\t(leadingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...leadingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\n\t\t\t\t{tagHtmlText &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{!tagHtmlText &&\n\t\t\t\t\tdisplayTagText !== '' &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{TrailingIcon &&\n\t\t\t\t\t(trailingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...trailingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\t\t\t</div>\n\t\t</Sc.Tag>\n\t);\n};\n\nTag.displayName = 'Tag';\n"],"names":["Tag","tagText","LeadingIcon","TrailingIcon","onLeadingIconClicked","leadingIconId","trailingIconId","onTrailingIconClicked","theme","type","variant","version","cursor","alignIcon","noBorder","tagHtmlText","contentPadding","padding","height","leadingIconTooltip","trailingIconTooltip","tagColor","numberOfLines","backgroundColor","borderRadius","size","borderStyle","gap","hoverBackgroundColor","rest","displayTagText","displayTheme","displayType","ValidTagTypeMap","iconColor","getTagIconColor","iconProps","jsx","Sc.Tag","jsxs","Tooltip","React","AiBodyTiny","AiBodyCaption","BodyTiny","BodyCaption"],"mappings":"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"}
+{"version":3,"file":"Tag.js","sources":["../../../../src/components/tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport { Tooltip } from '../tooltips/Tooltip';\nimport {\n\tAiBodyCaption,\n\tAiBodyTiny,\n\tBodyCaption,\n\tBodyTiny,\n} from '../TypographyStyle';\nimport { TagProps, ValidTagTypeMap } from './model';\nimport * as Sc from './Tag.styled';\nimport { getTagIconColor } from './themes';\n\nexport const Tag = ({\n\ttagText,\n\tLeadingIcon,\n\tTrailingIcon,\n\tonLeadingIconClicked = undefined,\n\tleadingIconId,\n\ttrailingIconId,\n\tonTrailingIconClicked = undefined,\n\ttheme = 'light',\n\ttype = 'neutral',\n\tvariant = 'regular',\n\tversion,\n\tcursor,\n\talignIcon,\n\tnoBorder,\n\ttagHtmlText,\n\tcontentPadding,\n\tpadding,\n\theight,\n\tleadingIconTooltip,\n\ttrailingIconTooltip,\n\ttagColor,\n\tnumberOfLines,\n\tbackgroundColor,\n\tborderRadius,\n\tsize = 'regular',\n\thoverBackgroundColor,\n}: TagProps) => {\n\tlet displayTagText = tagText;\n\tconst displayTheme = theme;\n\tlet displayType = type;\n\n\tif (!ValidTagTypeMap[variant][type]) {\n\t\tdisplayType = 'neutral';\n\t}\n\n\tif (variant === 'circle') {\n\t\tif (typeof displayTagText === 'number' && displayTagText > 99) {\n\t\t\tdisplayTagText = '99+';\n\t\t}\n\t}\n\n\tconst iconColor = getTagIconColor(theme, displayType);\n\tconst iconProps = {\n\t\theight: variant === 'compressed' ? 12 : 16,\n\t\twidth: variant === 'compressed' ? 12 : 16,\n\t\tcolor: iconColor,\n\t\tstyle: { display: 'block' },\n\t};\n\n\treturn (\n\t\t<Sc.Tag\n\t\t\tcursor={cursor}\n\t\t\ttheme={displayTheme}\n\t\t\ttype={displayType}\n\t\t\tvariant={variant}\n\t\t\tversion={version}\n\t\t\talignIcon={alignIcon}\n\t\t\tnoBorder={noBorder}\n\t\t\tcontentPadding={contentPadding}\n\t\t\tpadding={padding}\n\t\t\theight={height}\n\t\t\tbackgroundColor={backgroundColor}\n\t\t\tborderRadius={borderRadius}\n\t\t\tsize={size}\n\t\t\thoverBackgroundColor={hoverBackgroundColor}\n\t\t>\n\t\t\t<div className=\"container\">\n\t\t\t\t{LeadingIcon &&\n\t\t\t\t\t(leadingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...leadingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\n\t\t\t\t{tagHtmlText &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{!tagHtmlText &&\n\t\t\t\t\tdisplayTagText !== '' &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{TrailingIcon &&\n\t\t\t\t\t(trailingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...trailingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\t\t\t</div>\n\t\t</Sc.Tag>\n\t);\n};\n\nTag.displayName = 'Tag';\n"],"names":["Tag","tagText","LeadingIcon","TrailingIcon","onLeadingIconClicked","leadingIconId","trailingIconId","onTrailingIconClicked","theme","type","variant","version","cursor","alignIcon","noBorder","tagHtmlText","contentPadding","padding","height","leadingIconTooltip","trailingIconTooltip","tagColor","numberOfLines","backgroundColor","borderRadius","size","hoverBackgroundColor","displayTagText","displayTheme","displayType","ValidTagTypeMap","iconColor","getTagIconColor","iconProps","jsx","Sc.Tag","jsxs","Tooltip","React","AiBodyTiny","AiBodyCaption","BodyTiny","BodyCaption"],"mappings":"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"}

package/dist/cjs/components/tag/Tag.styled.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),t=require("./themes.js"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=i(a),n=d.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),t=require("./themes.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=a(i),n=d.default.div`
 	cursor: ${e=>e.cursor??"default"};
 	${e=>e.size!=="small"&&(e.variant==="regular"?`display: block;
 		     min-height: 26px;
@@ -6,17 +6,17 @@
 	.container {
 		display: flex;
 		align-items: ${e=>e.alignIcon?e.alignIcon:"center"};
-		gap: ${e=>e.gap??6}px;
+		gap: 6px;
 		${e=>e.height?`height: ${e.height}px; box-sizing: border-box;`:e.size==="small"?"height: 16px; box-sizing: border-box;":""}
 		padding: ${e=>e.padding?e.padding:e.size==="small"?"2px 6px":e.contentPadding?`${e.contentPadding}px`:t.getPadding(e.variant)};
 		background: ${e=>e.backgroundColor??t.getBackgroundColor(e.theme,e.type)};
 
 		border-radius: ${e=>e.borderRadius!==void 0?typeof e.borderRadius=="number"?`${e.borderRadius}px`:e.borderRadius:e.variant==="regular"?"4px":"12px"};
 
-		${e=>!e.noBorder&&e.theme==="light"&&`border: ${e.version==="2.0"?.5:1}px ${e.borderStyle??"solid"} ${t.generateBorder(e.type,e.theme)};`}
+		${e=>!e.noBorder&&e.theme==="light"&&`border: ${e.version==="2.0"?.5:1}px solid ${t.generateBorder(e.type,e.theme)};`}
 
 		.text {
-			color: ${e=>e.tagColor??t.getTextColor(e.theme,e.type)};
+			color: ${e=>t.getTextColor(e.theme,e.type)};
 		}
 
 		.icon-trailing {

package/dist/cjs/components/tag/Tag.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.styled.js","sources":["../../../../src/components/tag/Tag.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { TagTheme, TagType, TagVariant } from './model';\nimport {\n\tgenerateBorder,\n\tgetBackgroundColor,\n\tgetPadding,\n\tgetTextColor,\n} from './themes';\n\nexport const Tag = styled.div<{\n\ttheme: TagTheme;\n\ttype: TagType;\n\tvariant: TagVariant;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tcursor?: string;\n\talignIcon?: string;\n\tnoBorder?: boolean;\n\tcontentPadding?: number;\n\tpadding?: string;\n\theight?: number;\n\tbackgroundColor?: string;\n\tborderRadius?: string | number;\n\tsize?: 'regular' | 'small';\n\tborderStyle?: 'solid' | 'dashed';\n\tgap?: number;\n\ttagColor?: string;\n\thoverBackgroundColor?: string;\n}>`\n\tcursor: ${(props) => props.cursor ?? 'default'};\n\t${(props) =>\n\t\tprops.size !== 'small' &&\n\t\t(props.variant === 'regular'\n\t\t\t? `display: block;\n\t\t     min-height: 26px;\n\t\t`\n\t\t\t: `min-height: 20px;`)}\n\t.container {\n\t\tdisplay: flex;\n\t\talign-items: ${(props) => (props.alignIcon ? props.alignIcon : 'center')};\n\t\tgap: ${(props) => props.gap ?? 6}px;\n\t\t${(props) =>\n\t\t\tprops.height\n\t\t\t\t? `height: ${props.height}px; box-sizing: border-box;`\n\t\t\t\t: props.size === 'small'\n\t\t\t\t? 'height: 16px; box-sizing: border-box;'\n\t\t\t\t: ''}\n\t\tpadding: ${(props) =>\n\t\t\tprops.padding\n\t\t\t\t? props.padding\n\t\t\t\t: props.size === 'small'\n\t\t\t\t? '2px 6px'\n\t\t\t\t: props.contentPadding\n\t\t\t\t? `${props.contentPadding}px`\n\t\t\t\t: getPadding(props.variant)};\n\t\tbackground: ${(props) =>\n\t\t\tprops.backgroundColor ?? getBackgroundColor(props.theme, props.type)};\n\n\t\tborder-radius: ${(props) =>\n\t\t\tprops.borderRadius !== undefined\n\t\t\t\t? typeof props.borderRadius === 'number'\n\t\t\t\t\t? `${props.borderRadius}px`\n\t\t\t\t\t: props.borderRadius\n\t\t\t\t: props.variant === 'regular'\n\t\t\t\t? '4px'\n\t\t\t\t: '12px'};\n\n\t\t${(props) =>\n\t\t\t!props.noBorder &&\n\t\t\tprops.theme === 'light' &&\n\t\t\t`border: ${props.version === '2.0' ? 0.5 : 1}px ${\n\t\t\t\tprops.borderStyle ?? 'solid'\n\t\t\t} ${generateBorder(props.type, props.theme)};`}\n\n\t\t.text {\n\t\t\tcolor: ${(props) =>\n\t\t\t\tprops.tagColor ?? getTextColor(props.theme, props.type)};\n\t\t}\n\n\t\t.icon-trailing {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t.icon-leading {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t${(props) =>\n\t\t\tprops.hoverBackgroundColor &&\n\t\t\t`&:hover {\n\t\t\t\tbackground: ${props.hoverBackgroundColor};\n\t\t\t}`}\n\t}\n`;\n"],"names":["Tag","styled","props","getPadding","getBackgroundColor","generateBorder","getTextColor"],"mappings":"6MASaA,EAAMC,EAAAA,QAAO;AAAA,WAmBdC,GAAUA,EAAM,QAAU,SAAS;AAAA,GAC3CA,GACFA,EAAM,OAAS,UACdA,EAAM,UAAY,UAChB;AAAA;AAAA,IAGA,oBAAoB;AAAA;AAAA;AAAA,iBAGPA,GAAWA,EAAM,UAAYA,EAAM,UAAY,QAAS;AAAA,SAChEA,GAAUA,EAAM,KAAO,CAAC;AAAA,IAC7BA,GACFA,EAAM,OACH,WAAWA,EAAM,MAAM,8BACvBA,EAAM,OAAS,QACf,wCACA,EAAE;AAAA,aACMA,GACXA,EAAM,QACHA,EAAM,QACNA,EAAM,OAAS,QACf,UACAA,EAAM,eACN,GAAGA,EAAM,cAAc,KACvBC,EAAAA,WAAWD,EAAM,OAAO,CAAC;AAAA,gBACdA,GACdA,EAAM,iBAAmBE,EAAAA,mBAAmBF,EAAM,MAAOA,EAAM,IAAI,CAAC;AAAA;AAAA,mBAEnDA,GACjBA,EAAM,eAAiB,OACpB,OAAOA,EAAM,cAAiB,SAC7B,GAAGA,EAAM,YAAY,KACrBA,EAAM,aACPA,EAAM,UAAY,UAClB,MACA,MAAM;AAAA;AAAA,IAEPA,GACF,CAACA,EAAM,UACPA,EAAM,QAAU,SAChB,WAAWA,EAAM,UAAY,MAAQ,GAAM,CAAC,MAC3CA,EAAM,aAAe,OACtB,IAAIG,iBAAeH,EAAM,KAAMA,EAAM,KAAK,CAAC,GAAG;AAAA;AAAA;AAAA,YAGpCA,GACTA,EAAM,UAAYI,EAAAA,aAAaJ,EAAM,MAAOA,EAAM,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAatDA,GACFA,EAAM,sBACN;AAAA,kBACeA,EAAM,oBAAoB;AAAA,KACvC;AAAA;AAAA"}
+{"version":3,"file":"Tag.styled.js","sources":["../../../../src/components/tag/Tag.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { TagTheme, TagType, TagVariant } from './model';\nimport {\n\tgenerateBorder,\n\tgetBackgroundColor,\n\tgetPadding,\n\tgetTextColor,\n} from './themes';\n\nexport const Tag = styled.div<{\n\ttheme: TagTheme;\n\ttype: TagType;\n\tvariant: TagVariant;\n\tversion?: '1.0' | '2.0' | '3.0';\n\tcursor?: string;\n\talignIcon?: string;\n\tnoBorder?: boolean;\n\tcontentPadding?: number;\n\tpadding?: string;\n\theight?: number;\n\tbackgroundColor?: string;\n\tborderRadius?: string | number;\n\tsize?: 'regular' | 'small';\n\thoverBackgroundColor?: string;\n}>`\n\tcursor: ${(props) => props.cursor ?? 'default'};\n\t${(props) =>\n\t\tprops.size !== 'small' &&\n\t\t(props.variant === 'regular'\n\t\t\t? `display: block;\n\t\t     min-height: 26px;\n\t\t`\n\t\t\t: `min-height: 20px;`)}\n\t.container {\n\t\tdisplay: flex;\n\t\talign-items: ${(props) => (props.alignIcon ? props.alignIcon : 'center')};\n\t\tgap: 6px;\n\t\t${(props) =>\n\t\t\tprops.height\n\t\t\t\t? `height: ${props.height}px; box-sizing: border-box;`\n\t\t\t\t: props.size === 'small'\n\t\t\t\t? 'height: 16px; box-sizing: border-box;'\n\t\t\t\t: ''}\n\t\tpadding: ${(props) =>\n\t\t\tprops.padding\n\t\t\t\t? props.padding\n\t\t\t\t: props.size === 'small'\n\t\t\t\t? '2px 6px'\n\t\t\t\t: props.contentPadding\n\t\t\t\t? `${props.contentPadding}px`\n\t\t\t\t: getPadding(props.variant)};\n\t\tbackground: ${(props) =>\n\t\t\tprops.backgroundColor ?? getBackgroundColor(props.theme, props.type)};\n\n\t\tborder-radius: ${(props) =>\n\t\t\tprops.borderRadius !== undefined\n\t\t\t\t? typeof props.borderRadius === 'number'\n\t\t\t\t\t? `${props.borderRadius}px`\n\t\t\t\t\t: props.borderRadius\n\t\t\t\t: props.variant === 'regular'\n\t\t\t\t? '4px'\n\t\t\t\t: '12px'};\n\n\t\t${(props) =>\n\t\t\t!props.noBorder &&\n\t\t\tprops.theme === 'light' &&\n\t\t\t`border: ${props.version === '2.0' ? 0.5 : 1}px solid ${generateBorder(\n\t\t\t\tprops.type,\n\t\t\t\tprops.theme,\n\t\t\t)};`}\n\n\t\t.text {\n\t\t\tcolor: ${(props) => getTextColor(props.theme, props.type)};\n\t\t}\n\n\t\t.icon-trailing {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t.icon-leading {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t${(props) =>\n\t\t\tprops.hoverBackgroundColor &&\n\t\t\t`&:hover {\n\t\t\t\tbackground: ${props.hoverBackgroundColor};\n\t\t\t}`}\n\t}\n`;\n"],"names":["Tag","styled","props","getPadding","getBackgroundColor","generateBorder","getTextColor"],"mappings":"6MASaA,EAAMC,EAAAA,QAAO;AAAA,WAgBdC,GAAUA,EAAM,QAAU,SAAS;AAAA,GAC3CA,GACFA,EAAM,OAAS,UACdA,EAAM,UAAY,UAChB;AAAA;AAAA,IAGA,oBAAoB;AAAA;AAAA;AAAA,iBAGPA,GAAWA,EAAM,UAAYA,EAAM,UAAY,QAAS;AAAA;AAAA,IAErEA,GACFA,EAAM,OACH,WAAWA,EAAM,MAAM,8BACvBA,EAAM,OAAS,QACf,wCACA,EAAE;AAAA,aACMA,GACXA,EAAM,QACHA,EAAM,QACNA,EAAM,OAAS,QACf,UACAA,EAAM,eACN,GAAGA,EAAM,cAAc,KACvBC,EAAAA,WAAWD,EAAM,OAAO,CAAC;AAAA,gBACdA,GACdA,EAAM,iBAAmBE,EAAAA,mBAAmBF,EAAM,MAAOA,EAAM,IAAI,CAAC;AAAA;AAAA,mBAEnDA,GACjBA,EAAM,eAAiB,OACpB,OAAOA,EAAM,cAAiB,SAC7B,GAAGA,EAAM,YAAY,KACrBA,EAAM,aACPA,EAAM,UAAY,UAClB,MACA,MAAM;AAAA;AAAA,IAEPA,GACF,CAACA,EAAM,UACPA,EAAM,QAAU,SAChB,WAAWA,EAAM,UAAY,MAAQ,GAAM,CAAC,YAAYG,EAAAA,eACvDH,EAAM,KACNA,EAAM,KACP,CAAC,GAAG;AAAA;AAAA;AAAA,YAGMA,GAAUI,eAAaJ,EAAM,MAAOA,EAAM,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAavDA,GACFA,EAAM,sBACN;AAAA,kBACeA,EAAM,oBAAoB;AAAA,KACvC;AAAA;AAAA"}

package/dist/cjs/components/tag/model.js.map

@@ -1 +1 @@
-{"version":3,"file":"model.js","sources":["../../../../src/components/tag/model.ts"],"sourcesContent":["import React from 'react';\nimport { MouseEventHandler } from 'react';\nimport { TooltipProps } from '../tooltips/Tooltip';\n\nexport type TagTheme = 'light' | 'dark';\n\nexport type TagVariant = 'regular' | 'circle' | 'compressed';\n\nexport type TagType =\n\t| 'negative'\n\t| 'warning'\n\t| 'positive'\n\t| 'neutral'\n\t| 'white'\n\t| 'purple'\n\t| 'blue'\n\t| 'grey'\n\t| 'ai';\n\nexport const ValidTagTypeMap = {\n\tregular: {\n\t\tnegative: true,\n\t\twarning: true,\n\t\tpositive: true,\n\t\tneutral: true,\n\t\twhite: true,\n\t\tpurple: true,\n\t\tblue: true,\n\t\tai: true,\n\t},\n\tcircle: {\n\t\tnegative: true,\n\t\twarning: true,\n\t\tpositive: true,\n\t\tneutral: true,\n\t\tblue: true,\n\t\tgrey: true,\n\t\tai: true,\n\t},\n\tcompressed: {\n\t\tnegative: true,\n\t\twarning: true,\n\t\tpositive: true,\n\t\tneutral: true,\n\t\twhite: true,\n\t\tpurple: true,\n\t\tblue: true,\n\t\tai: true,\n\t},\n};\n\nexport interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {\n\t/**\n\t * Set the theme of the Tag\n\t * @default default light\n\t */\n\ttheme?: TagTheme;\n\n\t/**\n\t * Set the color of the Tag\n\t * @default default neutral\n\t */\n\ttype?: TagType;\n\n\t/**\n\t * Set the color of the Tag\n\t * @default default regular\n\t */\n\tvariant?: TagVariant;\n\n\t/**\n\t * The icon component that is the right of the text\n\t * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react\n\t * @default undefined\n\t */\n\tTrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\t/**\n\t * The right icon id,\n\t * @default trailing-icon\n\t */\n\ttrailingIconId?: string;\n\t/**\n\t * The right icon on click event, defaults to () => {}\n\t */\n\tonTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;\n\t/**\n\t * Tooltip props for the trailing icon\n\t * @default undefined\n\t */\n\ttrailingIconTooltip?: Omit<TooltipProps, 'children'>;\n\n\t/**\n\t * The icon component that is to the left of the text\n\t * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react\n\t * @default undefined\n\t */\n\tLeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\t/**\n\t * The right icon on click event, defaults to () => {}\n\t */\n\tonLeadingIconClicked?: MouseEventHandler<HTMLButtonElement>;\n\t/**\n\t * The left icon id,\n\t * @default leading-icon\n\t */\n\tleadingIconId?: string;\n\t/**\n\t * Tooltip props for the leading icon\n\t * @default undefined\n\t */\n\tleadingIconTooltip?: Omit<TooltipProps, 'children'>;\n\n\ttagText: string | number;\n\tversion?: '1.0' | '2.0' | '3.0';\n\t/** Custom CSS padding string, e.g. '4px 8px' */\n\tpadding?: string;\n\t/** Custom height in px */\n\theight?: number;\n\tcursor?: string;\n\talignIcon?: string;\n\tnoBorder?: boolean;\n\ttagHtmlText?: JSX.Element;\n\tcontentPadding?: number;\n\ttagColor?: string;\n\tnumberOfLines?: number;\n\t/**\n\t * Override the computed background color of the tag container.\n\t * @default undefined (uses theme/type color)\n\t */\n\tbackgroundColor?: string;\n\t/**\n\t * Override the border-radius of the tag container.\n\t * @default undefined (uses variant-based radius: 4px for regular, 12px otherwise)\n\t */\n\tborderRadius?: string | number;\n\t/**\n\t * Controls the size of the tag. 'small' sets height to 16px and uses tiny font.\n\t * @default 'regular'\n\t */\n\tsize?: 'regular' | 'small';\n\t/**\n\t * Border style of the tag container. 'dashed' marks an action that is not\n\t * configured yet, e.g. an \"Add custom\" affordance.\n\t * @default 'solid'\n\t */\n\tborderStyle?: 'solid' | 'dashed';\n\t/**\n\t * Gap in px between the leading icon, text and trailing icon.\n\t * @default 6\n\t */\n\tgap?: number;\n\t/**\n\t * Background color on hover.\n\t * @default undefined (no hover effect)\n\t */\n\thoverBackgroundColor?: string;\n}\n"],"names":["ValidTagTypeMap"],"mappings":"gFAmBO,MAAMA,EAAkB,CAC9B,QAAS,CACR,SAAU,GACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,MAAO,GACP,OAAQ,GACR,KAAM,GACN,GAAI,EAAA,EAEL,OAAQ,CACP,SAAU,GACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,KAAM,GACN,KAAM,GACN,GAAI,EAAA,EAEL,WAAY,CACX,SAAU,GACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,MAAO,GACP,OAAQ,GACR,KAAM,GACN,GAAI,EAAA,CAEN"}
+{"version":3,"file":"model.js","sources":["../../../../src/components/tag/model.ts"],"sourcesContent":["import React from 'react';\nimport { MouseEventHandler } from 'react';\nimport { TooltipProps } from '../tooltips/Tooltip';\n\nexport type TagTheme = 'light' | 'dark';\n\nexport type TagVariant = 'regular' | 'circle' | 'compressed';\n\nexport type TagType =\n\t| 'negative'\n\t| 'warning'\n\t| 'positive'\n\t| 'neutral'\n\t| 'white'\n\t| 'purple'\n\t| 'blue'\n\t| 'grey'\n\t| 'ai';\n\nexport const ValidTagTypeMap = {\n\tregular: {\n\t\tnegative: true,\n\t\twarning: true,\n\t\tpositive: true,\n\t\tneutral: true,\n\t\twhite: true,\n\t\tpurple: true,\n\t\tblue: true,\n\t\tai: true,\n\t},\n\tcircle: {\n\t\tnegative: true,\n\t\twarning: true,\n\t\tpositive: true,\n\t\tneutral: true,\n\t\tblue: true,\n\t\tgrey: true,\n\t\tai: true,\n\t},\n\tcompressed: {\n\t\tnegative: true,\n\t\twarning: true,\n\t\tpositive: true,\n\t\tneutral: true,\n\t\twhite: true,\n\t\tpurple: true,\n\t\tblue: true,\n\t\tai: true,\n\t},\n};\n\nexport interface TagProps extends React.BaseHTMLAttributes<HTMLDivElement> {\n\t/**\n\t * Set the theme of the Tag\n\t * @default default light\n\t */\n\ttheme?: TagTheme;\n\n\t/**\n\t * Set the color of the Tag\n\t * @default default neutral\n\t */\n\ttype?: TagType;\n\n\t/**\n\t * Set the color of the Tag\n\t * @default default regular\n\t */\n\tvariant?: TagVariant;\n\n\t/**\n\t * The icon component that is the right of the text\n\t * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react\n\t * @default undefined\n\t */\n\tTrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\t/**\n\t * The right icon id,\n\t * @default trailing-icon\n\t */\n\ttrailingIconId?: string;\n\t/**\n\t * The right icon on click event, defaults to () => {}\n\t */\n\tonTrailingIconClicked?: MouseEventHandler<HTMLButtonElement>;\n\t/**\n\t * Tooltip props for the trailing icon\n\t * @default undefined\n\t */\n\ttrailingIconTooltip?: Omit<TooltipProps, 'children'>;\n\n\t/**\n\t * The icon component that is to the left of the text\n\t * Referred to https://ozzie.sh/passing-icons-as-props-in-a-consistent-way-using-react\n\t * @default undefined\n\t */\n\tLeadingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\t/**\n\t * The right icon on click event, defaults to () => {}\n\t */\n\tonLeadingIconClicked?: MouseEventHandler<HTMLButtonElement>;\n\t/**\n\t * The left icon id,\n\t * @default leading-icon\n\t */\n\tleadingIconId?: string;\n\t/**\n\t * Tooltip props for the leading icon\n\t * @default undefined\n\t */\n\tleadingIconTooltip?: Omit<TooltipProps, 'children'>;\n\n\ttagText: string | number;\n\tversion?: '1.0' | '2.0' | '3.0';\n\t/** Custom CSS padding string, e.g. '4px 8px' */\n\tpadding?: string;\n\t/** Custom height in px */\n\theight?: number;\n\tcursor?: string;\n\talignIcon?: string;\n\tnoBorder?: boolean;\n\ttagHtmlText?: JSX.Element;\n\tcontentPadding?: number;\n\ttagColor?: string;\n\tnumberOfLines?: number;\n\t/**\n\t * Override the computed background color of the tag container.\n\t * @default undefined (uses theme/type color)\n\t */\n\tbackgroundColor?: string;\n\t/**\n\t * Override the border-radius of the tag container.\n\t * @default undefined (uses variant-based radius: 4px for regular, 12px otherwise)\n\t */\n\tborderRadius?: string | number;\n\t/**\n\t * Controls the size of the tag. 'small' sets height to 16px and uses tiny font.\n\t * @default 'regular'\n\t */\n\tsize?: 'regular' | 'small';\n\t/**\n\t * Background color on hover.\n\t * @default undefined (no hover effect)\n\t */\n\thoverBackgroundColor?: string;\n}\n"],"names":["ValidTagTypeMap"],"mappings":"gFAmBO,MAAMA,EAAkB,CAC9B,QAAS,CACR,SAAU,GACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,MAAO,GACP,OAAQ,GACR,KAAM,GACN,GAAI,EAAA,EAEL,OAAQ,CACP,SAAU,GACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,KAAM,GACN,KAAM,GACN,GAAI,EAAA,EAEL,WAAY,CACX,SAAU,GACV,QAAS,GACT,SAAU,GACV,QAAS,GACT,MAAO,GACP,OAAQ,GACR,KAAM,GACN,GAAI,EAAA,CAEN"}