@itwin/itwinui-react 3.15.5 → 5.0.0-alpha.0

package/DEV-esm/utils/functions/polymorphic.js

@@ -1,49 +0,0 @@
-import * as React from 'react';
-import cx from 'classnames';
-import { useGlobals } from '../hooks/useGlobals.js';
-import { styles } from '../../styles.js';
-let _base = (defaultElement) => (className, attrs) => {
-  let Comp = React.forwardRef(({ as = defaultElement, ...props }, ref) => {
-    props = {
-      ...attrs,
-      ...props,
-      className: getScopedClassName(
-        cx(className, attrs?.className, props.className),
-      ),
-    };
-    let Element = as || 'div';
-    if (
-      'button' === Element ||
-      'a' === Element ||
-      ('input' === Element && 'checkbox' === props.type)
-    ) {
-      var _props;
-      (_props = props).tabIndex ?? (_props.tabIndex = 0);
-    }
-    useGlobals();
-    return React.createElement(Element, {
-      ref: ref,
-      ...props,
-    });
-  });
-  Comp.displayName = getDisplayNameFromClass(className);
-  return Comp;
-};
-export const polymorphic = new Proxy(
-  {},
-  {
-    get: (target, prop) => {
-      if ('string' == typeof prop) return _base(prop);
-      return Reflect.get(target, prop);
-    },
-  },
-);
-let getDisplayNameFromClass = (str) => {
-  let camel = str.replace(/-([a-z])/g, (g) => g[1].toUpperCase());
-  return camel.substring(3);
-};
-let getScopedClassName = (className = '') =>
-  className
-    .split(' ')
-    .map((c) => (c in styles ? styles[c] : c))
-    .join(' ') || null;

package/DEV-esm/utils/functions/react.js

@@ -1,17 +0,0 @@
-import * as React from 'react';
-import { mergeRefs } from '../hooks/useMergedRefs.js';
-export const cloneElementWithRef = (children, getProps) => {
-  if (!children) return null;
-  if (!React.isValidElement(children)) return children;
-  let props = getProps(children);
-  let ref = mergeRefs(
-    ...[
-      'ref' in children ? children.ref : null,
-      'ref' in props ? props.ref : null,
-    ].filter(Boolean),
-  );
-  return React.cloneElement(children, {
-    ...props,
-    ref,
-  });
-};

package/DEV-esm/utils/functions/supports.js

@@ -1,3 +0,0 @@
-import { getWindow } from './dom.js';
-export const supportsHas = () =>
-  getWindow()?.CSS?.supports?.('selector(:has(+ *))');

package/DEV-esm/utils/hooks/index.js

@@ -1,17 +0,0 @@
-export * from './useEventListener.js';
-export * from './useMergedRefs.js';
-export * from './useOverflow.js';
-export * from './useResizeObserver.js';
-export * from './useContainerWidth.js';
-export * from './useGlobals.js';
-export * from './useIntersection.js';
-export * from './useMediaQuery.js';
-export * from './useSafeContext.js';
-export * from './useLatestRef.js';
-export * from './useIsomorphicLayoutEffect.js';
-export * from './useIsClient.js';
-export * from './useId.js';
-export * from './useControlledState.js';
-export * from './useSyncExternalStore.js';
-export * from './useVirtualScroll.js';
-export * from './useWarningLogger.js';

package/DEV-esm/utils/hooks/useContainerWidth.js

@@ -1,18 +0,0 @@
-import * as React from 'react';
-import { useMergedRefs } from './useMergedRefs.js';
-import { useResizeObserver } from './useResizeObserver.js';
-export const useContainerWidth = (watchResizes = true) => {
-  let [contentWidth, setContentWidth] = React.useState(0);
-  let ref = React.useCallback((element) => {
-    if (!element) return;
-    setContentWidth(element.getBoundingClientRect().width);
-  }, []);
-  let updateWidth = React.useCallback(
-    ({ width }) => setContentWidth(width),
-    [],
-  );
-  let [resizeRef, resizeObserver] = useResizeObserver(updateWidth);
-  if (!watchResizes) resizeObserver?.disconnect();
-  let refs = useMergedRefs(ref, watchResizes ? resizeRef : void 0);
-  return [refs, contentWidth];
-};

