@codeleap/web 2.4.7 → 3.0.2

package/src/lib/hooks.ts

@@ -0,0 +1,340 @@
+import { AnyFunction, onMount, onUpdate, range, useUncontrolled } from '@codeleap/common'
+import { useCallback, useMemo, useRef, useState } from 'react'
+import { v4 } from 'uuid'
+import { easeInOut, EasingFunction, AnimationProps, useAnimate, useAnimation, animate } from 'framer-motion'
+
+export function useWindowSize() {
+  const [size, setSize] = useState([])
+
+  onMount(() => {
+    setSize([window.innerWidth, window.innerWidth])
+  })
+
+  function handleResize() {
+    setSize([window.innerWidth, window.innerHeight])
+  }
+
+  onUpdate(() => {
+    window.addEventListener('resize', handleResize)
+    return () => {
+      window.removeEventListener('resize', handleResize)
+    }
+  }, [])
+
+  return size
+}
+
+// type UseClickOutsideOpts = {
+//   customId?: string
+//   deps?: any[]
+// }
+// export function useClickOutside(
+//   callback: AnyFunction,
+//   deps?: UseClickOutsideOpts,
+// ) {
+//   const id = useRef(deps?.customId || v4())
+
+//   const onClick = useCallback((e: Event) => {
+//     const element = document.getElementById(id.current)
+//     if (!element) return
+//     const isInside = element.contains(e.target as Node) || ((e.target as HTMLElement).id === id.current)
+
+//     // const iterNodes = (el:HTMLElement|Element) => {
+//     //   if (isInside) return
+//     //   for (let i = 0; i < el.children.length; i++) {
+//     //     const node = el.children.item(i)
+
+//     //     if (!node) return
+//     //     const _isInside = node.contains(e.target as Node)
+//     //     if (_isInside) {
+//     //       isInside = _isInside
+//     //     }
+//     //     if (isInside) break
+
+//     //     if (node.hasChildNodes()) {
+//     //       iterNodes(node)
+//     //     }
+
+//     //     if (isInside) break
+//     //   }
+//     // }
+
+//     // if (!isInside) {
+//     //   iterNodes(element)
+//     // }
+
+//     if (!isInside) {
+//       callback(e)
+//     }
+//   }, deps?.deps || [])
+//   onUpdate(() => {
+
+//     document.addEventListener('click', onClick)
+//     return () => {
+//       document.removeEventListener('click', onClick)
+//     }
+//   }, [onClick])
+
+//   return id.current
+// }
+
+import { useEffect } from 'react'
+
+const DEFAULT_EVENTS = ['mousedown', 'touchstart']
+
+export function useClickOutside<T extends HTMLElement = any>(
+  handler: () => void,
+  events?: string[] | null,
+  nodes?: HTMLElement[],
+) {
+  const ref = useRef<T>()
+
+  useEffect(() => {
+    const listener = (event: any) => {
+      if (Array.isArray(nodes)) {
+        const shouldIgnore = event?.target?.hasAttribute('data-ignore-outside-clicks')
+        const shouldTrigger = nodes.every((node) => !!node && !node.contains(event.target))
+        shouldTrigger && !shouldIgnore && handler()
+      } else if (ref.current && !ref.current.contains(event.target)) {
+        handler()
+      }
+    };
+
+    (events || DEFAULT_EVENTS).forEach((fn) => document.addEventListener(fn, listener))
+
+    return () => {
+      (events || DEFAULT_EVENTS).forEach((fn) => document.removeEventListener(fn, listener))
+    }
+  }, [ref, handler, nodes])
+
+  return ref
+}
+
+export function useScrollEffect(
+  effect: (passed: boolean, current: number) => any,
+  breakpoint: number,
+  extraDependencies = [],
+) {
+  function handleScroll() {
+    const passed = window.scrollY > breakpoint
+    effect(passed, window.scrollY)
+  }
+
+  onUpdate(() => {
+    document.addEventListener('scroll', handleScroll)
+    return () => {
+      document.removeEventListener('scroll', handleScroll)
+    }
+  }, [breakpoint, ...extraDependencies])
+}
+
+export const DOTS = 'dots'
+
+export interface PaginationParams {
+  /** Page selected on initial render, defaults to 1 */
+  initialPage?: number
+
+  /** Controlled active page number */
+  page?: number
+
+  /** Total amount of pages */
+  total: number
+
+  /** Siblings amount on left/right side of selected page, defaults to 1 */
+  siblings?: number
+
+  /** Amount of elements visible on left/right edges, defaults to 1  */
+  boundaries?: number
+
+  /** Callback fired after change of each page */
+  onChange?: (page: number) => void
+}
+
+export function usePagination({
+  total,
+  siblings = 1,
+  boundaries = 1,
+  page,
+  initialPage = 1,
+  onChange,
+}: PaginationParams) {
+  const [activePage, setActivePage] = useUncontrolled({
+    value: page,
+    onChange,
+    defaultValue: initialPage,
+    finalValue: initialPage,
+    rule: (_page) => typeof _page === 'number' && _page <= total,
+  })
+
+  const setPage = (pageNumber: number) => {
+    if (pageNumber <= 0) {
+      setActivePage(1)
+    } else if (pageNumber > total) {
+      setActivePage(total)
+    } else {
+      setActivePage(pageNumber)
+    }
+  }
+
+  const next = () => setPage(activePage + 1)
+  const previous = () => setPage(activePage - 1)
+  const first = () => setPage(1)
+  const last = () => setPage(total)
+
+  const paginationRange = useMemo((): (number | 'dots')[] => {
+    // Pages count is determined as siblings (left/right) + boundaries(left/right) + currentPage + 2*DOTS
+    const totalPageNumbers = siblings * 2 + 3 + boundaries * 2
+
+    /*
+     * If the number of pages is less than the page numbers we want to show in our
+     * paginationComponent, we return the range [1..total]
+     */
+    if (totalPageNumbers >= total) {
+      return range(1, total)
+    }
+
+    const leftSiblingIndex = Math.max(activePage - siblings, boundaries)
+    const rightSiblingIndex = Math.min(activePage + siblings, total - boundaries)
+
+    /*
+     * We do not want to show dots if there is only one position left
+     * after/before the left/right page count as that would lead to a change if our Pagination
+     * component size which we do not want
+     */
+    const shouldShowLeftDots = leftSiblingIndex > boundaries + 2
+    const shouldShowRightDots = rightSiblingIndex < total - (boundaries + 1)
+
+    if (!shouldShowLeftDots && shouldShowRightDots) {
+      const leftItemCount = siblings * 2 + boundaries + 2
+      return [...range(1, leftItemCount), DOTS, ...range(total - (boundaries - 1), total)]
+    }
+
+    if (shouldShowLeftDots && !shouldShowRightDots) {
+      const rightItemCount = boundaries + 1 + 2 * siblings
+      return [...range(1, boundaries), DOTS, ...range(total - rightItemCount, total)]
+    }
+
+    return [
+      ...range(1, boundaries),
+      DOTS,
+      ...range(leftSiblingIndex, rightSiblingIndex),
+      DOTS,
+      ...range(total - boundaries + 1, total),
+    ]
+  }, [total, siblings, activePage])
+
+  return {
+    range: paginationRange,
+    active: activePage,
+    setPage,
+    next,
+    previous,
+    first,
+    last,
+  }
+}
+
+
+export interface UseMediaQueryOptions {
+  getInitialValueInEffect: boolean;
+}
+
+type MediaQueryCallback = (event: { matches: boolean; media: string }) => void;
+
+/**
+ * Older versions of Safari (shipped withCatalina and before) do not support addEventListener on matchMedia
+ * https://stackoverflow.com/questions/56466261/matchmedia-addlistener-marked-as-deprecated-addeventlistener-equivalent
+ * */
+function attachMediaListener(query: MediaQueryList, callback: MediaQueryCallback) {
+  try {
+    query.addEventListener('change', callback);
+    return () => query.removeEventListener('change', callback);
+  } catch (e) {
+    query.addListener(callback);
+    return () => query.removeListener(callback);
+  }
+}
+
+function getInitialValue(query: string, initialValue?: boolean) {
+  if (typeof initialValue === 'boolean') {
+    return initialValue;
+  }
+
+  if (typeof window !== 'undefined' && 'matchMedia' in window) {
+    return window.matchMedia(query).matches;
+  }
+
+  return false;
+}
+
+export function useMediaQuery(
+  query: string,
+  initialValue?: boolean,
+  { getInitialValueInEffect }: UseMediaQueryOptions = {
+    getInitialValueInEffect: true,
+  }
+) {
+
+  const _query = useMemo(() => {
+    return query.trim().replace('@media screen and ', '')
+    
+  }, [query])
+  const [matches, setMatches] = useState(
+    getInitialValueInEffect ? initialValue : getInitialValue(_query, initialValue)
+  );
+  const queryRef = useRef<MediaQueryList>();
+
+  useEffect(() => {
+    if(query.trim() === '') return
+    if ('matchMedia' in window) {
+      queryRef.current = window.matchMedia(_query);
+      setMatches(queryRef.current.matches);
+      return attachMediaListener(queryRef.current, (event) => setMatches(event.matches));
+    }
+
+    return undefined;
+  }, [_query]);
+
+  return matches;
+}
+
+type SelectProperties<T extends Record<string|number|symbol, any>, K extends keyof T> = {
+  [P in K] : T[K]
+}
+
+export function useStaticAnimationStyles<T extends Record<string|number|symbol, any>, K extends keyof T >(obj: T, keys: K[]) {
+  const styles = useRef({})
+
+  if (Object.keys(styles.current).length === 0) {
+    const mappedStyles = keys.map((k) => [k, { ...obj[k] }])
+
+    styles.current = Object.fromEntries(mappedStyles)
+  }
+
+  return styles.current as SelectProperties<T, K>
+}
+
+type UseAnimatedVariantStylesConfig<T extends Record<string|number|symbol, any>, K extends keyof T > = {
+  variantStyles: T
+  animatedProperties: K[]
+  updater: (states: SelectProperties<T, K>) => AnimationProps
+  dependencies?: any[]
+}
+
+export function useAnimatedVariantStyles<T extends Record<string|number|symbol, any>, K extends keyof T >(config: UseAnimatedVariantStylesConfig<T, K>) {
+  const { animatedProperties, updater, variantStyles, dependencies = [] } = config
+
+  const staticStyles = useStaticAnimationStyles(variantStyles, animatedProperties)
+
+  const initialState = updater(staticStyles)
+
+  const [animated, setAnimated] = useState(initialState)
+
+  onUpdate(() => {
+    const nextState = updater(staticStyles)
+    
+    setAnimated(nextState)
+  }, dependencies)
+
+  return animated
+}

