@cube-dev/ui-kit 0.114.0 → 0.116.0

package/dist/tasty/tasty.js

@@ -0,0 +1,191 @@
+/** @license MIT | @cube-dev/ui-kit v0.116.0 | Cube Dev Team */
+import { processTokens, stringifyTokens } from "./utils/process-tokens.js";
+import { mergeStyles } from "./utils/merge-styles.js";
+import { useStyles } from "./hooks/useStyles.js";
+import { BASE_STYLES } from "./styles/list.js";
+import { getDisplayName } from "./utils/get-display-name.js";
+import { _modAttrs } from "./utils/mod-attrs.js";
+import { createElement, forwardRef, useMemo } from "react";
+import { isValidElementType } from "react-is";
+
+//#region src/tasty/tasty.tsx
+/**
+* Precalculated entries for performance optimization
+*/
+const IS_PROPERTIES_ENTRIES = Object.entries({
+	isDisabled: "disabled",
+	isHidden: "hidden",
+	isChecked: "checked"
+});
+/**
+* Helper function to handle is* properties consistently
+* Transforms is* props to HTML attributes and adds corresponding data-* attributes
+*/
+function handleIsProperties(props) {
+	for (const [isProperty, targetAttribute] of IS_PROPERTIES_ENTRIES) {
+		if (isProperty in props) {
+			props[targetAttribute] = props[isProperty];
+			delete props[isProperty];
+		}
+		const dataAttribute = `data-${targetAttribute}`;
+		if (!(dataAttribute in props) && props[targetAttribute]) props[dataAttribute] = "";
+	}
+}
+/**
+* Creates a sub-element component for compound component patterns.
+* Sub-elements are lightweight components with data-element attribute for CSS targeting.
+*/
+function createSubElement(elementName, definition) {
+	const config = typeof definition === "string" ? { as: definition } : definition;
+	const tag = config.as ?? "div";
+	const defaultQa = config.qa;
+	const defaultQaVal = config.qaVal;
+	const SubElement = forwardRef((props, ref) => {
+		const { qa, qaVal, mods, tokens, isDisabled, isHidden, isChecked, className, style, ...htmlProps } = props;
+		let modProps;
+		if (mods) modProps = _modAttrs(mods);
+		const tokenStyle = tokens ? processTokens(tokens) : void 0;
+		let mergedStyle;
+		if (tokenStyle || style) mergedStyle = tokenStyle && style ? {
+			...tokenStyle,
+			...style
+		} : tokenStyle ?? style;
+		const elementProps = {
+			"data-element": elementName,
+			"data-qa": qa ?? defaultQa,
+			"data-qaval": qaVal ?? defaultQaVal,
+			...modProps || {},
+			...htmlProps,
+			className,
+			style: mergedStyle,
+			isDisabled,
+			isHidden,
+			isChecked,
+			ref
+		};
+		handleIsProperties(elementProps);
+		if (elementProps["data-qa"] === void 0) delete elementProps["data-qa"];
+		if (elementProps["data-qaval"] === void 0) delete elementProps["data-qaval"];
+		return createElement(tag, elementProps);
+	});
+	SubElement.displayName = `SubElement(${elementName})`;
+	return SubElement;
+}
+function tasty(Component, options) {
+	if (isValidElementType(Component)) return tastyWrap(Component, options);
+	return tastyElement(Component);
+}
+function tastyWrap(Component, options) {
+	let { as: extendTag, element: extendElement, ...defaultProps } = options ?? {};
+	let propsWithStyles = ["styles"].concat(Object.keys(defaultProps).filter((prop) => prop.endsWith("Styles")));
+	const _WrappedComponent = forwardRef((props, ref) => {
+		const { as, element, ...restProps } = props;
+		const mergedStylesMap = useMemo(() => {
+			return propsWithStyles.reduce((map, prop) => {
+				const restValue = restProps[prop];
+				const defaultValue = defaultProps[prop];
+				if (restValue != null && defaultValue != null) map[prop] = mergeStyles(defaultValue, restValue);
+				else map[prop] = restValue ?? defaultValue;
+				return map;
+			}, {});
+		}, [propsWithStyles.map((prop) => props[prop])]);
+		return createElement(Component, {
+			...defaultProps,
+			...restProps,
+			...mergedStylesMap,
+			as: as ?? extendTag,
+			element: element || extendElement,
+			ref
+		});
+	});
+	_WrappedComponent.displayName = `TastyWrappedComponent(${getDisplayName(Component, defaultProps.qa ?? extendTag ?? "Anonymous")})`;
+	return _WrappedComponent;
+}
+function tastyElement(tastyOptions) {
+	let { as: originalAs = "div", element: defaultElement, styles: defaultStyles, styleProps, variants, tokens: defaultTokens, elements, ...defaultProps } = tastyOptions;
+	let variantStylesMap;
+	if (variants) {
+		variantStylesMap = Object.entries(variants).reduce((map, [variant, variantStyles]) => {
+			map[variant] = mergeStyles(defaultStyles, variantStyles);
+			return map;
+		}, {});
+		if (!variantStylesMap["default"]) variantStylesMap["default"] = defaultStyles;
+	}
+	let { qa: defaultQa, qaVal: defaultQaVal, ...otherDefaultProps } = defaultProps ?? {};
+	const _TastyComponent = forwardRef((allProps, ref) => {
+		let { as, styles, variant, mods, element, qa, qaVal, className: userClassName, tokens, style, ...otherProps } = allProps;
+		let propStyles = null;
+		const propsToCheck = styleProps ? styleProps.concat(BASE_STYLES) : BASE_STYLES;
+		for (const prop of propsToCheck) {
+			const key = prop;
+			if (!propStyles) propStyles = {};
+			if (key in otherProps) {
+				propStyles[key] = otherProps[key];
+				delete otherProps[key];
+			}
+		}
+		if (!styles || styles && Object.keys(styles).length === 0) styles = void 0;
+		const baseStyles = variantStylesMap ? variantStylesMap[variant || "default"] ?? variantStylesMap["default"] : defaultStyles;
+		const { className: stylesClassName } = useStyles(useMemo(() => {
+			const hasStyles = styles && Object.keys(styles).length > 0;
+			const hasPropStyles = propStyles && Object.keys(propStyles).length > 0;
+			if (!hasStyles && !hasPropStyles) return baseStyles;
+			return mergeStyles(baseStyles, styles, propStyles);
+		}, [
+			baseStyles,
+			styles,
+			propStyles
+		]));
+		const mergedTokens = useMemo(() => {
+			if (!defaultTokens && !tokens) return void 0;
+			if (!defaultTokens) return tokens;
+			if (!tokens) return defaultTokens;
+			return {
+				...defaultTokens,
+				...tokens
+			};
+		}, [stringifyTokens(tokens)]);
+		const processedTokenStyle = useMemo(() => {
+			return processTokens(mergedTokens);
+		}, [mergedTokens]);
+		const mergedStyle = useMemo(() => {
+			if (!processedTokenStyle && !style) return void 0;
+			if (!processedTokenStyle) return style;
+			if (!style) return processedTokenStyle;
+			return {
+				...processedTokenStyle,
+				...style
+			};
+		}, [processedTokenStyle, style]);
+		let modProps;
+		if (mods) modProps = _modAttrs(mods);
+		const finalClassName = [userClassName || "", stylesClassName].filter(Boolean).join(" ");
+		const elementProps = {
+			"data-element": element || defaultElement,
+			"data-qa": qa || defaultQa,
+			"data-qaval": qaVal || defaultQaVal,
+			...otherDefaultProps,
+			...modProps || {},
+			...otherProps,
+			className: finalClassName,
+			style: mergedStyle,
+			ref
+		};
+		handleIsProperties(elementProps);
+		return createElement(as ?? originalAs, elementProps);
+	});
+	_TastyComponent.displayName = `TastyComponent(${defaultProps.qa || originalAs})`;
+	if (elements) {
+		const subElements = Object.entries(elements).reduce((acc, [name, definition]) => {
+			acc[name] = createSubElement(name, definition);
+			return acc;
+		}, {});
+		return Object.assign(_TastyComponent, subElements);
+	}
+	return _TastyComponent;
+}
+const Element = tasty({});
+
+//#endregion
+export { Element, tasty };
+//# sourceMappingURL=tasty.js.map