package/DEV-esm/utils/hooks/useControlledState.js

@@ -1,20 +0,0 @@
-import * as React from 'react';
-export const useControlledState = (
-  initialValue,
-  controlledState,
-  setControlledState,
-) => {
-  let [uncontrolledState, setUncontrolledState] = React.useState(initialValue);
-  let state = React.useMemo(
-    () => (void 0 !== controlledState ? controlledState : uncontrolledState),
-    [controlledState, uncontrolledState],
-  );
-  let setState = React.useCallback(
-    (value) => {
-      setUncontrolledState(value);
-      setControlledState?.(value);
-    },
-    [setControlledState, setUncontrolledState],
-  );
-  return [state, setState];
-};

package/DEV-esm/utils/hooks/useDragAndDrop.js

@@ -1,105 +0,0 @@
-import * as React from 'react';
-import {
-  getTranslateValuesFromElement,
-  getWindow,
-} from '../functions/index.js';
-import { useEventListener } from './useEventListener.js';
-import { useResizeObserver } from './useResizeObserver.js';
-let getContainerRect = (containerRef) => {
-  let containerRect = containerRef?.current?.getBoundingClientRect();
-  return {
-    top: containerRect?.top ?? 0,
-    right: containerRect?.right ?? getWindow()?.innerWidth ?? 0,
-    bottom: containerRect?.bottom ?? getWindow()?.innerHeight ?? 0,
-    left: containerRect?.left ?? 0,
-  };
-};
-export const useDragAndDrop = (elementRef, containerRef, enabled = true) => {
-  let grabOffsetX = React.useRef(0);
-  let grabOffsetY = React.useRef(0);
-  let translateX = React.useRef();
-  let translateY = React.useRef();
-  let containerRectRef = React.useRef(getContainerRect(containerRef));
-  let adjustTransform = React.useCallback(() => {
-    if (!elementRef.current || !enabled) return;
-    let { top, right, bottom, left } =
-      elementRef.current?.getBoundingClientRect();
-    let [newTranslateX, newTranslateY] = getTranslateValuesFromElement(
-      elementRef.current,
-    );
-    containerRectRef.current = getContainerRect(containerRef);
-    if (bottom > containerRectRef.current.bottom)
-      newTranslateY -= bottom - containerRectRef.current.bottom;
-    if (top < containerRectRef.current.top)
-      newTranslateY += containerRectRef.current.top - top;
-    if (right > containerRectRef.current.right)
-      newTranslateX -= right - containerRectRef.current.right;
-    if (left < containerRectRef.current.left)
-      newTranslateX += containerRectRef.current.left - left;
-    translateX.current = newTranslateX;
-    translateY.current = newTranslateY;
-    elementRef.current.style.transform = `translate(${newTranslateX}px, ${newTranslateY}px)`;
-  }, [containerRef, elementRef, enabled]);
-  let [resizeRef, resizeObserver] = useResizeObserver(adjustTransform);
-  resizeRef(containerRef?.current);
-  React.useEffect(
-    () => () => {
-      resizeObserver?.disconnect();
-    },
-    [resizeObserver],
-  );
-  useEventListener(
-    'resize',
-    () => {
-      adjustTransform();
-      if (null != translateX.current && null != translateY.current)
-        setTransform(
-          `translate(${translateX.current}px, ${translateY.current}px)`,
-        );
-    },
-    getWindow(),
-  );
-  let [transform, setTransform] = React.useState('');
-  let onPointerMove = React.useRef((event) => {
-    if (!elementRef.current) return;
-    let newTranslateX = event.clientX - grabOffsetX.current;
-    let newTranslateY = event.clientY - grabOffsetY.current;
-    elementRef.current.style.transform = `translate(${newTranslateX}px, ${newTranslateY}px)`;
-    adjustTransform();
-  });
-  let originalUserSelect = React.useRef('');
-  let onPointerDown = React.useCallback(
-    (e) => {
-      if (!elementRef.current || 0 !== e.button || !enabled) return;
-      let [x, y] = getTranslateValuesFromElement(elementRef.current);
-      grabOffsetX.current = e.clientX - x;
-      grabOffsetY.current = e.clientY - y;
-      originalUserSelect.current = elementRef.current.style.userSelect;
-      elementRef.current.style.userSelect = 'none';
-      let ownerDocument = elementRef.current.ownerDocument || document;
-      ownerDocument.addEventListener('pointermove', onPointerMove.current);
-      ownerDocument.addEventListener(
-        'pointerup',
-        () => {
-          setTransform(
-            `translate(${translateX.current}px, ${translateY.current}px)`,
-          );
-          ownerDocument.removeEventListener(
-            'pointermove',
-            onPointerMove.current,
-          );
-          if (elementRef.current)
-            elementRef.current.style.userSelect = originalUserSelect.current;
-        },
-        {
-          once: true,
-        },
-      );
-    },
-    [elementRef, enabled],
-  );
-  return {
-    onPointerDown,
-    transform,
-  };
-};

