@hortonstudio/main 1.2.11 → 1.2.13

package/attributes-master/packages/utils/src/helpers/guards.ts

@@ -1,138 +0,0 @@
-import type { Entry, FormField } from '../types';
-
-export const isString = (value: unknown): value is string => typeof value === 'string';
-export const isNumber = (value: unknown): value is number => typeof value === 'number';
-export const isBoolean = (value: unknown): value is boolean => typeof value === 'boolean';
-export const isUndefined = (value: unknown): value is undefined => value === undefined;
-export const isDate = (value: unknown): value is Date => value instanceof Date;
-
-/**
- * It literally does nothing.
- */
-export const noop = () => {
-  // No operation.
-};
-
-/**
- * Makes sure a value is not `null` or `undefined`.
- * Useful for type safety when filtering empty elements from an array. Check out the example for more in-depth explanation.
- * @param value The value to type-check.
- * @example ```typescript
- * const items = [1, null, 4, undefined, 8];
- *
- * const filteredItemsError: number[] = items.filter((item) => value !== undefined && value !== null); // Type '(number | null | undefined)[]' is not assignable to type 'number[]'.
- *
- * const filteredItemsSuccess: number[] = items.filter(isNotEmpty); // Success!
- * ```
- */
-export const isNotEmpty = <T>(value: T | null | undefined): value is T => value !== undefined && value !== null;
-
-/**
- * Check if a key is included in a readonly array
- * @param key
- * @param source readonly array of strings
- * @returns True/false
- */
-export const isKeyOf = <T extends string>(
-  key: string | null | undefined,
-  source: readonly T[]
-): key is (typeof source)[number] => !!key && source.includes(<T>key);
-
-/**
- * Gets the keys of an object with inferred typing.
- * @param object
- * @returns
- */
-export const getObjectKeys = <T extends Record<string, unknown>>(object: T): (keyof T)[] =>
-  Object.keys(object) as (keyof T)[];
-
-/**
- * Gets type safe `Object.entries()`.
- * @param object
- */
-export const getObjectEntries = <T extends Readonly<Record<string, unknown>>>(object: T): Entry<T>[] =>
-  Object.entries(object) as Entry<T>[];
-
-/**
- * @returns `true` if the target is an instance of Element type.
- * @param target
- */
-export const isElement = (target: unknown): target is Element => target instanceof Element;
-
-/**
- * @returns `true` if the target is an instance of HTMLElement type.
- * @param target
- */
-export const isHTMLElement = (target: unknown): target is HTMLElement => target instanceof HTMLElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLVideoElement type.
- * @param target
- */
-export const isHTMLVideoElement = (target: unknown): target is HTMLVideoElement => target instanceof HTMLVideoElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLInputElement type.
- * @param target
- */
-export const isHTMLInputElement = (target: unknown): target is HTMLInputElement => target instanceof HTMLInputElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLSelectElement type.
- * @param target
- */
-export const isHTMLSelectElement = (target: unknown): target is HTMLSelectElement =>
-  target instanceof HTMLSelectElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLTextAreaElement type.
- * @param target
- */
-export const isHTMLTextAreaElement = (target: unknown): target is HTMLTextAreaElement =>
-  target instanceof HTMLTextAreaElement;
-
-/**
- * Checks if an element is a form field element
- * @param element
- */
-export const isFormField = (element: Element | EventTarget | null): element is FormField =>
-  isHTMLInputElement(element) || isHTMLSelectElement(element) || isHTMLTextAreaElement(element);
-
-/**
- * Checks if an element is a form element
- * @param target
- */
-export const isHTMLFormElement = (target: unknown): target is HTMLFormElement => target instanceof HTMLFormElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLAnchorElement type.
- * @param target
- */
-export const isHTMLAnchorElement = (target: unknown): target is HTMLAnchorElement =>
-  target instanceof HTMLAnchorElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLOptionElement type.
- * @param target
- */
-export const isHTMLOptionElement = (target: unknown): target is HTMLOptionElement =>
-  target instanceof HTMLOptionElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLImageElement type.
- * @param target
- */
-export const isHTMLImageElement = (target: unknown): target is HTMLImageElement => target instanceof HTMLImageElement;
-
-/**
- * @returns `true` if the target is an instance of HTMLButtonElement type.
- * @param target
- */
-export const isHTMLButtonElement = (target: unknown): target is HTMLButtonElement =>
-  target instanceof HTMLButtonElement;
-
-/**
- * @returns `true` if the target is an instance of File type.
- * @param target
- */
-export const isFile = (target: unknown): target is File => target instanceof File;

