{"version":3,"file":"static/npm.lit-labs.9eab9028.js","mappings":"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","sources":["../node_modules/@lit-labs/react/src/create-component.ts"],"sourcesContent":["/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nconst NODE_MODE = false;\n\n// Match a prop name to a typed event callback by\n// adding an Event type as an expected property on a string.\nexport type EventName<T extends Event = Event> = string & {\n __event_type: T;\n};\n\n// A key value map matching React prop names to event names\ntype EventNames = Record<string, EventName | string>;\n\n// A map of expected event listener types based on EventNames\ntype EventListeners<R extends EventNames> = {\n [K in keyof R]: R[K] extends EventName\n ? (e: R[K]['__event_type']) => void\n : (e: Event) => void;\n};\n\ntype ReactProps<I, E> = Omit<React.HTMLAttributes<I>, keyof E>;\ntype ElementWithoutPropsOrEventListeners<I, E> = Omit<\n I,\n keyof E | keyof ReactProps<I, E>\n>;\n\n// Props the user is allowed to use, includes standard attributes, children,\n// ref, as well as special event and element properties.\nexport type WebComponentProps<\n I extends HTMLElement,\n E extends EventNames = {}\n> = Partial<\n ReactProps<I, E> &\n ElementWithoutPropsOrEventListeners<I, E> &\n EventListeners<E>\n>;\n\n// Props used by this component wrapper. This is the WebComponentProps and the\n// special `__forwardedRef` property. Note, this ref is special because\n// it's both needed in this component to get access to the rendered element\n// and must fulfill any ref passed by the user.\ntype ReactComponentProps<\n I extends HTMLElement,\n E extends EventNames = {}\n> = WebComponentProps<I, E> & {\n __forwardedRef: React.Ref<I>;\n};\n\nexport type ReactWebComponent<\n I extends HTMLElement,\n E extends EventNames = {}\n> = React.ForwardRefExoticComponent<\n React.PropsWithoutRef<WebComponentProps<I, E>> & React.RefAttributes<I>\n>;\n\ninterface Options<I extends HTMLElement, E extends EventNames = {}> {\n tagName: string;\n elementClass: Constructor<I>;\n react: typeof window.React;\n events?: E;\n displayName?: string;\n}\n\ntype Constructor<T> = {new (): T};\n\nconst DEV_MODE = true;\n\nconst reservedReactProperties = new Set([\n 'children',\n 'localName',\n 'ref',\n 'style',\n 'className',\n]);\n\nconst listenedEvents: WeakMap<\n Element,\n Map<string, EventListenerObject>\n> = new WeakMap();\n\n/**\n * Adds an event listener for the specified event to the given node. In the\n * React setup, there should only ever be one event listener. Thus, for\n * efficiency only one listener is added and the handler for that listener is\n * updated to point to the given listener function.\n */\nconst addOrUpdateEventListener = (\n node: Element,\n event: string,\n listener: (event?: Event) => void\n) => {\n let events = listenedEvents.get(node);\n if (events === undefined) {\n listenedEvents.set(node, (events = new Map()));\n }\n let handler = events.get(event);\n if (listener !== undefined) {\n // If necessary, add listener and track handler\n if (handler === undefined) {\n events.set(event, (handler = {handleEvent: listener}));\n node.addEventListener(event, handler);\n // Otherwise just update the listener with new value\n } else {\n handler.handleEvent = listener;\n }\n // Remove listener if one exists and value is undefined\n } else if (handler !== undefined) {\n events.delete(event);\n node.removeEventListener(event, handler);\n }\n};\n\n/**\n * Sets properties and events on custom elements. These properties and events\n * have been pre-filtered so we know they should apply to the custom element.\n */\nconst setProperty = <E extends Element>(\n node: E,\n name: string,\n value: unknown,\n old: unknown,\n events?: EventNames\n) => {\n const event = events?.[name];\n if (event !== undefined && value !== old) {\n // Dirty check event value.\n addOrUpdateEventListener(node, event, value as (e?: Event) => void);\n return;\n }\n\n // Note, the attribute removal here for `undefined` and `null` values is done\n // to match React's behavior on non-custom elements. It needs special\n // handling because it does not match platform behavior. For example,\n // setting the `id` property to `undefined` sets the attribute to the string\n // \"undefined.\" React \"fixes\" that odd behavior and the code here matches\n // React's convention.\n if (\n (value === undefined || value === null) &&\n name in HTMLElement.prototype\n ) {\n node.removeAttribute(name);\n return;\n }\n\n // But don't dirty check properties; elements are assumed to do this.\n node[name as keyof E] = value as E[keyof E];\n};\n\n// Set a React ref. Note, there are 2 kinds of refs and there's no built in\n// React API to set a ref.\nconst setRef = (ref: React.Ref<unknown>, value: Element | null) => {\n if (typeof ref === 'function') {\n ref(value);\n } else {\n (ref as {current: Element | null}).current = value;\n }\n};\n\n/**\n * Creates a React component for a custom element. Properties are distinguished\n * from attributes automatically, and events can be configured so they are\n * added to the custom element as event listeners.\n *\n * @param options An options bag containing the parameters needed to generate\n * a wrapped web component.\n *\n * @param options.react The React module, typically imported from the `react` npm\n * package.\n * @param options.tagName The custom element tag name registered via\n * `customElements.define`.\n * @param options.elementClass The custom element class registered via\n * `customElements.define`.\n * @param options.events An object listing events to which the component can listen. The\n * object keys are the event property names passed in via React props and the\n * object values are the names of the corresponding events generated by the\n * custom element. For example, given `{onactivate: 'activate'}` an event\n * function may be passed via the component's `onactivate` prop and will be\n * called when the custom element fires its `activate` event.\n * @param options.displayName A React component display name, used in debugging\n * messages. Default value is inferred from the name of custom element class\n * registered via `customElements.define`.\n */\nexport function createComponent<\n I extends HTMLElement,\n E extends EventNames = {}\n>(options: Options<I, E>): ReactWebComponent<I, E>;\n/**\n * @deprecated Use `createComponent(options)` instead of individual arguments.\n *\n * Creates a React component for a custom element. Properties are distinguished\n * from attributes automatically, and events can be configured so they are\n * added to the custom element as event listeners.\n *\n * @param React The React module, typically imported from the `react` npm\n * package.\n * @param tagName The custom element tag name registered via\n * `customElements.define`.\n * @param elementClass The custom element class registered via\n * `customElements.define`.\n * @param events An object listing events to which the component can listen. The\n * object keys are the event property names passed in via React props and the\n * object values are the names of the corresponding events generated by the\n * custom element. For example, given `{onactivate: 'activate'}` an event\n * function may be passed via the component's `onactivate` prop and will be\n * called when the custom element fires its `activate` event.\n * @param displayName A React component display name, used in debugging\n * messages. Default value is inferred from the name of custom element class\n * registered via `customElements.define`.\n */\nexport function createComponent<\n I extends HTMLElement,\n E extends EventNames = {}\n>(\n ReactOrOptions: typeof window.React,\n tagName: string,\n elementClass: Constructor<I>,\n events?: E,\n displayName?: string\n): ReactWebComponent<I, E>;\nexport function createComponent<\n I extends HTMLElement,\n E extends EventNames = {}\n>(\n ReactOrOptions: typeof window.React | Options<I, E> = window.React,\n tagName?: string,\n elementClass?: Constructor<I>,\n events?: E,\n displayName?: string\n): ReactWebComponent<I, E> {\n // digest overloaded parameters\n let React: typeof window.React;\n let tag: string;\n let element: Constructor<I>;\n if (tagName === undefined) {\n const options = ReactOrOptions as Options<I, E>;\n ({tagName: tag, elementClass: element, events, displayName} = options);\n React = options.react;\n } else {\n React = ReactOrOptions as typeof window.React;\n element = elementClass as Constructor<I>;\n tag = tagName;\n }\n\n // Warn users when web components use reserved React properties\n if (DEV_MODE) {\n for (const p of reservedReactProperties) {\n if (p in element.prototype && !(p in HTMLElement.prototype)) {\n // Note, this effectively warns only for `ref` since the other\n // reserved props are on HTMLElement.prototype. To address this\n // would require crawling down the prototype, which doesn't feel worth\n // it since implementing these properties on an element is extremely\n // rare.\n console.warn(`${tagName} contains property ${p} which is a React\nreserved property. It will be used by React and not set on\nthe element.`);\n }\n }\n }\n\n const Component = React.Component;\n const createElement = React.createElement;\n const eventProps = new Set(Object.keys(events ?? {}));\n\n type Props = ReactComponentProps<I, E>;\n\n class ReactComponent extends Component<Props> {\n private _element: I | null = null;\n private _elementProps!: Record<string, unknown>;\n private _forwardedRef?: React.Ref<I>;\n private _ref?: React.RefCallback<I>;\n\n static displayName = displayName ?? element.name;\n\n private _updateElement(oldProps?: Props) {\n if (this._element === null) {\n return;\n }\n // Set element properties to the values in `this.props`\n for (const prop in this._elementProps) {\n setProperty(\n this._element,\n prop,\n this.props[prop],\n oldProps ? oldProps[prop] : undefined,\n events\n );\n }\n // Note, the spirit of React might be to \"unset\" any old values that\n // are no longer included; however, there's no reasonable value to set\n // them to so we just leave the previous state as is.\n }\n\n /**\n * Updates element properties correctly setting properties\n * on mount.\n */\n override componentDidMount() {\n this._updateElement();\n this._element?.removeAttribute('defer-hydration');\n }\n\n /**\n * Updates element properties correctly setting properties\n * on every update. Note, this does not include mount.\n */\n override componentDidUpdate(old: Props) {\n this._updateElement(old);\n }\n\n /**\n * Renders the custom element with a `ref` prop which allows this\n * component to reference the custom element.\n *\n * Standard attributes are passed to React and element properties and events\n * are updated in componentDidMount/componentDidUpdate.\n *\n */\n override render() {\n // Extract and remove __forwardedRef from userProps in a rename-safe way\n const {__forwardedRef, ...userProps} = this.props;\n // Since refs only get fulfilled once, pass a new one if the user's ref\n // changed. This allows refs to be fulfilled as expected, going from\n // having a value to null.\n if (this._forwardedRef !== __forwardedRef) {\n this._ref = (value: I | null) => {\n if (__forwardedRef !== null) {\n setRef(__forwardedRef, value);\n }\n\n this._element = value;\n this._forwardedRef = __forwardedRef;\n };\n }\n // Save element props while iterating to avoid the need to iterate again\n // when setting properties.\n this._elementProps = {};\n const props: Record<string, unknown> = {ref: this._ref};\n // Filters class properties and event properties out and passes the\n // remaining attributes to React. This allows attributes to use framework\n // rules for setting attributes and render correctly under SSR.\n for (const [k, v] of Object.entries(userProps)) {\n if (reservedReactProperties.has(k)) {\n // React does *not* handle `className` for custom elements so\n // coerce it to `class` so it's handled correctly.\n props[k === 'className' ? 'class' : k] = v;\n continue;\n }\n\n if (eventProps.has(k) || k in element.prototype) {\n this._elementProps[k] = v;\n continue;\n }\n\n props[k] = v;\n }\n\n // If component is to be server rendered with `@lit-labs/ssr-react` pass\n // element properties in a special bag to be set by the server-side\n // element renderer.\n if (\n NODE_MODE &&\n createElement.name === 'litPatchedCreateElement' &&\n Object.keys(this._elementProps).length\n ) {\n // This property needs to remain unminified.\n props['_$litProps$'] = this._elementProps;\n return createElement<React.HTMLAttributes<I>, I>(tag, props);\n }\n\n if (!NODE_MODE) {\n // Suppress hydration warning for server-rendered attributes, including\n // \"defer-hydration\"\n props['suppressHydrationWarning'] = true;\n }\n\n return createElement<React.HTMLAttributes<I>, I>(tag, props);\n }\n }\n\n const ForwardedComponent: ReactWebComponent<I, E> = React.forwardRef<\n I,\n WebComponentProps<I, E>\n >((props, __forwardedRef) =>\n createElement<Props, ReactComponent, typeof ReactComponent>(\n ReactComponent,\n {...props, __forwardedRef},\n props?.children\n )\n );\n\n // To ease debugging in the React Developer Tools\n ForwardedComponent.displayName = ReactComponent.displayName;\n\n return ForwardedComponent;\n}\n"],"names":["t","Set","e","WeakMap","n","setProperty","s","i","o","l","HTMLElement","prototype","removeAttribute","get","set","Map","handleEvent","addEventListener","delete","removeEventListener","setRef","current","a","c","r","arguments","length","undefined","window","React","d","tagName","elementClass","events","displayName","react","h","Component","u","createElement","f","Object","keys","v","constructor","this","props","componentDidMount","componentDidUpdate","render","_$Gl","ref","entries","has","suppressHydrationWarning","name","m","forwardRef","children"],"sourceRoot":""}