package/DEV-esm/utils/hooks/useEventListener.js

@@ -1,15 +0,0 @@
-import * as React from 'react';
-export const useEventListener = (eventName, handler, element) => {
-  let savedHandler = React.useRef();
-  React.useEffect(() => {
-    savedHandler.current = handler;
-  }, [handler]);
-  React.useEffect(() => {
-    if (!element) return;
-    let eventListener = (event) => savedHandler.current?.(event);
-    element.addEventListener(eventName, eventListener);
-    return () => {
-      element.removeEventListener(eventName, eventListener);
-    };
-  }, [eventName, element]);
-};

package/DEV-esm/utils/hooks/useGlobals.js

@@ -1,37 +0,0 @@
-import * as React from 'react';
-import { ThemeContext } from '../../core/ThemeProvider/ThemeContext.js';
-import { isUnitTest } from '../functions/dev.js';
-let didLogWarning = {
-  fontSize: false,
-  themeProvider: false,
-};
-export const useGlobals = () => {
-  let themeContext = React.useContext(ThemeContext);
-  useThemeProviderWarning(themeContext);
-  useRootFontSizeWarning();
-  return themeContext;
-};
-export const useThemeProviderWarning = (themeContext) => {
-  React.useEffect(() => {
-    if (!isUnitTest && !didLogWarning.themeProvider && !themeContext) {
-      console.error(
-        'iTwinUI components must be used within a tree wrapped in a ThemeProvider.',
-      );
-      didLogWarning.themeProvider = true;
-    }
-  }, [themeContext]);
-};
-let useRootFontSizeWarning = () => {
-  React.useEffect(() => {
-    if (!isUnitTest && !didLogWarning.fontSize) {
-      let rootFontSize = parseInt(
-        getComputedStyle(document.documentElement).fontSize,
-      );
-      if (rootFontSize < 16)
-        console.error(
-          'Root font size must not be overridden. \nSee https://github.com/iTwin/iTwinUI/wiki/iTwinUI-react-v2-migration-guide#relative-font-size',
-        );
-      didLogWarning.fontSize = true;
-    }
-  }, []);
-};

package/DEV-esm/utils/hooks/useId.js

@@ -1,9 +0,0 @@
-import * as React from 'react';
-import { getRandomValue } from '../functions/numbers.js';
-export const useId = () => {
-  let uniqueValue = useUniqueValue();
-  return React.useMemo(() => `iui-${uniqueValue}`, [uniqueValue]);
-};
-let _React = React;
-let useUniqueValue =
-  _React.useId ?? (() => React.useMemo(() => getRandomValue(10), []));

package/DEV-esm/utils/hooks/useIntersection.js

@@ -1,30 +0,0 @@
-import * as React from 'react';
-import { getWindow } from '../functions/dom.js';
-export const useIntersection = (onIntersect, options = {}, once = true) => {
-  let { root, rootMargin, threshold } = options;
-  let cleanupRef = React.useRef(() => {});
-  let setRef = React.useCallback(
-    (node) => {
-      cleanupRef.current?.();
-      cleanupRef.current = () => {};
-      if (!node || !getWindow()?.IntersectionObserver) return;
-      let observer = new IntersectionObserver(
-        ([entry], obs) => {
-          if (entry.isIntersecting) {
-            if (once) obs.disconnect();
-            onIntersect();
-          }
-        },
-        {
-          root,
-          rootMargin,
-          threshold,
-        },
-      );
-      observer.observe(node);
-      cleanupRef.current = () => observer.disconnect();
-    },
-    [onIntersect, once, root, rootMargin, threshold],
-  );
-  return setRef;
-};