package/attributes-master/packages/utils/src/helpers/index.ts

@@ -1,11 +0,0 @@
-export * from './dates';
-export * from './dom';
-export * from './events';
-export * from './fetch';
-export * from './forms';
-export * from './guards';
-export * from './numbers';
-export * from './selectors';
-export * from './strings';
-export * from './wait';
-export * from './webflow';

package/attributes-master/packages/utils/src/helpers/numbers.ts

@@ -1,86 +0,0 @@
-import { isDate, isNumber } from './guards';
-
-/**
- * Converts a value to a number, removing any invalid symbols like `$` or `,`.
- * @param value
- * @returns The valid number value.
- */
-export const normalizeNumber = (value: string | number | Date) => {
-  if (isNumber(value)) return value;
-  if (isDate(value)) return value.getTime();
-  if (!value) return;
-
-  return parseFloat(value.replace(/[^0-9.-]+/g, ''));
-};
-
-/**
- * Parses a numeric Attribute string.
- * @param rawValue The raw string. Example: "20", "-25.3"...
- * @param fallback A value to fall back to when the parsed value is not valid.
- */
-export function parseNumericAttribute(rawValue: string | number | null | undefined, fallback: number): number;
-export function parseNumericAttribute(
-  rawValue: string | number | null | undefined,
-  fallback?: number | null
-): number | null;
-export function parseNumericAttribute(
-  rawValue: string | number | null | undefined,
-  fallback?: number | null
-): number | null {
-  if (!rawValue) return fallback ?? null;
-
-  const value = Number(rawValue);
-
-  if (!isNaN(value)) return value;
-  if (fallback) return fallback;
-  return null;
-}
-
-/**
- * Calculates the amount of decimals that a float number has.
- * @param value A number.
- */
-export const getDecimalPrecision = (value: number) => {
-  if (!isFinite(value)) return 0;
-
-  let exponential = 1;
-  let precision = 0;
-
-  while (Math.round(value * exponential) / exponential !== value) {
-    exponential *= 10;
-    precision += 1;
-  }
-  return precision;
-};
-
-/**
- * Ensures a decimal precision on a number.
- * @param value The number to handle.
- * @param precision The amount of decimals.
- */
-const setDecimalPrecision = (value: number, precision: number) => {
-  const pow = Math.pow(10, precision);
-
-  return Math.round(value * pow) / pow;
-};
-
-/**
- * Adjusts a numeric value to a step factor.
- * @param value The numeric value to adjust.
- * @param step The increment step.
- * @param precision The step's decimal precision. If not provided, it will be calculated.
- * @param minRange A minimum range value, used for offsetting.
- * @returns The adjusted value.
- */
-export const adjustValueToStep = (value: number, step: number, precision?: number, minRange = 0) => {
-  precision ??= getDecimalPrecision(step);
-
-  const offset = minRange > 1 ? minRange % step : 0;
-
-  const remainder = value % step;
-  const floor = offset + value - remainder;
-
-  if (remainder > step / 2) return setDecimalPrecision(floor + step, precision);
-
-  return setDecimalPrecision(floor, precision);
-};

package/attributes-master/packages/utils/src/helpers/selectors.ts

