| 1 |
import { |
| 2 |
BOX_PADDING, |
| 3 |
BOX_BORDER, |
| 4 |
DIGITS_PADDING, |
| 5 |
DIGITS_BORDER, |
| 6 |
UNITS, |
| 7 |
} from "./constants"; |
| 8 |
import * as typographyObjs from "./typographyConstants"; |
| 9 |
|
| 10 |
const { |
| 11 |
generateDimensionsAttributes, |
| 12 |
generateTypographyAttributes, |
| 13 |
generateBorderShadowAttributes, |
| 14 |
} = window.EBControls; |
| 15 |
|
| 16 |
// Per-unit color attributes: days/hours/minutes/seconds × bg/digit/label/border. |
| 17 |
const unitColorAttributes = UNITS.reduce((acc, unit) => { |
| 18 |
acc[`${unit}BgColor`] = { type: "string" }; |
| 19 |
acc[`${unit}DigitColor`] = { type: "string" }; |
| 20 |
acc[`${unit}LabelColor`] = { type: "string" }; |
| 21 |
acc[`${unit}BorderColor`] = { type: "string" }; |
| 22 |
return acc; |
| 23 |
}, {}); |
| 24 |
|
| 25 |
const attributes = { |
| 26 |
// Housekeeping |
| 27 |
resOption: { type: "string", default: "Desktop" }, |
| 28 |
blockId: { type: "string" }, |
| 29 |
blockStyles: { type: "object" }, |
| 30 |
|
| 31 |
// ── Timer Settings ────────────────────────────────────────────── |
| 32 |
countdownType: { type: "string", default: "due_date" }, |
| 33 |
dueTime: { type: "string", default: "" }, |
| 34 |
evergreenHours: { type: "number", default: 11 }, |
| 35 |
evergreenMinutes: { type: "number", default: 59 }, |
| 36 |
evergreenRecurring: { type: "boolean", default: false }, |
| 37 |
recurringRestartAfter: { type: "number", default: 0 }, |
| 38 |
recurringStopTime: { type: "string", default: "" }, |
| 39 |
|
| 40 |
// ── Content Settings ──────────────────────────────────────────── |
| 41 |
layout: { type: "string", default: "grid" }, |
| 42 |
labelView: { type: "string", default: "nx-countdown-label-block" }, |
| 43 |
alignment: { type: "string", default: "center" }, |
| 44 |
|
| 45 |
showDays: { type: "boolean", default: true }, |
| 46 |
daysLabel: { type: "string", default: "Days" }, |
| 47 |
showHours: { type: "boolean", default: true }, |
| 48 |
hoursLabel: { type: "string", default: "Hours" }, |
| 49 |
showMinutes: { type: "boolean", default: true }, |
| 50 |
minutesLabel: { type: "string", default: "Minutes" }, |
| 51 |
showSeconds: { type: "boolean", default: true }, |
| 52 |
secondsLabel: { type: "string", default: "Seconds" }, |
| 53 |
|
| 54 |
showSeparator: { type: "boolean", default: false }, |
| 55 |
separatorStyle: { type: "string", default: "dotted" }, |
| 56 |
separatorColor: { type: "string" }, |
| 57 |
|
| 58 |
// ── Expire Action ─────────────────────────────────────────────── |
| 59 |
expireType: { type: "string", default: "none" }, |
| 60 |
expiryTitle: { type: "string", default: "The countdown is finished!" }, |
| 61 |
expiryText: { |
| 62 |
type: "string", |
| 63 |
default: "Thank you for being part of this event.", |
| 64 |
}, |
| 65 |
redirectUrl: { type: "string", default: "#" }, |
| 66 |
|
| 67 |
// ── Countdown Box styles ──────────────────────────────────────── |
| 68 |
boxBgColor: { type: "string" }, |
| 69 |
boxBgGradient: { type: "string", default: "" }, |
| 70 |
boxSpacing: { type: "number", default: 15 }, |
| 71 |
|
| 72 |
// ── Color & Typography ────────────────────────────────────────── |
| 73 |
digitsColor: { type: "string", default: "#fec503" }, |
| 74 |
digitsBgColor: { type: "string" }, |
| 75 |
labelColor: { type: "string", default: "#aaaaaa" }, |
| 76 |
|
| 77 |
// ── Individual box styling (per unit) ─────────────────────────── |
| 78 |
...unitColorAttributes, |
| 79 |
|
| 80 |
// ── Expire message styles ─────────────────────────────────────── |
| 81 |
expireAlignment: { type: "string", default: "" }, |
| 82 |
expireTitleColor: { type: "string" }, |
| 83 |
expireTextColor: { type: "string" }, |
| 84 |
|
| 85 |
// ── Typography (digits, label, expire title, expire text) ─────── |
| 86 |
...generateTypographyAttributes(Object.values(typographyObjs)), |
| 87 |
|
| 88 |
// ── Dimensions (paddings) ─────────────────────────────────────── |
| 89 |
...generateDimensionsAttributes(BOX_PADDING, { |
| 90 |
top: 20, |
| 91 |
bottom: 20, |
| 92 |
right: 24, |
| 93 |
left: 24, |
| 94 |
isLinked: false, |
| 95 |
}), |
| 96 |
...generateDimensionsAttributes(DIGITS_PADDING, { |
| 97 |
top: 0, |
| 98 |
bottom: 0, |
| 99 |
right: 0, |
| 100 |
left: 0, |
| 101 |
isLinked: true, |
| 102 |
}), |
| 103 |
|
| 104 |
// ── Border + shadow (box, digits) ─────────────────────────────── |
| 105 |
...generateBorderShadowAttributes(BOX_BORDER, { |
| 106 |
bdrDefaults: { top: 0, bottom: 0, right: 0, left: 0 }, |
| 107 |
rdsDefaults: { top: 0, right: 0, bottom: 0, left: 0 }, |
| 108 |
}), |
| 109 |
...generateBorderShadowAttributes(DIGITS_BORDER, { |
| 110 |
bdrDefaults: { top: 0, bottom: 0, right: 0, left: 0 }, |
| 111 |
rdsDefaults: { top: 0, right: 0, bottom: 0, left: 0 }, |
| 112 |
}), |
| 113 |
}; |
| 114 |
|
| 115 |
export default attributes; |
| 116 |
|