package/src/lib/index.ts

@@ -0,0 +1,2 @@
+export * from './utils'
+export * from './hooks'

package/src/lib/logger.ts

@@ -0,0 +1,13 @@
+import { Logger } from '@codeleap/common'
+
+export const logger = new Logger({
+  Environment: {
+    IsDev: true,
+  },
+  Sentry: {
+    enable: false,
+  },
+  Logger: {
+    Level: 'debug',
+  },
+})

package/src/lib/utils/cookies.ts

@@ -0,0 +1,13 @@
+import Cookies from 'js-cookie'
+
+const get = (key) => Cookies.get(key)
+
+const set = (key, value) => Cookies.set(key, value, { expires: 365 })
+
+const remove = (key) => Cookies.remove(key)
+
+export default {
+  get,
+  set,
+  remove,
+}

package/src/lib/utils/index.ts

@@ -0,0 +1,4 @@
+export * from './pollyfils/scroll'
+export * from './stopPropagation'
+export { default as url } from 'url-parse'
+export { default as Cookies } from './cookies'

package/src/lib/utils/pollyfils/scroll.ts

@@ -0,0 +1,65 @@
+// native smooth scrolling for Chrome, Firefox & Opera
+// @see: https://caniuse.com/#feat=css-scroll-behavior
+const nativeSmoothScrollTo = (elem, pad = 0) => {
+  if (!window) return
+  window.scroll({
+    behavior: 'smooth',
+    left: 0,
+    top: elem.getBoundingClientRect().top + window.pageYOffset + pad,
+  })
+}
+
+// polyfilled smooth scrolling for IE, Edge & Safari
+const smoothScrollTo = (to, duration) => {
+  if (!document) return
+  const element = document.scrollingElement || document.documentElement,
+    start = element.scrollTop,
+    change = to - start,
+    startDate = +new Date()
+
+  // t = current time
+  // b = start value
+  // c = change in value
+  // d = duration
+  const easeInOutQuad = (t, b, c, d) => {
+    t /= d / 2
+    if (t < 1) return (c / 2) * t * t + b
+    t--
+    return (-c / 2) * (t * (t - 2) - 1) + b
+  }
+
+  const animateScroll = () => {
+    const currentDate = +new Date()
+    const currentTime = currentDate - startDate
+    element.scrollTop = parseInt(
+      easeInOutQuad(currentTime, start, change, duration),
+    )
+    if (currentTime < duration) {
+      requestAnimationFrame(animateScroll)
+    } else {
+      element.scrollTop = to
+    }
+  }
+  animateScroll()
+}
+
+// detect support for the behavior property in ScrollOptions
+
+// smooth scrolling stub
+export const scrollToElem = (elemSelector, padOffsets = [0, 0]) => {
+  if (!document) return
+  const supportsNativeSmoothScroll =
+    'scrollBehavior' in document.documentElement.style || {}
+  if (!elemSelector) {
+    return
+  }
+
+  const elem = document.querySelector(elemSelector)
+  if (elem) {
+    if (supportsNativeSmoothScroll) {
+      nativeSmoothScrollTo(elem, padOffsets[0])
+    } else {
+      smoothScrollTo(elem.offsetTop + padOffsets[0], 600)
+    }
+  }
+}

