@nanoporetech-digital/components-react 8.0.0-alpha.1 → 8.0.0-alpha.11

package/dist/components.d.ts

@@ -24,6 +24,7 @@ export declare const NanoDetails: import('react').ForwardRefExoticComponent<JSX.
 export declare const NanoDialog: import('react').ForwardRefExoticComponent<JSX.NanoDialog & Omit<import('react').HTMLAttributes<HTMLNanoDialogElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoDialogElement>>;
 export declare const NanoDrawer: import('react').ForwardRefExoticComponent<JSX.NanoDrawer & Omit<import('react').HTMLAttributes<HTMLNanoDrawerElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoDrawerElement>>;
 export declare const NanoDropdown: import('react').ForwardRefExoticComponent<JSX.NanoDropdown & Omit<import('react').HTMLAttributes<HTMLNanoDropdownElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoDropdownElement>>;
+export declare const NanoFeatureBox: import('react').ForwardRefExoticComponent<JSX.NanoFeatureBox & Omit<import('react').HTMLAttributes<HTMLNanoFeatureBoxElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoFeatureBoxElement>>;
 export declare const NanoFieldValidator: import('react').ForwardRefExoticComponent<JSX.NanoFieldValidator & Omit<import('react').HTMLAttributes<HTMLNanoFieldValidatorElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoFieldValidatorElement>>;
 export declare const NanoFileUpload: import('react').ForwardRefExoticComponent<JSX.NanoFileUpload & Omit<import('react').HTMLAttributes<HTMLNanoFileUploadElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoFileUploadElement>>;
 export declare const NanoFooter: import('react').ForwardRefExoticComponent<JSX.NanoFooter & Omit<import('react').HTMLAttributes<HTMLNanoFooterElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoFooterElement>>;
@@ -50,7 +51,6 @@ export declare const NanoRange: import('react').ForwardRefExoticComponent<JSX.Na
 export declare const NanoRating: import('react').ForwardRefExoticComponent<JSX.NanoRating & Omit<import('react').HTMLAttributes<HTMLNanoRatingElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoRatingElement>>;
 export declare const NanoResizeObserve: import('react').ForwardRefExoticComponent<JSX.NanoResizeObserve & Omit<import('react').HTMLAttributes<HTMLNanoResizeObserveElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoResizeObserveElement>>;
 export declare const NanoSelect: import('react').ForwardRefExoticComponent<JSX.NanoSelect & Omit<import('react').HTMLAttributes<HTMLNanoSelectElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoSelectElement>>;
-export declare const NanoSkeleton: import('react').ForwardRefExoticComponent<JSX.NanoSkeleton & Omit<import('react').HTMLAttributes<HTMLNanoSkeletonElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoSkeletonElement>>;
 export declare const NanoSlide: import('react').ForwardRefExoticComponent<JSX.NanoSlide & Omit<import('react').HTMLAttributes<HTMLNanoSlideElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoSlideElement>>;
 export declare const NanoSlides: import('react').ForwardRefExoticComponent<JSX.NanoSlides & Omit<import('react').HTMLAttributes<HTMLNanoSlidesElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoSlidesElement>>;
 export declare const NanoSortable: import('react').ForwardRefExoticComponent<JSX.NanoSortable & Omit<import('react').HTMLAttributes<HTMLNanoSortableElement>, "style"> & import('./react-component-lib/interfaces').StyleReactProps & import('react').RefAttributes<HTMLNanoSortableElement>>;

package/dist/index.cjs

@@ -180,6 +180,7 @@ const NanoDetails = /* @__PURE__ */ createReactComponent("nano-details");
 const NanoDialog = /* @__PURE__ */ createReactComponent("nano-dialog");
 const NanoDrawer = /* @__PURE__ */ createReactComponent("nano-drawer");
 const NanoDropdown = /* @__PURE__ */ createReactComponent("nano-dropdown");
+const NanoFeatureBox = /* @__PURE__ */ createReactComponent("nano-feature-box");
 const NanoFieldValidator = /* @__PURE__ */ createReactComponent("nano-field-validator");
 const NanoFileUpload = /* @__PURE__ */ createReactComponent("nano-file-upload");
 const NanoFooter = /* @__PURE__ */ createReactComponent("nano-footer");
@@ -206,7 +207,6 @@ const NanoRange = /* @__PURE__ */ createReactComponent("nano-range");
 const NanoRating = /* @__PURE__ */ createReactComponent("nano-rating");
 const NanoResizeObserve = /* @__PURE__ */ createReactComponent("nano-resize-observe");
 const NanoSelect = /* @__PURE__ */ createReactComponent("nano-select");
-const NanoSkeleton = /* @__PURE__ */ createReactComponent("nano-skeleton");
 const NanoSlide = /* @__PURE__ */ createReactComponent("nano-slide");
 const NanoSlides = /* @__PURE__ */ createReactComponent("nano-slides");
 const NanoSortable = /* @__PURE__ */ createReactComponent("nano-sortable");
@@ -244,6 +244,7 @@ exports.NanoDetails = NanoDetails;
 exports.NanoDialog = NanoDialog;
 exports.NanoDrawer = NanoDrawer;
 exports.NanoDropdown = NanoDropdown;
+exports.NanoFeatureBox = NanoFeatureBox;
 exports.NanoFieldValidator = NanoFieldValidator;
 exports.NanoFileUpload = NanoFileUpload;
 exports.NanoFooter = NanoFooter;
@@ -270,7 +271,6 @@ exports.NanoRange = NanoRange;
 exports.NanoRating = NanoRating;
 exports.NanoResizeObserve = NanoResizeObserve;
 exports.NanoSelect = NanoSelect;