package/dist/tasty/tasty.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tasty.js","names":["modAttrs"],"sources":["../../src/tasty/tasty.tsx"],"sourcesContent":["import {\n  AllHTMLAttributes,\n  ComponentType,\n  createElement,\n  forwardRef,\n  ForwardRefExoticComponent,\n  JSX,\n  PropsWithoutRef,\n  RefAttributes,\n  useMemo,\n} from 'react';\nimport { isValidElementType } from 'react-is';\n\nimport { useStyles } from './hooks/useStyles';\nimport { BASE_STYLES } from './styles/list';\nimport { Styles, StylesInterface } from './styles/types';\nimport {\n  AllBaseProps,\n  BaseProps,\n  BaseStyleProps,\n  Mods,\n  Props,\n  Tokens,\n} from './types';\nimport { getDisplayName } from './utils/get-display-name';\nimport { mergeStyles } from './utils/merge-styles';\nimport { modAttrs } from './utils/mod-attrs';\nimport { processTokens, stringifyTokens } from './utils/process-tokens';\n\nimport type { StyleValue, StyleValueStateMap } from './utils/styles';\n\n/**\n * Mapping of is* properties to their corresponding HTML attributes\n */\nconst IS_PROPERTIES_MAP = {\n  isDisabled: 'disabled',\n  isHidden: 'hidden',\n  isChecked: 'checked',\n} as const;\n\n/**\n * Precalculated entries for performance optimization\n */\nconst IS_PROPERTIES_ENTRIES = Object.entries(IS_PROPERTIES_MAP);\n\n/**\n * Helper function to handle is* properties consistently\n * Transforms is* props to HTML attributes and adds corresponding data-* attributes\n */\nfunction handleIsProperties(props: Record<string, unknown>) {\n  for (const [isProperty, targetAttribute] of IS_PROPERTIES_ENTRIES) {\n    if (isProperty in props) {\n      props[targetAttribute] = props[isProperty];\n      delete props[isProperty];\n    }\n\n    // Add data-* attribute if target attribute is truthy and doesn't already exist\n    const dataAttribute = `data-${targetAttribute}`;\n    if (!(dataAttribute in props) && props[targetAttribute]) {\n      props[dataAttribute] = '';\n    }\n  }\n}\n\n// Basic props accepted by our base element\ntype BaseElementProps = { as?: string } & Record<string, unknown>;\n\n/**\n * Creates a sub-element component for compound component patterns.\n * Sub-elements are lightweight components with data-element attribute for CSS targeting.\n */\nfunction createSubElement<Tag extends keyof JSX.IntrinsicElements>(\n  elementName: string,\n  definition: SubElementDefinition<Tag>,\n): ForwardRefExoticComponent<\n  PropsWithoutRef<SubElementProps<Tag>> & RefAttributes<unknown>\n> {\n  // Normalize definition to object form\n  const config =\n    typeof definition === 'string'\n      ? { as: definition as Tag }\n      : (definition as { as?: Tag; qa?: string; qaVal?: string | number });\n\n  const tag = config.as ?? ('div' as Tag);\n  const defaultQa = config.qa;\n  const defaultQaVal = config.qaVal;\n\n  const SubElement = forwardRef<unknown, SubElementProps<Tag>>((props, ref) => {\n    const {\n      qa,\n      qaVal,\n      mods,\n      tokens,\n      isDisabled,\n      isHidden,\n      isChecked,\n      className,\n      style,\n      ...htmlProps\n    } = props as SubElementProps<Tag> & {\n      className?: string;\n      style?: Record<string, unknown>;\n    };\n\n    // Build mod attributes\n    let modProps: Record<string, unknown> | undefined;\n    if (mods) {\n      modProps = modAttrs(mods as Mods) as Record<string, unknown>;\n    }\n\n    // Process tokens into inline style properties\n    const tokenStyle = tokens\n      ? (processTokens(tokens) as Record<string, unknown>)\n      : undefined;\n\n    // Merge token styles with explicit style prop (style has priority)\n    let mergedStyle: Record<string, unknown> | undefined;\n    if (tokenStyle || style) {\n      mergedStyle =\n        tokenStyle && style\n          ? { ...tokenStyle, ...style }\n          : ((tokenStyle ?? style) as Record<string, unknown>);\n    }\n\n    const elementProps = {\n      'data-element': elementName,\n      'data-qa': qa ?? defaultQa,\n      'data-qaval': qaVal ?? defaultQaVal,\n      ...(modProps || {}),\n      ...htmlProps,\n      className,\n      style: mergedStyle,\n      isDisabled,\n      isHidden,\n      isChecked,\n      ref,\n    } as Record<string, unknown>;\n\n    // Handle is* properties (isDisabled -> disabled + data-disabled, etc.)\n    handleIsProperties(elementProps);\n\n    // Clean up undefined data attributes\n    if (elementProps['data-qa'] === undefined) delete elementProps['data-qa'];\n    if (elementProps['data-qaval'] === undefined)\n      delete elementProps['data-qaval'];\n\n    return createElement(tag, elementProps);\n  });\n\n  SubElement.displayName = `SubElement(${elementName})`;\n\n  return SubElement as ForwardRefExoticComponent<\n    PropsWithoutRef<SubElementProps<Tag>> & RefAttributes<unknown>\n  >;\n}\n\ntype StyleList = readonly (keyof {\n  [key in keyof StylesInterface]: StylesInterface[key];\n})[];\n\nexport type PropsWithStyles = {\n  styles?: Styles;\n} & Omit<Props, 'styles'>;\n\nexport type VariantMap = Record<string, Styles>;\n\nexport type WithVariant<V extends VariantMap> = {\n  variant?: keyof V;\n};\n\n// ============================================================================\n// Sub-element types for compound components\n// ============================================================================\n\n/**\n * Definition for a sub-element. Can be either:\n * - A tag name string (e.g., 'div', 'span')\n * - An object with configuration options\n */\nexport type SubElementDefinition<\n  Tag extends keyof JSX.IntrinsicElements = 'div',\n> =\n  | Tag\n  | {\n      as?: Tag;\n      qa?: string;\n      qaVal?: string | number;\n    };\n\n/**\n * Map of sub-element definitions.\n * Keys become the sub-component names (e.g., { Icon: 'span' } -> Component.Icon)\n */\nexport type ElementsDefinition = Record<\n  string,\n  SubElementDefinition<keyof JSX.IntrinsicElements>\n>;\n\n/**\n * Resolves the tag from a SubElementDefinition\n */\ntype ResolveElementTag<T extends SubElementDefinition<any>> = T extends string\n  ? T\n  : T extends { as?: infer Tag }\n    ? Tag extends keyof JSX.IntrinsicElements\n      ? Tag\n      : 'div'\n    : 'div';\n\n/**\n * Props for sub-element components.\n * Combines HTML attributes with tasty-specific props (qa, qaVal, mods, tokens, isDisabled, etc.)\n */\nexport type SubElementProps<Tag extends keyof JSX.IntrinsicElements = 'div'> =\n  Omit<\n    JSX.IntrinsicElements[Tag],\n    'ref' | 'color' | 'content' | 'translate'\n  > & {\n    qa?: string;\n    qaVal?: string | number;\n    mods?: Mods;\n    tokens?: Tokens;\n    isDisabled?: boolean;\n    isHidden?: boolean;\n    isChecked?: boolean;\n  };\n\n/**\n * Generates the sub-element component types from an ElementsDefinition\n */\ntype SubElementComponents<E extends ElementsDefinition> = {\n  [K in keyof E]: ForwardRefExoticComponent<\n    PropsWithoutRef<SubElementProps<ResolveElementTag<E[K]>>> &\n      RefAttributes<\n        ResolveElementTag<E[K]> extends keyof HTMLElementTagNameMap\n          ? HTMLElementTagNameMap[ResolveElementTag<E[K]>]\n          : Element\n      >\n  >;\n};\n\n/**\n * Base type containing common properties shared between TastyProps and TastyElementOptions.\n * Separated to avoid code duplication while allowing different type constraints.\n */\ntype TastyBaseProps<\n  K extends StyleList,\n  V extends VariantMap,\n  E extends ElementsDefinition = {},\n> = {\n  /** Default styles of the element. */\n  styles?: Styles;\n  /** The list of styles that can be provided by props */\n  styleProps?: K;\n  element?: BaseProps['element'];\n  variants?: V;\n  /** Default tokens for inline CSS custom properties */\n  tokens?: Tokens;\n  /** Sub-element definitions for compound components */\n  elements?: E;\n} & Pick<BaseProps, 'qa' | 'qaVal'> &\n  WithVariant<V>;\n\nexport type TastyProps<\n  K extends StyleList,\n  V extends VariantMap,\n  E extends ElementsDefinition = {},\n  DefaultProps = Props,\n> = TastyBaseProps<K, V, E> & {\n  /** The tag name of the element or a React component. */\n  as?: string | ComponentType<any>;\n} & Partial<Omit<DefaultProps, 'as' | 'styles' | 'styleProps' | 'tokens'>>;\n\n/**\n * TastyElementOptions is used for the element-creation overload of tasty().\n * It includes a Tag generic that allows TypeScript to infer the correct\n * HTML element type from the `as` prop.\n *\n * Note: Uses a separate index signature with `unknown` instead of inheriting\n * from Props (which has `any`) to ensure strict type checking for styles.\n */\nexport type TastyElementOptions<\n  K extends StyleList,\n  V extends VariantMap,\n  E extends ElementsDefinition = {},\n  Tag extends keyof JSX.IntrinsicElements = 'div',\n> = TastyBaseProps<K, V, E> & {\n  /** The tag name of the element or a React component. */\n  as?: Tag | ComponentType<any>;\n} & {\n  /** Allow additional props without polluting style type checking */\n  [key: string]: unknown;\n};\n\nexport type AllBasePropsWithMods<K extends StyleList> = AllBaseProps & {\n  [key in K[number]]?:\n    | StyleValue<StylesInterface[key]>\n    | StyleValueStateMap<StylesInterface[key]>;\n} & BaseStyleProps;\n\n/**\n * Keys from BasePropsWithoutChildren that should be omitted from HTML attributes.\n * This excludes event handlers so they can be properly typed from JSX.IntrinsicElements.\n */\ntype TastySpecificKeys =\n  | 'as'\n  | 'qa'\n  | 'qaVal'\n  | 'element'\n  | 'styles'\n  | 'breakpoints'\n  | 'block'\n  | 'inline'\n  | 'mods'\n  | 'isHidden'\n  | 'isDisabled'\n  | 'css'\n  | 'style'\n  | 'theme'\n  | 'tokens'\n  | 'ref'\n  | 'color';\n\n/**\n * Props type for tasty elements that combines:\n * - AllBasePropsWithMods for style props with strict tokens type\n * - HTML attributes for flexibility (properly typed based on tag)\n * - Variant support\n *\n * Uses AllHTMLAttributes as base for common attributes (like disabled),\n * but overrides event handlers with tag-specific types from JSX.IntrinsicElements.\n */\nexport type TastyElementProps<\n  K extends StyleList,\n  V extends VariantMap,\n  Tag extends keyof JSX.IntrinsicElements = 'div',\n> = AllBasePropsWithMods<K> &\n  WithVariant<V> &\n  Omit<\n    Omit<AllHTMLAttributes<HTMLElement>, keyof JSX.IntrinsicElements[Tag]> &\n      JSX.IntrinsicElements[Tag],\n    TastySpecificKeys | K[number]\n  >;\n\ntype TastyComponentPropsWithDefaults<\n  Props extends PropsWithStyles,\n  DefaultProps extends Partial<Props>,\n> = keyof DefaultProps extends never\n  ? Props\n  : {\n      [key in Extract<keyof Props, keyof DefaultProps>]?: Props[key];\n    } & {\n      [key in keyof Omit<Props, keyof DefaultProps>]: Props[key];\n    };\n\nexport function tasty<\n  K extends StyleList,\n  V extends VariantMap,\n  E extends ElementsDefinition = {},\n  Tag extends keyof JSX.IntrinsicElements = 'div',\n>(\n  options: TastyElementOptions<K, V, E, Tag>,\n  secondArg?: never,\n): ForwardRefExoticComponent<\n  PropsWithoutRef<TastyElementProps<K, V, Tag>> & RefAttributes<unknown>\n> &\n  SubElementComponents<E>;\nexport function tasty<\n  Props extends PropsWithStyles,\n  DefaultProps extends Partial<Props> = Partial<Props>,\n>(\n  Component: ComponentType<Props>,\n  options?: TastyProps<never, never, {}, Props>,\n): ComponentType<TastyComponentPropsWithDefaults<Props, DefaultProps>>;\n\n// Implementation\nexport function tasty<\n  K extends StyleList,\n  V extends VariantMap,\n  C = Record<string, unknown>,\n>(Component: any, options?: any) {\n  if (isValidElementType(Component)) {\n    return tastyWrap(Component as ComponentType<any>, options);\n  }\n\n  return tastyElement(Component as TastyProps<K, V>);\n}\n\nfunction tastyWrap<\n  P extends PropsWithStyles,\n  DefaultProps extends Partial<P> = Partial<P>,\n>(\n  Component: ComponentType<P>,\n  options?: TastyProps<never, never, P>,\n): ComponentType<TastyComponentPropsWithDefaults<P, DefaultProps>> {\n  let {\n    as: extendTag,\n    element: extendElement,\n    ...defaultProps\n  } = (options ?? {}) as TastyProps<never, never, P>;\n\n  let propsWithStyles = ['styles'].concat(\n    Object.keys(defaultProps).filter((prop) => prop.endsWith('Styles')),\n  );\n\n  const _WrappedComponent = forwardRef<any, any>((props, ref) => {\n    const { as, element, ...restProps } = props as Record<string, unknown>;\n    const propsWithStylesValues = propsWithStyles.map(\n      (prop) => (props as any)[prop],\n    );\n\n    const mergedStylesMap: Styles | undefined = useMemo(() => {\n      return propsWithStyles.reduce((map, prop) => {\n        const restValue = (restProps as any)[prop];\n        const defaultValue = (defaultProps as any)[prop];\n\n        if (restValue != null && defaultValue != null) {\n          (map as any)[prop] = mergeStyles(defaultValue, restValue);\n        } else {\n          (map as any)[prop] = restValue ?? defaultValue;\n        }\n\n        return map;\n      }, {} as Styles);\n    }, [propsWithStylesValues]);\n\n    const elementProps = {\n      ...(defaultProps as unknown as Record<string, unknown>),\n      ...(restProps as unknown as Record<string, unknown>),\n      ...(mergedStylesMap as unknown as Record<string, unknown>),\n      as: (as as string | undefined) ?? extendTag,\n      element: (element as string | undefined) || extendElement,\n      ref,\n    } as unknown as P;\n\n    return createElement(Component as ComponentType<P>, elementProps);\n  });\n\n  _WrappedComponent.displayName = `TastyWrappedComponent(${getDisplayName(\n    Component,\n    (defaultProps as any).qa ?? (extendTag as any) ?? 'Anonymous',\n  )})`;\n\n  return _WrappedComponent as unknown as ComponentType<\n    TastyComponentPropsWithDefaults<P, DefaultProps>\n  >;\n}\n\nfunction tastyElement<\n  K extends StyleList,\n  V extends VariantMap,\n  E extends ElementsDefinition,\n>(tastyOptions: TastyProps<K, V, E>) {\n  let {\n    as: originalAs = 'div',\n    element: defaultElement,\n    styles: defaultStyles,\n    styleProps,\n    variants,\n    tokens: defaultTokens,\n    elements,\n    ...defaultProps\n  } = tastyOptions;\n\n  // Pre-compute merged styles for each variant (if variants are defined)\n  // This avoids creating separate component instances per variant\n  let variantStylesMap: Record<string, Styles | undefined> | undefined;\n  if (variants) {\n    const variantEntries = Object.entries(variants) as [string, Styles][];\n    variantStylesMap = variantEntries.reduce(\n      (map, [variant, variantStyles]) => {\n        map[variant] = mergeStyles(defaultStyles, variantStyles);\n        return map;\n      },\n      {} as Record<string, Styles | undefined>,\n    );\n    // Ensure 'default' variant always exists\n    if (!variantStylesMap['default']) {\n      variantStylesMap['default'] = defaultStyles;\n    }\n  }\n\n  let {\n    qa: defaultQa,\n    qaVal: defaultQaVal,\n    ...otherDefaultProps\n  } = defaultProps ?? {};\n\n  const _TastyComponent = forwardRef<\n    unknown,\n    AllBasePropsWithMods<K> & WithVariant<V>\n  >((allProps, ref) => {\n    let {\n      as,\n      styles,\n      variant,\n      mods,\n      element,\n      qa,\n      qaVal,\n      className: userClassName,\n      tokens,\n      style,\n      ...otherProps\n    } = allProps as Record<string, unknown> as AllBasePropsWithMods<K> &\n      WithVariant<V> & {\n        className?: string;\n        tokens?: Tokens;\n        style?: Record<string, unknown>;\n      };\n\n    // Optimize propStyles extraction - avoid creating empty objects\n    let propStyles: Styles | null = null;\n    const propsToCheck = styleProps\n      ? (styleProps as StyleList).concat(BASE_STYLES)\n      : BASE_STYLES;\n\n    for (const prop of propsToCheck) {\n      const key = prop as unknown as string;\n\n      if (!propStyles) propStyles = {};\n\n      if (key in otherProps) {\n        (propStyles as any)[key] = (otherProps as any)[key];\n        delete (otherProps as any)[key];\n      }\n    }\n\n    if (\n      !styles ||\n      (styles && Object.keys(styles as Record<string, unknown>).length === 0)\n    ) {\n      styles = undefined as unknown as Styles;\n    }\n\n    // Determine base styles: use variant styles if available, otherwise default styles\n    const baseStyles = variantStylesMap\n      ? variantStylesMap[(variant as string) || 'default'] ??\n        variantStylesMap['default']\n      : defaultStyles;\n\n    // Merge base styles with instance styles and prop styles\n    const allStyles = useMemo(() => {\n      const hasStyles =\n        styles && Object.keys(styles as Record<string, unknown>).length > 0;\n      const hasPropStyles = propStyles && Object.keys(propStyles).length > 0;\n\n      if (!hasStyles && !hasPropStyles) {\n        return baseStyles;\n      }\n\n      return mergeStyles(baseStyles, styles as Styles, propStyles as Styles);\n    }, [baseStyles, styles, propStyles]);\n\n    // Use the useStyles hook for style generation and injection\n    const { className: stylesClassName } = useStyles(allStyles);\n\n    // Merge default tokens with instance tokens (instance overrides defaults)\n    const tokensKey = stringifyTokens(tokens as Tokens | undefined);\n    const mergedTokens = useMemo(() => {\n      if (!defaultTokens && !tokens) return undefined;\n      if (!defaultTokens) return tokens as Tokens;\n      if (!tokens) return defaultTokens;\n      return { ...defaultTokens, ...tokens } as Tokens;\n    }, [tokensKey]);\n\n    // Process merged tokens into inline style properties\n    const processedTokenStyle = useMemo(() => {\n      return processTokens(mergedTokens);\n    }, [mergedTokens]);\n\n    // Merge processed tokens with explicit style prop (style has priority)\n    const mergedStyle = useMemo(() => {\n      if (!processedTokenStyle && !style) return undefined;\n      if (!processedTokenStyle) return style;\n      if (!style) return processedTokenStyle;\n      return { ...processedTokenStyle, ...style };\n    }, [processedTokenStyle, style]);\n\n    let modProps: Record<string, unknown> | undefined;\n    if (mods) {\n      const modsObject = mods as unknown as Record<string, unknown>;\n      modProps = modAttrs(modsObject as any) as Record<string, unknown>;\n    }\n\n    // Merge user className with generated className\n    const finalClassName = [(userClassName as string) || '', stylesClassName]\n      .filter(Boolean)\n      .join(' ');\n\n    const elementProps = {\n      'data-element': (element as string | undefined) || defaultElement,\n      'data-qa': (qa as string | undefined) || defaultQa,\n      'data-qaval': (qaVal as string | undefined) || defaultQaVal,\n      ...(otherDefaultProps as unknown as Record<string, unknown>),\n      ...(modProps || {}),\n      ...(otherProps as unknown as Record<string, unknown>),\n      className: finalClassName,\n      style: mergedStyle,\n      ref,\n    } as Record<string, unknown>;\n\n    // Apply the helper to handle is* properties\n    handleIsProperties(elementProps);\n\n    const renderedElement = createElement(\n      (as as string | 'div') ?? originalAs,\n      elementProps,\n    );\n\n    return renderedElement;\n  });\n\n  _TastyComponent.displayName = `TastyComponent(${\n    (defaultProps as any).qa || originalAs\n  })`;\n\n  // Attach sub-element components if elements are defined\n  if (elements) {\n    const subElements = Object.entries(elements).reduce(\n      (acc, [name, definition]) => {\n        acc[name] = createSubElement(\n          name,\n          definition as SubElementDefinition<keyof JSX.IntrinsicElements>,\n        );\n        return acc;\n      },\n      {} as Record<string, ForwardRefExoticComponent<any>>,\n    );\n\n    return Object.assign(_TastyComponent, subElements);\n  }\n\n  return _TastyComponent;\n}\n\nexport const Element = tasty({});\n"],"mappings":"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"}

package/dist/tasty/types.d.ts

@@ -0,0 +1,192 @@
+
+import { Styles } from "./styles/types.js";
+import { BASE_STYLES, BLOCK_INNER_STYLES, BLOCK_OUTER_STYLES, BLOCK_STYLES, COLOR_STYLES, CONTAINER_STYLES, DIMENSION_STYLES, FLOW_STYLES, OUTER_STYLES, POSITION_STYLES, TEXT_STYLES } from "./styles/list.js";
+import { AllHTMLAttributes, CSSProperties, ComponentType } from "react";
+import { AriaLabelingProps } from "@react-types/shared";
+
+//#region src/tasty/types.d.ts
+interface GlobalStyledProps {
+  breakpoints?: number[];
+}
+/**
+ * Extensible interface for theme names.
+ * Augment this interface to register project-specific theme names for autocomplete.
+ *
+ * @example
+ * ```typescript
+ * declare module '@cube-dev/ui-kit' {
+ *   interface TastyThemeNames {
+ *     danger: true;
+ *     success: true;
+ *   }
+ * }
+ * ```
+ */
+interface TastyThemeNames {}
+type ThemeNameKey = Extract<keyof TastyThemeNames, string>;
+type ThemeName = [ThemeNameKey] extends [never] ? string : ThemeNameKey;
+/** Allowed mod value types */
+type ModValue = boolean | string | number | undefined | null;
+/**
+ * Type for element modifiers (mods prop).
+ * Can be used as a generic to define known modifiers with autocomplete:
+ * @example
+ * type ButtonMods = Mods<{
+ *   loading?: boolean;
+ *   selected?: boolean;
+ * }>;
+ */
+type Mods<T extends Record<string, ModValue> = {}> = T & {
+  [key: string]: ModValue;
+};
+/**
+ * Token value: string or number (processed), boolean for special handling, undefined/null (skipped).
+ * For color tokens (#name), boolean `true` is converted to `transparent`.
+ * For non-color tokens ($name), boolean `true` results in an empty string value.
+ * Boolean `false` results in no CSS output (token is skipped).
+ */
+type TokenValue = string | number | boolean | undefined | null;
+/**
+ * Tokens definition for inline CSS custom properties.
+ * - `$name` keys become `--name` CSS properties
+ * - `#name` keys become `--name-color` and `--name-color-rgb` CSS properties
+ */
+type Tokens = {
+  [key: `$${string}` | `#${string}`]: TokenValue;
+};
+type Caps = 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I' | 'J' | 'K' | 'L' | 'M' | 'N' | 'O' | 'P' | 'Q' | 'R' | 'S' | 'T' | 'U' | 'V' | 'W' | 'X' | 'Y' | 'Z';
+interface BasePropsWithoutChildren<K extends TagName = TagName> extends Pick<AllHTMLAttributes<HTMLElement>, 'className' | 'role' | 'id'> {
+  /** The HTML tag or React component to render as */
+  as?: K | ComponentType<any>;
+  /** QA ID for e2e testing. An alias for `data-qa` attribute. */
+  qa?: string;
+  /** QA value for e2e testing. An alias for `data-qaval` attribute. */
+  qaVal?: string | number;
+  /** Inner element name */
+  element?: `${Caps}${string}`;
+  /** The style map */
+  styles?: Styles;
+  /** The list of responsive points in pixels */
+  breakpoints?: number[];
+  /** Whether the element has the block layout outside */
+  block?: boolean;
+  /** Whether the element has the inline layout outside */
+  inline?: boolean;
+  /** The list of element modifiers **/
+  mods?: Mods;
+  /** Whether the element is hidden (`hidden` attribute is set) */
+  isHidden?: boolean;
+  /** Whether the element is disabled (`disabled` attribute is set) */
+  isDisabled?: boolean;
+  /** Plain css for the element */
+  css?: string;
+  /** The CSS style map */
+  style?: CSSProperties | (CSSProperties & {
+    [key: string]: string | number | null | undefined;
+  });
+  /** User-defined theme for the element. Mapped to `data-theme` attribute. Augment `TastyThemeNames` to register project-specific themes for autocomplete. */
+  theme?: ThemeName | (string & {});
+  /** CSS custom property tokens rendered as inline styles */
+  tokens?: Tokens;
+}
+interface BaseProps<K extends TagName = TagName> extends AriaLabelingProps, BasePropsWithoutChildren<K>, Pick<AllHTMLAttributes<HTMLElementTagNameMap[K]>, 'children'> {}
+interface AllBaseProps<K extends TagName = TagName> extends BaseProps<K>, Omit<AllHTMLAttributes<HTMLElementTagNameMap[K]>, 'style' | 'disabled' | 'hidden' | 'css' | 'content' | 'translate' | 'as' | 'form' | 'bgcolor' | 'background' | 'align' | 'border' | 'color' | 'height' | 'size' | 'width' | 'prefix'> {}
+type BaseStyleProps = Pick<Styles, (typeof BASE_STYLES)[number]>;
+type PositionStyleProps = Pick<Styles, (typeof POSITION_STYLES)[number]>;
+type BlockStyleProps = Pick<Styles, (typeof BLOCK_STYLES)[number]>;
+type BlockInnerStyleProps = Pick<Styles, (typeof BLOCK_INNER_STYLES)[number]>;
+type BlockOuterStyleProps = Pick<Styles, (typeof BLOCK_OUTER_STYLES)[number]>;
+type ColorStyleProps = Pick<Styles, (typeof COLOR_STYLES)[number]>;
+type TextStyleProps = Pick<Styles, (typeof TEXT_STYLES)[number]>;
+type DimensionStyleProps = Pick<Styles, (typeof DIMENSION_STYLES)[number]>;
+type FlowStyleProps = Pick<Styles, (typeof FLOW_STYLES)[number]>;
+type ContainerStyleProps = Pick<Styles, (typeof CONTAINER_STYLES)[number]>;
+type OuterStyleProps = Pick<Styles, (typeof OUTER_STYLES)[number]>;
+type ShortGridStyles = {
+  template?: Styles['gridTemplate'];
+  columns?: Styles['gridColumns'];
+  rows?: Styles['gridRows'];
+  areas?: Styles['gridAreas'];
+};
+interface Props {
+  [key: string]: any;
+}
+type TagName = keyof HTMLElementTagNameMap;
+/**
+ * Configuration type for tasty.config.ts files.
+ * Used by the Tasty VSCode extension for validation and autocomplete.
+ *
+ * @example
+ * ```typescript
+ * import type { TastyExtensionConfig } from '@cube-dev/ui-kit';
+ *
+ * const config: TastyExtensionConfig = {
+ *   tokens: ['#primary', '#danger', '$spacing'],
+ *   units: ['x', 'r', 'bw'],
+ *   states: ['@mobile', '@tablet', '@dark'],
+ *   presets: ['h1', 'h2', 't1', 't2'],
+ * };
+ *
+ * export default config;
+ * ```
+ */
+interface TastyExtensionConfig {
+  /**
+   * Extend another config file. Path is relative to this config file.
+   * The extended config is merged first, then this config's values are added.
+   * @example '../tasty.config.ts'
+   */
+  extends?: string;
+  /**
+   * Valid token names for validation and autocomplete.
+   * Use # prefix for colors, $ prefix for custom properties.
+   * Set to `false` to disable token validation (overrides parent).
+   * @example ['#primary', '#danger', '$spacing', '$gap']
+   */
+  tokens?: false | string[];
+  /**
+   * Valid custom unit names.
+   * Set to `false` to disable unit validation (overrides parent).
+   * @example ['x', 'r', 'bw', 'cols']
+   */
+  units?: false | string[];
+  /**
+   * Valid custom function names.
+   * Set to `false` to disable function validation (overrides parent).
+   * @example ['clamp', 'double']
+   */
+  funcs?: false | string[];
+  /**
+   * State alias names for autocomplete.
+   * Must start with @ prefix.
+   * @example ['@mobile', '@tablet', '@dark']
+   */
+  states?: string[];
+  /**
+   * Valid preset names for the `preset` style property.
+   * Tasty has no built-in presets - they are project-specific.
+   * @example ['h1', 'h2', 'h3', 't1', 't2', 't3', 'tag']
+   */
+  presets?: string[];
+  /**
+   * Custom style property names added via configure({ handlers }).
+   * Suppresses "unknown property" warnings for these names.
+   * @example ['myGradient', 'customLayout', 'brandBorder']
+   */
+  styles?: string[];
+  /**
+   * Descriptions for presets, shown on hover in the extension.
+   * Maps preset names to human-readable descriptions.
+   * @example { h1: 'Heading 1 (36px/44px, semibold)', t1: 'Text large (18px/24px)' }
+   */
+  presetDescriptions?: Record<string, string>;
+  /**
+   * Descriptions for state aliases, shown on hover in the extension.
+   * Maps state names to human-readable descriptions.
+   * @example { '@mobile': 'Mobile viewport (width < 768px)' }
+   */
+  stateDescriptions?: Record<string, string>;
+}
+//#endregion
+export { AllBaseProps, BaseProps, BasePropsWithoutChildren, BaseStyleProps, BlockInnerStyleProps, BlockOuterStyleProps, BlockStyleProps, ColorStyleProps, ContainerStyleProps, DimensionStyleProps, FlowStyleProps, GlobalStyledProps, ModValue, Mods, OuterStyleProps, PositionStyleProps, Props, ShortGridStyles, TagName, TastyExtensionConfig, TastyThemeNames, TextStyleProps, TokenValue, Tokens };
+//# sourceMappingURL=types.d.ts.map

package/dist/tasty/utils/cache-wrapper.js

@@ -0,0 +1,25 @@
+/** @license MIT | @cube-dev/ui-kit v0.116.0 | Cube Dev Team */
+//#region src/tasty/utils/cache-wrapper.ts
+/**
+* Create a function that caches the result up to the limit.
+*/
+function cacheWrapper(handler, limit = 1e3) {
+	let cache = {};
+	let count = 0;
+	return ((firstArg, secondArg) => {
+		const key = typeof firstArg === "string" && secondArg == null ? firstArg : JSON.stringify([firstArg, secondArg]);
+		if (!cache[key]) {
+			if (count > limit) {
+				cache = {};
+				count = 0;
+			}
+			count++;
+			cache[key] = secondArg == null ? handler(firstArg) : handler(firstArg, secondArg);
+		}
+		return cache[key];
+	});
+}
+
+//#endregion
+export { cacheWrapper };
+//# sourceMappingURL=cache-wrapper.js.map

package/dist/tasty/utils/cache-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cache-wrapper.js","names":[],"sources":["../../../src/tasty/utils/cache-wrapper.ts"],"sourcesContent":["/**\n * Create a function that caches the result up to the limit.\n */\nexport function cacheWrapper<\n  T extends (firstArg: any, secondArg?: string) => any,\n>(handler: T, limit = 1000): T {\n  let cache: { string?: ReturnType<T> } = {};\n  let count = 0;\n\n  return ((firstArg: any, secondArg?: string) => {\n    const key =\n      typeof firstArg === 'string' && secondArg == null\n        ? firstArg\n        : JSON.stringify([firstArg, secondArg]);\n\n    if (!cache[key]) {\n      if (count > limit) {\n        cache = {};\n        count = 0;\n      }\n\n      count++;\n\n      cache[key] =\n        secondArg == null ? handler(firstArg) : handler(firstArg, secondArg);\n    }\n\n    return cache[key];\n  }) as T;\n}\n"],"mappings":";;;;;AAGA,SAAgB,aAEd,SAAY,QAAQ,KAAS;CAC7B,IAAI,QAAoC,EAAE;CAC1C,IAAI,QAAQ;AAEZ,UAAS,UAAe,cAAuB;EAC7C,MAAM,MACJ,OAAO,aAAa,YAAY,aAAa,OACzC,WACA,KAAK,UAAU,CAAC,UAAU,UAAU,CAAC;AAE3C,MAAI,CAAC,MAAM,MAAM;AACf,OAAI,QAAQ,OAAO;AACjB,YAAQ,EAAE;AACV,YAAQ;;AAGV;AAEA,SAAM,OACJ,aAAa,OAAO,QAAQ,SAAS,GAAG,QAAQ,UAAU,UAAU;;AAGxE,SAAO,MAAM"}

package/dist/tasty/utils/case-converter.js

@@ -0,0 +1,9 @@
+/** @license MIT | @cube-dev/ui-kit v0.116.0 | Cube Dev Team */
+//#region src/tasty/utils/case-converter.ts
+function camelToKebab(str) {
+	return str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+}
+
+//#endregion
+export { camelToKebab };
+//# sourceMappingURL=case-converter.js.map

package/dist/tasty/utils/case-converter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"case-converter.js","names":[],"sources":["../../../src/tasty/utils/case-converter.ts"],"sourcesContent":["export function camelToKebab(str: string): string {\n  return str.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();\n}\n"],"mappings":";;AAAA,SAAgB,aAAa,KAAqB;AAChD,QAAO,IAAI,QAAQ,sBAAsB,QAAQ,CAAC,aAAa"}

package/dist/tasty/utils/colors.d.ts

@@ -0,0 +1,6 @@
+
+//#region src/tasty/utils/colors.d.ts
+declare function color(name: any, opacity?: number): string;
+//#endregion
+export { color };
+//# sourceMappingURL=colors.d.ts.map

package/dist/tasty/utils/colors.js

@@ -0,0 +1,10 @@
+/** @license MIT | @cube-dev/ui-kit v0.116.0 | Cube Dev Team */
+//#region src/tasty/utils/colors.ts
+function color(name, opacity = 1) {
+	if (opacity !== 1) return `rgb(var(--${name}-color-rgb) / ${opacity})`;
+	return `var(--${name}-color)`;
+}
+
+//#endregion
+export { color };
+//# sourceMappingURL=colors.js.map

package/dist/tasty/utils/colors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.js","names":[],"sources":["../../../src/tasty/utils/colors.ts"],"sourcesContent":["export function color(name, opacity = 1) {\n  if (opacity !== 1) {\n    return `rgb(var(--${name}-color-rgb) / ${opacity})`;\n  }\n\n  return `var(--${name}-color)`;\n}\n"],"mappings":";;AAAA,SAAgB,MAAM,MAAM,UAAU,GAAG;AACvC,KAAI,YAAY,EACd,QAAO,aAAa,KAAK,gBAAgB,QAAQ;AAGnD,QAAO,SAAS,KAAK"}

package/dist/tasty/utils/dotize.d.ts

@@ -0,0 +1,27 @@
+
+//#region src/tasty/utils/dotize.d.ts
+declare const dotize: {
+  valTypes: {
+    none: string;
+    primitive: string;
+    object: string;
+    array: string;
+  };
+  getValType: (val: any) => string | undefined;
+  getPathType: (arrPath: any) => never[];
+  isUndefined: (obj: any) => obj is undefined;
+  isNumber: (f: any) => boolean;
+  isEmptyObj: (obj: any) => boolean;
+  isPlainObject: (obj: any) => boolean;
+  isNotObject: (obj: any) => boolean;
+  isEmptyArray: (arr: any) => boolean;
+  isNotArray: (arr: any) => boolean;
+  removeEmptyArrayItem: (arr: any) => any;
+  getFieldName: (field: any, prefix: any, isRoot: any, isArrayItem: any, isArray: any) => string;
+  startsWith: (val: any, valToSearch: any) => boolean;
+  convert: (obj: any, prefix?: string) => any;
+  backward: (obj: any, prefix: any) => any;
+};
+//#endregion
+export { dotize };
+//# sourceMappingURL=dotize.d.ts.map

package/dist/tasty/utils/dotize.js

@@ -0,0 +1,123 @@
+/** @license MIT | @cube-dev/ui-kit v0.116.0 | Cube Dev Team */
+//#region src/tasty/utils/dotize.ts
+const dotize = {
+	valTypes: {
+		none: "NONE",
+		primitive: "PRIM",
+		object: "OBJECT",
+		array: "ARRAY"
+	},
+	getValType: function(val) {
+		if (!val || typeof val != "object" || Array.isArray(val)) return dotize.valTypes.primitive;
+		if (typeof val == "object") return dotize.valTypes.object;
+	},
+	getPathType: function(arrPath) {
+		let arrPathTypes = [];
+		for (let path in arrPath) {
+			let pathVal = arrPath[path];
+			if (!pathVal) arrPathTypes.push(dotize.valTypes.none);
+			else if (dotize.isNumber(pathVal)) arrPathTypes.push(dotize.valTypes.array);
+			else arrPathTypes.push(dotize.valTypes.object);
+		}
+		return arrPathTypes;
+	},
+	isUndefined: function(obj) {
+		return typeof obj == "undefined";
+	},
+	isNumber: function(f) {
+		return !isNaN(parseInt(f));
+	},
+	isEmptyObj: function(obj) {
+		for (let prop in obj) if (Object.hasOwnProperty.call(obj, prop)) return false;
+		return JSON.stringify(obj) === JSON.stringify({});
+	},
+	isPlainObject: function(obj) {
+		if (typeof obj !== "object" || obj === null) return false;
+		return Object.getPrototypeOf(obj) === Object.prototype;
+	},
+	isNotObject: function(obj) {
+		return !obj || !this.isPlainObject(obj);
+	},
+	isEmptyArray: function(arr) {
+		return Array.isArray(arr) && arr.length == 0;
+	},
+	isNotArray: function(arr) {
+		return Array.isArray(arr) == false;
+	},
+	removeEmptyArrayItem: function(arr) {
+		return arr.filter(function(el) {
+			return el != null && el != "";
+		});
+	},
+	getFieldName: function(field, prefix, isRoot, isArrayItem, isArray) {
+		if (isArray) return (prefix ? prefix : "") + (dotize.isNumber(field) ? "[" + field + "]" : (isRoot && !prefix ? "" : ".") + field);
+		else if (isArrayItem) return (prefix ? prefix : "") + "[" + field + "]";
+		else return (prefix ? prefix + "." : "") + field;
+	},
+	startsWith: function(val, valToSearch) {
+		return val.indexOf(valToSearch) == 0;
+	},
+	convert: function(obj, prefix = "") {
+		let newObj = {};
+		if (dotize.isNotObject(obj)) if (prefix) {
+			newObj[prefix] = obj;
+			return newObj;
+		} else return obj;
+		return (function recurse(o, p, isRoot) {
+			let isArrayItem = Array.isArray(o);
+			for (let f in o) {
+				let currentProp = o[f];
+				if (currentProp && typeof currentProp === "object" && !Array.isArray(currentProp) && dotize.isPlainObject(currentProp)) {
+					if (isArrayItem && dotize.isEmptyObj(currentProp) == false) newObj = recurse(currentProp, dotize.getFieldName(f, p, isRoot, true));
+					else if (dotize.isEmptyObj(currentProp) == false) newObj = recurse(currentProp, dotize.getFieldName(f, p, isRoot));
+					else if (dotize.isEmptyObj(currentProp)) newObj[dotize.getFieldName(f, p, isRoot, isArrayItem)] = currentProp;
+				} else if (isArrayItem || dotize.isNumber(f)) newObj[dotize.getFieldName(f, p, isRoot, true)] = currentProp;
+				else newObj[dotize.getFieldName(f, p, isRoot)] = currentProp;
+			}
+			return newObj;
+		})(obj, prefix, true);
+	},
+	backward: function(obj, prefix) {
+		let newObj = {};
+		let arStartRegex = /\[(\d+)\]/g;
+		if (dotize.isNotObject(obj) && dotize.isNotArray(obj)) if (prefix) return obj[prefix];
+		else return obj;
+		for (let tProp in obj) {
+			let tPropVal = obj[tProp];
+			if (prefix) {
+				let prefixRegex = new RegExp("^" + prefix);
+				tProp = tProp.replace(prefixRegex, "");
+			}
+			tProp = tProp.replace(arStartRegex, ".$1");
+			if (dotize.startsWith(tProp, ".")) tProp = tProp.replace(/^\./, "");
+			var arrPath = tProp.split(".");
+			var arrPathTypes = dotize.getPathType(arrPath);
+			if (!dotize.isUndefined(arrPathTypes) && arrPathTypes[0] == dotize.valTypes.array && Array.isArray(newObj) == false) newObj = [];
+			(function recurse(rPropVal, rObj, rPropValPrev, rObjPrev) {
+				let currentPath = arrPath.shift();
+				let currentPathType = arrPathTypes.shift();
+				if (typeof currentPath == "undefined" || currentPath == "") {
+					newObj = rPropVal;
+					return;
+				}
+				let isArray = currentPathType == dotize.valTypes.array;
+				if (dotize.isNumber(currentPath)) currentPath = parseInt(currentPath);
+				if (arrPath.length > 0) {
+					if (typeof rObj[currentPath] == "undefined") if (isArray) rObj[currentPath] = [];
+					else rObj[currentPath] = {};
+					recurse(rPropVal, rObj[currentPath], currentPath, rObj);
+					return;
+				}
+				if (currentPathType == dotize.valTypes.array && rPropValPrev && rObjPrev) {
+					if (Array.isArray(rObjPrev[rPropValPrev]) == false) rObjPrev[rPropValPrev] = [];
+					rObjPrev[rPropValPrev].push(rPropVal);
+				} else rObj[currentPath] = rPropVal;
+			})(tPropVal, newObj);
+		}
+		return newObj;
+	}
+};
+
+//#endregion
+export { dotize };
+//# sourceMappingURL=dotize.js.map