package/src/lib/utils/stopPropagation.ts

@@ -0,0 +1,15 @@
+import { AnyFunction } from '@codeleap/common'
+
+export function stopPropagation(event: any) {
+  const tryCalls = [
+    event?.stopPropagation,
+    event?.preventDefault,
+    event.nativeEvent?.stopImmediatePropagation as AnyFunction,
+  ]
+
+  for (const call of tryCalls) {
+    try {
+      call()
+    } catch (e) {}
+  }
+}

package/src/types/index.ts

@@ -0,0 +1 @@
+export * from './utility'

package/src/types/utility.ts

@@ -0,0 +1,3 @@
+import { CSSInterpolation, CSSObject } from '@emotion/css'
+
+export type StylesOf<C extends string> = Partial<Record<C, CSSInterpolation | CSSInterpolation[]>>

package/dist/components/ActivityIndicator/index.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { CSSObject } from '@emotion/react';
-import { ComponentVariants, ActivityIndicatorStyles, ActivityIndicatorComposition } from '@codeleap/common';
-import { StylesOf } from '../../types/utility';
-export * from './styles';
-export declare type ActivityIndicatorProps = {
-    animating?: boolean;
-    hidesWhenStopped?: boolean;
-    styles?: StylesOf<ActivityIndicatorComposition>;
-    css?: CSSObject;
-} & ComponentVariants<typeof ActivityIndicatorStyles>;
-export declare const ActivityIndicator: React.FC<ActivityIndicatorProps>;

