@dotss/ui 1.0.2 → 1.0.3

package/node_modules/@emotion/react/src/_isolated-hnrs.ts

@@ -0,0 +1,15 @@
+// this file isolates this package that is not tree-shakeable
+// and allows it to be dropped - if it stays unused
+// it happens thanks to sideEffects: false in our package.json
+import hoistNonReactStatics from 'hoist-non-react-statics'
+
+// have to wrap it in a proxy function because Rollup is too damn smart
+// and if this module doesn't actually contain any logic of its own
+// then Rollup just use 'hoist-non-react-statics' directly in other chunks
+export default <
+  T extends React.ComponentType<any>,
+  S extends React.ComponentType<any>
+>(
+  targetComponent: T,
+  sourceComponent: S
+) => hoistNonReactStatics(targetComponent, sourceComponent)

package/node_modules/@emotion/react/src/class-names.tsx

@@ -0,0 +1,180 @@
+import * as React from 'react'
+import {
+  EmotionCache,
+  getRegisteredStyles,
+  insertStyles,
+  registerStyles,
+  SerializedStyles
+} from '@emotion/utils'
+import { CSSInterpolation, serializeStyles } from '@emotion/serialize'
+import isDevelopment from '#is-development'
+import { withEmotionCache } from './context'
+import { Theme, ThemeContext } from './theming'
+import { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks'
+import isBrowser from '#is-browser'
+
+export interface ArrayClassNamesArg extends Array<ClassNamesArg> {}
+
+export type ClassNamesArg =
+  | undefined
+  | null
+  | string
+  | boolean
+  | { [className: string]: boolean | null | undefined }
+  | ArrayClassNamesArg
+
+let classnames = (args: ArrayClassNamesArg): string => {
+  let len = args.length
+  let i = 0
+  let cls = ''
+  for (; i < len; i++) {
+    let arg = args[i]
+    if (arg == null) continue
+
+    let toAdd
+    switch (typeof arg) {
+      case 'boolean':
+        break
+      case 'object': {
+        if (Array.isArray(arg)) {
+          toAdd = classnames(arg)
+        } else {
+          if (
+            isDevelopment &&
+            arg.styles !== undefined &&
+            arg.name !== undefined
+          ) {
+            console.error(
+              'You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' +
+                '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.'
+            )
+          }
+          toAdd = ''
+          for (const k in arg) {
+            if (arg[k] && k) {
+              toAdd && (toAdd += ' ')
+              toAdd += k
+            }
+          }
+        }
+        break
+      }
+      default: {
+        toAdd = arg
+      }
+    }
+    if (toAdd) {
+      cls && (cls += ' ')
+      cls += toAdd
+    }
+  }
+  return cls
+}
+function merge(
+  registered: EmotionCache['registered'],
+  css: ClassNamesContent['css'],
+  className: string
+) {
+  const registeredStyles: string[] = []
+
+  const rawClassName = getRegisteredStyles(
+    registered,
+    registeredStyles,
+    className
+  )
+
+  if (registeredStyles.length < 2) {
+    return className
+  }
+  return rawClassName + css(registeredStyles)
+}
+
+const Insertion = ({
+  cache,
+  serializedArr
+}: {
+  cache: EmotionCache
+  serializedArr: SerializedStyles[]
+}) => {
+  let rules = useInsertionEffectAlwaysWithSyncFallback(() => {
+    let rules = ''
+    for (let i = 0; i < serializedArr.length; i++) {
+      let res = insertStyles(cache, serializedArr[i], false)
+      if (!isBrowser && res !== undefined) {
+        rules += res
+      }
+    }
+    if (!isBrowser) {
+      return rules
+    }
+  })
+
+  if (!isBrowser && rules!.length !== 0) {
+    return (
+      <style
+        {...{
+          [`data-emotion`]: `${cache.key} ${serializedArr
+            .map(serialized => serialized.name)
+            .join(' ')}`,
+          dangerouslySetInnerHTML: { __html: rules! },
+          nonce: cache.sheet.nonce
+        }}
+      />
+    )
+  }
+  return null
+}
+
+export interface ClassNamesContent {
+  css(template: TemplateStringsArray, ...args: Array<CSSInterpolation>): string
+  css(...args: Array<CSSInterpolation>): string
+  cx(...args: Array<ClassNamesArg>): string
+  theme: Theme
+}
+
+export interface ClassNamesProps {
+  children(content: ClassNamesContent): React.ReactNode
+}
+
+export const ClassNames = /* #__PURE__ */ withEmotionCache<ClassNamesProps>(
+  (props, cache) => {
+    let hasRendered = false
+    let serializedArr: SerializedStyles[] = []
+
+    let css: ClassNamesContent['css'] = (...args) => {
+      if (hasRendered && isDevelopment) {
+        throw new Error('css can only be used during render')
+      }
+
+      let serialized = serializeStyles(args, cache.registered)
+      serializedArr.push(serialized)
+      // registration has to happen here as the result of this might get consumed by `cx`
+      registerStyles(cache, serialized, false)
+      return `${cache.key}-${serialized.name}`
+    }
+    let cx = (...args: Array<ClassNamesArg>) => {
+      if (hasRendered && isDevelopment) {
+        throw new Error('cx can only be used during render')
+      }
+      return merge(cache.registered, css, classnames(args))
+    }
+    let content = {
+      css,
+      cx,
+      theme: React.useContext(ThemeContext)
+    }
+    let ele = props.children(content)
+    hasRendered = true
+
+    return (
+      <>
+        <Insertion cache={cache} serializedArr={serializedArr} />
+        {ele}
+      </>
+    )
+  }
+)
+
+if (isDevelopment) {
+  ClassNames.displayName = 'EmotionClassNames'
+}

package/node_modules/@emotion/react/src/conditions/false.ts

@@ -0,0 +1 @@
+export default false

package/node_modules/@emotion/react/src/conditions/is-browser.ts

@@ -0,0 +1 @@
+export default typeof document !== 'undefined'

package/node_modules/@emotion/react/src/conditions/true.ts

@@ -0,0 +1 @@
+export default true

package/node_modules/@emotion/react/src/context.tsx

@@ -0,0 +1,72 @@
+import * as React from 'react'
+import { useContext, forwardRef } from 'react'
+import createCache, { EmotionCache } from '@emotion/cache'
+import isDevelopment from '#is-development'
+import isBrowser from '#is-browser'
+
+let EmotionCacheContext =
+  /* #__PURE__ */ React.createContext<EmotionCache | null>(
+    // we're doing this to avoid preconstruct's dead code elimination in this one case
+    // because this module is primarily intended for the browser and node
+    // but it's also required in react native and similar environments sometimes
+    // and we could have a special build just for that
+    // but this is much easier and the native packages
+    // might use a different theme context in the future anyway
+    typeof HTMLElement !== 'undefined'
+      ? /* #__PURE__ */ createCache({ key: 'css' })
+      : null
+  )
+
+if (isDevelopment) {
+  EmotionCacheContext.displayName = 'EmotionCacheContext'
+}
+
+export let CacheProvider = EmotionCacheContext.Provider
+
+export let __unsafe_useEmotionCache = function useEmotionCache() {
+  return useContext(EmotionCacheContext)
+}
+
+let withEmotionCache = function withEmotionCache<Props, RefType = any>(
+  func: (
+    props: React.PropsWithoutRef<Props>,
+    context: EmotionCache,
+    ref?: React.ForwardedRef<RefType>
+  ) => React.ReactNode
+):
+  | React.FC<React.PropsWithoutRef<Props> & React.RefAttributes<RefType>>
+  | React.ForwardRefExoticComponent<
+      React.PropsWithoutRef<Props> & React.RefAttributes<RefType>
+    > {
+  return forwardRef<RefType, Props>((props, ref) => {
+    // the cache will never be null in the browser
+    let cache = useContext(EmotionCacheContext)!
+
+    return func(props, cache, ref)
+  })
+}
+
+if (!isBrowser) {
+  withEmotionCache = function withEmotionCache(func) {
+    return (props: Parameters<typeof func>[0]) => {
+      let cache = useContext(EmotionCacheContext)
+      if (cache === null) {
+        // yes, we're potentially creating this on every render
+        // it doesn't actually matter though since it's only on the server
+        // so there will only every be a single render
+        // that could change in the future because of suspense and etc. but for now,
+        // this works and i don't want to optimise for a future thing that we aren't sure about
+        cache = createCache({ key: 'css' })
+        return (
+          <EmotionCacheContext.Provider value={cache}>
+            {func(props, cache)}
+          </EmotionCacheContext.Provider>
+        )
+      } else {
+        return func(props, cache)
+      }
+    }
+  }
+}
+
+export { withEmotionCache }

package/node_modules/@emotion/react/src/css.ts

@@ -0,0 +1,14 @@
+import type { SerializedStyles } from '@emotion/utils'
+import type { CSSInterpolation } from '@emotion/serialize'
+import { serializeStyles } from '@emotion/serialize'
+
+function css(
+  template: TemplateStringsArray,
+  ...args: CSSInterpolation[]
+): SerializedStyles
+function css(...args: CSSInterpolation[]): SerializedStyles
+function css(...args: CSSInterpolation[]) {
+  return serializeStyles(args)
+}
+
+export default css

package/node_modules/@emotion/react/src/emotion-element.tsx

@@ -0,0 +1,193 @@
+import * as React from 'react'
+import { withEmotionCache } from './context'
+import { Theme, ThemeContext } from './theming'
+import {
+  EmotionCache,
+  getRegisteredStyles,
+  insertStyles,
+  registerStyles,
+  SerializedStyles
+} from '@emotion/utils'
+import { hasOwn } from './utils'
+import { Interpolation, serializeStyles } from '@emotion/serialize'
+import isDevelopment from '#is-development'
+import isBrowser from '#is-browser'
+import { getLabelFromStackTrace } from './get-label-from-stack-trace'
+import { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks'
+
+const typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__'
+
+const labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__'
+
+interface EmotionProps {
+  css: Interpolation<Theme>
+  [typePropName]: React.ElementType
+  [labelPropName]?: string
+  [key: string]: unknown
+}
+
+export const createEmotionProps = (
+  type: React.ElementType,
+  props: { css: Interpolation<Theme> }
+): EmotionProps => {
+  if (
+    isDevelopment &&
+    typeof props.css === 'string' &&
+    // check if there is a css declaration
+    props.css.indexOf(':') !== -1
+  ) {
+    throw new Error(
+      `Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css\`${props.css}\``
+    )
+  }
+
+  let newProps = {} as EmotionProps
+
+  for (let key in props) {
+    if (hasOwn.call(props, key)) {
+      newProps[key] = props[key as keyof typeof props]
+    }
+  }
+
+  newProps[typePropName] = type
+
+  // Runtime labeling is an opt-in feature because:
+  // - It causes hydration warnings when using Safari and SSR
+  // - It can degrade performance if there are a huge number of elements
+  //
+  // Even if the flag is set, we still don't compute the label if it has already
+  // been determined by the Babel plugin.
+  if (
+    isDevelopment &&
+    typeof globalThis !== 'undefined' &&
+    !!(globalThis as any).EMOTION_RUNTIME_AUTO_LABEL &&
+    !!props.css &&
+    (typeof props.css !== 'object' ||
+      !('name' in props.css) ||
+      typeof props.css.name !== 'string' ||
+      props.css.name.indexOf('-') === -1)
+  ) {
+    const label = getLabelFromStackTrace(new Error().stack)
+    if (label) newProps[labelPropName] = label
+  }
+
+  return newProps
+}
+
+const Insertion = ({
+  cache,
+  serialized,
+  isStringTag
+}: {
+  cache: EmotionCache
+  serialized: SerializedStyles
+  isStringTag: boolean
+}) => {
+  registerStyles(cache, serialized, isStringTag)
+
+  const rules = useInsertionEffectAlwaysWithSyncFallback(() =>
+    insertStyles(cache, serialized, isStringTag)
+  )
+
+  if (!isBrowser && rules !== undefined) {
+    let serializedNames = serialized.name
+    let next = serialized.next
+    while (next !== undefined) {
+      serializedNames += ' ' + next.name
+      next = next.next
+    }
+    return (
+      <style
+        {...{
+          [`data-emotion`]: `${cache.key} ${serializedNames}`,
+          dangerouslySetInnerHTML: { __html: rules },
+          nonce: cache.sheet.nonce
+        }}
+      />
+    )
+  }
+  return null
+}
+
+let Emotion = /* #__PURE__ */ withEmotionCache<EmotionProps>(
+  (props, cache, ref) => {
+    let cssProp = props.css as EmotionProps['css']
+
+    // so that using `css` from `emotion` and passing the result to the css prop works
+    // not passing the registered cache to serializeStyles because it would
+    // make certain babel optimisations not possible
+    if (
+      typeof cssProp === 'string' &&
+      cache.registered[cssProp] !== undefined
+    ) {
+      cssProp = cache.registered[cssProp]
+    }
+
+    let WrappedComponent = props[
+      typePropName
+    ] as EmotionProps[typeof typePropName]
+    let registeredStyles = [cssProp]
+    let className = ''
+
+    if (typeof props.className === 'string') {
+      className = getRegisteredStyles(
+        cache.registered,
+        registeredStyles,
+        props.className
+      )
+    } else if (props.className != null) {
+      className = `${props.className} `
+    }
+
+    let serialized = serializeStyles(
+      registeredStyles,
+      undefined,
+      React.useContext(ThemeContext)
+    )
+
+    if (isDevelopment && serialized.name.indexOf('-') === -1) {
+      let labelFromStack = props[labelPropName]
+      if (labelFromStack) {
+        serialized = serializeStyles([
+          serialized,
+          'label:' + labelFromStack + ';'
+        ])
+      }
+    }
+
+    className += `${cache.key}-${serialized.name}`
+
+    const newProps: Record<string, unknown> = {}
+    for (let key in props) {
+      if (
+        hasOwn.call(props, key) &&
+        key !== 'css' &&
+        key !== typePropName &&
+        (!isDevelopment || key !== labelPropName)
+      ) {
+        newProps[key] = props[key]
+      }
+    }
+    newProps.className = className
+    if (ref) {
+      newProps.ref = ref
+    }
+
+    return (
+      <>
+        <Insertion
+          cache={cache}
+          serialized={serialized}
+          isStringTag={typeof WrappedComponent === 'string'}
+        />
+        <WrappedComponent {...newProps} />
+      </>
+    )
+  }
+)
+
+if (isDevelopment) {
+  Emotion.displayName = 'EmotionCssPropInternal'
+}
+
+export default Emotion

package/node_modules/@emotion/react/src/get-label-from-stack-trace.ts

@@ -0,0 +1,55 @@
+const getLastPart = (functionName: string): string => {
+  // The match may be something like 'Object.createEmotionProps' or
+  // 'Loader.prototype.render'
+  const parts = functionName.split('.')
+  return parts[parts.length - 1]
+}
+
+const getFunctionNameFromStackTraceLine = (
+  line: string
+): string | undefined => {
+  // V8
+  let match = /^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(line)
+  if (match) return getLastPart(match[1])
+
+  // Safari / Firefox
+  match = /^([A-Za-z0-9$.]+)@/.exec(line)
+  if (match) return getLastPart(match[1])
+
+  return undefined
+}
+
+const internalReactFunctionNames = /* #__PURE__ */ new Set([
+  'renderWithHooks',
+  'processChild',
+  'finishClassComponent',
+  'renderToString'
+])
+
+// These identifiers come from error stacks, so they have to be valid JS
+// identifiers, thus we only need to replace what is a valid character for JS,
+// but not for CSS.
+const sanitizeIdentifier = (identifier: string) =>
+  identifier.replace(/\$/g, '-')
+
+export const getLabelFromStackTrace = (stackTrace: string | undefined) => {
+  if (!stackTrace) return undefined
+
+  const lines = stackTrace.split('\n')
+
+  for (let i = 0; i < lines.length; i++) {
+    const functionName = getFunctionNameFromStackTraceLine(lines[i])
+
+    // The first line of V8 stack traces is just "Error"
+    if (!functionName) continue
+
+    // If we reach one of these, we have gone too far and should quit
+    if (internalReactFunctionNames.has(functionName)) break
+
+    // The component name is the first function in the stack that starts with an
+    // uppercase letter
+    if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName)
+  }
+
+  return undefined
+}

package/node_modules/@emotion/react/src/global.tsx

@@ -0,0 +1,147 @@
+import * as React from 'react'
+import isDevelopment from '#is-development'
+import { withEmotionCache } from './context'
+import { Theme, ThemeContext } from './theming'
+import { insertStyles } from '@emotion/utils'
+import { Options as SheetOptions, StyleSheet } from '@emotion/sheet'
+import isBrowser from '#is-browser'
+import { useInsertionEffectWithLayoutFallback } from '@emotion/use-insertion-effect-with-fallbacks'
+
+import { Interpolation, serializeStyles } from '@emotion/serialize'
+
+export interface GlobalProps {
+  styles: Interpolation<Theme>
+}
+
+let warnedAboutCssPropForGlobal = false
+
+// maintain place over rerenders.
+// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
+// initial client-side render from SSR, use place of hydrating tag
+
+export let Global = /* #__PURE__ */ withEmotionCache<GlobalProps>(
+  (props, cache) => {
+    if (
+      isDevelopment &&
+      !warnedAboutCssPropForGlobal && // check for className as well since the user is
+      // probably using the custom createElement which
+      // means it will be turned into a className prop
+      // I don't really want to add it to the type since it shouldn't be used
+      (('className' in props && props.className) ||
+        ('css' in props && props.css))
+    ) {
+      console.error(
+        "It looks like you're using the css prop on Global, did you mean to use the styles prop instead?"
+      )
+      warnedAboutCssPropForGlobal = true
+    }
+    let styles = props.styles
+
+    let serialized = serializeStyles(
+      [styles],
+      undefined,
+      React.useContext(ThemeContext)
+    )
+
+    if (!isBrowser) {
+      let serializedNames = serialized.name
+      let serializedStyles = serialized.styles
+      let next = serialized.next
+      while (next !== undefined) {
+        serializedNames += ' ' + next.name
+        serializedStyles += next.styles
+        next = next.next
+      }
+
+      let shouldCache = cache.compat === true
+
+      let rules = cache.insert(
+        ``,
+        { name: serializedNames, styles: serializedStyles },
+        cache.sheet,
+        shouldCache
+      )
+
+      if (shouldCache) {
+        return null
+      }
+
+      return (
+        <style
+          {...{
+            [`data-emotion`]: `${cache.key}-global ${serializedNames}`,
+            dangerouslySetInnerHTML: { __html: rules! },
+            nonce: cache.sheet.nonce
+          }}
+        />
+      )
+    }
+
+    // yes, i know these hooks are used conditionally
+    // but it is based on a constant that will never change at runtime
+    // it's effectively like having two implementations and switching them out
+    // so it's not actually breaking anything
+
+    let sheetRef = React.useRef<
+      [sheet: StyleSheet, isRehydrating: boolean] | undefined
+    >()
+
+    useInsertionEffectWithLayoutFallback(() => {
+      const key = `${cache.key}-global`
+
+      // use case of https://github.com/emotion-js/emotion/issues/2675
+      let sheet = new (cache.sheet.constructor as {
+        new (options: SheetOptions): StyleSheet
+      })({
+        key,
+        nonce: cache.sheet.nonce,
+        container: cache.sheet.container,
+        speedy: cache.sheet.isSpeedy
+      })
+      let rehydrating = false
+      let node: HTMLStyleElement | null = document.querySelector(
+        `style[data-emotion="${key} ${serialized.name}"]`
+      )
+      if (cache.sheet.tags.length) {
+        sheet.before = cache.sheet.tags[0]
+      }
+      if (node !== null) {
+        rehydrating = true
+        // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
+        node.setAttribute('data-emotion', key)
+        sheet.hydrate([node])
+      }
+      sheetRef.current = [sheet, rehydrating]
+      return () => {
+        sheet.flush()
+      }
+    }, [cache])
+
+    useInsertionEffectWithLayoutFallback(() => {
+      let sheetRefCurrent = sheetRef.current!
+      let [sheet, rehydrating] = sheetRefCurrent
+      if (rehydrating) {
+        sheetRefCurrent[1] = false
+        return
+      }
+      if (serialized.next !== undefined) {
+        // insert keyframes
+        insertStyles(cache, serialized.next, true)
+      }
+
+      if (sheet.tags.length) {
+        // if this doesn't exist then it will be null so the style element will be appended
+        let element = sheet.tags[sheet.tags.length - 1].nextElementSibling
+        sheet.before = element
+        sheet.flush()
+      }
+      cache.insert(``, serialized, sheet, false)
+    }, [cache, serialized.name])
+
+    return null
+  }
+)
+
+if (isDevelopment) {
+  Global.displayName = 'EmotionGlobal'
+}