@@ -1,249 +0,0 @@
-import type { AttributeElements, AttributeSettings, FinsweetAttributeKey, LooseString } from '../types';
-
-/**
- * @returns Selector helpers for the defined Attribute Elements and Settings.
- * @param attributeKey
- * @param elements
- * @param settings
- */
-export const generateSelectors = <
-  ElementsDefinition extends AttributeElements,
-  SettingsDefinition extends AttributeSettings,
->(
-  attributeKey: FinsweetAttributeKey,
-  elements: ElementsDefinition,
-  settings: SettingsDefinition
-) => {
-  const ELEMENT_ATTRIBUTE_NAME = `fs-${attributeKey}-element`;
-  const INSTANCE_ATTRIBUTE_NAME = `fs-${attributeKey}-instance`;
-
-  /**
-   * Constructs the attribute name for a setting.
-   * @param settingKey
-   */
-  const getSettingAttributeName = (settingKey: keyof SettingsDefinition) => {
-    const { key } = settings[settingKey];
-
-    return `fs-${attributeKey}-${key}`;
-  };
-
-  /**
-   * @returns A valid CSS selector for a setting.
-   * @param settingKey The key of the setting.
-   * @param valueKey [Optional] The key of the setting value.
-   * @param explicitValue [Optional] An explicit value to use instead of a predefined setting value.
-   */
-  const getSettingSelector = <SettingKey extends keyof SettingsDefinition>(
-    settingKey: SettingKey,
-    value?: LooseString<NonNullable<SettingsDefinition[SettingKey]['values']>[number]>
-  ) => {
-    const attributeName = getSettingAttributeName(settingKey);
-
-    // With setting value
-    if (value) {
-      return `[${attributeName}="${value}" i]`;
-    }
-
-    // No setting value
-    return `[${attributeName}]`;
-  };
-
-  /**
-   * @returns A valid CSS selector for an element.
-   * @param elementKey The key of the element.
-   * @param params.instance The index of the element instance.
-   * If `null`, it will select all elements without an instance.
-   * If `undefined`, it will select all elements.
-   */
-  const getElementSelector = (
-    elementKey?: ElementsDefinition[number],
-    { instance }: { instance?: string | null } = {}
-  ) => {
-    if (!elementKey) {
-      return `[${ELEMENT_ATTRIBUTE_NAME}]`;
-    }
-
-    const elementSelector = `[${ELEMENT_ATTRIBUTE_NAME}="${elementKey}" i]`;
-
-    // If no instance is provided, select all elements
-    if (instance === undefined) {
-      return elementSelector;
-    }
-
-    // If instance is null, select all elements without an instance
-    if (instance === null) {
-      return `${elementSelector}:not([${INSTANCE_ATTRIBUTE_NAME}], [${INSTANCE_ATTRIBUTE_NAME}] ${elementSelector})`;
-    }
-
-    // If instance exists, select the specific element instance
-    const instanceSelector = `[${INSTANCE_ATTRIBUTE_NAME}="${instance}"]`;
-
-    return `${elementSelector}${instanceSelector}, ${instanceSelector} ${elementSelector}`;
-  };
-
-  /**
-   * @returns A valid CSS selector for an element instance.
-   * @param instance The instance identifier.
-   */
-  const getInstanceSelector = (instance: string) => {
-    return `[${INSTANCE_ATTRIBUTE_NAME}="${instance}"]`;
-  };
-
-  /**
-   * @returns The first element that matches the selector.
-   * @param elementKey The key of the element.
-   * @param params.instance The index of the element instance.
-   * @param params.scope The scope to query the element from. Defaults to `document`.
-   */
-  const queryElement = <E extends Element = HTMLElement>(
-    elementKey?: ElementsDefinition[number],
-    { instance, scope }: { instance?: string | null; scope?: ParentNode | null } = {}
-  ) => {
-    const selector = getElementSelector(elementKey, { instance });
-    const target = scope || document;
-
-    return target.querySelector<E>(selector);
-  };
-
-  /**
-   * @returns All elements that match the selector.
-   * @param elementKey The key of the element.
-   * @param params.instance The index of the element instance.
-   * @param params.scope The scope to query the element from. Defaults to `document`.
-   */
-  const queryAllElements = <E extends Element = HTMLElement>(
-    elementKey?: ElementsDefinition[number],
-    { instance, scope }: { instance?: string | null; scope?: ParentNode | null } = {}
-  ) => {
-    const selector = getElementSelector(elementKey, { instance });
-    const target = scope || document;
-
-    return [...target.querySelectorAll<E>(selector)];
-  };
-
-  /**
-   * @returns The instance index of an element.
-   * @param element The element to get the instance index from.
-   */
-  const getInstance = (element: Element) => {
-    const instanceHolder = element.closest(`[${INSTANCE_ATTRIBUTE_NAME}]`);
-    if (!instanceHolder) return null;
-
-    return instanceHolder.getAttribute(INSTANCE_ATTRIBUTE_NAME);
-  };
-
-  /**
-   * @returns The first ancestor that matches the selector.
-   * @param elementKey The key of the element.
-   * @param params.instance The index of the element instance.
-   */
-  const getClosestElement = <E extends Element = HTMLElement>(
-    element: Element,
-    elementKey?: ElementsDefinition[number],
-    { instance }: { instance?: string | null } = {}
-  ) => {
-    const selector = getElementSelector(elementKey, { instance });
-
-    return element.closest<E>(selector);
-  };
-
-  /**
-   * @returns The value of an attribute. It will check, in order:
-   * - The element itself.
-   * - The closest ancestor that has the attribute.
-   * - The script tags.
-   *
-   * @param element The element to get the attribute value from, or its closest ancestor that has the attribute. If `null`, it will check the script tags.
-   * @param settingKey The attribute key.
-   * @param filterInvalid Whether to filter out invalid values. Defaults to `false`.
-   */
-  const getAttribute = <
-    SettingKey extends keyof SettingsDefinition,
-    FilterInvalid extends boolean = false,
-    SettingValues = SettingsDefinition[SettingKey]['values'],
-    SettingDefaultValue = SettingsDefinition[SettingKey]['defaultValue'],
-    SettingValueIsNumeric = SettingsDefinition[SettingKey]['isNumeric'],
-    SettingValue = SettingValueIsNumeric extends true
-      ? number
-      : SettingValues extends Array<string>
-        ? FilterInvalid extends true
-          ? SettingValues[number]
-          : string
-        : string,
-  >(
-    element: Element | null,
-    settingKey: SettingKey,
-    { filterInvalid }: { filterInvalid?: FilterInvalid } = {}
-  ): SettingDefaultValue extends string ? SettingValue : SettingValue | undefined => {
-    const attributeName = getSettingAttributeName(settingKey);
-    const selector = getSettingSelector(settingKey);
-
-    const settingElement = element?.closest(selector);
-
-    // Check the element
-    let rawValue = settingElement?.getAttribute(attributeName);
-
-    // Check the script tags
-    if (!rawValue) {
-      for (const script of window.FinsweetAttributes.scripts) {
-        rawValue = script.getAttribute(attributeName);
-
-        if (rawValue) break;
-      }
-    }
-
-    // Fall back to the default value, if available
-    const { values = [], defaultValue, isNumeric } = settings[settingKey];
-
-    rawValue ??= defaultValue;
-
-    // @ts-expect-error Returning undefined is valid
-    if (!rawValue) return;
-
-    // Parse numeric values
-    if (isNumeric) {
-      let parsedValue = Number(rawValue);
-
-      if (isNaN(parsedValue) && defaultValue) {
-        parsedValue = Number(defaultValue);
-      }
-
-      if (!isNaN(parsedValue)) {
-        return parsedValue as SettingValue;
-      }
-    }
-
-    // @ts-expect-error Returning undefined is valid
-    if (filterInvalid && values.length && !values.includes(rawValue)) return;
-
-    const value = rawValue as SettingValue;
-    return value;
-  };
-
-  /**
-   * @returns Whether an element has a specific attribute value.
-   * @param element
-   * @param settingKey
-   * @param valueKey
-   */
-  const hasAttributeValue = <SettingKey extends keyof SettingsDefinition>(
-    element: Element,
-    settingKey: SettingKey,
-    value: NonNullable<SettingsDefinition[SettingKey]['values']>[number]
-  ) => {
-    return getAttribute(element, settingKey) === value;
-  };
-
-  return {
-    getClosestElement,
-    getElementSelector,
-    getSettingSelector,
-    getInstanceSelector,
-    getSettingAttributeName,
-    queryElement,
-    queryAllElements,
-    getInstance,
-    getAttribute,
-    hasAttributeValue,
-  };
-};