package/dist/components/ActivityIndicator/index.js

@@ -1,57 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ActivityIndicator = void 0;
-var jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-var View_1 = require("../View");
-var react_1 = require("@emotion/react");
-var common_1 = require("@codeleap/common");
-__exportStar(require("./styles"), exports);
-var spin = (0, react_1.keyframes)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    from {\n        transform: rotate(0deg);\n    }\n    to{ \n        transform: rotate(360deg);\n    }\n"], ["\n    from {\n        transform: rotate(0deg);\n    }\n    to{ \n        transform: rotate(360deg);\n    }\n"])));
-var ActivityIndicator = function (indicatorProps) {
-    var _a = indicatorProps.animating, animating = _a === void 0 ? true : _a, _b = indicatorProps.hidesWhenStopped, hidesWhenStopped = _b === void 0 ? true : _b, variants = indicatorProps.variants, responsiveVariants = indicatorProps.responsiveVariants, styles = indicatorProps.styles, viewProps = __rest(indicatorProps, ["animating", "hidesWhenStopped", "variants", "responsiveVariants", "styles"]);
-    var variantStyles = (0, common_1.useDefaultComponentStyle)('ActivityIndicator', {
-        styles: styles,
-        responsiveVariants: responsiveVariants,
-        variants: variants,
-    });
-    return ((0, jsx_runtime_1.jsxs)(View_1.View, __assign({}, viewProps, { css: [variantStyles.wrapper, (!animating && hidesWhenStopped) && { visibility: 'hidden' }] }, { children: [(0, jsx_runtime_1.jsx)(View_1.View, { css: __assign(__assign({}, variantStyles.circle), variantStyles.backCircle) }, void 0), (0, jsx_runtime_1.jsx)(View_1.View, { css: __assign(__assign(__assign({}, variantStyles.circle), variantStyles.frontCircle), { animation: "".concat(spin, " 1s infinite"), animationPlayState: animating ? 'running' : 'paused' }) }, void 0)] }), void 0));
-};
-exports.ActivityIndicator = ActivityIndicator;
-var templateObject_1;
-//# sourceMappingURL=index.js.map