package/DEV-esm/utils/hooks/useIsClient.js

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export const useIsClient = () => {
-  let [isClient, setIsClient] = React.useState(false);
-  React.useEffect(() => {
-    setIsClient(true);
-  }, []);
-  return isClient;
-};

package/DEV-esm/utils/hooks/useIsomorphicLayoutEffect.js

@@ -1,4 +0,0 @@
-import * as React from 'react';
-let useIsomorphicLayoutEffect =
-  'undefined' != typeof window ? React.useLayoutEffect : React.useEffect;
-export { useIsomorphicLayoutEffect as useLayoutEffect };

package/DEV-esm/utils/hooks/useLatestRef.js

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export const useLatestRef = (value) => {
-  let valueRef = React.useRef(value);
-  React.useEffect(() => {
-    valueRef.current = value;
-  }, [value]);
-  return valueRef;
-};

package/DEV-esm/utils/hooks/useMediaQuery.js

@@ -1,20 +0,0 @@
-import * as React from 'react';
-import { useSyncExternalStore } from './useSyncExternalStore.js';
-export const useMediaQuery = (queryString) => {
-  let getSnapshot = React.useCallback(
-    () =>
-      'undefined' != typeof window
-        ? window.matchMedia?.(queryString).matches
-        : void 0,
-    [queryString],
-  );
-  let subscribe = React.useCallback(
-    (onChange) => {
-      let mediaQueryList = window.matchMedia?.(queryString);
-      mediaQueryList?.addEventListener?.('change', onChange);
-      return () => mediaQueryList?.removeEventListener?.('change', onChange);
-    },
-    [queryString],
-  );
-  return useSyncExternalStore(subscribe, getSnapshot, () => void 0);
-};

package/DEV-esm/utils/hooks/useMergedRefs.js

@@ -1,11 +0,0 @@
-import * as React from 'react';
-export const mergeRefs =
-  (...refs) =>
-  (instance) => {
-    refs.forEach((ref) => {
-      if ('function' == typeof ref) ref(instance);
-      else if (ref) ref.current = instance;
-    });
-  };
-export const useMergedRefs = (...refs) =>
-  React.useCallback(mergeRefs(...refs), [...refs]);

package/DEV-esm/utils/hooks/useOverflow.js

@@ -1,63 +0,0 @@
-import * as React from 'react';
-import { useMergedRefs } from './useMergedRefs.js';
-import { useResizeObserver } from './useResizeObserver.js';
-import { useLayoutEffect } from './useIsomorphicLayoutEffect.js';
-let STARTING_MAX_ITEMS_COUNT = 20;
-export const useOverflow = (
-  itemsCount,
-  disabled = false,
-  orientation = 'horizontal',
-) => {
-  let containerRef = React.useRef(null);
-  let [visibleCount, setVisibleCount] = React.useState(() =>
-    disabled ? itemsCount : Math.min(itemsCount, STARTING_MAX_ITEMS_COUNT),
-  );
-  let needsFullRerender = React.useRef(true);
-  let [containerSize, setContainerSize] = React.useState(0);
-  let previousContainerSize = React.useRef(0);
-  let updateContainerSize = React.useCallback(
-    ({ width, height }) =>
-      setContainerSize('horizontal' === orientation ? width : height),
-    [orientation],
-  );
-  let [resizeRef, observer] = useResizeObserver(updateContainerSize);
-  let resizeObserverRef = React.useRef(observer);
-  useLayoutEffect(() => {
-    if (disabled) setVisibleCount(itemsCount);
-    else {
-      setVisibleCount(Math.min(itemsCount, STARTING_MAX_ITEMS_COUNT));
-      needsFullRerender.current = true;
-    }
-  }, [containerSize, disabled, itemsCount]);
-  let mergedRefs = useMergedRefs(containerRef, resizeRef);
-  useLayoutEffect(() => {
-    if (!containerRef.current || disabled) {
-      resizeObserverRef.current?.disconnect();
-      return;
-    }
-    let dimension = 'horizontal' === orientation ? 'Width' : 'Height';
-    let availableSize = containerRef.current[`offset${dimension}`];
-    let requiredSize = containerRef.current[`scroll${dimension}`];
-    if (availableSize < requiredSize) {
-      let avgItemSize = requiredSize / visibleCount;
-      let visibleItems = Math.floor(availableSize / avgItemSize);
-      setVisibleCount(visibleItems > 0 ? visibleItems : 1);
-    } else if (needsFullRerender.current) {
-      let childrenSize = Array.from(containerRef.current.children).reduce(
-        (sum, child) => sum + child[`offset${dimension}`],
-        0,
-      );
-      let currentVisibleCount =
-        visibleCount || Math.min(itemsCount, STARTING_MAX_ITEMS_COUNT);
-      let avgItemSize = childrenSize / currentVisibleCount;
-      let visibleItems = Math.floor(availableSize / avgItemSize);
-      if (!isNaN(visibleItems))
-        setVisibleCount(Math.min(itemsCount, 2 * visibleItems));
-    }
-    needsFullRerender.current = false;
-  }, [containerSize, visibleCount, disabled, itemsCount, orientation]);
-  useLayoutEffect(() => {
-    previousContainerSize.current = containerSize;
-  }, [containerSize]);
-  return [mergedRefs, visibleCount];
-};

