{"version":3,"file":"required.chunk-C-rdxDSa.js","sources":["../../../../../packages/web-components/src/utils/get-tag-name-from-element.ts","../../../../../packages/web-components/src/lib/decorators/required.ts"],"sourcesContent":["export const getTagNameFromElement = (element: any) => {\n  if (element?.tagName) {\n    return element?.tagName.toLowerCase();\n  }\n  if (element.toString().match(/(([a-z]|-)*)/g)[1]) {\n    return element.toString().match(/(([a-z]|-)*)/)[1];\n  }\n\n  return 'your PDS element';\n};\n","import { nothing } from 'lit';\nimport { getTagNameFromElement } from '../../utils/get-tag-name-from-element.js';\n\n/**\n * The `@required` decorator can be used to indicate that\n * a property is required. When used, if that property\n * is not defined, then the component will not render\n * and will produce an error message in the console.\n * Additionally, the name of the property will be added\n * to `pdsRequiredProperties` on the element.\n *\n * The `@required` decorator should be used in conjunction\n * with the `@property()` decorator.\n *\n * Implementation note: if you are expecting to extend the\n * class that is using this decorator, keep the following\n * in mind:\n *\n * Decorators are applied at design time, meaning they run\n * when the TypeScript code is transpiled to JavaScript,\n * not at runtime.\n *\n * When you extend a class, the decorator on the parent class\n * is applied to the parent class itself, not to the child class.\n *\n * The child class inherits the properties and methods of the\n * parent class, but it does not inherit the decorators.\n *\n * If you want the decorator to apply to both the parent and child\n * classes, you need to override the parent's property in the\n * child class and apply it to directly to the child property.\n *\n * Also, in order for the decorator to notify correctly in the\n * React components, you may need to add { reflect: true } to the\n * property in the web component.\n */\nexport function required(target: any, propertyKey: string) {\n  const originalRender = target.render;\n\n  // eslint-disable-next-line no-param-reassign\n  target.pdsRequiredProperties ??= new Set();\n  target.pdsRequiredProperties.add(propertyKey);\n\n  // eslint-disable-next-line no-param-reassign\n  target.render = function render() {\n    if (\n      (typeof this[propertyKey] === 'undefined' ||\n        this[propertyKey] === null) &&\n      // eslint-disable-next-line @typescript-eslint/dot-notation\n      !this['_$changedProperties']?.has(propertyKey)\n    ) {\n      console.error(\n        '\"%s\" is a required property of <%s /> but is undefined. Please check that you are passing all required properties.',\n        propertyKey,\n        getTagNameFromElement(this),\n        this,\n      );\n\n      // If a required prop is not passed, the element should not render\n      return nothing;\n    }\n\n    return originalRender.call(this);\n  };\n}\n"],"names":["getTagNameFromElement","element","required","target","propertyKey","originalRender","_a","nothing"],"mappings":";AAAa,MAAAA,IAAwB,CAACC,MAChCA,KAAA,QAAAA,EAAS,UACJA,KAAA,gBAAAA,EAAS,QAAQ,gBAEtBA,EAAQ,SAAS,EAAE,MAAM,eAAe,EAAE,CAAC,IACtCA,EAAQ,SAAS,EAAE,MAAM,cAAc,EAAE,CAAC,IAG5C;AC4BO,SAAAC,EAASC,GAAaC,GAAqB;AACzD,QAAMC,IAAiBF,EAAO;AAGvB,EAAAA,EAAA,0BAAAA,EAAA,4CAA8B,IAAI,IAClCA,EAAA,sBAAsB,IAAIC,CAAW,GAGrCD,EAAA,SAAS,WAAkB;;AAChC,YACG,OAAO,KAAKC,CAAW,IAAM,OAC5B,KAAKA,CAAW,MAAM;AAAA,IAExB,GAACE,IAAA,KAAK,wBAAL,QAAAA,EAA6B,IAAIF,OAE1B,QAAA;AAAA,MACN;AAAA,MACAA;AAAA,MACAJ,EAAsB,IAAI;AAAA,MAC1B;AAAA,IACF,GAGOO,KAGFF,EAAe,KAAK,IAAI;AAAA,EACjC;AACF;"}