package/dist/components/ActivityIndicator/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ActivityIndicator/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gCAA8B;AAC9B,wCAAqD;AACrD,2CAKyB;AAGzB,2CAAwB;AAExB,IAAM,IAAI,OAAG,iBAAS,kLAAA,8GAOrB,IAAA,CAAA;AASM,IAAM,iBAAiB,GAAqC,UACjE,cAAc;IAGZ,IAAA,KAOE,cAAc,UAPA,EAAhB,SAAS,mBAAG,IAAI,KAAA,EAChB,KAME,cAAc,iBANO,EAAvB,gBAAgB,mBAAG,IAAI,KAAA,EAEvB,QAAQ,GAIN,cAAc,SAJR,EACR,kBAAkB,GAGhB,cAAc,mBAHE,EAClB,MAAM,GAEJ,cAAc,OAFV,EACH,SAAS,UACV,cAAc,EARZ,6EAQL,CADa,CACI;IAElB,IAAM,aAAa,GAAG,IAAA,iCAAwB,EAAC,mBAAmB,EAAE;QAClE,MAAM,QAAA;QACN,kBAAkB,oBAAA;QAClB,QAAQ,UAAA;KACT,CAAC,CAAA;IAEF,OAAO,CACL,wBAAC,WAAI,eAAK,SAAS,IAAE,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC,CAAC,SAAS,IAAI,gBAAgB,CAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,iBAC7G,uBAAC,WAAI,IAAC,GAAG,wBAAO,aAAa,CAAC,MAAM,GAAK,aAAa,CAAC,UAAU,YAAM,EACvE,uBAAC,WAAI,IACH,GAAG,iCACE,aAAa,CAAC,MAAM,GACpB,aAAa,CAAC,WAAW,KAC5B,SAAS,EAAE,UAAG,IAAI,iBAAc,EAChC,kBAAkB,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,cAEtD,aACG,CACR,CAAA;AACH,CAAC,CAAA;AAhCY,QAAA,iBAAiB,qBAgC7B"}