package/attributes-master/packages/utils/src/helpers/strings.ts

@@ -1,19 +0,0 @@
-/**
- * Convert a string of comma separated values to an array of values.
- *
- * @param string Comma separated string.
- * @param filterEmpty Defines if empty values should be filtered out of the returned array. Defaults to `true`.
- */
-export const extractCommaSeparatedValues = (string: string | null | undefined, filterEmpty = true): string[] => {
-  if (!string) return [];
-
-  const items = string.split(',').reduce<string[]>((accumulatedValue, currentValue) => {
-    const value = currentValue.trim();
-
-    if (!filterEmpty || value) accumulatedValue.push(value);
-
-    return accumulatedValue;
-  }, []);
-
-  return items;
-};

package/attributes-master/packages/utils/src/helpers/wait.ts

@@ -1,36 +0,0 @@
-import type { FinsweetAttributeKey } from '../types';
-
-/**
- * @returns Awaitable promise for waiting X time.
- * @param time
- */
-export const wait = (time: number): Promise<unknown> => new Promise((resolve) => setTimeout(resolve, time));
-
-/**
- * Waits for the defined Attribute to be fully loaded.
- * @param key The Attribute key.
- */
-export const waitAttributeLoaded = (key: FinsweetAttributeKey) => window.FinsweetAttributes.modules[key]?.loading;
-
-/**
- * @returns A promise that resolves once Webflow has fully loaded.
- */
-export const waitWebflowReady = async () => {
-  return new Promise((resolve) => {
-    window.Webflow ||= [];
-    window.Webflow.push(resolve);
-  });
-};
-
-/**
- * @returns A promise that resolves once the DOM is ready.
- */
-export const waitDOMReady = async () => {
-  return new Promise((resolve) => {
-    if (document.readyState === 'loading') {
-      document.addEventListener('DOMContentLoaded', resolve);
-    } else {
-      resolve(undefined);
-    }
-  });
-};

