@getmicdrop/venue-calendar 4.3.121 → 4.3.123
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +22 -0
- package/dist/{AddOnCard-jj59e855.js → AddOnCard-nTlOLRHQ.js} +21 -21
- package/dist/{ArrowLeftIcon-t-CY0sbi.js → ArrowLeftIcon-D5-uNI0U.js} +2 -2
- package/dist/{BlockPlaceholder-BmEZ68_q.js → BlockPlaceholder-CuoGXCMh.js} +4 -4
- package/dist/{Button-VUB2WJ88.js → Button-BLmw_oMF.js} +11 -11
- package/dist/{Button-B58iYo_t.js → Button-DoHESV6k.js} +5 -5
- package/dist/{Calendar-hxcQBkTF.js → Calendar-C9hahXIM.js} +142 -161
- package/dist/{CalendarFoundryView-CSAKDe-F.js → CalendarFoundryView-Cv-ICYi9.js} +1475 -1473
- package/dist/{CalendarIcon-B5JWs0gm.js → CalendarIcon-5pe0K5ma.js} +2 -2
- package/dist/{CartView-CF2y1JDa.js → CartView-CXp67TQT.js} +287 -284
- package/dist/{ChartBlock-SYOAO1s_.js → ChartBlock-VVDwIPue.js} +36 -36
- package/dist/{CheckIcon-BSwoGox7.js → CheckIcon-FxQwEejD.js} +2 -2
- package/dist/{Checkbox-BtJwg_CF.js → Checkbox-Cn1nEBOm.js} +1 -1
- package/dist/{Checkout-2h2K3-bE.js → Checkout-BOftqs3v.js} +383 -381
- package/dist/Checkout-DQrcjCeh.js +1934 -0
- package/dist/{CheckoutTimer-Bpt5gPyA.js → CheckoutTimer-DPuy8TpI.js} +7 -7
- package/dist/{ChevronDownIcon-CVZ0usBx.js → ChevronDownIcon-ADsji-Ia.js} +2 -2
- package/dist/{ChevronDownOutline-D7YDiKBF.js → ChevronDownOutline-CAboOQwi.js} +1 -1
- package/dist/ChevronRightOutline-BWIIgG7O.js +23 -0
- package/dist/{CloseIcon-DUnvWXUY.js → CloseIcon-BgvYIos-.js} +3 -3
- package/dist/{CloseOutline-qpVa62mu.js → CloseOutline-BJtQbSqD.js} +1 -1
- package/dist/{CollectionView-XdNMvMtn.js → CollectionView-Ds3iGZYx.js} +8 -8
- package/dist/{CropImage-C8W_Xb_V.js → CropImage-Cvl-yxAB.js} +15 -15
- package/dist/{EmptyState-CMFePII9.js → EmptyState-BXE5HfzR.js} +2 -2
- package/dist/{Event-B_9T21du.js → Event-C8Y3zpPM.js} +620 -534
- package/dist/EventCard-DGnCiMw9.js +175 -0
- package/dist/{EventPage-BMnKpciU.js → EventPage-DjP9llB-.js} +294 -270
- package/dist/{ExclamationCircleOutline-D3XbhOwM.js → ExclamationCircleOutline-CmH69h0L.js} +1 -1
- package/dist/{action-test-id-7RXdHucW.js → FallbackBlock-C_-N8OKB.js} +72 -72
- package/dist/{Grid-kuP6V0GW.js → Grid-BKWXQEkM.js} +2 -2
- package/dist/{Heading-vOVPxhJF.js → Heading-CrJEsrFE.js} +4 -4
- package/dist/{Input-BXZmvQ0p.js → Input-komF5aTV.js} +10 -10
- package/dist/{LiveRegion-D9Me4kBs.js → LiveRegion-B_OI5McX.js} +2 -2
- package/dist/{LocationIcon-E-7CQh4E.js → LocationIcon-D7SbJ6q_.js} +3 -3
- package/dist/{Modal-kG0LKgMZ.js → Modal-_a_bJbko.js} +3 -3
- package/dist/{ModalFooter-CM5RDuvB.js → ModalFooter-CJPDF8Zl.js} +15 -15
- package/dist/{ModalHeader-DBVXezSL.js → ModalHeader-B3K9xN0J.js} +3 -3
- package/dist/{PasswordInput-DzXNIwRc.js → PasswordInput-C-SJ5Oix.js} +7 -7
- package/dist/{PhoneInput-DnmN_L03.js → PhoneInput-CYg7S7S7.js} +13 -13
- package/dist/{RecommendationsRail-DrzM8h2r.js → RecommendationsRail-QP0CJ7-3.js} +71 -68
- package/dist/{ScarcityBadge-DjzrzvId.js → ScarcityBadge-Cawy-u79.js} +7 -7
- package/dist/{SeriesPage-Ds_FEEZW.js → SeriesPage-BXLOd-gT.js} +3 -3
- package/dist/{Spinner-B2rdbspc.js → Spinner-DMSIvUd3.js} +3 -3
- package/dist/{Success-Dkak0iM9.js → Success-DCJLQx8J.js} +178 -175
- package/dist/{TagIcon-BY8tK_qA.js → TagIcon-CwCUhnam.js} +2 -2
- package/dist/{Text-CqjLjIF8.js → Text-uKiMcqy6.js} +1 -1
- package/dist/{Textarea-Cymhixzd.js → Textarea-DHm4GHH9.js} +3 -3
- package/dist/{ViewTicketsEmbed-B_fqalQh.js → ViewTicketsEmbed-Cblb2S6M.js} +24 -23
- package/dist/{WarningCircleIcon-C5Lc7qkF.js → WarningCircleIcon-ClRHaffl.js} +4 -4
- package/dist/{WarningTriIcon-BM8qc9xx.js → WarningTriIcon-zhqOKjq8.js} +2 -2
- package/dist/adapter-DwqQNwIc.js +164 -0
- package/dist/api--R8K0DjS.js +489 -0
- package/dist/{browser-DxdP6IWt.js → browser-o9TsPy0d.js} +1 -1
- package/dist/checkoutState-BtNPT28I.js +198 -0
- package/dist/client-CS0e2JHE.js +262 -0
- package/dist/{constants-C6MZgb2S.js → constants-lKAMwRvZ.js} +5 -1
- package/dist/{controlAria-CGb-KeRn.js → controlAria-DSrMfxwY.js} +2 -2
- package/dist/{copyToClipboard-F-akSgaF.js → copyToClipboard-198pSFq9.js} +3 -3
- package/dist/{createErrorGate.svelte-CEGaIQeI.js → createErrorGate.svelte-D96YnnB4.js} +5 -5
- package/dist/cta-bYAHgtET.js +116 -0
- package/dist/{datetime-BnKG6Hjm.js → datetime-B0mHwpmb.js} +53 -53
- package/dist/{de-BHcAXwnM.js → de-C3szl-Vf.js} +10 -4
- package/dist/{de-BPmqZ6ao.js → de-CX7o2WAr.js} +5 -1
- package/dist/{defaultLabels-BbNEEsF7.js → defaultLabels-C8IfDtR9.js} +210 -240
- package/dist/{defaults-CgsFJvJ2.js → defaults-vPJmFph1.js} +7 -7
- package/dist/{dist-bwbfGPKR.js → dist-xFB1K0Ua.js} +2 -2
- package/dist/{es-BV3Sgeg-.js → es-DS1-fjU8.js} +5 -1
- package/dist/{es-DZ3yceh-.js → es-QnJXFKEx.js} +10 -4
- package/dist/{event-DfqUhl5j.js → event-Cn1I6eqc.js} +2 -2
- package/dist/{event-transform-Bk1IoYh5.js → event-transform-DqzYVPvy.js} +18 -18
- package/dist/{eventStatusStream-CE0PwO0c.js → eventStatusStream-D27L0zB8.js} +2 -2
- package/dist/{filepond-plugin-file-validate-size-DNnItZ84.js → filepond-plugin-file-validate-size-DSfmFeGz.js} +1 -1
- package/dist/{filepond-plugin-file-validate-type-CUMTkI8X.js → filepond-plugin-file-validate-type-C44EKcE7.js} +1 -1
- package/dist/{filepond-plugin-image-exif-orientation-GEwHZTBU.js → filepond-plugin-image-exif-orientation-DNdFnriO.js} +1 -1
- package/dist/{filepond-plugin-image-preview-DKfgAnVa.js → filepond-plugin-image-preview-BVewVSQZ.js} +1 -1
- package/dist/{floatingPosition-XIv5DYuP.js → floatingPosition-TQ0h6TbT.js} +6 -6
- package/dist/{fr-Dyi163Vk.js → fr-BVgQDC6c.js} +10 -4
- package/dist/{fr-BJ0VQGEj.js → fr-CN3PiNzU.js} +5 -1
- package/dist/{href-CfWGAmkP.js → href-Cl_PNVlB.js} +24 -24
- package/dist/i18n-BsgEaeHp.js +497 -0
- package/dist/i18n-SDe3ZEhB.js +28 -0
- package/dist/{id-CVXaHHqU.js → id-CPG4tPVY.js} +5 -1
- package/dist/{id-DvFRZVAm.js → id-DCcXxLEY.js} +10 -4
- package/dist/{imageOptimizer-B3fj8_30.js → imageOptimizer-C8racBby.js} +11 -11
- package/dist/{imageUrl-xyMedKrE.js → imageUrl-ClaMf08i.js} +1 -1
- package/dist/{it-C0lzsHje.js → it-CjwnCYFF.js} +5 -1
- package/dist/{it-Bh05tcLv.js → it-CufAwhe3.js} +10 -4
- package/dist/{ja-Dl2r6tQ6.js → ja-C2uiNCJX.js} +5 -1
- package/dist/{ja-CU4PQS4j.js → ja-CMa_nsLY.js} +10 -4
- package/dist/{keyboard-DhCcdIyh.js → keyboard-enDXh6xy.js} +4 -4
- package/dist/{ko-DINqFSE1.js → ko-Bh97byDf.js} +5 -1
- package/dist/{ko-DDk6EdWm.js → ko-BwJHUjqS.js} +10 -4
- package/dist/{lazyOnce-CCfEO1xG.js → lazyOnce-BL5svIPP.js} +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/de.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/es.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/fr.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/id.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/it.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/ja.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/ko.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/nl.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/pl.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/pt-br.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/tr.js +1 -1
- package/dist/locales/{4.3.121 → 4.3.123}/flow/zh.js +1 -1
- package/dist/locales/4.3.123/main/de.js +1 -0
- package/dist/locales/4.3.123/main/es.js +1 -0
- package/dist/locales/4.3.123/main/fr.js +1 -0
- package/dist/locales/4.3.123/main/id.js +1 -0
- package/dist/locales/4.3.123/main/it.js +1 -0
- package/dist/locales/4.3.123/main/ja.js +1 -0
- package/dist/locales/4.3.123/main/ko.js +1 -0
- package/dist/locales/4.3.123/main/nl.js +1 -0
- package/dist/locales/4.3.123/main/pl.js +1 -0
- package/dist/locales/4.3.123/main/pt-br.js +1 -0
- package/dist/locales/4.3.123/main/tr.js +1 -0
- package/dist/locales/4.3.123/main/zh.js +1 -0
- package/dist/look-island.svelte-Dr-Vl_J1.js +1279 -0
- package/dist/looks/4.3.123/looks.js +226 -0
- package/dist/looks/4.3.123/micdrop-wordmark-BYMG6vLR.svg +1 -0
- package/dist/looks/4.3.123/microphone-Ccv4r-kd.webp +0 -0
- package/dist/looks/4.3.123/superuser-CZF6a5gO.webp +0 -0
- package/dist/looks/4.3.123/treasury-DUE7lZzT.webp +0 -0
- package/dist/looks/4.3.123/user-image-yuS4errP.svg +9 -0
- package/dist/{modalManager.svelte-Cz_6x1Qd.js → modalManager.svelte-BUU99uSO.js} +1 -1
- package/dist/navigation-DlpJzq1c.js +176 -0
- package/dist/{nl-DOSKYHSx.js → nl-BQALrtyB.js} +10 -4
- package/dist/{nl-D92n5tHa.js → nl-ve_OaXOQ.js} +5 -1
- package/dist/normalizers-B8Ruvrlh.js +44 -0
- package/dist/{phoneUtils-CS66SHie.js → phoneUtils-CQvpvMDO.js} +50 -50
- package/dist/{pixels-Bu5-BISs.js → pixels-BZQYpQU0.js} +3 -3
- package/dist/{pl-BlZHcnlS.js → pl-BHBBOz2I.js} +5 -1
- package/dist/{pl-CkLEymA2.js → pl-DaPcPjBE.js} +10 -4
- package/dist/{portal-D-oaEWsY.js → portal-CLBp645_.js} +2 -2
- package/dist/{portalContainment-CeAVqIb-.js → portalContainment-Dz0y6lW6.js} +2 -2
- package/dist/{pt-br-BHuCQSM-.js → pt-br-BxdP86Vr.js} +10 -4
- package/dist/{pt-br-BrxthY0b.js → pt-br-D30dkLzU.js} +5 -1
- package/dist/seo/seo.mjs +9 -9
- package/dist/{serverTotals-B8SJCzxE.js → serverTotals-F3SRKn1I.js} +6 -6
- package/dist/{showcase-state-options-KO_TYk3I.js → showcase-state-options-DRCOUibv.js} +3 -3
- package/dist/{sizing-B7ixYndz.js → sizing-DFjg7-wy.js} +3 -3
- package/dist/{sortable.esm--ZtTTTPp.js → sortable.esm-RsK3eRs6.js} +1 -1
- package/dist/{src-DZgagYE3.js → src-DJtQCBFq.js} +1 -1
- package/dist/to-event-card-props-CBtlDgMr.js +205 -0
- package/dist/{tr-BnAdi4HO.js → tr-CFVBCuqV.js} +5 -1
- package/dist/{tr-Bvc34ODh.js → tr-CSfagpI3.js} +10 -4
- package/dist/types/index.d.ts +21 -4
- package/dist/utils-BXiwc_cU.js +219 -0
- package/dist/venue-calendar.css +1 -1
- package/dist/venue-calendar.es.js +1591 -1895
- package/dist/venue-calendar.iife.js +35 -35
- package/dist/venue-calendar.umd.js +175 -54
- package/dist/widget-key-context-litAkRgC.js +744 -0
- package/dist/{zh-K0hOzZ3G.js → zh-DWMcKVLH.js} +10 -4
- package/dist/{zh-Tg1OTvWs.js → zh-DeEOoOFR.js} +5 -1
- package/package.json +3 -3
- package/src/lib/theme.js +222 -222
- package/dist/Checkout-BFu5dTw_.js +0 -1933
- package/dist/api-BEYkGabB.js +0 -654
- package/dist/i18n-B705OXZp.js +0 -28
- package/dist/i18n-BoMUWcCq.js +0 -608
- package/dist/locales/4.3.121/main/de.js +0 -1
- package/dist/locales/4.3.121/main/es.js +0 -1
- package/dist/locales/4.3.121/main/fr.js +0 -1
- package/dist/locales/4.3.121/main/id.js +0 -1
- package/dist/locales/4.3.121/main/it.js +0 -1
- package/dist/locales/4.3.121/main/ja.js +0 -1
- package/dist/locales/4.3.121/main/ko.js +0 -1
- package/dist/locales/4.3.121/main/nl.js +0 -1
- package/dist/locales/4.3.121/main/pl.js +0 -1
- package/dist/locales/4.3.121/main/pt-br.js +0 -1
- package/dist/locales/4.3.121/main/tr.js +0 -1
- package/dist/locales/4.3.121/main/zh.js +0 -1
- package/dist/to-event-card-props-DYIfPN8e.js +0 -379
- package/dist/utils-NMx3aPDk.js +0 -412
- package/dist/widget-key-context-D2zj4sp5.js +0 -988
|
@@ -3,7 +3,6 @@ var e = {
|
|
|
3
3
|
viewList: "列表",
|
|
4
4
|
viewGallery: "画廊",
|
|
5
5
|
viewCalendar: "日历",
|
|
6
|
-
viewTonight: "今晚节目单",
|
|
7
6
|
searchPlaceholder: "搜索活动",
|
|
8
7
|
searchAriaLabel: "搜索活动",
|
|
9
8
|
listView: "列表视图",
|
|
@@ -94,7 +93,6 @@ var e = {
|
|
|
94
93
|
nextWeek: "下周",
|
|
95
94
|
comingUp: "即将上演",
|
|
96
95
|
noShowsTonight: "今晚暂无演出",
|
|
97
|
-
nextShow: "下一场演出",
|
|
98
96
|
noUpcomingShowsScheduled: "暂无近期演出安排",
|
|
99
97
|
nothingOn: "暂无安排",
|
|
100
98
|
noUpcomingEventsScheduled: "暂无近期活动安排",
|
|
@@ -473,9 +471,13 @@ var e = {
|
|
|
473
471
|
queueWaitLessThanMinute: "不到一分钟",
|
|
474
472
|
queueWaitMinute: "{n} 分钟",
|
|
475
473
|
queueWaitMinutes: "{n} 分钟",
|
|
476
|
-
queueKeepPageOpen: "
|
|
474
|
+
queueKeepPageOpen: "请保持此页面打开,关闭页面将放弃您的位置",
|
|
475
|
+
queueReleaseSpot: "放弃我的位置",
|
|
477
476
|
queueAdmittedTitle: "轮到您了",
|
|
478
477
|
queueAdmittedBody: "轮到您了,现在可以购票",
|
|
478
|
+
queuePassTimeLeft: "您还有{time}可以购票",
|
|
479
|
+
queuePassEndingSoon: "剩余不到一分钟,请立即购票",
|
|
480
|
+
queuePassExpired: "您的购票时间已过,现在购买将重新排队",
|
|
479
481
|
sessionExpiringSoonMessage: "您的结算会话将在 {time} 后超时,所选门票将被释放回库存",
|
|
480
482
|
extensionsRemaining: "剩余延长次数:{count}",
|
|
481
483
|
continueCheckout: "继续结算",
|
|
@@ -540,7 +542,11 @@ var e = {
|
|
|
540
542
|
giftCardPaymentDetails: "支付详情",
|
|
541
543
|
giftCardBack: "返回",
|
|
542
544
|
giftCardPayAmount: "支付 {amount}",
|
|
543
|
-
giftCardPaymentFailed: "支付失败,请重试"
|
|
545
|
+
giftCardPaymentFailed: "支付失败,请重试",
|
|
546
|
+
fromPrice: "{price} 起",
|
|
547
|
+
payWhatYouWant: "随心付",
|
|
548
|
+
onSaleOn: "{date} 开售",
|
|
549
|
+
showAtTime: "演出 {time}"
|
|
544
550
|
};
|
|
545
551
|
//#endregion
|
|
546
552
|
export { e as zh };
|
|
@@ -199,9 +199,13 @@ var e = {
|
|
|
199
199
|
queueWaitLessThanMinute: "不到一分钟",
|
|
200
200
|
queueWaitMinute: "{n} 分钟",
|
|
201
201
|
queueWaitMinutes: "{n} 分钟",
|
|
202
|
-
queueKeepPageOpen: "
|
|
202
|
+
queueKeepPageOpen: "请保持此页面打开,关闭页面将放弃您的位置",
|
|
203
|
+
queueReleaseSpot: "放弃我的位置",
|
|
203
204
|
queueAdmittedTitle: "轮到您了",
|
|
204
205
|
queueAdmittedBody: "轮到您了,现在可以购票",
|
|
206
|
+
queuePassTimeLeft: "您还有{time}可以购票",
|
|
207
|
+
queuePassEndingSoon: "剩余不到一分钟,请立即购票",
|
|
208
|
+
queuePassExpired: "您的购票时间已过,现在购买将重新排队",
|
|
205
209
|
recommendationsHeading: "该场地的更多演出",
|
|
206
210
|
recommendationFromTonightsLineup: "来自今晚的阵容",
|
|
207
211
|
recommendationSimilarShow: "相似演出",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@getmicdrop/venue-calendar",
|
|
3
3
|
"_version_comment": "4.1.55 was the last PUBLISHED version, and the tree carried 36 commits npm's 4.1.55 does not have — including the gate-password security fix and four money fixes. A filename must never reuse a version npm has taken (jsDelivr/unpkg cache the FIRST bytes they see under `@4.1.55` forever, so republishing that number ships the old widget to every venue that pinned it). Bumped to 4.2.0 here, BEFORE anything is built for publish. `npm run release:preflight` refuses to proceed when this number already exists in the registry.",
|
|
4
|
-
"version": "4.3.
|
|
4
|
+
"version": "4.3.123",
|
|
5
5
|
"description": "A customizable Svelte calendar component for displaying comedy events",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"types": "./dist/types/index.d.ts",
|
|
@@ -46,8 +46,8 @@
|
|
|
46
46
|
"scripts": {
|
|
47
47
|
"dev": "vite dev",
|
|
48
48
|
"build": "vite build",
|
|
49
|
-
"_build_lib_comment": "
|
|
50
|
-
"build:lib": "cross-env VC_IIFE_ONLY=1 vite build --config vite.config.lib.js && vite build --config vite.config.lib.js && vite build --config vite.config.locales.js",
|
|
49
|
+
"_build_lib_comment": "FOUR passes, and the order is load-bearing. (1) VC_IIFE_ONLY=1 builds the IIFE and is the ONLY pass with emptyOutDir on — it owns the dist wipe. (2) the default pass appends ES + UMD. (3) vite.config.locales.js appends the version-pinned locale chunks the IIFE fetches at runtime. (4) vite.config.looks.js appends the version-pinned looks bundle (dist/looks/<version>/looks.js) the IIFE fetches for a look-* view. Move the locales or looks pass earlier and it gets wiped by (1); give it emptyOutDir and it wipes the bundle it serves. Both failures are silent at build time and total at runtime, so scripts/size-guard.mjs asserts the IIFE and the locale tree coexist in dist.",
|
|
50
|
+
"build:lib": "cross-env VC_IIFE_ONLY=1 vite build --config vite.config.lib.js && vite build --config vite.config.lib.js && vite build --config vite.config.locales.js && vite build --config vite.config.looks.js",
|
|
51
51
|
"build:api": "vite build --config vite.config.api.js",
|
|
52
52
|
"build:seo": "vite build --config vite.config.seo.js",
|
|
53
53
|
"build:all": "npm run build:lib && npm run build:api && npm run build:seo",
|
package/src/lib/theme.js
CHANGED
|
@@ -1,222 +1,222 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Theme Configuration for Embeddable Calendar Widget
|
|
3
|
-
*
|
|
4
|
-
* This module provides comprehensive theming options for the calendar widget.
|
|
5
|
-
* All colors use HSL format for easy manipulation.
|
|
6
|
-
*
|
|
7
|
-
* Usage:
|
|
8
|
-
* 1. Import and call applyTheme() with your custom theme
|
|
9
|
-
* 2. Or set CSS custom properties directly on the widget container
|
|
10
|
-
*
|
|
11
|
-
* Example:
|
|
12
|
-
* ```js
|
|
13
|
-
* import { applyTheme, themes } from '@getmicdrop/venue-calendar/theme';
|
|
14
|
-
* applyTheme(themes.dark);
|
|
15
|
-
*
|
|
16
|
-
* // Or custom theme:
|
|
17
|
-
* applyTheme({
|
|
18
|
-
* brandPrimary: '270 76% 60%', // Purple
|
|
19
|
-
* textPrimary: '0 0% 100%',
|
|
20
|
-
* bgPrimary: '0 0% 10%',
|
|
21
|
-
* });
|
|
22
|
-
* ```
|
|
23
|
-
*/
|
|
24
|
-
|
|
25
|
-
// Default light theme
|
|
26
|
-
export const lightTheme = {
|
|
27
|
-
// Brand colors
|
|
28
|
-
brandPrimary: '217 91% 60%', // #2563EB - Blue
|
|
29
|
-
|
|
30
|
-
// Text colors
|
|
31
|
-
textPrimary: '0 0% 0%', // Black
|
|
32
|
-
textSecondary: '0 0% 40%', // Dark Gray
|
|
33
|
-
textTertiary: '0 0% 60%', // Gray
|
|
34
|
-
|
|
35
|
-
// Background colors
|
|
36
|
-
bgPrimary: '0 0% 100%', // White
|
|
37
|
-
bgSecondary: '0 0% 98%', // Light Gray
|
|
38
|
-
bgQuaternary: '0 0% 96%', // Very Light Gray
|
|
39
|
-
|
|
40
|
-
// Border/Stroke colors
|
|
41
|
-
strokePrimary: '0 0% 80%', // Medium Gray
|
|
42
|
-
strokeSecondary: '0 0% 90%', // Light Gray
|
|
43
|
-
|
|
44
|
-
// Status colors
|
|
45
|
-
statusOnSale: '217 91% 60%', // Blue
|
|
46
|
-
statusSellingFast: '38 92% 50%', // Orange
|
|
47
|
-
statusSoldOut: '0 84% 60%', // Red
|
|
48
|
-
|
|
49
|
-
// Calendar specific
|
|
50
|
-
todayBg: '217 91% 97%', // Light blue
|
|
51
|
-
todayText: '217 91% 50%', // Blue
|
|
52
|
-
eventDotOnSale: '217 91% 60%',
|
|
53
|
-
eventDotSellingFast: '38 92% 50%',
|
|
54
|
-
eventDotSoldOut: '0 84% 60%',
|
|
55
|
-
|
|
56
|
-
// Interaction states
|
|
57
|
-
hoverBg: '0 0% 96%',
|
|
58
|
-
focusRing: '217 91% 60%',
|
|
59
|
-
};
|
|
60
|
-
|
|
61
|
-
// Dark theme
|
|
62
|
-
export const darkTheme = {
|
|
63
|
-
// Brand colors
|
|
64
|
-
brandPrimary: '217 91% 65%', // Lighter blue for dark mode
|
|
65
|
-
|
|
66
|
-
// Text colors
|
|
67
|
-
textPrimary: '0 0% 98%', // Near white
|
|
68
|
-
textSecondary: '0 0% 70%', // Light gray
|
|
69
|
-
textTertiary: '0 0% 50%', // Gray
|
|
70
|
-
|
|
71
|
-
// Background colors
|
|
72
|
-
bgPrimary: '0 0% 9%', // Very dark gray
|
|
73
|
-
bgSecondary: '0 0% 13%', // Dark gray
|
|
74
|
-
bgQuaternary: '0 0% 17%', // Slightly lighter
|
|
75
|
-
|
|
76
|
-
// Border/Stroke colors
|
|
77
|
-
strokePrimary: '0 0% 30%',
|
|
78
|
-
strokeSecondary: '0 0% 20%',
|
|
79
|
-
|
|
80
|
-
// Status colors
|
|
81
|
-
statusOnSale: '217 91% 65%',
|
|
82
|
-
statusSellingFast: '38 92% 55%',
|
|
83
|
-
statusSoldOut: '0 84% 65%',
|
|
84
|
-
|
|
85
|
-
// Calendar specific
|
|
86
|
-
todayBg: '217 50% 20%',
|
|
87
|
-
todayText: '217 91% 70%',
|
|
88
|
-
eventDotOnSale: '217 91% 65%',
|
|
89
|
-
eventDotSellingFast: '38 92% 55%',
|
|
90
|
-
eventDotSoldOut: '0 84% 65%',
|
|
91
|
-
|
|
92
|
-
// Interaction states
|
|
93
|
-
hoverBg: '0 0% 20%',
|
|
94
|
-
focusRing: '217 91% 65%',
|
|
95
|
-
};
|
|
96
|
-
|
|
97
|
-
// High contrast theme for accessibility
|
|
98
|
-
export const highContrastTheme = {
|
|
99
|
-
brandPrimary: '217 100% 50%',
|
|
100
|
-
textPrimary: '0 0% 0%',
|
|
101
|
-
textSecondary: '0 0% 20%',
|
|
102
|
-
textTertiary: '0 0% 30%',
|
|
103
|
-
bgPrimary: '0 0% 100%',
|
|
104
|
-
bgSecondary: '0 0% 95%',
|
|
105
|
-
bgQuaternary: '0 0% 90%',
|
|
106
|
-
strokePrimary: '0 0% 0%',
|
|
107
|
-
strokeSecondary: '0 0% 30%',
|
|
108
|
-
statusOnSale: '217 100% 40%',
|
|
109
|
-
statusSellingFast: '30 100% 40%',
|
|
110
|
-
statusSoldOut: '0 100% 40%',
|
|
111
|
-
todayBg: '217 100% 90%',
|
|
112
|
-
todayText: '217 100% 30%',
|
|
113
|
-
eventDotOnSale: '217 100% 40%',
|
|
114
|
-
eventDotSellingFast: '30 100% 40%',
|
|
115
|
-
eventDotSoldOut: '0 100% 40%',
|
|
116
|
-
hoverBg: '217 100% 95%',
|
|
117
|
-
focusRing: '217 100% 40%',
|
|
118
|
-
};
|
|
119
|
-
|
|
120
|
-
// Preset themes collection
|
|
121
|
-
export const themes = {
|
|
122
|
-
light: lightTheme,
|
|
123
|
-
dark: darkTheme,
|
|
124
|
-
highContrast: highContrastTheme,
|
|
125
|
-
};
|
|
126
|
-
|
|
127
|
-
/**
|
|
128
|
-
* Apply a theme to the calendar widget
|
|
129
|
-
* @param {Object} theme - Theme object with HSL color values
|
|
130
|
-
* @param {HTMLElement} container - Optional container element (defaults to :root)
|
|
131
|
-
*/
|
|
132
|
-
export function applyTheme(theme, container = document.documentElement) {
|
|
133
|
-
const cssVarMap = {
|
|
134
|
-
brandPrimary: '--brand-primary',
|
|
135
|
-
textPrimary: '--text-primary',
|
|
136
|
-
textSecondary: '--text-secondary',
|
|
137
|
-
textTertiary: '--text-tertiary',
|
|
138
|
-
bgPrimary: '--bg-primary',
|
|
139
|
-
bgSecondary: '--bg-secondary',
|
|
140
|
-
bgQuaternary: '--bg-quaternary',
|
|
141
|
-
strokePrimary: '--stroke-primary',
|
|
142
|
-
strokeSecondary: '--stroke-secondary',
|
|
143
|
-
statusOnSale: '--status-on-sale',
|
|
144
|
-
statusSellingFast: '--status-selling-fast',
|
|
145
|
-
statusSoldOut: '--status-sold-out',
|
|
146
|
-
todayBg: '--today-bg',
|
|
147
|
-
todayText: '--today-text',
|
|
148
|
-
eventDotOnSale: '--event-dot-on-sale',
|
|
149
|
-
eventDotSellingFast: '--event-dot-selling-fast',
|
|
150
|
-
eventDotSoldOut: '--event-dot-sold-out',
|
|
151
|
-
hoverBg: '--hover-bg',
|
|
152
|
-
focusRing: '--focus-ring',
|
|
153
|
-
};
|
|
154
|
-
|
|
155
|
-
Object.entries(theme).forEach(([key, value]) => {
|
|
156
|
-
const cssVar = cssVarMap[key];
|
|
157
|
-
if (cssVar) {
|
|
158
|
-
container.style.setProperty(cssVar, value);
|
|
159
|
-
}
|
|
160
|
-
});
|
|
161
|
-
|
|
162
|
-
// Sync data-theme attribute when a known preset is applied so SC
|
|
163
|
-
// components (Stripe theme detector, DarkModeToggle reader, etc.)
|
|
164
|
-
// see the same intent. Partial/custom themes don't trigger this —
|
|
165
|
-
// they edit a few CSS vars without flipping the overall light/dark
|
|
166
|
-
// mode signal.
|
|
167
|
-
if (container.setAttribute) {
|
|
168
|
-
if (theme === darkTheme) {
|
|
169
|
-
container.setAttribute('data-theme', 'dark');
|
|
170
|
-
} else if (theme === lightTheme || theme === highContrastTheme) {
|
|
171
|
-
container.setAttribute('data-theme', 'light');
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
/**
|
|
177
|
-
* Generate CSS string for embedding
|
|
178
|
-
* @param {Object} theme - Theme object
|
|
179
|
-
* @returns {string} CSS string
|
|
180
|
-
*/
|
|
181
|
-
export function generateThemeCSS(theme) {
|
|
182
|
-
const cssVarMap = {
|
|
183
|
-
brandPrimary: '--brand-primary',
|
|
184
|
-
textPrimary: '--text-primary',
|
|
185
|
-
textSecondary: '--text-secondary',
|
|
186
|
-
textTertiary: '--text-tertiary',
|
|
187
|
-
bgPrimary: '--bg-primary',
|
|
188
|
-
bgSecondary: '--bg-secondary',
|
|
189
|
-
bgQuaternary: '--bg-quaternary',
|
|
190
|
-
strokePrimary: '--stroke-primary',
|
|
191
|
-
strokeSecondary: '--stroke-secondary',
|
|
192
|
-
statusOnSale: '--status-on-sale',
|
|
193
|
-
statusSellingFast: '--status-selling-fast',
|
|
194
|
-
statusSoldOut: '--status-sold-out',
|
|
195
|
-
todayBg: '--today-bg',
|
|
196
|
-
todayText: '--today-text',
|
|
197
|
-
eventDotOnSale: '--event-dot-on-sale',
|
|
198
|
-
eventDotSellingFast: '--event-dot-selling-fast',
|
|
199
|
-
eventDotSoldOut: '--event-dot-sold-out',
|
|
200
|
-
hoverBg: '--hover-bg',
|
|
201
|
-
focusRing: '--focus-ring',
|
|
202
|
-
};
|
|
203
|
-
|
|
204
|
-
const lines = [];
|
|
205
|
-
Object.entries(theme).forEach(([key, value]) => {
|
|
206
|
-
const cssVar = cssVarMap[key];
|
|
207
|
-
if (cssVar) {
|
|
208
|
-
lines.push(` ${cssVar}: ${value};`);
|
|
209
|
-
}
|
|
210
|
-
});
|
|
211
|
-
|
|
212
|
-
return `:root {\n${lines.join('\n')}\n}`;
|
|
213
|
-
}
|
|
214
|
-
|
|
215
|
-
export default {
|
|
216
|
-
themes,
|
|
217
|
-
lightTheme,
|
|
218
|
-
darkTheme,
|
|
219
|
-
highContrastTheme,
|
|
220
|
-
applyTheme,
|
|
221
|
-
generateThemeCSS,
|
|
222
|
-
};
|
|
1
|
+
/**
|
|
2
|
+
* Theme Configuration for Embeddable Calendar Widget
|
|
3
|
+
*
|
|
4
|
+
* This module provides comprehensive theming options for the calendar widget.
|
|
5
|
+
* All colors use HSL format for easy manipulation.
|
|
6
|
+
*
|
|
7
|
+
* Usage:
|
|
8
|
+
* 1. Import and call applyTheme() with your custom theme
|
|
9
|
+
* 2. Or set CSS custom properties directly on the widget container
|
|
10
|
+
*
|
|
11
|
+
* Example:
|
|
12
|
+
* ```js
|
|
13
|
+
* import { applyTheme, themes } from '@getmicdrop/venue-calendar/theme';
|
|
14
|
+
* applyTheme(themes.dark);
|
|
15
|
+
*
|
|
16
|
+
* // Or custom theme:
|
|
17
|
+
* applyTheme({
|
|
18
|
+
* brandPrimary: '270 76% 60%', // Purple
|
|
19
|
+
* textPrimary: '0 0% 100%',
|
|
20
|
+
* bgPrimary: '0 0% 10%',
|
|
21
|
+
* });
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
// Default light theme
|
|
26
|
+
export const lightTheme = {
|
|
27
|
+
// Brand colors
|
|
28
|
+
brandPrimary: '217 91% 60%', // #2563EB - Blue
|
|
29
|
+
|
|
30
|
+
// Text colors
|
|
31
|
+
textPrimary: '0 0% 0%', // Black
|
|
32
|
+
textSecondary: '0 0% 40%', // Dark Gray
|
|
33
|
+
textTertiary: '0 0% 60%', // Gray
|
|
34
|
+
|
|
35
|
+
// Background colors
|
|
36
|
+
bgPrimary: '0 0% 100%', // White
|
|
37
|
+
bgSecondary: '0 0% 98%', // Light Gray
|
|
38
|
+
bgQuaternary: '0 0% 96%', // Very Light Gray
|
|
39
|
+
|
|
40
|
+
// Border/Stroke colors
|
|
41
|
+
strokePrimary: '0 0% 80%', // Medium Gray
|
|
42
|
+
strokeSecondary: '0 0% 90%', // Light Gray
|
|
43
|
+
|
|
44
|
+
// Status colors
|
|
45
|
+
statusOnSale: '217 91% 60%', // Blue
|
|
46
|
+
statusSellingFast: '38 92% 50%', // Orange
|
|
47
|
+
statusSoldOut: '0 84% 60%', // Red
|
|
48
|
+
|
|
49
|
+
// Calendar specific
|
|
50
|
+
todayBg: '217 91% 97%', // Light blue
|
|
51
|
+
todayText: '217 91% 50%', // Blue
|
|
52
|
+
eventDotOnSale: '217 91% 60%',
|
|
53
|
+
eventDotSellingFast: '38 92% 50%',
|
|
54
|
+
eventDotSoldOut: '0 84% 60%',
|
|
55
|
+
|
|
56
|
+
// Interaction states
|
|
57
|
+
hoverBg: '0 0% 96%',
|
|
58
|
+
focusRing: '217 91% 60%',
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
// Dark theme
|
|
62
|
+
export const darkTheme = {
|
|
63
|
+
// Brand colors
|
|
64
|
+
brandPrimary: '217 91% 65%', // Lighter blue for dark mode
|
|
65
|
+
|
|
66
|
+
// Text colors
|
|
67
|
+
textPrimary: '0 0% 98%', // Near white
|
|
68
|
+
textSecondary: '0 0% 70%', // Light gray
|
|
69
|
+
textTertiary: '0 0% 50%', // Gray
|
|
70
|
+
|
|
71
|
+
// Background colors
|
|
72
|
+
bgPrimary: '0 0% 9%', // Very dark gray
|
|
73
|
+
bgSecondary: '0 0% 13%', // Dark gray
|
|
74
|
+
bgQuaternary: '0 0% 17%', // Slightly lighter
|
|
75
|
+
|
|
76
|
+
// Border/Stroke colors
|
|
77
|
+
strokePrimary: '0 0% 30%',
|
|
78
|
+
strokeSecondary: '0 0% 20%',
|
|
79
|
+
|
|
80
|
+
// Status colors
|
|
81
|
+
statusOnSale: '217 91% 65%',
|
|
82
|
+
statusSellingFast: '38 92% 55%',
|
|
83
|
+
statusSoldOut: '0 84% 65%',
|
|
84
|
+
|
|
85
|
+
// Calendar specific
|
|
86
|
+
todayBg: '217 50% 20%',
|
|
87
|
+
todayText: '217 91% 70%',
|
|
88
|
+
eventDotOnSale: '217 91% 65%',
|
|
89
|
+
eventDotSellingFast: '38 92% 55%',
|
|
90
|
+
eventDotSoldOut: '0 84% 65%',
|
|
91
|
+
|
|
92
|
+
// Interaction states
|
|
93
|
+
hoverBg: '0 0% 20%',
|
|
94
|
+
focusRing: '217 91% 65%',
|
|
95
|
+
};
|
|
96
|
+
|
|
97
|
+
// High contrast theme for accessibility
|
|
98
|
+
export const highContrastTheme = {
|
|
99
|
+
brandPrimary: '217 100% 50%',
|
|
100
|
+
textPrimary: '0 0% 0%',
|
|
101
|
+
textSecondary: '0 0% 20%',
|
|
102
|
+
textTertiary: '0 0% 30%',
|
|
103
|
+
bgPrimary: '0 0% 100%',
|
|
104
|
+
bgSecondary: '0 0% 95%',
|
|
105
|
+
bgQuaternary: '0 0% 90%',
|
|
106
|
+
strokePrimary: '0 0% 0%',
|
|
107
|
+
strokeSecondary: '0 0% 30%',
|
|
108
|
+
statusOnSale: '217 100% 40%',
|
|
109
|
+
statusSellingFast: '30 100% 40%',
|
|
110
|
+
statusSoldOut: '0 100% 40%',
|
|
111
|
+
todayBg: '217 100% 90%',
|
|
112
|
+
todayText: '217 100% 30%',
|
|
113
|
+
eventDotOnSale: '217 100% 40%',
|
|
114
|
+
eventDotSellingFast: '30 100% 40%',
|
|
115
|
+
eventDotSoldOut: '0 100% 40%',
|
|
116
|
+
hoverBg: '217 100% 95%',
|
|
117
|
+
focusRing: '217 100% 40%',
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
// Preset themes collection
|
|
121
|
+
export const themes = {
|
|
122
|
+
light: lightTheme,
|
|
123
|
+
dark: darkTheme,
|
|
124
|
+
highContrast: highContrastTheme,
|
|
125
|
+
};
|
|
126
|
+
|
|
127
|
+
/**
|
|
128
|
+
* Apply a theme to the calendar widget
|
|
129
|
+
* @param {Object} theme - Theme object with HSL color values
|
|
130
|
+
* @param {HTMLElement} container - Optional container element (defaults to :root)
|
|
131
|
+
*/
|
|
132
|
+
export function applyTheme(theme, container = document.documentElement) {
|
|
133
|
+
const cssVarMap = {
|
|
134
|
+
brandPrimary: '--brand-primary',
|
|
135
|
+
textPrimary: '--text-primary',
|
|
136
|
+
textSecondary: '--text-secondary',
|
|
137
|
+
textTertiary: '--text-tertiary',
|
|
138
|
+
bgPrimary: '--bg-primary',
|
|
139
|
+
bgSecondary: '--bg-secondary',
|
|
140
|
+
bgQuaternary: '--bg-quaternary',
|
|
141
|
+
strokePrimary: '--stroke-primary',
|
|
142
|
+
strokeSecondary: '--stroke-secondary',
|
|
143
|
+
statusOnSale: '--status-on-sale',
|
|
144
|
+
statusSellingFast: '--status-selling-fast',
|
|
145
|
+
statusSoldOut: '--status-sold-out',
|
|
146
|
+
todayBg: '--today-bg',
|
|
147
|
+
todayText: '--today-text',
|
|
148
|
+
eventDotOnSale: '--event-dot-on-sale',
|
|
149
|
+
eventDotSellingFast: '--event-dot-selling-fast',
|
|
150
|
+
eventDotSoldOut: '--event-dot-sold-out',
|
|
151
|
+
hoverBg: '--hover-bg',
|
|
152
|
+
focusRing: '--focus-ring',
|
|
153
|
+
};
|
|
154
|
+
|
|
155
|
+
Object.entries(theme).forEach(([key, value]) => {
|
|
156
|
+
const cssVar = cssVarMap[key];
|
|
157
|
+
if (cssVar) {
|
|
158
|
+
container.style.setProperty(cssVar, value);
|
|
159
|
+
}
|
|
160
|
+
});
|
|
161
|
+
|
|
162
|
+
// Sync data-theme attribute when a known preset is applied so SC
|
|
163
|
+
// components (Stripe theme detector, DarkModeToggle reader, etc.)
|
|
164
|
+
// see the same intent. Partial/custom themes don't trigger this —
|
|
165
|
+
// they edit a few CSS vars without flipping the overall light/dark
|
|
166
|
+
// mode signal.
|
|
167
|
+
if (container.setAttribute) {
|
|
168
|
+
if (theme === darkTheme) {
|
|
169
|
+
container.setAttribute('data-theme', 'dark');
|
|
170
|
+
} else if (theme === lightTheme || theme === highContrastTheme) {
|
|
171
|
+
container.setAttribute('data-theme', 'light');
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
/**
|
|
177
|
+
* Generate CSS string for embedding
|
|
178
|
+
* @param {Object} theme - Theme object
|
|
179
|
+
* @returns {string} CSS string
|
|
180
|
+
*/
|
|
181
|
+
export function generateThemeCSS(theme) {
|
|
182
|
+
const cssVarMap = {
|
|
183
|
+
brandPrimary: '--brand-primary',
|
|
184
|
+
textPrimary: '--text-primary',
|
|
185
|
+
textSecondary: '--text-secondary',
|
|
186
|
+
textTertiary: '--text-tertiary',
|
|
187
|
+
bgPrimary: '--bg-primary',
|
|
188
|
+
bgSecondary: '--bg-secondary',
|
|
189
|
+
bgQuaternary: '--bg-quaternary',
|
|
190
|
+
strokePrimary: '--stroke-primary',
|
|
191
|
+
strokeSecondary: '--stroke-secondary',
|
|
192
|
+
statusOnSale: '--status-on-sale',
|
|
193
|
+
statusSellingFast: '--status-selling-fast',
|
|
194
|
+
statusSoldOut: '--status-sold-out',
|
|
195
|
+
todayBg: '--today-bg',
|
|
196
|
+
todayText: '--today-text',
|
|
197
|
+
eventDotOnSale: '--event-dot-on-sale',
|
|
198
|
+
eventDotSellingFast: '--event-dot-selling-fast',
|
|
199
|
+
eventDotSoldOut: '--event-dot-sold-out',
|
|
200
|
+
hoverBg: '--hover-bg',
|
|
201
|
+
focusRing: '--focus-ring',
|
|
202
|
+
};
|
|
203
|
+
|
|
204
|
+
const lines = [];
|
|
205
|
+
Object.entries(theme).forEach(([key, value]) => {
|
|
206
|
+
const cssVar = cssVarMap[key];
|
|
207
|
+
if (cssVar) {
|
|
208
|
+
lines.push(` ${cssVar}: ${value};`);
|
|
209
|
+
}
|
|
210
|
+
});
|
|
211
|
+
|
|
212
|
+
return `:root {\n${lines.join('\n')}\n}`;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
export default {
|
|
216
|
+
themes,
|
|
217
|
+
lightTheme,
|
|
218
|
+
darkTheme,
|
|
219
|
+
highContrastTheme,
|
|
220
|
+
applyTheme,
|
|
221
|
+
generateThemeCSS,
|
|
222
|
+
};
|