@usefillo/core 0.24.1 → 0.26.0

package/dist/index.d.ts

@@ -95,6 +95,11 @@ interface RatingField extends BaseField {
 }
 interface DateField extends BaseField {
     kind: "date";
+    /**
+     * Start on today's date — the respondent's own day, set by their device once
+     * the form loads (the server can't know their time zone). They can change it.
+     */
+    defaultToday?: boolean;
 }
 interface LinearScaleField extends BaseField {
     kind: "linear_scale";
@@ -300,8 +305,12 @@ interface ResponseLimit {
      *   and anonymous embeds can still dedupe.
      * - "identify": the identify() respondent (HMAC-verifiable). The strong
      *   path; only embedded surfaces that call identify() are recognized.
+     * - "email": a verified email address. On the form's Fillo link the person
+     *   confirms their email with a 6-digit code before filling in, and the
+     *   device stays confirmed for 30 days. Embedded forms can't show that
+     *   step — use "identify" there.
      */
-    by: "browser" | "field" | "identify";
+    by: "browser" | "field" | "identify" | "email";
     /** The email/phone field whose answer identifies the person. `by: "field"` only. */
     field?: string;
     /**
@@ -315,7 +324,8 @@ interface ResponseLimit {
      * response (the first answer stands); "update" edits it in place (re-anchored
      * to the current schema, `response.updated` webhook, previous answers
      * prefilled for a verified respondent). "update" applies to `by: "identify"`
-     * only — a self-claim/browser must not overwrite another person's response.
+     * and `by: "email"` only — a self-claim/browser must not overwrite another
+     * person's response.
      */
     onRepeat: "keep" | "update";
 }
@@ -401,16 +411,31 @@ interface FormSchema {
     pages: FormPage[];
     settings: FormSettings;
 }
-interface FormTheme {
-    /** Omit to inherit the host page. Use "auto" to follow the visitor's system directly. */
-    colorScheme?: "light" | "dark" | "auto";
+/** The colors (and logo) of one appearance. */
+interface FormThemePalette {
     /** Accent for buttons, focus rings, selection. */
     primary?: string;
     background?: string;
     text?: string;
+    /**
+     * Logo shown above the form on Fillo-hosted pages: the id of an image
+     * uploaded to the workspace. Embedded forms leave branding to the host app.
+     */
+    logo?: string;
+}
+interface FormTheme extends FormThemePalette {
+    /** Omit to inherit the host page. Use "auto" to follow the visitor's system directly. */
+    colorScheme?: "light" | "dark" | "auto";
     /** Border radius scale, e.g. "8px". */
     radius?: string;
     fontFamily?: string;
+    /**
+     * Dark-mode colors, for a form that follows a light/dark setting
+     * (`colorScheme` omitted or "auto"). The top-level colors are then the
+     * light palette. An unset dark color uses the default dark token; an unset
+     * dark logo reuses the top-level logo. Ignored when `colorScheme` is fixed.
+     */
+    dark?: FormThemePalette;
 }
 /** Branding the server tells the SDK to render. Server-owned so the wording /
  *  link can change centrally without a new SDK release. */
@@ -1980,6 +2005,8 @@ declare const FILLO_THEME_VARS: readonly [{
     readonly var: "--fillo-muted";
 }, {
     readonly var: "--fillo-border";
+}, {
+    readonly var: "--fillo-control-border";
 }, {
     readonly var: "--fillo-control-bg";
 }, {
@@ -2006,6 +2033,30 @@ declare const FILLO_THEME_VARS: readonly [{
  * `[data-fillo-color-scheme="dark"]` CSS, so no new CSS is needed.
  */
 declare function resolveThemeAppearance(theme: FormTheme | null): FormTheme | null;
+/**
+ * True when the theme switches palettes with the light/dark setting: it has
+ * dark colors and its scheme is not fixed (omitted or "auto"). A dark logo
+ * alone switches nothing.
+ */
+declare function themeHasDarkPalette(theme: FormTheme | null | undefined): boolean;
+interface ThemeDomAttributes {
+    /** Inline custom properties for the form root (`--fillo-primary`, …). */
+    vars: Record<string, string>;
+    /** `data-fillo-*` attributes for the form root. */
+    attrs: Record<string, string>;
+}
+/**
+ * Turn an untrusted theme into the form root's inline custom properties and
+ * data attributes — one implementation for every renderer.
+ *
+ * A theme with a dark palette (see themeHasDarkPalette) emits each color as
+ * `light-dark(light, dark)`, so it follows the form's own color-scheme: the
+ * host page's when `colorScheme` is omitted, the visitor's device on "auto".
+ * `data-fillo-on-primary` (and `-dark`) name the text tone that reads on a
+ * custom accent; the stylesheet maps them to `--fillo-primary-contrast`, which
+ * stays overridable from consumer CSS.
+ */
+declare function resolveThemeDom(theme: FormTheme | null | undefined): ThemeDomAttributes | null;
 
 /** Result of syncing a code-defined form: its canonical id, slug, and branding. */
 interface SyncedForm {
@@ -2208,6 +2259,15 @@ declare function isBuildTimeDevEnv(): boolean;
  */
 declare function isLikelyDevEnv(): boolean;
 
+/** A device's local calendar date as YYYY-MM-DD — the value a date field holds. */
+declare function localDateString(now?: Date): string;
+/**
+ * Fill each unanswered date field that starts on today (`defaultToday`). Only
+ * the respondent's device knows their "today" (time zone), so renderers apply
+ * this in the browser after hydration, never on the server. Returns `data`
+ * itself when nothing needed filling.
+ */
+declare function applyDateDefaults(form: FormSchema, data: ResponseData, now?: Date): ResponseData;
 /**
  * Build initial response data from URL query parameters — Tally-style
  * prefilling. Hidden fields read their configured paramName; every other
@@ -2252,4 +2312,4 @@ declare class Sha1 {
 }
 declare const sha1Base64: (bytes: Uint8Array) => string;
 
-export { type AutoSubmitContext, BLOCK_KIND_META, type BaseField, type Block, type BlockKind, CONTENT_KINDS, type CalcExpr, type CalculatedField, type ChallengeConfig, type ChallengeTheme, type CheckboxField, type ChoiceField, type CodeForm, type Condition, type ConditionOp, type ContentBlock, type ContentKind, type CreatedDraft, type CustomField, DEFAULT_FIELD_STRINGS, DEFAULT_RESPONDENT_ERROR_STRINGS, DEFAULT_STRINGS, DRAFT_KINDS, type DateField, type DividerBlock, FILLO_CALC_MIN_SDK_VERSION, FILLO_CHALLENGE_MIN_SDK_VERSION, FILLO_DATA_ATTRS, FILLO_GROUP_MIN_SDK_VERSION, FILLO_MIN_SDK_VERSION, FILLO_SCHEMA_VERSION, FILLO_SDK_VERSION, FILLO_SLOTS, FILLO_THEME_VARS, type Field, type FieldKind, type FieldSpec, type FieldValue, type FileUploadField, type FileValue, type FilloAppearance, FilloClient, type FilloClientOptions, FilloError, type FilloFieldStrings, FilloJsxError, type FilloRendererStrings, type FilloRespondent, type FilloSlot, type FilloStrings, type FormBranding, type FormController, type FormControllerOptions, type FormControllerState, type FormDraftSpec, type FormPage, type FormSchema, type FormSettings, type FormStatus, type FormTheme, type GroupInstanceValue, type HeadingBlock, type HiddenField, JSX_BLOCK_COMPONENTS, JSX_BLOCK_SPECS, type JsonValue, type JsxFormMeta, type JumpRule, type LinearScaleField, MAX_FILES_PER_FIELD, type MatrixField, type NextPage, type NumberField, PHONE_COUNTRIES, PHONE_PICKER_COUNTRIES, PHONE_POPOVER_VIEWPORT_GAP, type ParagraphBlock, type ParsePhoneOptions, type ParsedPhone, type PhoneCountry, type PhoneField, type PhonePopoverPlacement, type ProvisionWorkspaceResult, type PublishedForm, REQUIRED_FIELD_MESSAGE, type RankingField, type RatingField, type RepeatingGroupField, type RespondentErrorOverrides, type RespondentErrorStrings, type ResponseData, type ResponseDraft, type ResponseLimit, type SchemaValidationResult, type SelectOption, Sha1, type SignatureField, type SlotClass, type SlotState, type SubmitMeta, type SubmitResult, type SyncFormResult, type SyncedForm, type TextField, type TrustPolicy, type UploadFileOptions, type UploadProgress, type UploadSession, type UploadStatus, type UploadTransport, type ValidationResult, type WhenBuilder, allFields, assembleForm, codeFormFromJsx, computeCalculated, conditionsMet, contentHash, countryByDialCode, countryByIso, countryByTimeZone, createBlock, createClient, createEmptyForm, createFormController, createId, defineForm, digitsOnly, evaluateCalc, flagEmoji, formSchemasEqual, formatAnswer, formatGroupedNumber, formatNational, isAutoSubmitBlock, isBlockVisible, isBuildTimeDevEnv, isCodeForm, isField, isFilloError, isLikelyDevEnv, isPossiblePhone, isTerminalPage, isValidPartialNumberText, localeForNotation, needsExplicitSubmit, normalizeFormSchema, normalizeFormTheme, normalizeSettings, parseGroupedNumber, parsePhone, pipeBlock, positionPhonePopover, prefillFromParams, provisionWorkspace, radioGroupStep, reachableFieldIds, reachableFields, reachablePageIds, reachablePageSequence, requiredFieldMessage, resolveNextPage, resolveSlotClass, resolveStrings, resolveText, resolveThemeAppearance, respondentErrorStringsFor, responseScopeValue, schemaFromJsx, sha1Base64, shouldAutoSubmit, slotClass, syncCodeForm, toE164, validateField, validateFormSchema, validateResponse, visibleBlocks, visibleFields, visibleGroupChildren, visiblePageBlocks, when };
+export { type AutoSubmitContext, BLOCK_KIND_META, type BaseField, type Block, type BlockKind, CONTENT_KINDS, type CalcExpr, type CalculatedField, type ChallengeConfig, type ChallengeTheme, type CheckboxField, type ChoiceField, type CodeForm, type Condition, type ConditionOp, type ContentBlock, type ContentKind, type CreatedDraft, type CustomField, DEFAULT_FIELD_STRINGS, DEFAULT_RESPONDENT_ERROR_STRINGS, DEFAULT_STRINGS, DRAFT_KINDS, type DateField, type DividerBlock, FILLO_CALC_MIN_SDK_VERSION, FILLO_CHALLENGE_MIN_SDK_VERSION, FILLO_DATA_ATTRS, FILLO_GROUP_MIN_SDK_VERSION, FILLO_MIN_SDK_VERSION, FILLO_SCHEMA_VERSION, FILLO_SDK_VERSION, FILLO_SLOTS, FILLO_THEME_VARS, type Field, type FieldKind, type FieldSpec, type FieldValue, type FileUploadField, type FileValue, type FilloAppearance, FilloClient, type FilloClientOptions, FilloError, type FilloFieldStrings, FilloJsxError, type FilloRendererStrings, type FilloRespondent, type FilloSlot, type FilloStrings, type FormBranding, type FormController, type FormControllerOptions, type FormControllerState, type FormDraftSpec, type FormPage, type FormSchema, type FormSettings, type FormStatus, type FormTheme, type FormThemePalette, type GroupInstanceValue, type HeadingBlock, type HiddenField, JSX_BLOCK_COMPONENTS, JSX_BLOCK_SPECS, type JsonValue, type JsxFormMeta, type JumpRule, type LinearScaleField, MAX_FILES_PER_FIELD, type MatrixField, type NextPage, type NumberField, PHONE_COUNTRIES, PHONE_PICKER_COUNTRIES, PHONE_POPOVER_VIEWPORT_GAP, type ParagraphBlock, type ParsePhoneOptions, type ParsedPhone, type PhoneCountry, type PhoneField, type PhonePopoverPlacement, type ProvisionWorkspaceResult, type PublishedForm, REQUIRED_FIELD_MESSAGE, type RankingField, type RatingField, type RepeatingGroupField, type RespondentErrorOverrides, type RespondentErrorStrings, type ResponseData, type ResponseDraft, type ResponseLimit, type SchemaValidationResult, type SelectOption, Sha1, type SignatureField, type SlotClass, type SlotState, type SubmitMeta, type SubmitResult, type SyncFormResult, type SyncedForm, type TextField, type ThemeDomAttributes, type TrustPolicy, type UploadFileOptions, type UploadProgress, type UploadSession, type UploadStatus, type UploadTransport, type ValidationResult, type WhenBuilder, allFields, applyDateDefaults, assembleForm, codeFormFromJsx, computeCalculated, conditionsMet, contentHash, countryByDialCode, countryByIso, countryByTimeZone, createBlock, createClient, createEmptyForm, createFormController, createId, defineForm, digitsOnly, evaluateCalc, flagEmoji, formSchemasEqual, formatAnswer, formatGroupedNumber, formatNational, isAutoSubmitBlock, isBlockVisible, isBuildTimeDevEnv, isCodeForm, isField, isFilloError, isLikelyDevEnv, isPossiblePhone, isTerminalPage, isValidPartialNumberText, localDateString, localeForNotation, needsExplicitSubmit, normalizeFormSchema, normalizeFormTheme, normalizeSettings, parseGroupedNumber, parsePhone, pipeBlock, positionPhonePopover, prefillFromParams, provisionWorkspace, radioGroupStep, reachableFieldIds, reachableFields, reachablePageIds, reachablePageSequence, requiredFieldMessage, resolveNextPage, resolveSlotClass, resolveStrings, resolveText, resolveThemeAppearance, resolveThemeDom, respondentErrorStringsFor, responseScopeValue, schemaFromJsx, sha1Base64, shouldAutoSubmit, slotClass, syncCodeForm, themeHasDarkPalette, toE164, validateField, validateFormSchema, validateResponse, visibleBlocks, visibleFields, visibleGroupChildren, visiblePageBlocks, when };

package/dist/index.js

@@ -1114,7 +1114,7 @@ var schemaShape = z2.object({
 });
 var MAX_SCHEMA_VERSION = 1;
 var FILLO_SCHEMA_VERSION = 1;
-var FILLO_SDK_VERSION = true ? "0.24.1" : "0.0.0-dev";
+var FILLO_SDK_VERSION = true ? "0.26.0" : "0.0.0-dev";
 var FILLO_MIN_SDK_VERSION = "0.4.0";
 var FILLO_CHALLENGE_MIN_SDK_VERSION = "0.9.0";
 var FILLO_CALC_MIN_SDK_VERSION = "0.11.0";
@@ -1560,12 +1560,12 @@ function normalizeUrl(value) {
 function normalizeResponseLimit(value) {
   if (!value || typeof value !== "object") return void 0;
   const rec = value;
-  const by = rec.by === "browser" || rec.by === "field" || rec.by === "identify" ? rec.by : void 0;
+  const by = rec.by === "browser" || rec.by === "field" || rec.by === "identify" || rec.by === "email" ? rec.by : void 0;
   if (!by) return void 0;
   const field2 = by === "field" ? optionalStr(rec.field, 128) : void 0;
   if (by === "field" && !field2) return void 0;
   const scopeField = optionalStr(rec.scopeField, 128);
-  const onRepeat = rec.onRepeat === "update" && by === "identify" ? "update" : "keep";
+  const onRepeat = rec.onRepeat === "update" && (by === "identify" || by === "email") ? "update" : "keep";
   return {
     by,
     ...field2 ? { field: field2 } : {},
@@ -1675,8 +1675,12 @@ function normalizeBlock(input) {
       });
     }
     case "signature":
-    case "date":
       return cleanObject(baseField(rec, kind));
+    case "date":
+      return cleanObject({
+        ...baseField(rec, kind),
+        defaultToday: rec.defaultToday === true ? true : void 0
+      });
     case "rating": {
       const max = int(rec.max, 1, 10, 5);
       return cleanObject({
@@ -1893,17 +1897,30 @@ function safeCssToken(value, max) {
   if (/[;{}<>]/.test(token) || /url\s*\(/i.test(token)) return void 0;
   return token;
 }
+function themeAssetId(value) {
+  return typeof value === "string" && /^[A-Za-z0-9_-]{8,64}$/.test(value) ? value : void 0;
+}
+function normalizeThemePalette(input) {
+  if (!input || typeof input !== "object" || Array.isArray(input)) return void 0;
+  const rec = input;
+  const palette = cleanObject({
+    primary: safeCssToken(rec.primary, 200),
+    background: safeCssToken(rec.background, 200),
+    text: safeCssToken(rec.text, 200),
+    logo: themeAssetId(rec.logo)
+  });
+  return Object.keys(palette).length > 0 ? palette : void 0;
+}
 function normalizeFormTheme(input) {
   if (!input || typeof input !== "object" || Array.isArray(input)) return null;
   const rec = input;
   const colorScheme = rec.colorScheme === "light" || rec.colorScheme === "dark" || rec.colorScheme === "auto" ? rec.colorScheme : void 0;
   const theme = cleanObject({
     colorScheme,
-    primary: safeCssToken(rec.primary, 200),
-    background: safeCssToken(rec.background, 200),
-    text: safeCssToken(rec.text, 200),
+    ...normalizeThemePalette(rec),
     radius: safeCssToken(rec.radius, 64),
-    fontFamily: safeCssToken(rec.fontFamily, 200)
+    fontFamily: safeCssToken(rec.fontFamily, 200),
+    dark: normalizeThemePalette(rec.dark)
   });
   return Object.keys(theme).length > 0 ? theme : null;
 }
@@ -3228,6 +3245,20 @@ function parseDecimal(raw) {
   const n = Number(s);
   return Number.isFinite(n) ? n : null;
 }
+function localDateString(now = /* @__PURE__ */ new Date()) {
+  const month = String(now.getMonth() + 1).padStart(2, "0");
+  const day = String(now.getDate()).padStart(2, "0");
+  return `${now.getFullYear()}-${month}-${day}`;
+}
+function applyDateDefaults(form, data, now = /* @__PURE__ */ new Date()) {
+  let next = null;
+  for (const field2 of allFields(form)) {
+    if (field2.kind !== "date" || !field2.defaultToday || data[field2.id] !== void 0) continue;
+    next = next ?? { ...data };
+    next[field2.id] = localDateString(now);
+  }
+  return next ?? data;
+}
 function prefillFromParams(form, params) {
   const data = {};
   for (const field2 of allFields(form)) {
@@ -3505,6 +3536,11 @@ function createFormController(options2) {
         notify();
       }
     }
+    const withDates = applyDateDefaults(form, data);
+    if (withDates !== data && status === "idle") {
+      data = computeCalculated(form, withDates);
+      notify();
+    }
     if (status === "idle" && hasSubmittedOnce(form, formId, data)) {
       status = "submitted";
       restoredSubmission = true;
@@ -4040,6 +4076,7 @@ function createFormController(options2) {
           if (data[key] === void 0) data[key] = value;
         }
       }
+      data = applyDateDefaults(form, data);
       data = computeCalculated(form, data);
       errors = {};
       pageIndex = 0;
@@ -4194,6 +4231,7 @@ var FILLO_THEME_VARS = [
   { var: "--fillo-font", themeProp: "fontFamily" },
   { var: "--fillo-muted" },
   { var: "--fillo-border" },
+  { var: "--fillo-control-border" },
   { var: "--fillo-control-bg" },
   { var: "--fillo-error" },
   { var: "--fillo-primary-contrast" }
@@ -4222,13 +4260,71 @@ function relativeLuminance(token) {
   return 0.2126 * srgbToLinear(r) + 0.7152 * srgbToLinear(g) + 0.0722 * srgbToLinear(b);
 }
 function resolveThemeAppearance(theme) {
-  if (!theme || theme.colorScheme === "light" || theme.colorScheme === "dark" || !theme.background) {
+  if (!theme || theme.colorScheme === "light" || theme.colorScheme === "dark" || !theme.background || // A form with dark colors of its own follows the light/dark setting.
+  themeHasDarkPalette(theme)) {
     return theme;
   }
   const luminance = relativeLuminance(theme.background);
   if (luminance == null) return theme;
   return { ...theme, colorScheme: luminance > DARK_LUMINANCE_THRESHOLD ? "light" : "dark" };
 }
+function themeHasDarkPalette(theme) {
+  if (!theme || theme.colorScheme === "light" || theme.colorScheme === "dark") return false;
+  const dark = theme.dark;
+  return Boolean(dark && (dark.primary || dark.background || dark.text));
+}
+var ON_LIGHT_TEXT = "#18181b";
+function onColorTone(color) {
+  const luminance = relativeLuminance(color);
+  if (luminance == null) return null;
+  const withWhite = 1.05 / (luminance + 0.05);
+  const withDark = (luminance + 0.05) / ((relativeLuminance(ON_LIGHT_TEXT) ?? 0) + 0.05);
+  return withWhite >= withDark ? "light" : "dark";
+}
+var PALETTE_VARS = [
+  ["primary", "--fillo-primary"],
+  ["background", "--fillo-bg"],
+  ["text", "--fillo-text"]
+];
+var DEFAULT_PALETTE = {
+  light: { primary: "#18181b", background: "transparent", text: "#18181b" },
+  dark: { primary: "#fafafa", background: "transparent", text: "#f4f4f5" }
+};
+function resolveThemeDom(theme) {
+  const safe = resolveThemeAppearance(normalizeFormTheme(theme));
+  if (!safe) return null;
+  const vars = {};
+  const attrs = {};
+  if (safe.colorScheme) attrs["data-fillo-color-scheme"] = safe.colorScheme;
+  const dark = themeHasDarkPalette(safe) ? safe.dark : void 0;
+  for (const [key, name] of PALETTE_VARS) {
+    const light = safe[key];
+    if (!dark) {
+      if (light) vars[name] = light;
+      continue;
+    }
+    const darkValue = dark[key];
+    if (!light && !darkValue) continue;
+    vars[name] = `light-dark(${light ?? DEFAULT_PALETTE.light[key]}, ${darkValue ?? DEFAULT_PALETTE.dark[key]})`;
+  }
+  if (safe.radius) vars["--fillo-radius"] = safe.radius;
+  if (safe.fontFamily) vars["--fillo-font"] = safe.fontFamily;
+  if (dark) {
+    const lightTone = onColorTone(safe.primary ?? DEFAULT_PALETTE.light.primary);
+    const darkTone = onColorTone(dark.primary ?? DEFAULT_PALETTE.dark.primary);
+    if (lightTone && darkTone) {
+      attrs["data-fillo-on-primary"] = lightTone;
+      attrs["data-fillo-on-primary-dark"] = darkTone;
+    }
+  } else if (safe.primary) {
+    const tone = onColorTone(safe.primary);
+    if (tone) attrs["data-fillo-on-primary"] = tone;
+  }
+  if (safe.primary || safe.background || safe.text || dark) {
+    attrs["data-fillo-has-color-theme"] = "";
+  }
+  return { vars, attrs };
+}
 
 // src/define.ts
 function defineForm(def) {
@@ -4418,7 +4514,7 @@ var JSX_BLOCK_SPECS = [
   field("Ranking", "ranking", ["options"], { optionChildren: true }),
   field("Matrix", "matrix", ["rows", "columns"]),
   field("Signature", "signature", []),
-  field("Date", "date", []),
+  field("Date", "date", ["defaultToday"]),
   field("FileUpload", "file_upload", ["maxFiles", "maxFileSizeMb", "accept"]),
   field("Hidden", "hidden", ["paramName", "defaultValue"]),
   field("Calculated", "calculated", ["calc", "decimals", "prefix", "suffix"]),
@@ -4811,6 +4907,7 @@ export {
   REQUIRED_FIELD_MESSAGE,
   Sha1,
   allFields,
+  applyDateDefaults,
   assembleForm,
   codeFormFromJsx,
   computeCalculated,
@@ -4842,6 +4939,7 @@ export {
   isPossiblePhone,
   isTerminalPage,
   isValidPartialNumberText,
+  localDateString,
   localeForNotation,
   needsExplicitSubmit,
   normalizeFormSchema,
@@ -4864,6 +4962,7 @@ export {
   resolveStrings,
   resolveText,
   resolveThemeAppearance,
+  resolveThemeDom,
   respondentErrorStringsFor,
   responseScopeValue,
   schemaFromJsx,
@@ -4871,6 +4970,7 @@ export {
   shouldAutoSubmit,
   slotClass,
   syncCodeForm,
+  themeHasDarkPalette,
   toE164,
   validateField,
   validateFormSchema,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usefillo/core",
-  "version": "0.24.1",
+  "version": "0.26.0",
   "description": "Form schema, validation, logic engine and JS client for Fillo. Framework-agnostic.",
   "license": "MIT",
   "keywords": [