-exports.NanoSkeleton = NanoSkeleton;
 exports.NanoSlide = NanoSlide;
 exports.NanoSlides = NanoSlides;
 exports.NanoSortable = NanoSortable;

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../src/react-component-lib/utils/case.ts","../src/react-component-lib/utils/attachProps.ts","../src/react-component-lib/utils/index.tsx","../src/react-component-lib/createComponent.tsx","../src/components.ts"],"sourcesContent":["export const dashToPascalCase = (str: string) =>\n  str\n    .toLowerCase()\n    .split('-')\n    .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1))\n    .join('');\nexport const camelToDashCase = (str: string) =>\n  str.replace(/([A-Z])/g, (m: string) => `-${m[0].toLowerCase()}`);\n","import { camelToDashCase } from './case';\n\nexport const attachProps = (node: HTMLElement, newProps: any, oldProps: any = {}) => {\n  // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first\n  if (node instanceof Element) {\n    // add any classes in className to the class list\n    const className = getClassName(node.classList, newProps, oldProps);\n    if (className !== '') {\n      node.className = className;\n    }\n\n    Object.keys(newProps).forEach((name) => {\n      if (\n        name === 'children' ||\n        name === 'style' ||\n        name === 'ref' ||\n        name === 'class' ||\n        name === 'className' ||\n        name === 'forwardedRef'\n      ) {\n        return;\n      }\n      if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n        const eventName = name.substring(2);\n        const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);\n\n        if (!isCoveredByReact(eventNameLc)) {\n          syncEvent(node, eventNameLc, newProps[name]);\n        }\n      } else {\n        (node as any)[name] = newProps[name];\n        const propType = typeof newProps[name];\n        if (propType === 'string') {\n          node.setAttribute(camelToDashCase(name), newProps[name]);\n        }\n      }\n    });\n  }\n};\n\nexport const getClassName = (classList: DOMTokenList, newProps: any, oldProps: any) => {\n  const newClassProp: string = newProps.className || newProps.class;\n  const oldClassProp: string = oldProps.className || oldProps.class;\n  // map the classes to Maps for performance\n  const currentClasses = arrayToMap(classList);\n  const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);\n  const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);\n  const finalClassNames: string[] = [];\n  // loop through each of the current classes on the component\n  // to see if it should be a part of the classNames added\n  currentClasses.forEach((currentClass) => {\n    if (incomingPropClasses.has(currentClass)) {\n      // add it as its already included in classnames coming in from newProps\n      finalClassNames.push(currentClass);\n      incomingPropClasses.delete(currentClass);\n    } else if (!oldPropClasses.has(currentClass)) {\n      // add it as it has NOT been removed by user\n      finalClassNames.push(currentClass);\n    }\n  });\n  incomingPropClasses.forEach((s) => finalClassNames.push(s));\n  return finalClassNames.join(' ');\n};\n\n/**\n * Checks if an event is supported in the current execution environment.\n * @license Modernizr 3.0.0pre (Custom Build) | MIT\n */\nexport const isCoveredByReact = (eventNameSuffix: string) => {\n  if (typeof document === 'undefined') {\n    return true;\n  } else {\n    const eventName = 'on' + eventNameSuffix;\n    let isSupported = eventName in document;\n\n    if (!isSupported) {\n      const element = document.createElement('div');\n      element.setAttribute(eventName, 'return;');\n      isSupported = typeof (element as any)[eventName] === 'function';\n    }\n\n    return isSupported;\n  }\n};\n\nexport const syncEvent = (\n  node: Element & { __events?: { [key: string]: ((e: Event) => any) | undefined } },\n  eventName: string,\n  newEventHandler?: (e: Event) => any\n) => {\n  const eventStore = node.__events || (node.__events = {});\n  const oldEventHandler = eventStore[eventName];\n\n  // Remove old listener so they don't double up.\n  if (oldEventHandler) {\n    node.removeEventListener(eventName, oldEventHandler);\n  }\n\n  // Bind new listener.\n  node.addEventListener(\n    eventName,\n    (eventStore[eventName] = function handler(e: Event) {\n      if (newEventHandler) {\n        newEventHandler.call(this, e);\n      }\n    })\n  );\n};\n\nconst arrayToMap = (arr: string[] | DOMTokenList) => {\n  const map = new Map<string, string>();\n  (arr as string[]).forEach((s: string) => map.set(s, s));\n  return map;\n};\n","import React from 'react';\n\nimport type { StyleReactProps } from '../interfaces';\n\nexport type StencilReactExternalProps<PropType, ElementType> = PropType &\n  Omit<React.HTMLAttributes<ElementType>, 'style'> &\n  StyleReactProps;\n\n// This will be replaced with React.ForwardedRef when react-output-target is upgraded to React v17\nexport type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;\n\nexport const setRef = (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => {\n  if (typeof ref === 'function') {\n    ref(value)\n  } else if (ref != null) {\n    // Cast as a MutableRef so we can assign current\n    (ref as React.MutableRefObject<any>).current = value\n  }\n};\n\nexport const mergeRefs = (\n  ...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]\n): React.RefCallback<any> => {\n  return (value: any) => {\n    refs.forEach(ref => {\n      setRef(ref, value)\n    })\n  }\n};\n\nexport const createForwardRef = <PropType, ElementType>(\n  ReactComponent: any,\n  displayName: string,\n) => {\n  const forwardRef = (\n    props: StencilReactExternalProps<PropType, ElementType>,\n    ref: StencilReactForwardedRef<ElementType>,\n  ) => {\n    return <ReactComponent {...props} forwardedRef={ref} />;\n  };\n  forwardRef.displayName = displayName;\n\n  return React.forwardRef(forwardRef);\n};\n\nexport const defineCustomElement = (tagName: string, customElement: any) => {\n  if (\n    customElement !== undefined &&\n    typeof customElements !== 'undefined' &&\n    !customElements.get(tagName)\n  ) {\n    customElements.define(tagName, customElement);\n  }\n}\n\nexport * from './attachProps';\nexport * from './case';\n","import React, { createElement } from 'react';\n\nimport {\n  attachProps,\n  camelToDashCase,\n  createForwardRef,\n  dashToPascalCase,\n  isCoveredByReact,\n  mergeRefs,\n} from './utils';\n\nexport interface HTMLStencilElement extends HTMLElement {\n  componentOnReady(): Promise<this>;\n}\n\ninterface StencilReactInternalProps<ElementType> extends React.HTMLAttributes<ElementType> {\n  forwardedRef: React.RefObject<ElementType>;\n  ref?: React.Ref<any>;\n}\n\nexport const createReactComponent = <\n  PropType,\n  ElementType extends HTMLStencilElement,\n  ContextStateType = {},\n  ExpandedPropsTypes = {}\n>(\n  tagName: string,\n  ReactComponentContext?: React.Context<ContextStateType>,\n  manipulatePropsFunction?: (\n    originalProps: StencilReactInternalProps<ElementType>,\n    propsToPass: any,\n  ) => ExpandedPropsTypes,\n  defineCustomElement?: () => void,\n) => {\n  if (defineCustomElement !== undefined) {\n    defineCustomElement();\n  }\n\n  const displayName = dashToPascalCase(tagName);\n  const ReactComponent = class extends React.Component<StencilReactInternalProps<ElementType>> {\n    componentEl!: ElementType;\n\n    setComponentElRef = (element: ElementType) => {\n      this.componentEl = element;\n    };\n\n    constructor(props: StencilReactInternalProps<ElementType>) {\n      super(props);\n    }\n\n    componentDidMount() {\n      this.componentDidUpdate(this.props);\n    }\n\n    componentDidUpdate(prevProps: StencilReactInternalProps<ElementType>) {\n      attachProps(this.componentEl, this.props, prevProps);\n    }\n\n    render() {\n      const { children, forwardedRef, style, className, ref, ...cProps } = this.props;\n\n      let propsToPass = Object.keys(cProps).reduce((acc: any, name) => {\n        const value = (cProps as any)[name];\n\n        if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n          const eventName = name.substring(2).toLowerCase();\n          if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {\n            acc[name] = value;\n          }\n        } else {\n          // we should only render strings, booleans, and numbers as attrs in html.\n          // objects, functions, arrays etc get synced via properties on mount.\n          const type = typeof value;\n\n          if (type === 'string' || type === 'boolean' || type === 'number') {\n            acc[camelToDashCase(name)] = value;\n          }\n        }\n        return acc;\n      }, {});\n\n      if (manipulatePropsFunction) {\n        propsToPass = manipulatePropsFunction(this.props, propsToPass);\n      }\n\n      const newProps: Omit<StencilReactInternalProps<ElementType>, 'forwardedRef'> = {\n        ...propsToPass,\n        ref: mergeRefs(forwardedRef, this.setComponentElRef),\n        style,\n      };\n\n      /**\n       * We use createElement here instead of\n       * React.createElement to work around a\n       * bug in Vite (https://github.com/vitejs/vite/issues/6104).\n       * React.createElement causes all elements to be rendered\n       * as <tagname> instead of the actual Web Component.\n       */\n      return createElement(tagName, newProps, children);\n    }\n\n    static get displayName() {\n      return displayName;\n    }\n  };\n\n  // If context was passed to createReactComponent then conditionally add it to the Component Class\n  if (ReactComponentContext) {\n    ReactComponent.contextType = ReactComponentContext;\n  }\n\n  return createForwardRef<PropType, ElementType>(ReactComponent, displayName);\n};\n","/* eslint-disable */\n/* tslint:disable */\n/* auto-generated react proxies */\nimport { createReactComponent } from './react-component-lib';\n\nimport type { JSX } from '@nanoporetech-digital/components';\n\n\n\nexport const NanoAccordion = /*@__PURE__*/createReactComponent<JSX.NanoAccordion, HTMLNanoAccordionElement>('nano-accordion');\nexport const NanoAlert = /*@__PURE__*/createReactComponent<JSX.NanoAlert, HTMLNanoAlertElement>('nano-alert');\nexport const NanoAlgolia = /*@__PURE__*/createReactComponent<JSX.NanoAlgolia, HTMLNanoAlgoliaElement>('nano-algolia');\nexport const NanoAlgoliaFilter = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaFilter, HTMLNanoAlgoliaFilterElement>('nano-algolia-filter');\nexport const NanoAlgoliaPagination = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaPagination, HTMLNanoAlgoliaPaginationElement>('nano-algolia-pagination');\nexport const NanoAlgoliaResults = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaResults, HTMLNanoAlgoliaResultsElement>('nano-algolia-results');\nexport const NanoAnimation = /*@__PURE__*/createReactComponent<JSX.NanoAnimation, HTMLNanoAnimationElement>('nano-animation');\nexport const NanoAvatar = /*@__PURE__*/createReactComponent<JSX.NanoAvatar, HTMLNanoAvatarElement>('nano-avatar');\nexport const NanoBadge = /*@__PURE__*/createReactComponent<JSX.NanoBadge, HTMLNanoBadgeElement>('nano-badge');\nexport const NanoBreadcrumb = /*@__PURE__*/createReactComponent<JSX.NanoBreadcrumb, HTMLNanoBreadcrumbElement>('nano-breadcrumb');\nexport const NanoCard = /*@__PURE__*/createReactComponent<JSX.NanoCard, HTMLNanoCardElement>('nano-card');\nexport const NanoCardCarousel = /*@__PURE__*/createReactComponent<JSX.NanoCardCarousel, HTMLNanoCardCarouselElement>('nano-card-carousel');\nexport const NanoCheckbox = /*@__PURE__*/createReactComponent<JSX.NanoCheckbox, HTMLNanoCheckboxElement>('nano-checkbox');\nexport const NanoCheckboxGroup = /*@__PURE__*/createReactComponent<JSX.NanoCheckboxGroup, HTMLNanoCheckboxGroupElement>('nano-checkbox-group');\nexport const NanoCollapsibleComparison = /*@__PURE__*/createReactComponent<JSX.NanoCollapsibleComparison, HTMLNanoCollapsibleComparisonElement>('nano-collapsible-comparison');\nexport const NanoContentLinks = /*@__PURE__*/createReactComponent<JSX.NanoContentLinks, HTMLNanoContentLinksElement>('nano-content-links');\nexport const NanoCta = /*@__PURE__*/createReactComponent<JSX.NanoCta, HTMLNanoCtaElement>('nano-cta');\nexport const NanoDataTable = /*@__PURE__*/createReactComponent<JSX.NanoDataTable, HTMLNanoDataTableElement>('nano-data-table');\nexport const NanoDatalist = /*@__PURE__*/createReactComponent<JSX.NanoDatalist, HTMLNanoDatalistElement>('nano-datalist');\nexport const NanoDateInput = /*@__PURE__*/createReactComponent<JSX.NanoDateInput, HTMLNanoDateInputElement>('nano-date-input');\nexport const NanoDatePicker = /*@__PURE__*/createReactComponent<JSX.NanoDatePicker, HTMLNanoDatePickerElement>('nano-date-picker');\nexport const NanoDetails = /*@__PURE__*/createReactComponent<JSX.NanoDetails, HTMLNanoDetailsElement>('nano-details');\nexport const NanoDialog = /*@__PURE__*/createReactComponent<JSX.NanoDialog, HTMLNanoDialogElement>('nano-dialog');\nexport const NanoDrawer = /*@__PURE__*/createReactComponent<JSX.NanoDrawer, HTMLNanoDrawerElement>('nano-drawer');\nexport const NanoDropdown = /*@__PURE__*/createReactComponent<JSX.NanoDropdown, HTMLNanoDropdownElement>('nano-dropdown');\nexport const NanoFieldValidator = /*@__PURE__*/createReactComponent<JSX.NanoFieldValidator, HTMLNanoFieldValidatorElement>('nano-field-validator');\nexport const NanoFileUpload = /*@__PURE__*/createReactComponent<JSX.NanoFileUpload, HTMLNanoFileUploadElement>('nano-file-upload');\nexport const NanoFooter = /*@__PURE__*/createReactComponent<JSX.NanoFooter, HTMLNanoFooterElement>('nano-footer');\nexport const NanoGlobalNav = /*@__PURE__*/createReactComponent<JSX.NanoGlobalNav, HTMLNanoGlobalNavElement>('nano-global-nav');\nexport const NanoGlobalSearchResults = /*@__PURE__*/createReactComponent<JSX.NanoGlobalSearchResults, HTMLNanoGlobalSearchResultsElement>('nano-global-search-results');\nexport const NanoGrid = /*@__PURE__*/createReactComponent<JSX.NanoGrid, HTMLNanoGridElement>('nano-grid');\nexport const NanoGridItem = /*@__PURE__*/createReactComponent<JSX.NanoGridItem, HTMLNanoGridItemElement>('nano-grid-item');\nexport const NanoHero = /*@__PURE__*/createReactComponent<JSX.NanoHero, HTMLNanoHeroElement>('nano-hero');\nexport const NanoIcon = /*@__PURE__*/createReactComponent<JSX.NanoIcon, HTMLNanoIconElement>('nano-icon');\nexport const NanoIconButton = /*@__PURE__*/createReactComponent<JSX.NanoIconButton, HTMLNanoIconButtonElement>('nano-icon-button');\nexport const NanoIconItem = /*@__PURE__*/createReactComponent<JSX.NanoIconItem, HTMLNanoIconItemElement>('nano-icon-item');\nexport const NanoImg = /*@__PURE__*/createReactComponent<JSX.NanoImg, HTMLNanoImgElement>('nano-img');\nexport const NanoInPageNav = /*@__PURE__*/createReactComponent<JSX.NanoInPageNav, HTMLNanoInPageNavElement>('nano-in-page-nav');\nexport const NanoInput = /*@__PURE__*/createReactComponent<JSX.NanoInput, HTMLNanoInputElement>('nano-input');\nexport const NanoIntersectionObserve = /*@__PURE__*/createReactComponent<JSX.NanoIntersectionObserve, HTMLNanoIntersectionObserveElement>('nano-intersection-observe');\nexport const NanoMaskedOverflow = /*@__PURE__*/createReactComponent<JSX.NanoMaskedOverflow, HTMLNanoMaskedOverflowElement>('nano-masked-overflow');\nexport const NanoMenu = /*@__PURE__*/createReactComponent<JSX.NanoMenu, HTMLNanoMenuElement>('nano-menu');\nexport const NanoMenuDrawer = /*@__PURE__*/createReactComponent<JSX.NanoMenuDrawer, HTMLNanoMenuDrawerElement>('nano-menu-drawer');\nexport const NanoMoreLess = /*@__PURE__*/createReactComponent<JSX.NanoMoreLess, HTMLNanoMoreLessElement>('nano-more-less');\nexport const NanoNavItem = /*@__PURE__*/createReactComponent<JSX.NanoNavItem, HTMLNanoNavItemElement>('nano-nav-item');\nexport const NanoOption = /*@__PURE__*/createReactComponent<JSX.NanoOption, HTMLNanoOptionElement>('nano-option');\nexport const NanoProgressBar = /*@__PURE__*/createReactComponent<JSX.NanoProgressBar, HTMLNanoProgressBarElement>('nano-progress-bar');\nexport const NanoRange = /*@__PURE__*/createReactComponent<JSX.NanoRange, HTMLNanoRangeElement>('nano-range');\nexport const NanoRating = /*@__PURE__*/createReactComponent<JSX.NanoRating, HTMLNanoRatingElement>('nano-rating');\nexport const NanoResizeObserve = /*@__PURE__*/createReactComponent<JSX.NanoResizeObserve, HTMLNanoResizeObserveElement>('nano-resize-observe');\nexport const NanoSelect = /*@__PURE__*/createReactComponent<JSX.NanoSelect, HTMLNanoSelectElement>('nano-select');\nexport const NanoSkeleton = /*@__PURE__*/createReactComponent<JSX.NanoSkeleton, HTMLNanoSkeletonElement>('nano-skeleton');\nexport const NanoSlide = /*@__PURE__*/createReactComponent<JSX.NanoSlide, HTMLNanoSlideElement>('nano-slide');\nexport const NanoSlides = /*@__PURE__*/createReactComponent<JSX.NanoSlides, HTMLNanoSlidesElement>('nano-slides');\nexport const NanoSortable = /*@__PURE__*/createReactComponent<JSX.NanoSortable, HTMLNanoSortableElement>('nano-sortable');\nexport const NanoSpinner = /*@__PURE__*/createReactComponent<JSX.NanoSpinner, HTMLNanoSpinnerElement>('nano-spinner');\nexport const NanoSplitPane = /*@__PURE__*/createReactComponent<JSX.NanoSplitPane, HTMLNanoSplitPaneElement>('nano-split-pane');\nexport const NanoSticker = /*@__PURE__*/createReactComponent<JSX.NanoSticker, HTMLNanoStickerElement>('nano-sticker');\nexport const NanoTab = /*@__PURE__*/createReactComponent<JSX.NanoTab, HTMLNanoTabElement>('nano-tab');\nexport const NanoTabContent = /*@__PURE__*/createReactComponent<JSX.NanoTabContent, HTMLNanoTabContentElement>('nano-tab-content');\nexport const NanoTabGroup = /*@__PURE__*/createReactComponent<JSX.NanoTabGroup, HTMLNanoTabGroupElement>('nano-tab-group');\nexport const NanoTable = /*@__PURE__*/createReactComponent<JSX.NanoTable, HTMLNanoTableElement>('nano-table');\nexport const NanoTag = /*@__PURE__*/createReactComponent<JSX.NanoTag, HTMLNanoTagElement>('nano-tag');\nexport const NanoTooltip = /*@__PURE__*/createReactComponent<JSX.NanoTooltip, HTMLNanoTooltipElement>('nano-tooltip');\n"],"names":["createElement"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../src/react-component-lib/utils/case.ts","../src/react-component-lib/utils/attachProps.ts","../src/react-component-lib/utils/index.tsx","../src/react-component-lib/createComponent.tsx","../src/components.ts"],"sourcesContent":["export const dashToPascalCase = (str: string) =>\n  str\n    .toLowerCase()\n    .split('-')\n    .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1))\n    .join('');\nexport const camelToDashCase = (str: string) =>\n  str.replace(/([A-Z])/g, (m: string) => `-${m[0].toLowerCase()}`);\n","import { camelToDashCase } from './case';\n\nexport const attachProps = (node: HTMLElement, newProps: any, oldProps: any = {}) => {\n  // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first\n  if (node instanceof Element) {\n    // add any classes in className to the class list\n    const className = getClassName(node.classList, newProps, oldProps);\n    if (className !== '') {\n      node.className = className;\n    }\n\n    Object.keys(newProps).forEach((name) => {\n      if (\n        name === 'children' ||\n        name === 'style' ||\n        name === 'ref' ||\n        name === 'class' ||\n        name === 'className' ||\n        name === 'forwardedRef'\n      ) {\n        return;\n      }\n      if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n        const eventName = name.substring(2);\n        const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);\n\n        if (!isCoveredByReact(eventNameLc)) {\n          syncEvent(node, eventNameLc, newProps[name]);\n        }\n      } else {\n        (node as any)[name] = newProps[name];\n        const propType = typeof newProps[name];\n        if (propType === 'string') {\n          node.setAttribute(camelToDashCase(name), newProps[name]);\n        }\n      }\n    });\n  }\n};\n\nexport const getClassName = (classList: DOMTokenList, newProps: any, oldProps: any) => {\n  const newClassProp: string = newProps.className || newProps.class;\n  const oldClassProp: string = oldProps.className || oldProps.class;\n  // map the classes to Maps for performance\n  const currentClasses = arrayToMap(classList);\n  const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);\n  const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);\n  const finalClassNames: string[] = [];\n  // loop through each of the current classes on the component\n  // to see if it should be a part of the classNames added\n  currentClasses.forEach((currentClass) => {\n    if (incomingPropClasses.has(currentClass)) {\n      // add it as its already included in classnames coming in from newProps\n      finalClassNames.push(currentClass);\n      incomingPropClasses.delete(currentClass);\n    } else if (!oldPropClasses.has(currentClass)) {\n      // add it as it has NOT been removed by user\n      finalClassNames.push(currentClass);\n    }\n  });\n  incomingPropClasses.forEach((s) => finalClassNames.push(s));\n  return finalClassNames.join(' ');\n};\n\n/**\n * Checks if an event is supported in the current execution environment.\n * @license Modernizr 3.0.0pre (Custom Build) | MIT\n */\nexport const isCoveredByReact = (eventNameSuffix: string) => {\n  if (typeof document === 'undefined') {\n    return true;\n  } else {\n    const eventName = 'on' + eventNameSuffix;\n    let isSupported = eventName in document;\n\n    if (!isSupported) {\n      const element = document.createElement('div');\n      element.setAttribute(eventName, 'return;');\n      isSupported = typeof (element as any)[eventName] === 'function';\n    }\n\n    return isSupported;\n  }\n};\n\nexport const syncEvent = (\n  node: Element & { __events?: { [key: string]: ((e: Event) => any) | undefined } },\n  eventName: string,\n  newEventHandler?: (e: Event) => any\n) => {\n  const eventStore = node.__events || (node.__events = {});\n  const oldEventHandler = eventStore[eventName];\n\n  // Remove old listener so they don't double up.\n  if (oldEventHandler) {\n    node.removeEventListener(eventName, oldEventHandler);\n  }\n\n  // Bind new listener.\n  node.addEventListener(\n    eventName,\n    (eventStore[eventName] = function handler(e: Event) {\n      if (newEventHandler) {\n        newEventHandler.call(this, e);\n      }\n    })\n  );\n};\n\nconst arrayToMap = (arr: string[] | DOMTokenList) => {\n  const map = new Map<string, string>();\n  (arr as string[]).forEach((s: string) => map.set(s, s));\n  return map;\n};\n","import React from 'react';\n\nimport type { StyleReactProps } from '../interfaces';\n\nexport type StencilReactExternalProps<PropType, ElementType> = PropType &\n  Omit<React.HTMLAttributes<ElementType>, 'style'> &\n  StyleReactProps;\n\n// This will be replaced with React.ForwardedRef when react-output-target is upgraded to React v17\nexport type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;\n\nexport const setRef = (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => {\n  if (typeof ref === 'function') {\n    ref(value)\n  } else if (ref != null) {\n    // Cast as a MutableRef so we can assign current\n    (ref as React.MutableRefObject<any>).current = value\n  }\n};\n\nexport const mergeRefs = (\n  ...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]\n): React.RefCallback<any> => {\n  return (value: any) => {\n    refs.forEach(ref => {\n      setRef(ref, value)\n    })\n  }\n};\n\nexport const createForwardRef = <PropType, ElementType>(\n  ReactComponent: any,\n  displayName: string,\n) => {\n  const forwardRef = (\n    props: StencilReactExternalProps<PropType, ElementType>,\n    ref: StencilReactForwardedRef<ElementType>,\n  ) => {\n    return <ReactComponent {...props} forwardedRef={ref} />;\n  };\n  forwardRef.displayName = displayName;\n\n  return React.forwardRef(forwardRef);\n};\n\nexport const defineCustomElement = (tagName: string, customElement: any) => {\n  if (\n    customElement !== undefined &&\n    typeof customElements !== 'undefined' &&\n    !customElements.get(tagName)\n  ) {\n    customElements.define(tagName, customElement);\n  }\n}\n\nexport * from './attachProps';\nexport * from './case';\n","import React, { createElement } from 'react';\n\nimport {\n  attachProps,\n  camelToDashCase,\n  createForwardRef,\n  dashToPascalCase,\n  isCoveredByReact,\n  mergeRefs,\n} from './utils';\n\nexport interface HTMLStencilElement extends HTMLElement {\n  componentOnReady(): Promise<this>;\n}\n\ninterface StencilReactInternalProps<ElementType> extends React.HTMLAttributes<ElementType> {\n  forwardedRef: React.RefObject<ElementType>;\n  ref?: React.Ref<any>;\n}\n\nexport const createReactComponent = <\n  PropType,\n  ElementType extends HTMLStencilElement,\n  ContextStateType = {},\n  ExpandedPropsTypes = {}\n>(\n  tagName: string,\n  ReactComponentContext?: React.Context<ContextStateType>,\n  manipulatePropsFunction?: (\n    originalProps: StencilReactInternalProps<ElementType>,\n    propsToPass: any,\n  ) => ExpandedPropsTypes,\n  defineCustomElement?: () => void,\n) => {\n  if (defineCustomElement !== undefined) {\n    defineCustomElement();\n  }\n\n  const displayName = dashToPascalCase(tagName);\n  const ReactComponent = class extends React.Component<StencilReactInternalProps<ElementType>> {\n    componentEl!: ElementType;\n\n    setComponentElRef = (element: ElementType) => {\n      this.componentEl = element;\n    };\n\n    constructor(props: StencilReactInternalProps<ElementType>) {\n      super(props);\n    }\n\n    componentDidMount() {\n      this.componentDidUpdate(this.props);\n    }\n\n    componentDidUpdate(prevProps: StencilReactInternalProps<ElementType>) {\n      attachProps(this.componentEl, this.props, prevProps);\n    }\n\n    render() {\n      const { children, forwardedRef, style, className, ref, ...cProps } = this.props;\n\n      let propsToPass = Object.keys(cProps).reduce((acc: any, name) => {\n        const value = (cProps as any)[name];\n\n        if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n          const eventName = name.substring(2).toLowerCase();\n          if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {\n            acc[name] = value;\n          }\n        } else {\n          // we should only render strings, booleans, and numbers as attrs in html.\n          // objects, functions, arrays etc get synced via properties on mount.\n          const type = typeof value;\n\n          if (type === 'string' || type === 'boolean' || type === 'number') {\n            acc[camelToDashCase(name)] = value;\n          }\n        }\n        return acc;\n      }, {});\n\n      if (manipulatePropsFunction) {\n        propsToPass = manipulatePropsFunction(this.props, propsToPass);\n      }\n\n      const newProps: Omit<StencilReactInternalProps<ElementType>, 'forwardedRef'> = {\n        ...propsToPass,\n        ref: mergeRefs(forwardedRef, this.setComponentElRef),\n        style,\n      };\n\n      /**\n       * We use createElement here instead of\n       * React.createElement to work around a\n       * bug in Vite (https://github.com/vitejs/vite/issues/6104).\n       * React.createElement causes all elements to be rendered\n       * as <tagname> instead of the actual Web Component.\n       */\n      return createElement(tagName, newProps, children);\n    }\n\n    static get displayName() {\n      return displayName;\n    }\n  };\n\n  // If context was passed to createReactComponent then conditionally add it to the Component Class\n  if (ReactComponentContext) {\n    ReactComponent.contextType = ReactComponentContext;\n  }\n\n  return createForwardRef<PropType, ElementType>(ReactComponent, displayName);\n};\n","/* eslint-disable */\n/* tslint:disable */\n/* auto-generated react proxies */\nimport { createReactComponent } from './react-component-lib';\n\nimport type { JSX } from '@nanoporetech-digital/components';\n\n\n\nexport const NanoAccordion = /*@__PURE__*/createReactComponent<JSX.NanoAccordion, HTMLNanoAccordionElement>('nano-accordion');\nexport const NanoAlert = /*@__PURE__*/createReactComponent<JSX.NanoAlert, HTMLNanoAlertElement>('nano-alert');\nexport const NanoAlgolia = /*@__PURE__*/createReactComponent<JSX.NanoAlgolia, HTMLNanoAlgoliaElement>('nano-algolia');\nexport const NanoAlgoliaFilter = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaFilter, HTMLNanoAlgoliaFilterElement>('nano-algolia-filter');\nexport const NanoAlgoliaPagination = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaPagination, HTMLNanoAlgoliaPaginationElement>('nano-algolia-pagination');\nexport const NanoAlgoliaResults = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaResults, HTMLNanoAlgoliaResultsElement>('nano-algolia-results');\nexport const NanoAnimation = /*@__PURE__*/createReactComponent<JSX.NanoAnimation, HTMLNanoAnimationElement>('nano-animation');\nexport const NanoAvatar = /*@__PURE__*/createReactComponent<JSX.NanoAvatar, HTMLNanoAvatarElement>('nano-avatar');\nexport const NanoBadge = /*@__PURE__*/createReactComponent<JSX.NanoBadge, HTMLNanoBadgeElement>('nano-badge');\nexport const NanoBreadcrumb = /*@__PURE__*/createReactComponent<JSX.NanoBreadcrumb, HTMLNanoBreadcrumbElement>('nano-breadcrumb');\nexport const NanoCard = /*@__PURE__*/createReactComponent<JSX.NanoCard, HTMLNanoCardElement>('nano-card');\nexport const NanoCardCarousel = /*@__PURE__*/createReactComponent<JSX.NanoCardCarousel, HTMLNanoCardCarouselElement>('nano-card-carousel');\nexport const NanoCheckbox = /*@__PURE__*/createReactComponent<JSX.NanoCheckbox, HTMLNanoCheckboxElement>('nano-checkbox');\nexport const NanoCheckboxGroup = /*@__PURE__*/createReactComponent<JSX.NanoCheckboxGroup, HTMLNanoCheckboxGroupElement>('nano-checkbox-group');\nexport const NanoCollapsibleComparison = /*@__PURE__*/createReactComponent<JSX.NanoCollapsibleComparison, HTMLNanoCollapsibleComparisonElement>('nano-collapsible-comparison');\nexport const NanoContentLinks = /*@__PURE__*/createReactComponent<JSX.NanoContentLinks, HTMLNanoContentLinksElement>('nano-content-links');\nexport const NanoCta = /*@__PURE__*/createReactComponent<JSX.NanoCta, HTMLNanoCtaElement>('nano-cta');\nexport const NanoDataTable = /*@__PURE__*/createReactComponent<JSX.NanoDataTable, HTMLNanoDataTableElement>('nano-data-table');\nexport const NanoDatalist = /*@__PURE__*/createReactComponent<JSX.NanoDatalist, HTMLNanoDatalistElement>('nano-datalist');\nexport const NanoDateInput = /*@__PURE__*/createReactComponent<JSX.NanoDateInput, HTMLNanoDateInputElement>('nano-date-input');\nexport const NanoDatePicker = /*@__PURE__*/createReactComponent<JSX.NanoDatePicker, HTMLNanoDatePickerElement>('nano-date-picker');\nexport const NanoDetails = /*@__PURE__*/createReactComponent<JSX.NanoDetails, HTMLNanoDetailsElement>('nano-details');\nexport const NanoDialog = /*@__PURE__*/createReactComponent<JSX.NanoDialog, HTMLNanoDialogElement>('nano-dialog');\nexport const NanoDrawer = /*@__PURE__*/createReactComponent<JSX.NanoDrawer, HTMLNanoDrawerElement>('nano-drawer');\nexport const NanoDropdown = /*@__PURE__*/createReactComponent<JSX.NanoDropdown, HTMLNanoDropdownElement>('nano-dropdown');\nexport const NanoFeatureBox = /*@__PURE__*/createReactComponent<JSX.NanoFeatureBox, HTMLNanoFeatureBoxElement>('nano-feature-box');\nexport const NanoFieldValidator = /*@__PURE__*/createReactComponent<JSX.NanoFieldValidator, HTMLNanoFieldValidatorElement>('nano-field-validator');\nexport const NanoFileUpload = /*@__PURE__*/createReactComponent<JSX.NanoFileUpload, HTMLNanoFileUploadElement>('nano-file-upload');\nexport const NanoFooter = /*@__PURE__*/createReactComponent<JSX.NanoFooter, HTMLNanoFooterElement>('nano-footer');\nexport const NanoGlobalNav = /*@__PURE__*/createReactComponent<JSX.NanoGlobalNav, HTMLNanoGlobalNavElement>('nano-global-nav');\nexport const NanoGlobalSearchResults = /*@__PURE__*/createReactComponent<JSX.NanoGlobalSearchResults, HTMLNanoGlobalSearchResultsElement>('nano-global-search-results');\nexport const NanoGrid = /*@__PURE__*/createReactComponent<JSX.NanoGrid, HTMLNanoGridElement>('nano-grid');\nexport const NanoGridItem = /*@__PURE__*/createReactComponent<JSX.NanoGridItem, HTMLNanoGridItemElement>('nano-grid-item');\nexport const NanoHero = /*@__PURE__*/createReactComponent<JSX.NanoHero, HTMLNanoHeroElement>('nano-hero');\nexport const NanoIcon = /*@__PURE__*/createReactComponent<JSX.NanoIcon, HTMLNanoIconElement>('nano-icon');\nexport const NanoIconButton = /*@__PURE__*/createReactComponent<JSX.NanoIconButton, HTMLNanoIconButtonElement>('nano-icon-button');\nexport const NanoIconItem = /*@__PURE__*/createReactComponent<JSX.NanoIconItem, HTMLNanoIconItemElement>('nano-icon-item');\nexport const NanoImg = /*@__PURE__*/createReactComponent<JSX.NanoImg, HTMLNanoImgElement>('nano-img');\nexport const NanoInPageNav = /*@__PURE__*/createReactComponent<JSX.NanoInPageNav, HTMLNanoInPageNavElement>('nano-in-page-nav');\nexport const NanoInput = /*@__PURE__*/createReactComponent<JSX.NanoInput, HTMLNanoInputElement>('nano-input');\nexport const NanoIntersectionObserve = /*@__PURE__*/createReactComponent<JSX.NanoIntersectionObserve, HTMLNanoIntersectionObserveElement>('nano-intersection-observe');\nexport const NanoMaskedOverflow = /*@__PURE__*/createReactComponent<JSX.NanoMaskedOverflow, HTMLNanoMaskedOverflowElement>('nano-masked-overflow');\nexport const NanoMenu = /*@__PURE__*/createReactComponent<JSX.NanoMenu, HTMLNanoMenuElement>('nano-menu');\nexport const NanoMenuDrawer = /*@__PURE__*/createReactComponent<JSX.NanoMenuDrawer, HTMLNanoMenuDrawerElement>('nano-menu-drawer');\nexport const NanoMoreLess = /*@__PURE__*/createReactComponent<JSX.NanoMoreLess, HTMLNanoMoreLessElement>('nano-more-less');\nexport const NanoNavItem = /*@__PURE__*/createReactComponent<JSX.NanoNavItem, HTMLNanoNavItemElement>('nano-nav-item');\nexport const NanoOption = /*@__PURE__*/createReactComponent<JSX.NanoOption, HTMLNanoOptionElement>('nano-option');\nexport const NanoProgressBar = /*@__PURE__*/createReactComponent<JSX.NanoProgressBar, HTMLNanoProgressBarElement>('nano-progress-bar');\nexport const NanoRange = /*@__PURE__*/createReactComponent<JSX.NanoRange, HTMLNanoRangeElement>('nano-range');\nexport const NanoRating = /*@__PURE__*/createReactComponent<JSX.NanoRating, HTMLNanoRatingElement>('nano-rating');\nexport const NanoResizeObserve = /*@__PURE__*/createReactComponent<JSX.NanoResizeObserve, HTMLNanoResizeObserveElement>('nano-resize-observe');\nexport const NanoSelect = /*@__PURE__*/createReactComponent<JSX.NanoSelect, HTMLNanoSelectElement>('nano-select');\nexport const NanoSlide = /*@__PURE__*/createReactComponent<JSX.NanoSlide, HTMLNanoSlideElement>('nano-slide');\nexport const NanoSlides = /*@__PURE__*/createReactComponent<JSX.NanoSlides, HTMLNanoSlidesElement>('nano-slides');\nexport const NanoSortable = /*@__PURE__*/createReactComponent<JSX.NanoSortable, HTMLNanoSortableElement>('nano-sortable');\nexport const NanoSpinner = /*@__PURE__*/createReactComponent<JSX.NanoSpinner, HTMLNanoSpinnerElement>('nano-spinner');\nexport const NanoSplitPane = /*@__PURE__*/createReactComponent<JSX.NanoSplitPane, HTMLNanoSplitPaneElement>('nano-split-pane');\nexport const NanoSticker = /*@__PURE__*/createReactComponent<JSX.NanoSticker, HTMLNanoStickerElement>('nano-sticker');\nexport const NanoTab = /*@__PURE__*/createReactComponent<JSX.NanoTab, HTMLNanoTabElement>('nano-tab');\nexport const NanoTabContent = /*@__PURE__*/createReactComponent<JSX.NanoTabContent, HTMLNanoTabContentElement>('nano-tab-content');\nexport const NanoTabGroup = /*@__PURE__*/createReactComponent<JSX.NanoTabGroup, HTMLNanoTabGroupElement>('nano-tab-group');\nexport const NanoTable = /*@__PURE__*/createReactComponent<JSX.NanoTable, HTMLNanoTableElement>('nano-table');\nexport const NanoTag = /*@__PURE__*/createReactComponent<JSX.NanoTag, HTMLNanoTagElement>('nano-tag');\nexport const NanoTooltip = /*@__PURE__*/createReactComponent<JSX.NanoTooltip, HTMLNanoTooltipElement>('nano-tooltip');\n"],"names":["createElement"],"mappings":"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"}

package/dist/index.js

@@ -178,6 +178,7 @@ const NanoDetails = /* @__PURE__ */ createReactComponent("nano-details");
 const NanoDialog = /* @__PURE__ */ createReactComponent("nano-dialog");
 const NanoDrawer = /* @__PURE__ */ createReactComponent("nano-drawer");
 const NanoDropdown = /* @__PURE__ */ createReactComponent("nano-dropdown");
+const NanoFeatureBox = /* @__PURE__ */ createReactComponent("nano-feature-box");
 const NanoFieldValidator = /* @__PURE__ */ createReactComponent("nano-field-validator");
 const NanoFileUpload = /* @__PURE__ */ createReactComponent("nano-file-upload");
 const NanoFooter = /* @__PURE__ */ createReactComponent("nano-footer");
@@ -204,7 +205,6 @@ const NanoRange = /* @__PURE__ */ createReactComponent("nano-range");
 const NanoRating = /* @__PURE__ */ createReactComponent("nano-rating");
 const NanoResizeObserve = /* @__PURE__ */ createReactComponent("nano-resize-observe");
 const NanoSelect = /* @__PURE__ */ createReactComponent("nano-select");
-const NanoSkeleton = /* @__PURE__ */ createReactComponent("nano-skeleton");
 const NanoSlide = /* @__PURE__ */ createReactComponent("nano-slide");
 const NanoSlides = /* @__PURE__ */ createReactComponent("nano-slides");
 const NanoSortable = /* @__PURE__ */ createReactComponent("nano-sortable");
@@ -243,6 +243,7 @@ export {
   NanoDialog,
   NanoDrawer,
   NanoDropdown,
+  NanoFeatureBox,
   NanoFieldValidator,
   NanoFileUpload,
   NanoFooter,
@@ -269,7 +270,6 @@ export {
   NanoRating,
   NanoResizeObserve,
   NanoSelect,
-  NanoSkeleton,
   NanoSlide,
   NanoSlides,
   NanoSortable,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/react-component-lib/utils/case.ts","../src/react-component-lib/utils/attachProps.ts","../src/react-component-lib/utils/index.tsx","../src/react-component-lib/createComponent.tsx","../src/components.ts"],"sourcesContent":["export const dashToPascalCase = (str: string) =>\n  str\n    .toLowerCase()\n    .split('-')\n    .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1))\n    .join('');\nexport const camelToDashCase = (str: string) =>\n  str.replace(/([A-Z])/g, (m: string) => `-${m[0].toLowerCase()}`);\n","import { camelToDashCase } from './case';\n\nexport const attachProps = (node: HTMLElement, newProps: any, oldProps: any = {}) => {\n  // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first\n  if (node instanceof Element) {\n    // add any classes in className to the class list\n    const className = getClassName(node.classList, newProps, oldProps);\n    if (className !== '') {\n      node.className = className;\n    }\n\n    Object.keys(newProps).forEach((name) => {\n      if (\n        name === 'children' ||\n        name === 'style' ||\n        name === 'ref' ||\n        name === 'class' ||\n        name === 'className' ||\n        name === 'forwardedRef'\n      ) {\n        return;\n      }\n      if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n        const eventName = name.substring(2);\n        const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);\n\n        if (!isCoveredByReact(eventNameLc)) {\n          syncEvent(node, eventNameLc, newProps[name]);\n        }\n      } else {\n        (node as any)[name] = newProps[name];\n        const propType = typeof newProps[name];\n        if (propType === 'string') {\n          node.setAttribute(camelToDashCase(name), newProps[name]);\n        }\n      }\n    });\n  }\n};\n\nexport const getClassName = (classList: DOMTokenList, newProps: any, oldProps: any) => {\n  const newClassProp: string = newProps.className || newProps.class;\n  const oldClassProp: string = oldProps.className || oldProps.class;\n  // map the classes to Maps for performance\n  const currentClasses = arrayToMap(classList);\n  const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);\n  const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);\n  const finalClassNames: string[] = [];\n  // loop through each of the current classes on the component\n  // to see if it should be a part of the classNames added\n  currentClasses.forEach((currentClass) => {\n    if (incomingPropClasses.has(currentClass)) {\n      // add it as its already included in classnames coming in from newProps\n      finalClassNames.push(currentClass);\n      incomingPropClasses.delete(currentClass);\n    } else if (!oldPropClasses.has(currentClass)) {\n      // add it as it has NOT been removed by user\n      finalClassNames.push(currentClass);\n    }\n  });\n  incomingPropClasses.forEach((s) => finalClassNames.push(s));\n  return finalClassNames.join(' ');\n};\n\n/**\n * Checks if an event is supported in the current execution environment.\n * @license Modernizr 3.0.0pre (Custom Build) | MIT\n */\nexport const isCoveredByReact = (eventNameSuffix: string) => {\n  if (typeof document === 'undefined') {\n    return true;\n  } else {\n    const eventName = 'on' + eventNameSuffix;\n    let isSupported = eventName in document;\n\n    if (!isSupported) {\n      const element = document.createElement('div');\n      element.setAttribute(eventName, 'return;');\n      isSupported = typeof (element as any)[eventName] === 'function';\n    }\n\n    return isSupported;\n  }\n};\n\nexport const syncEvent = (\n  node: Element & { __events?: { [key: string]: ((e: Event) => any) | undefined } },\n  eventName: string,\n  newEventHandler?: (e: Event) => any\n) => {\n  const eventStore = node.__events || (node.__events = {});\n  const oldEventHandler = eventStore[eventName];\n\n  // Remove old listener so they don't double up.\n  if (oldEventHandler) {\n    node.removeEventListener(eventName, oldEventHandler);\n  }\n\n  // Bind new listener.\n  node.addEventListener(\n    eventName,\n    (eventStore[eventName] = function handler(e: Event) {\n      if (newEventHandler) {\n        newEventHandler.call(this, e);\n      }\n    })\n  );\n};\n\nconst arrayToMap = (arr: string[] | DOMTokenList) => {\n  const map = new Map<string, string>();\n  (arr as string[]).forEach((s: string) => map.set(s, s));\n  return map;\n};\n","import React from 'react';\n\nimport type { StyleReactProps } from '../interfaces';\n\nexport type StencilReactExternalProps<PropType, ElementType> = PropType &\n  Omit<React.HTMLAttributes<ElementType>, 'style'> &\n  StyleReactProps;\n\n// This will be replaced with React.ForwardedRef when react-output-target is upgraded to React v17\nexport type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;\n\nexport const setRef = (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => {\n  if (typeof ref === 'function') {\n    ref(value)\n  } else if (ref != null) {\n    // Cast as a MutableRef so we can assign current\n    (ref as React.MutableRefObject<any>).current = value\n  }\n};\n\nexport const mergeRefs = (\n  ...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]\n): React.RefCallback<any> => {\n  return (value: any) => {\n    refs.forEach(ref => {\n      setRef(ref, value)\n    })\n  }\n};\n\nexport const createForwardRef = <PropType, ElementType>(\n  ReactComponent: any,\n  displayName: string,\n) => {\n  const forwardRef = (\n    props: StencilReactExternalProps<PropType, ElementType>,\n    ref: StencilReactForwardedRef<ElementType>,\n  ) => {\n    return <ReactComponent {...props} forwardedRef={ref} />;\n  };\n  forwardRef.displayName = displayName;\n\n  return React.forwardRef(forwardRef);\n};\n\nexport const defineCustomElement = (tagName: string, customElement: any) => {\n  if (\n    customElement !== undefined &&\n    typeof customElements !== 'undefined' &&\n    !customElements.get(tagName)\n  ) {\n    customElements.define(tagName, customElement);\n  }\n}\n\nexport * from './attachProps';\nexport * from './case';\n","import React, { createElement } from 'react';\n\nimport {\n  attachProps,\n  camelToDashCase,\n  createForwardRef,\n  dashToPascalCase,\n  isCoveredByReact,\n  mergeRefs,\n} from './utils';\n\nexport interface HTMLStencilElement extends HTMLElement {\n  componentOnReady(): Promise<this>;\n}\n\ninterface StencilReactInternalProps<ElementType> extends React.HTMLAttributes<ElementType> {\n  forwardedRef: React.RefObject<ElementType>;\n  ref?: React.Ref<any>;\n}\n\nexport const createReactComponent = <\n  PropType,\n  ElementType extends HTMLStencilElement,\n  ContextStateType = {},\n  ExpandedPropsTypes = {}\n>(\n  tagName: string,\n  ReactComponentContext?: React.Context<ContextStateType>,\n  manipulatePropsFunction?: (\n    originalProps: StencilReactInternalProps<ElementType>,\n    propsToPass: any,\n  ) => ExpandedPropsTypes,\n  defineCustomElement?: () => void,\n) => {\n  if (defineCustomElement !== undefined) {\n    defineCustomElement();\n  }\n\n  const displayName = dashToPascalCase(tagName);\n  const ReactComponent = class extends React.Component<StencilReactInternalProps<ElementType>> {\n    componentEl!: ElementType;\n\n    setComponentElRef = (element: ElementType) => {\n      this.componentEl = element;\n    };\n\n    constructor(props: StencilReactInternalProps<ElementType>) {\n      super(props);\n    }\n\n    componentDidMount() {\n      this.componentDidUpdate(this.props);\n    }\n\n    componentDidUpdate(prevProps: StencilReactInternalProps<ElementType>) {\n      attachProps(this.componentEl, this.props, prevProps);\n    }\n\n    render() {\n      const { children, forwardedRef, style, className, ref, ...cProps } = this.props;\n\n      let propsToPass = Object.keys(cProps).reduce((acc: any, name) => {\n        const value = (cProps as any)[name];\n\n        if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n          const eventName = name.substring(2).toLowerCase();\n          if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {\n            acc[name] = value;\n          }\n        } else {\n          // we should only render strings, booleans, and numbers as attrs in html.\n          // objects, functions, arrays etc get synced via properties on mount.\n          const type = typeof value;\n\n          if (type === 'string' || type === 'boolean' || type === 'number') {\n            acc[camelToDashCase(name)] = value;\n          }\n        }\n        return acc;\n      }, {});\n\n      if (manipulatePropsFunction) {\n        propsToPass = manipulatePropsFunction(this.props, propsToPass);\n      }\n\n      const newProps: Omit<StencilReactInternalProps<ElementType>, 'forwardedRef'> = {\n        ...propsToPass,\n        ref: mergeRefs(forwardedRef, this.setComponentElRef),\n        style,\n      };\n\n      /**\n       * We use createElement here instead of\n       * React.createElement to work around a\n       * bug in Vite (https://github.com/vitejs/vite/issues/6104).\n       * React.createElement causes all elements to be rendered\n       * as <tagname> instead of the actual Web Component.\n       */\n      return createElement(tagName, newProps, children);\n    }\n\n    static get displayName() {\n      return displayName;\n    }\n  };\n\n  // If context was passed to createReactComponent then conditionally add it to the Component Class\n  if (ReactComponentContext) {\n    ReactComponent.contextType = ReactComponentContext;\n  }\n\n  return createForwardRef<PropType, ElementType>(ReactComponent, displayName);\n};\n","/* eslint-disable */\n/* tslint:disable */\n/* auto-generated react proxies */\nimport { createReactComponent } from './react-component-lib';\n\nimport type { JSX } from '@nanoporetech-digital/components';\n\n\n\nexport const NanoAccordion = /*@__PURE__*/createReactComponent<JSX.NanoAccordion, HTMLNanoAccordionElement>('nano-accordion');\nexport const NanoAlert = /*@__PURE__*/createReactComponent<JSX.NanoAlert, HTMLNanoAlertElement>('nano-alert');\nexport const NanoAlgolia = /*@__PURE__*/createReactComponent<JSX.NanoAlgolia, HTMLNanoAlgoliaElement>('nano-algolia');\nexport const NanoAlgoliaFilter = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaFilter, HTMLNanoAlgoliaFilterElement>('nano-algolia-filter');\nexport const NanoAlgoliaPagination = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaPagination, HTMLNanoAlgoliaPaginationElement>('nano-algolia-pagination');\nexport const NanoAlgoliaResults = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaResults, HTMLNanoAlgoliaResultsElement>('nano-algolia-results');\nexport const NanoAnimation = /*@__PURE__*/createReactComponent<JSX.NanoAnimation, HTMLNanoAnimationElement>('nano-animation');\nexport const NanoAvatar = /*@__PURE__*/createReactComponent<JSX.NanoAvatar, HTMLNanoAvatarElement>('nano-avatar');\nexport const NanoBadge = /*@__PURE__*/createReactComponent<JSX.NanoBadge, HTMLNanoBadgeElement>('nano-badge');\nexport const NanoBreadcrumb = /*@__PURE__*/createReactComponent<JSX.NanoBreadcrumb, HTMLNanoBreadcrumbElement>('nano-breadcrumb');\nexport const NanoCard = /*@__PURE__*/createReactComponent<JSX.NanoCard, HTMLNanoCardElement>('nano-card');\nexport const NanoCardCarousel = /*@__PURE__*/createReactComponent<JSX.NanoCardCarousel, HTMLNanoCardCarouselElement>('nano-card-carousel');\nexport const NanoCheckbox = /*@__PURE__*/createReactComponent<JSX.NanoCheckbox, HTMLNanoCheckboxElement>('nano-checkbox');\nexport const NanoCheckboxGroup = /*@__PURE__*/createReactComponent<JSX.NanoCheckboxGroup, HTMLNanoCheckboxGroupElement>('nano-checkbox-group');\nexport const NanoCollapsibleComparison = /*@__PURE__*/createReactComponent<JSX.NanoCollapsibleComparison, HTMLNanoCollapsibleComparisonElement>('nano-collapsible-comparison');\nexport const NanoContentLinks = /*@__PURE__*/createReactComponent<JSX.NanoContentLinks, HTMLNanoContentLinksElement>('nano-content-links');\nexport const NanoCta = /*@__PURE__*/createReactComponent<JSX.NanoCta, HTMLNanoCtaElement>('nano-cta');\nexport const NanoDataTable = /*@__PURE__*/createReactComponent<JSX.NanoDataTable, HTMLNanoDataTableElement>('nano-data-table');\nexport const NanoDatalist = /*@__PURE__*/createReactComponent<JSX.NanoDatalist, HTMLNanoDatalistElement>('nano-datalist');\nexport const NanoDateInput = /*@__PURE__*/createReactComponent<JSX.NanoDateInput, HTMLNanoDateInputElement>('nano-date-input');\nexport const NanoDatePicker = /*@__PURE__*/createReactComponent<JSX.NanoDatePicker, HTMLNanoDatePickerElement>('nano-date-picker');\nexport const NanoDetails = /*@__PURE__*/createReactComponent<JSX.NanoDetails, HTMLNanoDetailsElement>('nano-details');\nexport const NanoDialog = /*@__PURE__*/createReactComponent<JSX.NanoDialog, HTMLNanoDialogElement>('nano-dialog');\nexport const NanoDrawer = /*@__PURE__*/createReactComponent<JSX.NanoDrawer, HTMLNanoDrawerElement>('nano-drawer');\nexport const NanoDropdown = /*@__PURE__*/createReactComponent<JSX.NanoDropdown, HTMLNanoDropdownElement>('nano-dropdown');\nexport const NanoFieldValidator = /*@__PURE__*/createReactComponent<JSX.NanoFieldValidator, HTMLNanoFieldValidatorElement>('nano-field-validator');\nexport const NanoFileUpload = /*@__PURE__*/createReactComponent<JSX.NanoFileUpload, HTMLNanoFileUploadElement>('nano-file-upload');\nexport const NanoFooter = /*@__PURE__*/createReactComponent<JSX.NanoFooter, HTMLNanoFooterElement>('nano-footer');\nexport const NanoGlobalNav = /*@__PURE__*/createReactComponent<JSX.NanoGlobalNav, HTMLNanoGlobalNavElement>('nano-global-nav');\nexport const NanoGlobalSearchResults = /*@__PURE__*/createReactComponent<JSX.NanoGlobalSearchResults, HTMLNanoGlobalSearchResultsElement>('nano-global-search-results');\nexport const NanoGrid = /*@__PURE__*/createReactComponent<JSX.NanoGrid, HTMLNanoGridElement>('nano-grid');\nexport const NanoGridItem = /*@__PURE__*/createReactComponent<JSX.NanoGridItem, HTMLNanoGridItemElement>('nano-grid-item');\nexport const NanoHero = /*@__PURE__*/createReactComponent<JSX.NanoHero, HTMLNanoHeroElement>('nano-hero');\nexport const NanoIcon = /*@__PURE__*/createReactComponent<JSX.NanoIcon, HTMLNanoIconElement>('nano-icon');\nexport const NanoIconButton = /*@__PURE__*/createReactComponent<JSX.NanoIconButton, HTMLNanoIconButtonElement>('nano-icon-button');\nexport const NanoIconItem = /*@__PURE__*/createReactComponent<JSX.NanoIconItem, HTMLNanoIconItemElement>('nano-icon-item');\nexport const NanoImg = /*@__PURE__*/createReactComponent<JSX.NanoImg, HTMLNanoImgElement>('nano-img');\nexport const NanoInPageNav = /*@__PURE__*/createReactComponent<JSX.NanoInPageNav, HTMLNanoInPageNavElement>('nano-in-page-nav');\nexport const NanoInput = /*@__PURE__*/createReactComponent<JSX.NanoInput, HTMLNanoInputElement>('nano-input');\nexport const NanoIntersectionObserve = /*@__PURE__*/createReactComponent<JSX.NanoIntersectionObserve, HTMLNanoIntersectionObserveElement>('nano-intersection-observe');\nexport const NanoMaskedOverflow = /*@__PURE__*/createReactComponent<JSX.NanoMaskedOverflow, HTMLNanoMaskedOverflowElement>('nano-masked-overflow');\nexport const NanoMenu = /*@__PURE__*/createReactComponent<JSX.NanoMenu, HTMLNanoMenuElement>('nano-menu');\nexport const NanoMenuDrawer = /*@__PURE__*/createReactComponent<JSX.NanoMenuDrawer, HTMLNanoMenuDrawerElement>('nano-menu-drawer');\nexport const NanoMoreLess = /*@__PURE__*/createReactComponent<JSX.NanoMoreLess, HTMLNanoMoreLessElement>('nano-more-less');\nexport const NanoNavItem = /*@__PURE__*/createReactComponent<JSX.NanoNavItem, HTMLNanoNavItemElement>('nano-nav-item');\nexport const NanoOption = /*@__PURE__*/createReactComponent<JSX.NanoOption, HTMLNanoOptionElement>('nano-option');\nexport const NanoProgressBar = /*@__PURE__*/createReactComponent<JSX.NanoProgressBar, HTMLNanoProgressBarElement>('nano-progress-bar');\nexport const NanoRange = /*@__PURE__*/createReactComponent<JSX.NanoRange, HTMLNanoRangeElement>('nano-range');\nexport const NanoRating = /*@__PURE__*/createReactComponent<JSX.NanoRating, HTMLNanoRatingElement>('nano-rating');\nexport const NanoResizeObserve = /*@__PURE__*/createReactComponent<JSX.NanoResizeObserve, HTMLNanoResizeObserveElement>('nano-resize-observe');\nexport const NanoSelect = /*@__PURE__*/createReactComponent<JSX.NanoSelect, HTMLNanoSelectElement>('nano-select');\nexport const NanoSkeleton = /*@__PURE__*/createReactComponent<JSX.NanoSkeleton, HTMLNanoSkeletonElement>('nano-skeleton');\nexport const NanoSlide = /*@__PURE__*/createReactComponent<JSX.NanoSlide, HTMLNanoSlideElement>('nano-slide');\nexport const NanoSlides = /*@__PURE__*/createReactComponent<JSX.NanoSlides, HTMLNanoSlidesElement>('nano-slides');\nexport const NanoSortable = /*@__PURE__*/createReactComponent<JSX.NanoSortable, HTMLNanoSortableElement>('nano-sortable');\nexport const NanoSpinner = /*@__PURE__*/createReactComponent<JSX.NanoSpinner, HTMLNanoSpinnerElement>('nano-spinner');\nexport const NanoSplitPane = /*@__PURE__*/createReactComponent<JSX.NanoSplitPane, HTMLNanoSplitPaneElement>('nano-split-pane');\nexport const NanoSticker = /*@__PURE__*/createReactComponent<JSX.NanoSticker, HTMLNanoStickerElement>('nano-sticker');\nexport const NanoTab = /*@__PURE__*/createReactComponent<JSX.NanoTab, HTMLNanoTabElement>('nano-tab');\nexport const NanoTabContent = /*@__PURE__*/createReactComponent<JSX.NanoTabContent, HTMLNanoTabContentElement>('nano-tab-content');\nexport const NanoTabGroup = /*@__PURE__*/createReactComponent<JSX.NanoTabGroup, HTMLNanoTabGroupElement>('nano-tab-group');\nexport const NanoTable = /*@__PURE__*/createReactComponent<JSX.NanoTable, HTMLNanoTableElement>('nano-table');\nexport const NanoTag = /*@__PURE__*/createReactComponent<JSX.NanoTag, HTMLNanoTagElement>('nano-tag');\nexport const NanoTooltip = /*@__PURE__*/createReactComponent<JSX.NanoTooltip, HTMLNanoTooltipElement>('nano-tooltip');\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/react-component-lib/utils/case.ts","../src/react-component-lib/utils/attachProps.ts","../src/react-component-lib/utils/index.tsx","../src/react-component-lib/createComponent.tsx","../src/components.ts"],"sourcesContent":["export const dashToPascalCase = (str: string) =>\n  str\n    .toLowerCase()\n    .split('-')\n    .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1))\n    .join('');\nexport const camelToDashCase = (str: string) =>\n  str.replace(/([A-Z])/g, (m: string) => `-${m[0].toLowerCase()}`);\n","import { camelToDashCase } from './case';\n\nexport const attachProps = (node: HTMLElement, newProps: any, oldProps: any = {}) => {\n  // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first\n  if (node instanceof Element) {\n    // add any classes in className to the class list\n    const className = getClassName(node.classList, newProps, oldProps);\n    if (className !== '') {\n      node.className = className;\n    }\n\n    Object.keys(newProps).forEach((name) => {\n      if (\n        name === 'children' ||\n        name === 'style' ||\n        name === 'ref' ||\n        name === 'class' ||\n        name === 'className' ||\n        name === 'forwardedRef'\n      ) {\n        return;\n      }\n      if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n        const eventName = name.substring(2);\n        const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1);\n\n        if (!isCoveredByReact(eventNameLc)) {\n          syncEvent(node, eventNameLc, newProps[name]);\n        }\n      } else {\n        (node as any)[name] = newProps[name];\n        const propType = typeof newProps[name];\n        if (propType === 'string') {\n          node.setAttribute(camelToDashCase(name), newProps[name]);\n        }\n      }\n    });\n  }\n};\n\nexport const getClassName = (classList: DOMTokenList, newProps: any, oldProps: any) => {\n  const newClassProp: string = newProps.className || newProps.class;\n  const oldClassProp: string = oldProps.className || oldProps.class;\n  // map the classes to Maps for performance\n  const currentClasses = arrayToMap(classList);\n  const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []);\n  const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []);\n  const finalClassNames: string[] = [];\n  // loop through each of the current classes on the component\n  // to see if it should be a part of the classNames added\n  currentClasses.forEach((currentClass) => {\n    if (incomingPropClasses.has(currentClass)) {\n      // add it as its already included in classnames coming in from newProps\n      finalClassNames.push(currentClass);\n      incomingPropClasses.delete(currentClass);\n    } else if (!oldPropClasses.has(currentClass)) {\n      // add it as it has NOT been removed by user\n      finalClassNames.push(currentClass);\n    }\n  });\n  incomingPropClasses.forEach((s) => finalClassNames.push(s));\n  return finalClassNames.join(' ');\n};\n\n/**\n * Checks if an event is supported in the current execution environment.\n * @license Modernizr 3.0.0pre (Custom Build) | MIT\n */\nexport const isCoveredByReact = (eventNameSuffix: string) => {\n  if (typeof document === 'undefined') {\n    return true;\n  } else {\n    const eventName = 'on' + eventNameSuffix;\n    let isSupported = eventName in document;\n\n    if (!isSupported) {\n      const element = document.createElement('div');\n      element.setAttribute(eventName, 'return;');\n      isSupported = typeof (element as any)[eventName] === 'function';\n    }\n\n    return isSupported;\n  }\n};\n\nexport const syncEvent = (\n  node: Element & { __events?: { [key: string]: ((e: Event) => any) | undefined } },\n  eventName: string,\n  newEventHandler?: (e: Event) => any\n) => {\n  const eventStore = node.__events || (node.__events = {});\n  const oldEventHandler = eventStore[eventName];\n\n  // Remove old listener so they don't double up.\n  if (oldEventHandler) {\n    node.removeEventListener(eventName, oldEventHandler);\n  }\n\n  // Bind new listener.\n  node.addEventListener(\n    eventName,\n    (eventStore[eventName] = function handler(e: Event) {\n      if (newEventHandler) {\n        newEventHandler.call(this, e);\n      }\n    })\n  );\n};\n\nconst arrayToMap = (arr: string[] | DOMTokenList) => {\n  const map = new Map<string, string>();\n  (arr as string[]).forEach((s: string) => map.set(s, s));\n  return map;\n};\n","import React from 'react';\n\nimport type { StyleReactProps } from '../interfaces';\n\nexport type StencilReactExternalProps<PropType, ElementType> = PropType &\n  Omit<React.HTMLAttributes<ElementType>, 'style'> &\n  StyleReactProps;\n\n// This will be replaced with React.ForwardedRef when react-output-target is upgraded to React v17\nexport type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;\n\nexport const setRef = (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => {\n  if (typeof ref === 'function') {\n    ref(value)\n  } else if (ref != null) {\n    // Cast as a MutableRef so we can assign current\n    (ref as React.MutableRefObject<any>).current = value\n  }\n};\n\nexport const mergeRefs = (\n  ...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]\n): React.RefCallback<any> => {\n  return (value: any) => {\n    refs.forEach(ref => {\n      setRef(ref, value)\n    })\n  }\n};\n\nexport const createForwardRef = <PropType, ElementType>(\n  ReactComponent: any,\n  displayName: string,\n) => {\n  const forwardRef = (\n    props: StencilReactExternalProps<PropType, ElementType>,\n    ref: StencilReactForwardedRef<ElementType>,\n  ) => {\n    return <ReactComponent {...props} forwardedRef={ref} />;\n  };\n  forwardRef.displayName = displayName;\n\n  return React.forwardRef(forwardRef);\n};\n\nexport const defineCustomElement = (tagName: string, customElement: any) => {\n  if (\n    customElement !== undefined &&\n    typeof customElements !== 'undefined' &&\n    !customElements.get(tagName)\n  ) {\n    customElements.define(tagName, customElement);\n  }\n}\n\nexport * from './attachProps';\nexport * from './case';\n","import React, { createElement } from 'react';\n\nimport {\n  attachProps,\n  camelToDashCase,\n  createForwardRef,\n  dashToPascalCase,\n  isCoveredByReact,\n  mergeRefs,\n} from './utils';\n\nexport interface HTMLStencilElement extends HTMLElement {\n  componentOnReady(): Promise<this>;\n}\n\ninterface StencilReactInternalProps<ElementType> extends React.HTMLAttributes<ElementType> {\n  forwardedRef: React.RefObject<ElementType>;\n  ref?: React.Ref<any>;\n}\n\nexport const createReactComponent = <\n  PropType,\n  ElementType extends HTMLStencilElement,\n  ContextStateType = {},\n  ExpandedPropsTypes = {}\n>(\n  tagName: string,\n  ReactComponentContext?: React.Context<ContextStateType>,\n  manipulatePropsFunction?: (\n    originalProps: StencilReactInternalProps<ElementType>,\n    propsToPass: any,\n  ) => ExpandedPropsTypes,\n  defineCustomElement?: () => void,\n) => {\n  if (defineCustomElement !== undefined) {\n    defineCustomElement();\n  }\n\n  const displayName = dashToPascalCase(tagName);\n  const ReactComponent = class extends React.Component<StencilReactInternalProps<ElementType>> {\n    componentEl!: ElementType;\n\n    setComponentElRef = (element: ElementType) => {\n      this.componentEl = element;\n    };\n\n    constructor(props: StencilReactInternalProps<ElementType>) {\n      super(props);\n    }\n\n    componentDidMount() {\n      this.componentDidUpdate(this.props);\n    }\n\n    componentDidUpdate(prevProps: StencilReactInternalProps<ElementType>) {\n      attachProps(this.componentEl, this.props, prevProps);\n    }\n\n    render() {\n      const { children, forwardedRef, style, className, ref, ...cProps } = this.props;\n\n      let propsToPass = Object.keys(cProps).reduce((acc: any, name) => {\n        const value = (cProps as any)[name];\n\n        if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) {\n          const eventName = name.substring(2).toLowerCase();\n          if (typeof document !== 'undefined' && isCoveredByReact(eventName)) {\n            acc[name] = value;\n          }\n        } else {\n          // we should only render strings, booleans, and numbers as attrs in html.\n          // objects, functions, arrays etc get synced via properties on mount.\n          const type = typeof value;\n\n          if (type === 'string' || type === 'boolean' || type === 'number') {\n            acc[camelToDashCase(name)] = value;\n          }\n        }\n        return acc;\n      }, {});\n\n      if (manipulatePropsFunction) {\n        propsToPass = manipulatePropsFunction(this.props, propsToPass);\n      }\n\n      const newProps: Omit<StencilReactInternalProps<ElementType>, 'forwardedRef'> = {\n        ...propsToPass,\n        ref: mergeRefs(forwardedRef, this.setComponentElRef),\n        style,\n      };\n\n      /**\n       * We use createElement here instead of\n       * React.createElement to work around a\n       * bug in Vite (https://github.com/vitejs/vite/issues/6104).\n       * React.createElement causes all elements to be rendered\n       * as <tagname> instead of the actual Web Component.\n       */\n      return createElement(tagName, newProps, children);\n    }\n\n    static get displayName() {\n      return displayName;\n    }\n  };\n\n  // If context was passed to createReactComponent then conditionally add it to the Component Class\n  if (ReactComponentContext) {\n    ReactComponent.contextType = ReactComponentContext;\n  }\n\n  return createForwardRef<PropType, ElementType>(ReactComponent, displayName);\n};\n","/* eslint-disable */\n/* tslint:disable */\n/* auto-generated react proxies */\nimport { createReactComponent } from './react-component-lib';\n\nimport type { JSX } from '@nanoporetech-digital/components';\n\n\n\nexport const NanoAccordion = /*@__PURE__*/createReactComponent<JSX.NanoAccordion, HTMLNanoAccordionElement>('nano-accordion');\nexport const NanoAlert = /*@__PURE__*/createReactComponent<JSX.NanoAlert, HTMLNanoAlertElement>('nano-alert');\nexport const NanoAlgolia = /*@__PURE__*/createReactComponent<JSX.NanoAlgolia, HTMLNanoAlgoliaElement>('nano-algolia');\nexport const NanoAlgoliaFilter = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaFilter, HTMLNanoAlgoliaFilterElement>('nano-algolia-filter');\nexport const NanoAlgoliaPagination = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaPagination, HTMLNanoAlgoliaPaginationElement>('nano-algolia-pagination');\nexport const NanoAlgoliaResults = /*@__PURE__*/createReactComponent<JSX.NanoAlgoliaResults, HTMLNanoAlgoliaResultsElement>('nano-algolia-results');\nexport const NanoAnimation = /*@__PURE__*/createReactComponent<JSX.NanoAnimation, HTMLNanoAnimationElement>('nano-animation');\nexport const NanoAvatar = /*@__PURE__*/createReactComponent<JSX.NanoAvatar, HTMLNanoAvatarElement>('nano-avatar');\nexport const NanoBadge = /*@__PURE__*/createReactComponent<JSX.NanoBadge, HTMLNanoBadgeElement>('nano-badge');\nexport const NanoBreadcrumb = /*@__PURE__*/createReactComponent<JSX.NanoBreadcrumb, HTMLNanoBreadcrumbElement>('nano-breadcrumb');\nexport const NanoCard = /*@__PURE__*/createReactComponent<JSX.NanoCard, HTMLNanoCardElement>('nano-card');\nexport const NanoCardCarousel = /*@__PURE__*/createReactComponent<JSX.NanoCardCarousel, HTMLNanoCardCarouselElement>('nano-card-carousel');\nexport const NanoCheckbox = /*@__PURE__*/createReactComponent<JSX.NanoCheckbox, HTMLNanoCheckboxElement>('nano-checkbox');\nexport const NanoCheckboxGroup = /*@__PURE__*/createReactComponent<JSX.NanoCheckboxGroup, HTMLNanoCheckboxGroupElement>('nano-checkbox-group');\nexport const NanoCollapsibleComparison = /*@__PURE__*/createReactComponent<JSX.NanoCollapsibleComparison, HTMLNanoCollapsibleComparisonElement>('nano-collapsible-comparison');\nexport const NanoContentLinks = /*@__PURE__*/createReactComponent<JSX.NanoContentLinks, HTMLNanoContentLinksElement>('nano-content-links');\nexport const NanoCta = /*@__PURE__*/createReactComponent<JSX.NanoCta, HTMLNanoCtaElement>('nano-cta');\nexport const NanoDataTable = /*@__PURE__*/createReactComponent<JSX.NanoDataTable, HTMLNanoDataTableElement>('nano-data-table');\nexport const NanoDatalist = /*@__PURE__*/createReactComponent<JSX.NanoDatalist, HTMLNanoDatalistElement>('nano-datalist');\nexport const NanoDateInput = /*@__PURE__*/createReactComponent<JSX.NanoDateInput, HTMLNanoDateInputElement>('nano-date-input');\nexport const NanoDatePicker = /*@__PURE__*/createReactComponent<JSX.NanoDatePicker, HTMLNanoDatePickerElement>('nano-date-picker');\nexport const NanoDetails = /*@__PURE__*/createReactComponent<JSX.NanoDetails, HTMLNanoDetailsElement>('nano-details');\nexport const NanoDialog = /*@__PURE__*/createReactComponent<JSX.NanoDialog, HTMLNanoDialogElement>('nano-dialog');\nexport const NanoDrawer = /*@__PURE__*/createReactComponent<JSX.NanoDrawer, HTMLNanoDrawerElement>('nano-drawer');\nexport const NanoDropdown = /*@__PURE__*/createReactComponent<JSX.NanoDropdown, HTMLNanoDropdownElement>('nano-dropdown');\nexport const NanoFeatureBox = /*@__PURE__*/createReactComponent<JSX.NanoFeatureBox, HTMLNanoFeatureBoxElement>('nano-feature-box');\nexport const NanoFieldValidator = /*@__PURE__*/createReactComponent<JSX.NanoFieldValidator, HTMLNanoFieldValidatorElement>('nano-field-validator');\nexport const NanoFileUpload = /*@__PURE__*/createReactComponent<JSX.NanoFileUpload, HTMLNanoFileUploadElement>('nano-file-upload');\nexport const NanoFooter = /*@__PURE__*/createReactComponent<JSX.NanoFooter, HTMLNanoFooterElement>('nano-footer');\nexport const NanoGlobalNav = /*@__PURE__*/createReactComponent<JSX.NanoGlobalNav, HTMLNanoGlobalNavElement>('nano-global-nav');\nexport const NanoGlobalSearchResults = /*@__PURE__*/createReactComponent<JSX.NanoGlobalSearchResults, HTMLNanoGlobalSearchResultsElement>('nano-global-search-results');\nexport const NanoGrid = /*@__PURE__*/createReactComponent<JSX.NanoGrid, HTMLNanoGridElement>('nano-grid');\nexport const NanoGridItem = /*@__PURE__*/createReactComponent<JSX.NanoGridItem, HTMLNanoGridItemElement>('nano-grid-item');\nexport const NanoHero = /*@__PURE__*/createReactComponent<JSX.NanoHero, HTMLNanoHeroElement>('nano-hero');\nexport const NanoIcon = /*@__PURE__*/createReactComponent<JSX.NanoIcon, HTMLNanoIconElement>('nano-icon');\nexport const NanoIconButton = /*@__PURE__*/createReactComponent<JSX.NanoIconButton, HTMLNanoIconButtonElement>('nano-icon-button');\nexport const NanoIconItem = /*@__PURE__*/createReactComponent<JSX.NanoIconItem, HTMLNanoIconItemElement>('nano-icon-item');\nexport const NanoImg = /*@__PURE__*/createReactComponent<JSX.NanoImg, HTMLNanoImgElement>('nano-img');\nexport const NanoInPageNav = /*@__PURE__*/createReactComponent<JSX.NanoInPageNav, HTMLNanoInPageNavElement>('nano-in-page-nav');\nexport const NanoInput = /*@__PURE__*/createReactComponent<JSX.NanoInput, HTMLNanoInputElement>('nano-input');\nexport const NanoIntersectionObserve = /*@__PURE__*/createReactComponent<JSX.NanoIntersectionObserve, HTMLNanoIntersectionObserveElement>('nano-intersection-observe');\nexport const NanoMaskedOverflow = /*@__PURE__*/createReactComponent<JSX.NanoMaskedOverflow, HTMLNanoMaskedOverflowElement>('nano-masked-overflow');\nexport const NanoMenu = /*@__PURE__*/createReactComponent<JSX.NanoMenu, HTMLNanoMenuElement>('nano-menu');\nexport const NanoMenuDrawer = /*@__PURE__*/createReactComponent<JSX.NanoMenuDrawer, HTMLNanoMenuDrawerElement>('nano-menu-drawer');\nexport const NanoMoreLess = /*@__PURE__*/createReactComponent<JSX.NanoMoreLess, HTMLNanoMoreLessElement>('nano-more-less');\nexport const NanoNavItem = /*@__PURE__*/createReactComponent<JSX.NanoNavItem, HTMLNanoNavItemElement>('nano-nav-item');\nexport const NanoOption = /*@__PURE__*/createReactComponent<JSX.NanoOption, HTMLNanoOptionElement>('nano-option');\nexport const NanoProgressBar = /*@__PURE__*/createReactComponent<JSX.NanoProgressBar, HTMLNanoProgressBarElement>('nano-progress-bar');\nexport const NanoRange = /*@__PURE__*/createReactComponent<JSX.NanoRange, HTMLNanoRangeElement>('nano-range');\nexport const NanoRating = /*@__PURE__*/createReactComponent<JSX.NanoRating, HTMLNanoRatingElement>('nano-rating');\nexport const NanoResizeObserve = /*@__PURE__*/createReactComponent<JSX.NanoResizeObserve, HTMLNanoResizeObserveElement>('nano-resize-observe');\nexport const NanoSelect = /*@__PURE__*/createReactComponent<JSX.NanoSelect, HTMLNanoSelectElement>('nano-select');\nexport const NanoSlide = /*@__PURE__*/createReactComponent<JSX.NanoSlide, HTMLNanoSlideElement>('nano-slide');\nexport const NanoSlides = /*@__PURE__*/createReactComponent<JSX.NanoSlides, HTMLNanoSlidesElement>('nano-slides');\nexport const NanoSortable = /*@__PURE__*/createReactComponent<JSX.NanoSortable, HTMLNanoSortableElement>('nano-sortable');\nexport const NanoSpinner = /*@__PURE__*/createReactComponent<JSX.NanoSpinner, HTMLNanoSpinnerElement>('nano-spinner');\nexport const NanoSplitPane = /*@__PURE__*/createReactComponent<JSX.NanoSplitPane, HTMLNanoSplitPaneElement>('nano-split-pane');\nexport const NanoSticker = /*@__PURE__*/createReactComponent<JSX.NanoSticker, HTMLNanoStickerElement>('nano-sticker');\nexport const NanoTab = /*@__PURE__*/createReactComponent<JSX.NanoTab, HTMLNanoTabElement>('nano-tab');\nexport const NanoTabContent = /*@__PURE__*/createReactComponent<JSX.NanoTabContent, HTMLNanoTabContentElement>('nano-tab-content');\nexport const NanoTabGroup = /*@__PURE__*/createReactComponent<JSX.NanoTabGroup, HTMLNanoTabGroupElement>('nano-tab-group');\nexport const NanoTable = /*@__PURE__*/createReactComponent<JSX.NanoTable, HTMLNanoTableElement>('nano-table');\nexport const NanoTag = /*@__PURE__*/createReactComponent<JSX.NanoTag, HTMLNanoTagElement>('nano-tag');\nexport const NanoTooltip = /*@__PURE__*/createReactComponent<JSX.NanoTooltip, HTMLNanoTooltipElement>('nano-tooltip');\n"],"names":[],"mappings":";;;;AAAa,MAAA,mBAAmB,CAAC,QAC/B,IACG,YAAA,EACA,MAAM,GAAG,EACT,IAAI,CAAC,YAAY,QAAQ,OAAO,CAAC,EAAE,gBAAgB,QAAQ,MAAM,CAAC,CAAC,EACnE,KAAK,EAAE;AACL,MAAM,kBAAkB,CAAC,QAC9B,IAAI,QAAQ,YAAY,CAAC,MAAc,IAAI,EAAE,CAAC,EAAE,YAAA,CAAa,EAAE;ACL1D,MAAM,cAAc,CAAC,MAAmB,UAAe,WAAgB,CAAA,MAAO;AAEnF,MAAI,gBAAgB,SAAS;AAE3B,UAAM,YAAY,aAAa,KAAK,WAAW,UAAU,QAAQ;AACjE,QAAI,cAAc,IAAI;AACpB,WAAK,YAAY;AAAA,IAAA;AAGnB,WAAO,KAAK,QAAQ,EAAE,QAAQ,CAAC,SAAS;AAEpC,UAAA,SAAS,cACT,SAAS,WACT,SAAS,SACT,SAAS,WACT,SAAS,eACT,SAAS,gBACT;AACA;AAAA,MAAA;AAEF,UAAI,KAAK,QAAQ,IAAI,MAAM,KAAK,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,YAAA,GAAe;AAC3D,cAAA,YAAY,KAAK,UAAU,CAAC;AAC5B,cAAA,cAAc,UAAU,CAAC,EAAE,gBAAgB,UAAU,UAAU,CAAC;AAElE,YAAA,CAAC,iBAAiB,WAAW,GAAG;AAClC,oBAAU,MAAM,aAAa,SAAS,IAAI,CAAC;AAAA,QAAA;AAAA,MAC7C,OACK;AACJ,aAAa,IAAI,IAAI,SAAS,IAAI;AAC7B,cAAA,WAAW,OAAO,SAAS,IAAI;AACrC,YAAI,aAAa,UAAU;AACzB,eAAK,aAAa,gBAAgB,IAAI,GAAG,SAAS,IAAI,CAAC;AAAA,QAAA;AAAA,MACzD;AAAA,IACF,CACD;AAAA,EAAA;AAEL;AAEO,MAAM,eAAe,CAAC,WAAyB,UAAe,aAAkB;AAC/E,QAAA,eAAuB,SAAS,aAAa,SAAS;AACtD,QAAA,eAAuB,SAAS,aAAa,SAAS;AAEtD,QAAA,iBAAiB,WAAW,SAAS;AACrC,QAAA,sBAAsB,WAAW,eAAe,aAAa,MAAM,GAAG,IAAI,EAAE;AAC5E,QAAA,iBAAiB,WAAW,eAAe,aAAa,MAAM,GAAG,IAAI,EAAE;AAC7E,QAAM,kBAA4B,CAAC;AAGpB,iBAAA,QAAQ,CAAC,iBAAiB;AACnC,QAAA,oBAAoB,IAAI,YAAY,GAAG;AAEzC,sBAAgB,KAAK,YAAY;AACjC,0BAAoB,OAAO,YAAY;AAAA,IAC9B,WAAA,CAAC,eAAe,IAAI,YAAY,GAAG;AAE5C,sBAAgB,KAAK,YAAY;AAAA,IAAA;AAAA,EACnC,CACD;AACD,sBAAoB,QAAQ,CAAC,MAAM,gBAAgB,KAAK,CAAC,CAAC;AACnD,SAAA,gBAAgB,KAAK,GAAG;AACjC;AAEA;AAAA;AAAA;AAAA;AAIa,MAAA,mBAAmB,CAAC,oBAA4B;AACvD,MAAA,OAAO,aAAa,aAAa;AAC5B,WAAA;AAAA,EAAA,OACF;AACL,UAAM,YAAY,OAAO;AACzB,QAAI,cAAc,aAAa;AAE/B,QAAI,CAAC,aAAa;AACV,YAAA,UAAU,SAAS,cAAc,KAAK;AACpC,cAAA,aAAa,WAAW,SAAS;AAC3B,oBAAA,OAAQ,QAAgB,SAAS,MAAM;AAAA,IAAA;AAGhD,WAAA;AAAA,EAAA;AAEX;AAEO,MAAM,YAAY,CACvB,MACA,WACA,oBACG;AACH,QAAM,aAAa,KAAK,aAAa,KAAK,WAAW,CAAA;AAC/C,QAAA,kBAAkB,WAAW,SAAS;AAG5C,MAAI,iBAAiB;AACd,SAAA,oBAAoB,WAAW,eAAe;AAAA,EAAA;AAIhD,OAAA;AAAA,IACH;AAAA,IACC,WAAW,SAAS,IAAI,SAAS,QAAQ,GAAU;AAClD,UAAI,iBAAiB;AACH,wBAAA,KAAK,MAAM,CAAC;AAAA,MAAA;AAAA,IAC9B;AAAA,EAEJ;AACF;AAEA,MAAM,aAAa,CAAC,QAAiC;AAC7C,QAAA,0BAAU,IAAoB;AACnC,MAAiB,QAAQ,CAAC,MAAc,IAAI,IAAI,GAAG,CAAC,CAAC;AAC/C,SAAA;AACT;ACtGa,MAAA,SAAS,CAAC,KAAiE,UAAe;AACjG,MAAA,OAAO,QAAQ,YAAY;AAC7B,QAAI,KAAK;AAAA,EAAA,WACA,OAAO,MAAM;AAErB,QAAoC,UAAU;AAAA,EAAA;AAEnD;AAEa,MAAA,YAAY,IACpB,SACwB;AAC3B,SAAO,CAAC,UAAe;AACrB,SAAK,QAAQ,CAAO,QAAA;AAClB,aAAO,KAAK,KAAK;AAAA,IAAA,CAClB;AAAA,EACH;AACF;AAEa,MAAA,mBAAmB,CAC9B,gBACA,gBACG;AACG,QAAA,aAAa,CACjB,OACA,QACG;AACH,WAAQ,sBAAA,cAAA,gBAAA,EAAgB,GAAG,OAAO,cAAc,KAAK;AAAA,EACvD;AACA,aAAW,cAAc;AAElB,SAAA,MAAM,WAAW,UAAU;AACpC;ACvBO,MAAM,uBAAuB,CAMlC,SACA,uBACA,yBAIA,wBACG;AAKG,QAAA,cAAc,iBAAiB,OAAO;AACtC,QAAA,iBAAiB,cAAc,MAAM,UAAkD;AAAA,IAO3F,YAAY,OAA+C;AACzD,YAAM,KAAK;AAPb;AAEA,+CAAoB,CAAC,YAAyB;AAC5C,aAAK,cAAc;AAAA,MACrB;AAAA,IAGa;AAAA,IAGb,oBAAoB;AACb,WAAA,mBAAmB,KAAK,KAAK;AAAA,IAAA;AAAA,IAGpC,mBAAmB,WAAmD;AACpE,kBAAY,KAAK,aAAa,KAAK,OAAO,SAAS;AAAA,IAAA;AAAA,IAGrD,SAAS;AACD,YAAA,EAAE,UAAU,cAAc,OAAO,WAAW,KAAK,GAAG,WAAW,KAAK;AAEtE,UAAA,cAAc,OAAO,KAAK,MAAM,EAAE,OAAO,CAAC,KAAU,SAAS;AACzD,cAAA,QAAS,OAAe,IAAI;AAElC,YAAI,KAAK,QAAQ,IAAI,MAAM,KAAK,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,YAAA,GAAe;AACjE,gBAAM,YAAY,KAAK,UAAU,CAAC,EAAE,YAAY;AAChD,cAAI,OAAO,aAAa,eAAe,iBAAiB,SAAS,GAAG;AAClE,gBAAI,IAAI,IAAI;AAAA,UAAA;AAAA,QACd,OACK;AAGL,gBAAM,OAAO,OAAO;AAEpB,cAAI,SAAS,YAAY,SAAS,aAAa,SAAS,UAAU;AAC5D,gBAAA,gBAAgB,IAAI,CAAC,IAAI;AAAA,UAAA;AAAA,QAC/B;AAEK,eAAA;AAAA,MACT,GAAG,EAAE;AAML,YAAM,WAAyE;AAAA,QAC7E,GAAG;AAAA,QACH,KAAK,UAAU,cAAc,KAAK,iBAAiB;AAAA,QACnD;AAAA,MACF;AASO,aAAA,cAAc,SAAS,UAAU,QAAQ;AAAA,IAAA;AAAA,IAGlD,WAAW,cAAc;AAChB,aAAA;AAAA,IAAA;AAAA,EAEX;AAOO,SAAA,iBAAwC,gBAAgB,WAAW;AAC5E;ACvGa,MAAA,qDAA+F,gBAAgB;AAC/G,MAAA,iDAAmF,YAAY;AAC/F,MAAA,mDAAyF,cAAc;AACvG,MAAA,yDAA2G,qBAAqB;AAChI,MAAA,6DAAuH,yBAAyB;AAChJ,MAAA,0DAA8G,sBAAsB;AACpI,MAAA,qDAA+F,gBAAgB;AAC/G,MAAA,kDAAsF,aAAa;AACnG,MAAA,iDAAmF,YAAY;AAC/F,MAAA,sDAAkG,iBAAiB;AACnH,MAAA,gDAAgF,WAAW;AAC3F,MAAA,wDAAwG,oBAAoB;AAC5H,MAAA,oDAA4F,eAAe;AAC3G,MAAA,yDAA2G,qBAAqB;AAChI,MAAA,iEAAmI,6BAA6B;AAChK,MAAA,wDAAwG,oBAAoB;AAC5H,MAAA,+CAA6E,UAAU;AACvF,MAAA,qDAA+F,iBAAiB;AAChH,MAAA,oDAA4F,eAAe;AAC3G,MAAA,qDAA+F,iBAAiB;AAChH,MAAA,sDAAkG,kBAAkB;AACpH,MAAA,mDAAyF,cAAc;AACvG,MAAA,kDAAsF,aAAa;AACnG,MAAA,kDAAsF,aAAa;AACnG,MAAA,oDAA4F,eAAe;AAC3G,MAAA,sDAAkG,kBAAkB;AACpH,MAAA,0DAA8G,sBAAsB;AACpI,MAAA,sDAAkG,kBAAkB;AACpH,MAAA,kDAAsF,aAAa;AACnG,MAAA,qDAA+F,iBAAiB;AAChH,MAAA,+DAA6H,4BAA4B;AACzJ,MAAA,gDAAgF,WAAW;AAC3F,MAAA,oDAA4F,gBAAgB;AAC5G,MAAA,gDAAgF,WAAW;AAC3F,MAAA,gDAAgF,WAAW;AAC3F,MAAA,sDAAkG,kBAAkB;AACpH,MAAA,oDAA4F,gBAAgB;AAC5G,MAAA,+CAA6E,UAAU;AACvF,MAAA,qDAA+F,kBAAkB;AACjH,MAAA,iDAAmF,YAAY;AAC/F,MAAA,+DAA6H,2BAA2B;AACxJ,MAAA,0DAA8G,sBAAsB;AACpI,MAAA,gDAAgF,WAAW;AAC3F,MAAA,sDAAkG,kBAAkB;AACpH,MAAA,oDAA4F,gBAAgB;AAC5G,MAAA,mDAAyF,eAAe;AACxG,MAAA,kDAAsF,aAAa;AACnG,MAAA,uDAAqG,mBAAmB;AACxH,MAAA,iDAAmF,YAAY;AAC/F,MAAA,kDAAsF,aAAa;AACnG,MAAA,yDAA2G,qBAAqB;AAChI,MAAA,kDAAsF,aAAa;AACnG,MAAA,iDAAmF,YAAY;AAC/F,MAAA,kDAAsF,aAAa;AACnG,MAAA,oDAA4F,eAAe;AAC3G,MAAA,mDAAyF,cAAc;AACvG,MAAA,qDAA+F,iBAAiB;AAChH,MAAA,mDAAyF,cAAc;AACvG,MAAA,+CAA6E,UAAU;AACvF,MAAA,sDAAkG,kBAAkB;AACpH,MAAA,oDAA4F,gBAAgB;AAC5G,MAAA,iDAAmF,YAAY;AAC/F,MAAA,+CAA6E,UAAU;AACvF,MAAA,mDAAyF,cAAc;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nanoporetech-digital/components-react",
-  "version": "8.0.0-alpha.1",
+  "version": "8.0.0-alpha.11",
   "sideEffects": false,
   "description": "React wrapper for Nano Components",
   "repository": {
@@ -52,7 +52,7 @@
   },
   "dependencies": {
     "tslib": "*",
-    "@nanoporetech-digital/components": "8.0.0-alpha.1"
+    "@nanoporetech-digital/components": "8.0.0-alpha.11"
   },
   "peerDependencies": {
     "react": ">=16.7.0",