package/DEV-esm/utils/hooks/useResizeObserver.js

@@ -1,23 +0,0 @@
-import * as React from 'react';
-import { getWindow } from '../functions/dom.js';
-export const useResizeObserver = (onResize) => {
-  let resizeObserver = React.useRef();
-  let elementRef = React.useCallback(
-    (element) => {
-      if (!getWindow()?.ResizeObserver) return;
-      resizeObserver.current?.disconnect?.();
-      if (element) {
-        resizeObserver.current = new ResizeObserver((entries) => {
-          window.requestAnimationFrame(() => {
-            if (!Array.isArray(entries) || !entries.length) return;
-            let [{ contentRect }] = entries;
-            return onResize(contentRect);
-          });
-        });
-        resizeObserver.current?.observe?.(element);
-      }
-    },
-    [onResize],
-  );
-  return [elementRef, resizeObserver.current];
-};

package/DEV-esm/utils/hooks/useSafeContext.js

@@ -1,7 +0,0 @@
-import * as React from 'react';
-export const useSafeContext = (context) => {
-  let value = React.useContext(context);
-  if (!value)
-    throw new Error(`${context.displayName || 'Context'} is undefined`);
-  return value;
-};

package/DEV-esm/utils/hooks/useSyncExternalStore.js

@@ -1,32 +0,0 @@
-import * as React from 'react';
-let _React = React;
-export const useSyncExternalStore =
-  _React.useSyncExternalStore || useSyncExternalStoreShim;
-function useSyncExternalStoreShim(subscribe, getSnapshot) {
-  let value = getSnapshot();
-  let [{ instance }, forceUpdate] = React.useState({
-    instance: {
-      value,
-      getSnapshot,
-    },
-  });
-  React.useLayoutEffect(() => {
-    instance.value = value;
-    instance.getSnapshot = getSnapshot;
-    if (!Object.is(value, getSnapshot()))
-      forceUpdate({
-        instance,
-      });
-  }, [subscribe, value, getSnapshot]);
-  React.useEffect(() => {
-    let synchronize = () => {
-      if (!Object.is(instance.value, instance.getSnapshot()))
-        forceUpdate({
-          instance,
-        });
-    };
-    synchronize();
-    return subscribe(synchronize);
-  }, [subscribe]);
-  return value;
-}

package/DEV-esm/utils/hooks/useVirtualScroll.js

@@ -1,50 +0,0 @@
-import { useVirtualizer } from '@tanstack/react-virtual';
-import React from 'react';
-let css = `
-:host {
-  contain: layout;
-  background-color: var(--iui-color-background);
-}
-[data-iui-virtualizer='root'] {
-  min-inline-size: 100%;
-  position: relative;
-}
-::slotted([data-iui-virtualizer='item']) {
-  position: absolute !important;
-  top: 0 !important;
-  left: 0 !important;
-}
-`;
-export const useVirtualScroll = (params) => {
-  let { ...rest } = params;
-  let _virtualizer = useVirtualizer({
-    indexAttribute: 'data-iui-index',
-    overscan: 10,
-    ...rest,
-  });
-  let scrollToIndex = React.useCallback(
-    (index, options) => {
-      setTimeout(() => {
-        _virtualizer.scrollToIndex(index, {
-          align: 'auto',
-          ...options,
-        });
-      });
-    },
-    [_virtualizer],
-  );
-  let virtualizer = React.useMemo(
-    () => ({
-      ..._virtualizer,
-      scrollToIndex,
-    }),
-    [_virtualizer, scrollToIndex],
-  );
-  return React.useMemo(
-    () => ({
-      virtualizer,
-      css,
-    }),
-    [virtualizer],
-  );
-};

