@sitecore/sc-contenthub-blok 0.0.90 → 1.0.1

package/node_modules/@emotion/react/package.json

@@ -1,8 +1,9 @@
 {
   "name": "@emotion/react",
-  "version": "11.13.5",
+  "version": "11.14.0",
   "main": "dist/emotion-react.cjs.js",
   "module": "dist/emotion-react.esm.js",
+  "types": "dist/emotion-react.cjs.d.ts",
   "exports": {
     ".": {
       "types": {
@@ -232,25 +233,24 @@
   },
   "imports": {
     "#is-development": {
-      "development": "./src/conditions/true.js",
-      "default": "./src/conditions/false.js"
+      "development": "./src/conditions/true.ts",
+      "default": "./src/conditions/false.ts"
     },
     "#is-browser": {
-      "edge-light": "./src/conditions/false.js",
-      "workerd": "./src/conditions/false.js",
-      "worker": "./src/conditions/false.js",
-      "browser": "./src/conditions/true.js",
-      "default": "./src/conditions/is-browser.js"
+      "edge-light": "./src/conditions/false.ts",
+      "workerd": "./src/conditions/false.ts",
+      "worker": "./src/conditions/false.ts",
+      "browser": "./src/conditions/true.ts",
+      "default": "./src/conditions/is-browser.ts"
     }
   },
-  "types": "types/index.d.ts",
   "files": [
     "src",
     "dist",
     "jsx-runtime",
     "jsx-dev-runtime",
     "_isolated-hnrs",
-    "types/*.d.ts",
+    "types/css-prop.d.ts",
     "macro.*"
   ],
   "sideEffects": false,
@@ -262,9 +262,9 @@
   "dependencies": {
     "@babel/runtime": "^7.18.3",
     "@emotion/babel-plugin": "^11.13.5",
-    "@emotion/cache": "^11.13.5",
+    "@emotion/cache": "^11.14.0",
     "@emotion/serialize": "^1.3.3",
-    "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0",
+    "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0",
     "@emotion/utils": "^1.4.2",
     "@emotion/weak-memoize": "^0.4.0",
     "hoist-non-react-statics": "^3.3.1"
@@ -280,9 +280,10 @@
   "devDependencies": {
     "@definitelytyped/dtslint": "0.0.112",
     "@emotion/css": "11.13.5",
-    "@emotion/css-prettifier": "1.1.4",
+    "@emotion/css-prettifier": "1.2.0",
     "@emotion/server": "11.11.0",
-    "@emotion/styled": "11.13.5",
+    "@emotion/styled": "11.14.0",
+    "@types/hoist-non-react-statics": "^3.3.5",
     "html-tag-names": "^1.1.2",
     "react": "16.14.0",
     "svg-tag-names": "^1.1.1",
@@ -295,10 +296,10 @@
   "umd:main": "dist/emotion-react.umd.min.js",
   "preconstruct": {
     "entrypoints": [
-      "./index.js",
-      "./jsx-runtime.js",
-      "./jsx-dev-runtime.js",
-      "./_isolated-hnrs.js"
+      "./index.ts",
+      "./jsx-runtime.ts",
+      "./jsx-dev-runtime.ts",
+      "./_isolated-hnrs.ts"
     ],
     "umdName": "emotionReact",
     "exports": {

package/node_modules/@emotion/react/src/{_isolated-hnrs.js → _isolated-hnrs.ts}

@@ -6,5 +6,10 @@ 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 (targetComponent, sourceComponent) =>
-  hoistNonReactStatics(targetComponent, sourceComponent)
+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.js → class-names.tsx}

@@ -1,27 +1,29 @@
 import * as React from 'react'
 import {
+  EmotionCache,
   getRegisteredStyles,
   insertStyles,
-  registerStyles
+  registerStyles,
+  SerializedStyles
 } from '@emotion/utils'
-import { serializeStyles } from '@emotion/serialize'
+import { CSSInterpolation, serializeStyles } from '@emotion/serialize'
 import isDevelopment from '#is-development'
 import { withEmotionCache } from './context'
-import { ThemeContext } from './theming'
+import { Theme, ThemeContext } from './theming'
 import { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks'
 import isBrowser from '#is-browser'
 
-/*
-type ClassNameArg =
+export interface ArrayClassNamesArg extends Array<ClassNamesArg> {}
+
+export type ClassNamesArg =
+  | undefined
+  | null
   | string
   | boolean
-  | { [key: string]: boolean }
-  | Array<ClassNameArg>
-  | null
-  | void
-*/
+  | { [className: string]: boolean | null | undefined }
+  | ArrayClassNamesArg
 
-let classnames = (args /*: Array<ClassNameArg> */) /*: string */ => {
+let classnames = (args: ArrayClassNamesArg): string => {
   let len = args.length
   let i = 0
   let cls = ''
@@ -69,11 +71,11 @@ let classnames = (args /*: Array<ClassNameArg> */) /*: string */ => {
   return cls
 }
 function merge(
-  registered /*: Object */,
-  css /*: (...args: Array<any>) => string */,
-  className /*: string */
+  registered: EmotionCache['registered'],
+  css: ClassNamesContent['css'],
+  className: string
 ) {
-  const registeredStyles = []
+  const registeredStyles: string[] = []
 
   const rawClassName = getRegisteredStyles(
     registered,
@@ -87,7 +89,13 @@ function merge(
   return rawClassName + css(registeredStyles)
 }
 
-const Insertion = ({ cache, serializedArr }) => {
+const Insertion = ({
+  cache,
+  serializedArr
+}: {
+  cache: EmotionCache
+  serializedArr: SerializedStyles[]
+}) => {
   let rules = useInsertionEffectAlwaysWithSyncFallback(() => {
     let rules = ''
     for (let i = 0; i < serializedArr.length; i++) {
@@ -101,14 +109,14 @@ const Insertion = ({ cache, serializedArr }) => {
     }
   })
 
-  if (!isBrowser && rules.length !== 0) {
+  if (!isBrowser && rules!.length !== 0) {
     return (
       <style
         {...{
           [`data-emotion`]: `${cache.key} ${serializedArr
             .map(serialized => serialized.name)
             .join(' ')}`,
-          dangerouslySetInnerHTML: { __html: rules },
+          dangerouslySetInnerHTML: { __html: rules! },
           nonce: cache.sheet.nonce
         }}
       />
@@ -117,21 +125,23 @@ const Insertion = ({ cache, serializedArr }) => {
   return null
 }
 
-/*
-type Props = {
-  children: ({
-    css: (...args: any) => string,
-    cx: (...args: Array<ClassNameArg>) => string,
-    theme: Object
-  }) => React.Node
-} */
+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 /*: React.AbstractComponent<Props>*/ =
-  /* #__PURE__ */ withEmotionCache((props, cache) => {
+export const ClassNames = /* #__PURE__ */ withEmotionCache<ClassNamesProps>(
+  (props, cache) => {
     let hasRendered = false
-    let serializedArr = []
+    let serializedArr: SerializedStyles[] = []
 
-    let css = (...args /*: Array<any> */) => {
+    let css: ClassNamesContent['css'] = (...args) => {
       if (hasRendered && isDevelopment) {
         throw new Error('css can only be used during render')
       }
@@ -142,7 +152,7 @@ export const ClassNames /*: React.AbstractComponent<Props>*/ =
       registerStyles(cache, serialized, false)
       return `${cache.key}-${serialized.name}`
     }
-    let cx = (...args /*: Array<ClassNameArg>*/) => {
+    let cx = (...args: Array<ClassNamesArg>) => {
       if (hasRendered && isDevelopment) {
         throw new Error('cx can only be used during render')
       }
@@ -162,7 +172,8 @@ export const ClassNames /*: React.AbstractComponent<Props>*/ =
         {ele}
       </>
     )
-  })
+  }
+)
 
 if (isDevelopment) {
   ClassNames.displayName = 'EmotionClassNames'

package/node_modules/@emotion/react/src/{context.js → context.tsx}

@@ -1,12 +1,11 @@
-/* import { type EmotionCache } from '@emotion/utils' */
 import * as React from 'react'
 import { useContext, forwardRef } from 'react'
-import createCache from '@emotion/cache'
+import createCache, { EmotionCache } from '@emotion/cache'
 import isDevelopment from '#is-development'
 import isBrowser from '#is-browser'
 
-let EmotionCacheContext /*: React.Context<EmotionCache | null> */ =
-  /* #__PURE__ */ React.createContext(
+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
@@ -24,28 +23,32 @@ if (isDevelopment) {
 
 export let CacheProvider = EmotionCacheContext.Provider
 
-export let __unsafe_useEmotionCache =
-  function useEmotionCache() /*: EmotionCache | null*/ {
-    return useContext(EmotionCacheContext)
-  }
+export let __unsafe_useEmotionCache = function useEmotionCache() {
+  return useContext(EmotionCacheContext)
+}
 
-let withEmotionCache =
-  function withEmotionCache /* <Props, Ref: React.Ref<*>> */(
-    func /*: (props: Props, cache: EmotionCache, ref: Ref) => React.Node */
-  ) /*: React.AbstractComponent<Props> */ {
-    return forwardRef((props /*: Props */, ref /*: Ref */) => {
-      // the cache will never be null in the browser
-      let cache = 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)
-    })
-  }
+    return func(props, cache, ref)
+  })
+}
 
 if (!isBrowser) {
-  withEmotionCache = function withEmotionCache /* <Props> */(
-    func /*: (props: Props, cache: EmotionCache) => React.Node */
-  ) /*: React.StatelessFunctionalComponent<Props> */ {
-    return (props /*: Props */) => {
+  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

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.js → emotion-element.tsx}

@@ -1,26 +1,35 @@
 import * as React from 'react'
 import { withEmotionCache } from './context'
-import { ThemeContext } from './theming'
+import { Theme, ThemeContext } from './theming'
 import {
+  EmotionCache,
   getRegisteredStyles,
   insertStyles,
-  registerStyles
+  registerStyles,
+  SerializedStyles
 } from '@emotion/utils'
 import { hasOwn } from './utils'
-import { serializeStyles } from '@emotion/serialize'
+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'
 
-let typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__'
+const typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__'
 
-let labelPropName = '__EMOTION_LABEL_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 /*: Object */
-) => {
+  type: React.ElementType,
+  props: { css: Interpolation<Theme> }
+): EmotionProps => {
   if (
     isDevelopment &&
     typeof props.css === 'string' &&
@@ -32,11 +41,11 @@ export const createEmotionProps = (
     )
   }
 
-  let newProps /*: any */ = {}
+  let newProps = {} as EmotionProps
 
   for (let key in props) {
     if (hasOwn.call(props, key)) {
-      newProps[key] = props[key]
+      newProps[key] = props[key as keyof typeof props]
     }
   }
 
@@ -51,9 +60,10 @@ export const createEmotionProps = (
   if (
     isDevelopment &&
     typeof globalThis !== 'undefined' &&
-    !!globalThis.EMOTION_RUNTIME_AUTO_LABEL &&
+    !!(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)
   ) {
@@ -64,7 +74,15 @@ export const createEmotionProps = (
   return newProps
 }
 
-const Insertion = ({ cache, serialized, isStringTag }) => {
+const Insertion = ({
+  cache,
+  serialized,
+  isStringTag
+}: {
+  cache: EmotionCache
+  serialized: SerializedStyles
+  isStringTag: boolean
+}) => {
   registerStyles(cache, serialized, isStringTag)
 
   const rules = useInsertionEffectAlwaysWithSyncFallback(() =>
@@ -91,9 +109,9 @@ const Insertion = ({ cache, serialized, isStringTag }) => {
   return null
 }
 
-let Emotion = /* #__PURE__ */ withEmotionCache(
-  /* <any, any> */ (props, cache, ref) => {
-    let cssProp = props.css
+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
@@ -105,7 +123,9 @@ let Emotion = /* #__PURE__ */ withEmotionCache(
       cssProp = cache.registered[cssProp]
     }
 
-    let WrappedComponent = props[typePropName]
+    let WrappedComponent = props[
+      typePropName
+    ] as EmotionProps[typeof typePropName]
     let registeredStyles = [cssProp]
     let className = ''
 
@@ -137,7 +157,7 @@ let Emotion = /* #__PURE__ */ withEmotionCache(
 
     className += `${cache.key}-${serialized.name}`
 
-    const newProps = {}
+    const newProps: Record<string, unknown> = {}
     for (let key in props) {
       if (
         hasOwn.call(props, key) &&

package/node_modules/@emotion/react/src/{get-label-from-stack-trace.js → get-label-from-stack-trace.ts}

@@ -1,11 +1,13 @@
-const getLastPart = (functionName /* : string */) /* : string */ => {
+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*/ => {
+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])
@@ -27,9 +29,10 @@ const internalReactFunctionNames = /* #__PURE__ */ new Set([
 // 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 => identifier.replace(/\$/g, '-')
+const sanitizeIdentifier = (identifier: string) =>
+  identifier.replace(/\$/g, '-')
 
-export const getLabelFromStackTrace = stackTrace => {
+export const getLabelFromStackTrace = (stackTrace: string | undefined) => {
   if (!stackTrace) return undefined
 
   const lines = stackTrace.split('\n')

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'
+}

package/node_modules/@emotion/react/src/{index.js → index.ts}

@@ -1,6 +1,15 @@
 import isDevelopment from '#is-development'
 import pkg from '../package.json'
-// export type { SerializedStyles } from '@emotion/utils'
+export type { EmotionCache } from '@emotion/cache'
+export type {
+  ArrayInterpolation,
+  ComponentSelector,
+  CSSObject,
+  FunctionInterpolation,
+  Interpolation,
+  Keyframes,
+  SerializedStyles
+} from '@emotion/serialize'
 export {
   withEmotionCache,
   CacheProvider,
@@ -9,10 +18,23 @@ export {
 export { jsx } from './jsx'
 export { jsx as createElement } from './jsx'
 export { Global } from './global'
+export type { GlobalProps } from './global'
 export { keyframes } from './keyframes'
 export { ClassNames } from './class-names'
+export type {
+  ClassNamesArg,
+  ClassNamesContent,
+  ClassNamesProps,
+  ArrayClassNamesArg
+} from './class-names'
 export { ThemeContext, useTheme, ThemeProvider, withTheme } from './theming'
+export type { Theme, ThemeProviderProps, WithTheme } from './theming'
 export { default as css } from './css'
+export type { DistributiveOmit, PropsOf } from './types'
+
+declare const global: Record<string, unknown>
+declare const jest: unknown
+declare const vi: unknown
 
 if (isDevelopment) {
   const isBrowser = typeof document !== 'undefined'
@@ -21,8 +43,7 @@ if (isDevelopment) {
 
   if (isBrowser && !isTestEnv) {
     // globalThis has wide browser support - https://caniuse.com/?search=globalThis, Node.js 12 and later
-    const globalContext =
-      // $FlowIgnore
+    const globalContext: Record<string, unknown> =
       typeof globalThis !== 'undefined'
         ? globalThis // eslint-disable-line no-undef
         : isBrowser