package/dist/components/ActivityIndicator/styles.d.ts

@@ -1,53 +0,0 @@
-import { ActivityIndicatorComposition } from '@codeleap/common';
-export declare const WebActivityIndicatorStyles: {
-    default: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    fixed: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    block: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    flex: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    absolute: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    relative: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    sticky: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    row: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    center: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    column: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    wrap: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    inline: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    inlineFlex: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    hidden: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    full: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    noWrap: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    fullWidth: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    fullHeight: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    fullView: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    fullViewWidth: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    fullViewHeight: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    whole: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    centerRow: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    listStyles: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignStart: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignEnd: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignCenter: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignStretch: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignSelfCenter: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignSelfStart: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignSelfStretch: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    alignSelfEnd: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    justifyStart: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    justifyEnd: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    justifyCenter: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    justifySpaceBetween: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    justifySpaceAround: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    textRight: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    textLeft: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    textCenter: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    blur: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    elevated: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    neumorphism: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    scrollX: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    scrollY: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    scrollXY: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    debRed: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    debGreen: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    debBlue: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-    debYellow: (theme: import("@codeleap/common").ThemeColorScheme<import("@codeleap/common").AppTheme>, variant?: string) => Partial<Record<ActivityIndicatorComposition, any>>;
-};

package/dist/components/ActivityIndicator/styles.js

@@ -1,22 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.WebActivityIndicatorStyles = void 0;
-var common_1 = require("@codeleap/common");
-var createActivityIndicatorStyle = (0, common_1.createDefaultVariantFactory)();
-var getDefault = common_1.ActivityIndicatorStyles.default;
-exports.WebActivityIndicatorStyles = __assign(__assign({}, common_1.ActivityIndicatorStyles), { default: createActivityIndicatorStyle(function (theme) {
-        var defaults = getDefault(theme);
-        return defaults;
-    }) });
-//# sourceMappingURL=styles.js.map

package/dist/components/ActivityIndicator/styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/ActivityIndicator/styles.ts"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,2CAIyB;AAEzB,IAAM,4BAA4B,GAChC,IAAA,oCAA2B,GAAgC,CAAA;AAE7D,IAAM,UAAU,GAAG,gCAAuB,CAAC,OAAO,CAAA;AAErC,QAAA,0BAA0B,yBAClC,gCAAuB,KAC1B,OAAO,EAAE,4BAA4B,CAAC,UAAC,KAAK;QAC1C,IAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,CAAC,CAAA;QAElC,OAAO,QAAQ,CAAA;IACjB,CAAC,CAAC,IACH"}

package/dist/components/Button.d.ts

@@ -1,18 +0,0 @@
-import { ButtonStyles, ComponentVariants, ButtonComposition, AnyFunction } from '@codeleap/common';
-import React, { ComponentPropsWithRef } from 'react';
-import { StylesOf } from '../types/utility';
-import { TouchableProps } from './Touchable';
-import { IconPlaceholder } from '@codeleap/common';
-declare type NativeButtonProps = ComponentPropsWithRef<'button'>;
-export declare type ButtonProps = NativeButtonProps & ComponentVariants<typeof ButtonStyles> & {
-    text?: string;
-    rightIcon?: IconPlaceholder;
-    icon?: IconPlaceholder;
-    onPress?: AnyFunction;
-    styles?: StylesOf<ButtonComposition>;
-    loading?: boolean;
-    debugName?: string;
-    debounce?: number;
-} & Partial<TouchableProps<any>>;
-export declare const Button: React.FC<ButtonProps>;
-export {};