package/attributes-master/packages/utils/src/helpers/webflow.ts

@@ -1,117 +0,0 @@
-import { WEBFLOW_BREAKPOINTS } from '../constants';
-import type { DropdownToggle, WebflowBreakpoint, WebflowModule } from '../types';
-import { simulateEvent } from './events';
-
-/**
- * @returns The Webflow Site ID of the website.
- * @param page The page to get the site ID from. Defaults to the current page.
- */
-export const getSiteId = (page = document): string | null => page.documentElement.getAttribute('data-wf-site');
-
-/**
- * Extracts the publish date of a Webflow site
- * @returns A Date object, if found.
- * @param page The page to get the publish date from. Defaults to the current page.
- */
-export const getPublishDate = (page = document): Date | undefined => {
-  const publishDatePrefix = 'Last Published:';
-
-  for (const node of page.childNodes) {
-    if (node.nodeType === Node.COMMENT_NODE && node.textContent?.includes(publishDatePrefix)) {
-      const publishDateValue = node.textContent.trim().split(publishDatePrefix)[1];
-      if (publishDateValue) return new Date(publishDateValue);
-    }
-  }
-};
-
-/**
- * Restarts the Webflow JS library.
- *
- * @param modules An array of {@link WebflowModule} to restart. If passed, only those modules will be restarted instead of the whole `Webflow` instance.
- *
- * @returns An awaitable promise that is fulfilled when the library has been correctly reinitialized.
- */
-export const restartWebflow = async (modules?: WebflowModule[]): Promise<unknown> => {
-  const { Webflow } = window;
-  if (!Webflow || !('destroy' in Webflow) || !('ready' in Webflow) || !('require' in Webflow)) return;
-
-  if (modules && !modules.length) return;
-
-  // Global
-  if (!modules) {
-    Webflow.destroy();
-    Webflow.ready();
-  }
-
-  // IX2
-  if (!modules || modules.includes('ix2')) {
-    const ix2 = Webflow.require('ix2');
-
-    if (ix2) {
-      const { store, actions } = ix2;
-      const { eventState } = store.getState().ixSession;
-      const stateEntries = Object.entries(eventState);
-
-      if (!modules) ix2.destroy();
-
-      ix2.init();
-
-      await Promise.all(stateEntries.map((state) => store.dispatch(actions.eventStateChanged(...state))));
-    }
-  }
-
-  // Commerce
-  if (!modules || modules.includes('commerce')) {
-    const commerce = Webflow.require('commerce');
-    const siteId = getSiteId();
-
-    if (commerce && siteId) {
-      commerce.destroy();
-      commerce.init({ siteId, apiUrl: 'https://render.webflow.com' });
-    }
-  }
-
-  // Lightbox
-  if (modules?.includes('lightbox')) Webflow.require('lightbox')?.ready();
-
-  // Slider
-  if (modules?.includes('slider')) {
-    const slider = Webflow.require('slider');
-
-    if (slider) {
-      slider.redraw();
-      slider.ready();
-    }
-  }
-
-  // Tabs
-  if (modules?.includes('tabs')) Webflow.require('tabs')?.redraw();
-
-  return new Promise((resolve) => Webflow.push(() => resolve(undefined)));
-};
-
-/**
- * Checks the current breakpoint based on the window media.
- *
- * @returns A {@link WebflowBreakpoint} string.
- */
-export const getCurrentBreakpoint = (): WebflowBreakpoint => {
-  for (const [breakpoint, mediaQuery] of WEBFLOW_BREAKPOINTS) {
-    if (window.matchMedia(mediaQuery).matches) {
-      return breakpoint;
-    }
-  }
-
-  return 'main';
-};
-
-/**
- * Closes a Webflow dropdown.
- * @param dropdownToggle A {@link DropdownToggle} element.
- * @param focusToggle Defaults to `true`.
- */
-export const closeDropdown = (dropdownToggle: DropdownToggle, focusToggle = true) => {
-  if (focusToggle) dropdownToggle.focus();
-
-  simulateEvent(dropdownToggle, 'w-close');
-};

package/attributes-master/packages/utils/src/index.ts

@@ -1,5 +0,0 @@
-export * from './animations';
-export * from './components';
-export * from './constants';
-export * from './helpers';
-export * from './types';