package/DEV-esm/utils/hooks/useWarningLogger.js

@@ -1,32 +0,0 @@
-import * as React from 'react';
-import { isUnitTest } from '../functions/dev.js';
-import { getWindow } from '../functions/dom.js';
-let _React = React;
-let ReactInternals = _React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
-export const useWarningLogger = isUnitTest
-  ? () => () => {}
-  : function () {
-      let loggedRef = React.useRef(false);
-      let timeoutRef = React.useRef(void 0);
-      let stack = ReactInternals?.ReactDebugCurrentFrame?.getCurrentStack?.();
-      let componentName = stack?.trim().split('\n')[1]?.trim();
-      let prefix = componentName ? `Warning (${componentName}):` : 'Warning:';
-      let logWarning = React.useCallback(
-        (message) => {
-          timeoutRef.current = getWindow()?.setTimeout(() => {
-            if (!loggedRef.current) {
-              console.error(prefix, message);
-              loggedRef.current = true;
-            }
-          });
-        },
-        [prefix],
-      );
-      React.useEffect(
-        () => () => {
-          if (timeoutRef.current) getWindow()?.clearTimeout(timeoutRef.current);
-        },
-        [],
-      );
-      return logWarning;
-    };

package/DEV-esm/utils/icons/StatusIconMap.js

@@ -1,27 +0,0 @@
-import * as React from 'react';
-import { SvgInfoCircular } from './SvgInfoCircular.js';
-import { SvgStatusError } from './SvgStatusError.js';
-import { SvgStatusSuccess } from './SvgStatusSuccess.js';
-import { SvgStatusWarning } from './SvgStatusWarning.js';
-export const StatusIconMap = {
-  negative: (args) =>
-    React.createElement(SvgStatusError, {
-      'aria-hidden': true,
-      ...args,
-    }),
-  positive: (args) =>
-    React.createElement(SvgStatusSuccess, {
-      'aria-hidden': true,
-      ...args,
-    }),
-  warning: (args) =>
-    React.createElement(SvgStatusWarning, {
-      'aria-hidden': true,
-      ...args,
-    }),
-  informational: (args) =>
-    React.createElement(SvgInfoCircular, {
-      'aria-hidden': true,
-      ...args,
-    }),
-};

package/DEV-esm/utils/icons/Svg.js

@@ -1,6 +0,0 @@
-import { polymorphic } from '../functions/polymorphic.js';
-export const Svg = polymorphic.svg('', {
-  viewBox: '0 0 16 16',
-  width: 16,
-  height: 16,
-});

package/DEV-esm/utils/icons/SvgCalendar.js

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { Svg } from './Svg.js';
-export const SvgCalendar = (props) =>
-  React.createElement(
-    Svg,
-    props,
-    React.createElement('path', {
-      d: 'M13,13H9V10h4ZM16,3V15a1,1,0,0,1-1,1H1a1,1,0,0,1-1-1V3A1,1,0,0,1,1,2H3V0H4V2h8V0h1V2h2A1,1,0,0,1,16,3ZM15,6H1v9H15Z',
-    }),
-  );

package/DEV-esm/utils/icons/SvgCaretDownSmall.js

@@ -1,10 +0,0 @@
-import * as React from 'react';
-import { Svg } from './Svg.js';
-export const SvgCaretDownSmall = (props) =>
-  React.createElement(
-    Svg,
-    props,
-    React.createElement('path', {
-      d: 'M4.807 6h6.395a.28.28 0 0 1 .24.443L8.27 9.9a.34.34 0 0 1-.481 0L4.566 6.443A.27.27 0 0 1 4.806 6z',
-    }),
-  );