{"_id":"@asemirsk/youtube","_rev":"27-5becc84d92b014af7aeb354ad202ae5d","time":{"created":"2022-04-04T11:45:16.563Z","1.0.0-alpha-3.9.0":"2022-03-15T12:56:49.443Z","modified":"2022-05-25T09:17:59.956Z","1.0.0-alpha-3.1.0":"2022-03-15T13:54:21.262Z","1.0.0-beta.2":"2022-03-15T14:25:20.957Z","1.0.0-beta.3":"2022-03-15T14:37:47.334Z","1.0.0":"2022-03-15T14:40:43.490Z","1.0.1-beta.0":"2022-03-15T14:44:51.978Z","1.0.0-alpha-5.3.0":"2022-03-15T16:03:44.090Z","1.0.0-alpha.0":"2022-04-04T11:45:16.842Z","1.0.0-beta.5":"2022-04-04T13:57:47.023Z","1.0.0-beta.6":"2022-04-08T20:00:58.127Z","1.0.1-beta.6":"2022-04-08T20:05:10.036Z","1.0.1":"2022-04-08T20:09:49.837Z","1.0.2-beta.0":"2022-04-08T20:19:23.514Z","1.0.2":"2022-04-08T20:22:27.963Z","1.0.3":"2022-04-08T20:26:32.186Z","1.1.0":"2022-04-19T15:07:28.015Z","2.0.1-beta.0":"2022-04-29T14:35:25.590Z","2.0.1-beta.1":"2022-04-29T14:41:46.595Z","2.0.3-beta.0":"2022-04-29T14:49:55.590Z","2.0.3-beta.1":"2022-04-29T14:51:54.721Z","2.0.5-beta.0":"2022-04-29T15:06:56.406Z","2.0.6-beta.0":"2022-05-02T10:08:24.927Z","3.0.0":"2022-05-02T10:21:51.082Z","1.0.0-beta.16":"2022-05-06T09:17:22.995Z","1.0.0-canary-24-22.0":"2022-05-25T08:46:29.588Z","1.0.0-canary-24-23.0":"2022-05-25T09:08:04.447Z","1.0.0-canary-24-24.0":"2022-05-25T09:17:59.881Z"},"name":"@asemirsk/youtube","dist-tags":{"alpha":"1.0.0-alpha.0","latest":"3.0.0","next":"1.0.0-beta.16","canary-24":"1.0.0-canary-24-24.0"},"versions":{"1.0.0-alpha.0":{"name":"@asemirsk/youtube","version":"1.0.0-alpha.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/components":"1.0.0-alpha.0+28ce15a","@asemirsk/core":"1.0.0-alpha.0+28ce15a","@asemirsk/fclasses":"1.0.0-alpha.0+28ce15a","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"28ce15a6b1c49e6f984d59ff1db29bac050fe78d","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-alpha.0","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-40GD5OdCUIgBhCnOIu9Tk2EDNvfIe4gVYbQ2qXA9uzdLDaOn/wI7QUuVSHoTtNMVVibBn4uvf8UdeQGCIkbTOg==","shasum":"45c096dbc933ece4fa096c1328d2bc73e0b995b3","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-alpha.0.tgz","fileCount":6,"unpackedSize":192772,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFNk3tb+MbY1QaPgef7OxvvrHy/pHzcB2DHV5se2bfbbAiEAgjUoizpGfc03huwxnUsmQiDP5xGALkXQAbJBbCBZjII="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiStpMACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmofgRAAlIqOKa+n+7zRAGxeVS1XHeKnfTQz2uR3HrAP6btTiwgtgcAW\r\n/SofR653cyfEGj9ChMTu45yjklHTQBG0vr4Nie5hK62MLg4zxpjtxS/IoVaR\r\nLTIN34E3MvSpyFnizEhSG9LCZrKJTIlrqswe1ISGix9w9L8M/RxZ/J6VA6PL\r\nPwT+JYL8kiFSJNoW4nECif28cobPFacWQZCaUFDCmk7JJPv2b0wGE0JnVEll\r\n4IqOMIZmwpjizaHKpGPf+AiaUvmClGTtqZGRjw24c1sSeXXm/ieZOIzlOdGT\r\nbKwVYrQhd6zKJGgkO32DEtlVm0PMdsw8L7ZQLIkEBSso3XIflnUtpqw7pb5E\r\n+LkMVJUS/S1ugwuf64HuAwh02wxD0SZ2ui9Ir2P05LxTpzUz16O6wdP6cjOZ\r\np6YbbTX7TsV9zOsVnadMsk2Hm+JsoiIphtDM5sfz2+J39Eju2uxwFNwFwd7A\r\nVMNg8H2Q7iwu2nx9+UmZ6MqG0WO8ICGkIckXB5LRKtqLzXU8hDyzAQgH7U5H\r\nmEzxN0vJDXfot1SZqMO8pPsWktCvmDVchiwUUOFcvkEQoe0NVEo4j5dAhMTc\r\nZrziV4JZXlVA7B60cVIbkp3+2lOLLxF0TZaeAmV6xliLDMLBPCtzzOH26L/t\r\noESlwgHtADhtbYDx6+GW4kDvTcksoeN5P5o=\r\n=QPKu\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-alpha.0_1649072716622_0.4760651056629479"},"_hasShrinkwrap":false},"1.0.0-beta.5":{"name":"@asemirsk/youtube","version":"1.0.0-beta.5","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/components":"^1.0.0-beta.5","@asemirsk/core":"^1.0.0-beta.5","@asemirsk/fclasses":"^1.0.0-beta.5","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"e6beb3c3e2c8fcff324e0e741ec5746fc55ec312","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-beta.5","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-G5rKMeS1+AAuhCtBdMlakL/QBot2HxAmy2sIT4mlZaet1ceeYMX90eQjNuOO4+3qpqNF8Gbpew46JcAz1XJaqQ==","shasum":"7b738e5c6906c954f49b4d4df74efba30f3f065b","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-beta.5.tgz","fileCount":6,"unpackedSize":192739,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCJaw/V3vCj4ESXOFmJtx7cSahkO9YTf8DP6frZELzlDAIhAMtoLzBkua8ha5U6+3ACBgC45sgIqOg6k1B5Oba6L8qn"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiSvlbACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpjTRAAooeEY7VRkl58W4Qclg1TdNdi339sWIEBEEZnI1SPOGoZMHZd\r\n49SBxzgpaJ7W5WMkvCGSYS7Op4+ptR8CSvqo80LwGd4iU7XJYwK19/ut6czM\r\nSNkvFgWYvJLkXQWOZOk/attW1iiEUS7vrTlRAEmZYI0ZeMXv/88pPOK9mb62\r\ns7GGBzJzgVOCa7AqNGDz8jWBs0sIRywrmzbHFejnVQ2CpD74OGhI1NtoNDhX\r\nGeSnVtNjDqAMkwnjHFcbnupZ+5LwGtvaY1RhPUw7Y0Li6u+AlSIOZLn2aepr\r\nTky3zMT/WTiLD06HhyhHnM2kB8lJkAEwY8ESSUUjvmC2FtfOijTD1Y09K2wk\r\nz5B+FJNYgRZWCg+EYOJwaF5F4+MNpAU1mYLwJ0hML4uORWdql5PrsXRuIQoc\r\nCTyXSmGg6BJTL6JfjStCQIibufCUOj6wICP5xCZqrEbAlMi19OZbkV7yFrDo\r\neRaAcqT3r7FhVup3/5+GJ/kQX1Z+XYZ5EJFbKqtmXfisNhUQ76tfWkZ1a0Fe\r\n+3klve0FsTBhpIyIc5K48gn6htqcSPTIpRJP/vXtrecvHyrzvciIZXfLEx/h\r\nCvba+DVklo3s6VTo3Fz6POMDmRGvR6/dUNwExAoiCVitc4uyRdq3Mzb06Fg2\r\nXE6ZP+zdLlqMpUnRbfOoLrij3BbrIHdD4V0=\r\n=RQqu\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-beta.5_1649080666843_0.14071331330546832"},"_hasShrinkwrap":false},"1.0.0-beta.6":{"name":"@asemirsk/youtube","version":"1.0.0-beta.6","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^1.0.0-beta.6","@asemirsk/core":"^1.0.0-beta.6","@asemirsk/fclasses":"^1.0.0-beta.6","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"cbd97725152f2362bb86e6d4bba02043e3c4570e","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-beta.6","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-/sC6/r6ItFCt4fy+R/dtXFw+g2wtlZGMQ4K/JnOcI2iPLLWljwDneOT0yy8Fw5ACupNTHM5y/o113RrL9sJi3g==","shasum":"038035de545a2196e4fda9e398c94ebb36f26da6","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-beta.6.tgz","fileCount":6,"unpackedSize":192777,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBngxw0408069gg+ciX3kenrGB7rNAP3ykIv7KfsJP1cAiEAlir+pxMl4dUsztsTgrVMSu5WD99jCpdsBv7x91OBQrs="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUJR6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoY7BAAlQmi2gTz4+wE5lcSUDUERE3CPovFBVuQKsoEDwF/VagCJbrg\r\nMWQ1QYSsvYsPCSH1aw1+iZAUrxxsUQLuzCgSgTu+oOAclvGWW8ditk+j4xKx\r\nL7BlmZTY64AdWoBE6OocmXruhjYeztDJo1fYUti5zJll7kuLqSPn/lM1M09L\r\nopCng5EiTEfB4Kwj9bN29oQtaGkRsZY2HRbb7y7yWu12o5M1TPrZFEm4jIWm\r\nLpijiH8jeu+RwKWE5D6Rw87o3KgqAtAscCqa8dXgeyn6jScZVKql/l5iJFZ/\r\n8sv2GuwIm/6bpdfFdd11/gdenCAkSokCVvXJZm5QJsUxLPZZqWz27FNb5fq5\r\nbJI7KV4jIwjGNdIK0LcuA+Ts2eN1HstW8hDrRgaRPvH+zXN+1dYJfRNA1Tz8\r\n0EgEdGiVGia8jtSDPMv1aQ7pZO4CJbrQYD9YinqSe5H04TZMcrCdixiReX6a\r\nHhDENRRpfqzw9VIS9Ya+wdUqYiOf1FFBU+Kyq95uqbXrmEYRts5xxpQBAfiH\r\n9zjmhIwNmDg8boczfp77yHPR+d3I+s6XDHVxs0HRwbF5AwNKPQN3loc+ZcRB\r\nXNildzf1Movhq22Eu/NrK+M7M/BWK00NgYgoKehttkR8ap7H7a9ZGEQC2VOL\r\ndrMo3WV3DrY+mdF1nunIQ0/1rXucvJdcGzM=\r\n=V7YH\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-beta.6_1649448057850_0.25819542097226034"},"_hasShrinkwrap":false},"1.0.1-beta.6":{"name":"@asemirsk/youtube","version":"1.0.1-beta.6","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.1-beta.6","@asemirsk/components":"^1.0.1-beta.6","@asemirsk/core":"^1.0.1-beta.6","@asemirsk/fclasses":"^1.0.1-beta.6","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"dfbcb3dab592c76bd48c138c275c1e27fbd9ca1d","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.1-beta.6","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-gGjyzmH9QSFQef9kKc9CTy1OrlpCfSn9IyY83dCSQQwke6uwEq9F35tO0Mh518ZRi7G8ghMpPXmAyknqvauE5Q==","shasum":"82767dba24a5cff0565a7085281dd89afa9e0cda","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.1-beta.6.tgz","fileCount":6,"unpackedSize":192777,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGRhvZPjBhkJ4Apsjfd4vHpnNcoCLMVxC3by/B4ZHyXKAiEAvZ5LNAUY/ZBdWeCvIAX8QbbGjA9nF2k6bY4OinAEfZs="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUJV2ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpxug//aVrGhGJU/2BIziZXZpIP/K+AHPfw8UiYdS8/Iq8Jgk5O5Snl\r\nJ17gNSgUO6GgidkT3xYR3eMqDJU9FUq/AsKF4fETvLEugXxC3F1JvkpWkzpZ\r\nmxGBivNqkhQBoH0WSxMORmH6TllHKzaXcMa2XFYaWzfvQ9ZiwxfaHUGxI9sT\r\nblGXCweOm2F3WDhaVsU6nHJBSWnBF2qjskHVzOn1/82hqC4fQ/kqntKlU549\r\nfXX0/YVCW0iDZwopowoPuGju6pc9kim3qIlUmiJ3bxd+SE89DFlL0aURzZs7\r\nQTvlXcLvKaQJoy5aBp6FBeYmDcp60VFRppE+Lb3IjGGD/OSeqCmhpbRYwPVK\r\nNUJy2OH2u4qOi7o5CUN5WACl773ooKcm+Vd3eieX6io+xZVJxrSBlZDBLhJ+\r\np+y6Q4RGZfxN3qyl6FJcmh807QDC6EBGxOdKKVJLYjvhwILAigVNv6JXF8Rp\r\n61rNSobh/+UZ57ckW9pI0xzJ0tQyYI6bt1GpAAJIVvi3SQSnbt8l+WUOFQNx\r\nbV6jRaHeb4VdeEsxrIRKhDc+0IjMs1wTe9vtnwBf7hA3kmCJJJr8F0iD+T0X\r\n5ZWR6f07FLLdcDG7UH4eA+ygxlkv4pPSmTWrHSZNOua7ddLoXpEdf6TZ0HL3\r\nt3SKBhZ5T8TeOSr4UsVunXkk788tjFghVFA=\r\n=jF9f\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.1-beta.6_1649448309799_0.0591047977367023"},"_hasShrinkwrap":false},"1.0.1":{"name":"@asemirsk/youtube","version":"1.0.1","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.1","@asemirsk/components":"^1.0.1","@asemirsk/core":"^1.0.1","@asemirsk/fclasses":"^1.0.1","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"b943f745d8dc223a872b770f79f3e0db78f43486","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.1","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-wGJenYPJem2TNyRb30n/hLhC7/zlmJ0girUHImIt0WdQ1tyyOtD17v2RsDMIzA7rrDv7BYVFemDaSV4EH63zzw==","shasum":"e1bc7f5924a10a8ab7998ad902b9d212feca7b74","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.1.tgz","fileCount":6,"unpackedSize":192742,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEtXBqPAO0PvpRhTn2NjI2nfxtXrWAzYiKKL04pfMWGIAiEAqGe718mVcLHAtV71VnOxuts1EkbBRyiADFOcV/lhfFE="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUJaNACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrX7w//SAZyHxcRhlFMDgkplNhimbwx42ZE9S5FgZ6hjctFHBesOw9g\r\nxz7E4d2SDFiYBMM/DMkoOHdXRRRkGRtgHSUXhJUyxmSVX9YTC7svaMkSNArI\r\nALKOXFeh7xaoUTxFzu3KxsfrVpe+AD9pNJllnv39skjQrIJRwvT21zhAVYx8\r\nRXFVuat6aVU9W7CmjCuTdtY8zbo53LoOGcnXtmPTZZgtFvMhLZcjT78JsgmW\r\nt2jHDWHcSM7zHF/zE/iPmKpV6AopAKSIEaNLDg9Nrf2L+ZRduhLF1oPBW4A1\r\nyTKceU5SFhvwIYGyfKgDtU9ymv1QiJwZmgtlRDpqeU7KVGcM1qURa5PEufTm\r\nNOzjBYB2wfWq6IhOigXcP5iRy4YSBMRntFLoMTahmRpYaRlQB/ZS73kOGUZJ\r\nAMLR/oTedWJYUUpzioL1fjwMIosRjZKBAOXAQq7NbxjbNvAhijYcBwdN6FFp\r\nfmPNRaRj3QdD6hoVut7R7bOM1P0l9S9VLXY8HbnAsluPK6vNiJpaweb+Z4SH\r\neM6P6g+ZUERUmnanR19A/OjBxLJnkHpMhrDvya0khsr2q8K6cAVWfcr/rIbu\r\nr5afvOmKAxtrmR5nTF2FXc5W36bgZ2WGBh5I0aNndvrDoa9ZmqqbAmyAoIP5\r\nMQRg/ajVKSxJgosOuzhzC+69OtfWFIDR98o=\r\n=x4dU\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.1_1649448589687_0.9027572703273821"},"_hasShrinkwrap":false},"1.0.2-beta.0":{"name":"@asemirsk/youtube","version":"1.0.2-beta.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.2-beta.0","@asemirsk/components":"^1.0.2-beta.0","@asemirsk/core":"^1.0.2-beta.0","@asemirsk/fclasses":"^1.0.2-beta.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"da62659a8fb42aa89cdc8cae2f148c8dd8db5dcb","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.2-beta.0","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-fEL5dETZrRd91Mc1r4fHvNIqtWWB7N4I7kC66H4QZSHYV4YzE7jeDpZ115XNdKE2pdk5DADiWNJMuHBBoKVnxg==","shasum":"f688aabb172cd344ce513b5b510db02c45dba710","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.2-beta.0.tgz","fileCount":6,"unpackedSize":192777,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID3KgYyn1dyR80VyT4HgHuHTRryUNSEMLsktZwP8l720AiEA3Y71iu5PHFqybS84BvDFrIC0lcVZ6y8ael7IWYfWZZ0="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUJjLACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpGOg//ey030oa7s6xeoo3sqlcVK57gciqb7KhEY1qvYfjbcVImuxKR\r\nQJ8jGYEzY0u0X0IT+DUXI50J7k+TmsGrnmlKDgPrG0YYCeB+ARxzj2xDTSA5\r\nwRXV/5Qem1aMa4Huh2T0Bb/TV6ZX7wNJpAC3p9QmpxOYYJQXPKGmJAK29nrU\r\nX0lTZdKk/sLS/O92WxIvTEUEvPKiU51GWiEgBI0kRDgZwvUir/zjtOvcJ3Yw\r\n1XWB3wQnv0IrdXe2SWkGMuFY59+wjVU0AkjULXqJyfPFm2tEJTVtVsINbD0r\r\niZ1P8a/5Be3cxdAqNjwdUw9oNzpyg1GvGj+/1y5ibkTrv/BGrOCUqGVd078d\r\nyjUCa7yyiL/YBs+d+ccH53wnM11d438slhkIsNOe7X0mZtnD7iwcB0YEXhj8\r\nfgoPWrHcyHGTlh/jfcbq1xJIUXxmLrZe5wlX3dSpPy/KMNVSBw/K5DzRNKQJ\r\nin+THuuzsk9DnnYiap5DOOPhPSzYdfPEr5VKApOINZpuPa+UQc0/sMkj82we\r\nTAdGhkW4a8R8Ckruaa4jMv505/TvS4TzKyOnttOZ1mSnCRE16Reak2zdAXUm\r\ngf99xktb5roC0GekYwqZOxgMLIv0JipVYM6uwZZSL8Z8xT+wtn8y8/O3OkA0\r\nKcbXi5us28jKqBzZ10ZK6XzE923ICrcJvMI=\r\n=EdMI\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.2-beta.0_1649449163224_0.3384617500386"},"_hasShrinkwrap":false},"1.0.2":{"name":"@asemirsk/youtube","version":"1.0.2","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.2","@asemirsk/components":"^1.0.2","@asemirsk/core":"^1.0.2","@asemirsk/fclasses":"^1.0.2","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"19cad7cb078a3029c7b40248078ddfa4d413bdcc","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.2","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-de5YuEkAEC8EVXyaI3tvXYP+NFNojkLv1AvD/LLQNBPS+krErYyLGl2C5Rmu6uJn0PFLSnGRGiBx7oWG25rBMA==","shasum":"2ba88df6ab43ec4e5d0aabb398c3f1ffff7433a4","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.2.tgz","fileCount":6,"unpackedSize":192742,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF7w4B6LXFMB0uw2bNZSnf442sCbfVwGsB0mgPl36E1jAiAR3earTSQELBrQkl3iaN5IJKeNiQTS2gAXVCBAv94R8Q=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUJmDACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr9hg/+IQI+GCJMeZL44ODf6u57Lp2+GDT/2zKqCm8upTOVAuOGFzAY\r\ntCATXYBo5JlsSwiJOyDS/rN+0DP61wObttxmPZNgomw9DLmmhrTW13EJezZ8\r\nC4xnOVx9k9k4kSljkeDySgm2js6HbVGnQBMZvRHnwLMRU+MJmgeWBFWhgjpl\r\n64KItsmgYaj4tHgpuZ3F35U0rL4ZA1bsEJlURvxeT/ltB6c/dExdLqs+/NLS\r\nl3jw3XIHLzQ6K5qhksVMpMFQK60Dduat27rA6ue9TtopNhLukq3z13X/ahts\r\nJ2EcRDytQgRg+BUCmx+MWHw5EUCiHwGG5xzZuWrSNgYhKeHs/2PFPn2/gdUy\r\nd1wDssnQyr7R6k0h6HXkyFqSA2m89o17gJZAC2umRnb+qAknKZO1jPNQKd/0\r\nKOoEdMCTNtlYzLYyrTt52RLm8yS/CDJ7/4gdETLgaAXUubWpjrGkdvRbWdso\r\nlMrIYZV5jICR9u18mhFUxjD/J2zwyqB4a+4kqYh+zMpCxGouCtm+VkKA1Q2S\r\nerE97xc0SQwbZ3WJBqtHIO3OBv5u8hDB3IWOVsEH5E0NvrGfnJC//oFbRTz/\r\nEKm4TLRDoNh54TIcuBSQcxtmhtlNnEMcuQABAz2EnyqmkXvNfqK6gRQqA3jY\r\nbqtbtnMj+d/luUp8kMGLIQ6cFRWJrCJNmPk=\r\n=PWVG\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.2_1649449347738_0.1497744793713245"},"_hasShrinkwrap":false},"1.0.3":{"name":"@asemirsk/youtube","version":"1.0.3","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.2","@asemirsk/components":"^1.0.3","@asemirsk/core":"^1.0.3","@asemirsk/fclasses":"^1.0.3","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"b46d91ae36b8631daaeaf0e17b4197086a98c2f9","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.3","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-E1Xs8pNgQJCP/Y+6RBMZ1SAuuPo9b0AjjHC0YWLezYzVCQ0ifYln3t/skl62rkQQ3QanyINy5Pdh15dNhHHMrA==","shasum":"d4083f44facc6512e81c84aa69489d8f981333be","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.3.tgz","fileCount":6,"unpackedSize":192742,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIESr9eHgthLeFJfxCBMrrOhDyYJYBWlWYnGyfuUMJQXnAiEApF5BmPF90KEYKtEuNC9CTYon6BI6CgZ9UWnNdWTEJiQ="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiUJp4ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrPyRAAjncPyeIhAi7a+ImkHy8Q9PtjJecqhemavw+dRCWY2XkhTbYH\r\n7+NtyBVzW4eqwR/fR92Gz8DINLjhO4J0uK8Ioukm8Yg0Fr9L4dCWW9JUtY/7\r\nWy+d5NclwQneXFseXfpGOYZE9XHPvDTHHULb/6Kf6E3XnA/YRJk7G+Ev8Qtf\r\nJOHGitMAvd8dFTb9oGU2+QwyYfTkXekamD29gx62qdt8EYiyR2I0p6tUeL7U\r\nD6AMYnQ09lN0aRh/QQVO8E7LqJKaU8wSA2k+XkYWNpwJJxnzWPTez6ELRoQy\r\nqmKKBALAoqJIYQlwde0N0D09CBvJMlcYWINFXS6BeiGeKwxW/I99Zj2XR3RH\r\nllH0lQXb0bitbaDrAddlRJnrr4xokJlSyVMpG2MgstPJIQ+t4AZ/jJZUmBS7\r\nN68eg0p914217TgtbzB47gToNbBMPwkWyK4quC+6d7HMvgvoOVxVcnLl45Fh\r\nCYQZkO10HIILgxDTZ6khTVF/Oj0Udt31KBQuxDiwSXA75S9BH2fHzkLmrrCB\r\n2HGupcQar3I6J4zPaNwSI52VZIoa+CSmpOZ6rRtPpjMBOlpaEn9uvsgpdy3r\r\nNcskl3Dv83R35jdES/9O4O5BMCi2DkeELqpE0f9a6x/njTa2dFnTp6cY4WcZ\r\n9+Tvn0AiGDGg5LQlLMe9ZNXsdVYOQDYDxwk=\r\n=If92\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.3_1649449591987_0.724849064145894"},"_hasShrinkwrap":false},"1.1.0":{"name":"@asemirsk/youtube","version":"1.1.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.1.0","@asemirsk/components":"^1.1.0","@asemirsk/core":"^1.1.0","@asemirsk/fclasses":"^1.1.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"e767bae774cc17eba5d92b638b7628cdc9236086","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.1.0","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-mRDqCvDdPBShoebXhFG9Nwb7Kz8ld1ivWOiuI4z0A2FB3g/rw/QS35QnoUPVn1LzWRbR1qUmsGhvNta5FxIy5g==","shasum":"f493c523700468ece98159a1fd3590eac546d717","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.1.0.tgz","fileCount":7,"unpackedSize":193576,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC99YY55CzdTk+WVZjsoPDnFkX01tElV7dzJkv5YAtI1QIgEwPuOLA1VsnzyIaWJytkiGv7KUC8kVe1TsKRwc6fomA="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiXtAwACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmosqA/+IIHz6ZIl6G872hGKI6cBUUeXwHtiMbll/zXbLRsuBSvpGO6h\r\ngKSuxKukhmeRDCia2Md3IsggL8zC4rMV/M87uzBPb60WgQYuOlQX8onpvxFO\r\nibbwXktKjv35oRdLBAioCSEcCZVTZpjuv92ypNTjh4mmNwYgVGUeEA6oZtKI\r\npQ7cxmDYgm1ddHgiSuisdr7ekC+smLHu4DNGO0RBOFBBH2HTeIGeJH6VTHyG\r\nKnYya/+yjIv+v5aUyTaOqdz9TLCWAYNLZg9DB76iQeiUMZRLpmtRKxIMA8FQ\r\nugJLqqHXhaqhmT4yQEx+FriI/4ix9jRKLPtjQficADn2iTEa1PPeSpM9VJAw\r\nBEZPhZiL1p8Of0bV3rJeGRNLELdXfKBt04Q1Zd6W1tebWqY9BWHK7jmJ9BPp\r\nEAUL+HI5d/ISUWeJ8pmQV/PHYdRiyGqnPmBO+2EaBX9UQu3EtZQVMpeqrBNU\r\nf3vHq8BkQ8shzAtw0XqlruYr9Pyz9k5FS4UK0tRt14vK/D/m0WxDbbuizY51\r\n02UvjGMCq2hLVajr/AS76w/qnD3r2VkzIudOlfsL+2LC83hNxaX5iuuA+yIM\r\nQVdSE/rq23rs90peaLA4B/nNqXseJdy+7T1+MwZqLfu6XwKxNBSX/OHzGBXd\r\nAtaicunC3DwIeD8cgmB1KjuoHgWtX7G7FOE=\r\n=gWze\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.1.0_1650380847834_0.17097732746883176"},"_hasShrinkwrap":false},"2.0.1-beta.0":{"name":"@asemirsk/youtube","version":"2.0.1-beta.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^2.0.1-beta.0","@asemirsk/core":"^2.0.1-beta.0","@asemirsk/fclasses":"^2.0.1-beta.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"2aebb64eab582696b080b48c5f3475c2759f6408","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@2.0.1-beta.0","_nodeVersion":"16.9.1","_npmVersion":"lerna/4.0.0/node@v16.9.1+x64 (linux)","dist":{"integrity":"sha512-jY90gqxS3BGZ7me05ITOmo1Zt9+H6Jt52XCyipBrhudBjjSh5WtL3b7zpG6DdbsDwtsT545hdgbXhniHTPV/2A==","shasum":"9bdc1374bd8c7d128dc49d0105e3f67bf0a35ffd","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-2.0.1-beta.0.tgz","fileCount":7,"unpackedSize":193611,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDcNf2lIXNy+AsRusAP9Zcq89rwM9xIvSN+VewMRGPcswIgELNVFBNdIj1qYGO7vZtdPvvzMpvDFrNX4BqocQQYQRE="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJia/etACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoTThAAhCKmj9O2F1RX4vipQxHGD9khxUCrBuNAMHxG1peycPGuSXn0\r\nAz26YXzC4EZ/w/fkOKZnBoznE9rda0xKoeAdFyp5f/SAskv+hS9bix1rhydm\r\nOjMPtkUwDdr7D8IU25LDkVj97NKbmOHrzJTEn6P/bd8SM1Vz01GjCoRXIIDy\r\nwPN0oPOBGlXN4Ezp7TKUh9MzmSSy+OcuWJPJXXsQXr9jpCYrH3SF8voId31W\r\nNTCWNnwEhGWpOpH97QyD8js3muQ0U7IADr+5Or8Lk5C3QZPvKPbtl3WXk5V1\r\nhXwVuKaclcBN+eLd5LYUqpD913YaQ+tpgQIr6LF9EPFZ1YUFPvEX1WsGKOcD\r\nAc189kUgTYTlcwEmC+4VLVGkRulEKar4/yidoR4v8HhL/aiqKNict0HPMtuk\r\n8LsKsHQypll/u4B0cbMompl+d8GQGHU1/soR9eDQYz5XXGF5PLI5qGVImLd0\r\nSaffVYYn9Bf8FM56oWNUMvE573JTVyLTAxq6hPyVkVb00CA1M83LCbJrXCxY\r\nVURPFRoYz6gSwl/OJwZICiGHU7WJRX+bE4D5lvY+Bc6ElgT9Sjl9pfW6jZxz\r\nleT54JJFeaw9aWSrn7mwGTFiWxSBEIcWdNBcWOogCMDGmz9lAfgQBlWnQxUK\r\nlEohuxQngWKHXqkL3zkhb3tcZfWFGdKFDJ8=\r\n=hIw2\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_2.0.1-beta.0_1651242925406_0.5310962662209695"},"_hasShrinkwrap":false},"2.0.1-beta.1":{"name":"@asemirsk/youtube","version":"2.0.1-beta.1","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^2.0.1-beta.1","@asemirsk/core":"^2.0.1-beta.1","@asemirsk/fclasses":"^2.0.1-beta.1","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"8651151ffab8ce28ac9424085c9325e3485ba177","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@2.0.1-beta.1","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-VAz+oBjABKl84ALtbnrBaY98oboKNXxlbzyqVWPLMcs2osAb+zWRMRIxw3axySwdQAs2WTAda1h8N47x2vbpaQ==","shasum":"19fae3aebf3a41b931338f5af7ee22a486f8b94f","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-2.0.1-beta.1.tgz","fileCount":7,"unpackedSize":193611,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH8teCbuQBTfS8iywrGm5f95oVTBNHpUrzIisiBrYu5XAiEA32Cz3VVrqeyAqnKohZU032PIxjcrylLTRw6D5E264o4="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJia/kqACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqdEA//R3hfa4ODSKOWfccIkNAZMssnECOEbifybcG+VA656XSDbm+z\r\nWOhNRO2x9nXnucl9gBcjC4lRIpGFo2Swlpx0d8vLhjG6Wh6UGsnVVZZU25CB\r\nzPmBvDvHHXAnO9JADcbFwkvTqIHB2yzQE4MiUMM2Bm41JMIjUEA60g7sqYdC\r\nqUpCOsY6Nx6WldGqvvDqWTAFVHKs3U5BxnSvE7FWwX7Rj8wvJqtvxoRIkwRg\r\nT/denLbFmPB8/rq4YmDAVFAgZdOYOlh5bCSMlc75qJTM0QKrHM//duH7tt5M\r\ni3muVh+qO9SPjb5qePHsW99SlRw91cxAmbFBJsXOUuyDypGUqZW8PVK9CN0E\r\n9clj8avLUKMqCKvggOxEkm7oE1J2QYojGFvoUbeWh0x6mOybT78qprIBYrdd\r\n087W28CN91CXIF7HSdxEI0RIgXc310oDyn11FNMMmzFywjDUUKImXYFjtaf2\r\n0mRndejvVj/+QKwNsEpSan+SCStqBpFYqsEC2i3HARqqTDMlpE5PRna/tObn\r\n31sj2ta0x2ylQhQSvpW9idVPOAXRooFCmxvygiANOkxYxZ5I4h2m1I3CFMJ1\r\nW1nvz0BI3Hw4/oKe9+zOG3L0NAHiAJEoqP5CQzrd+2bG9jyH1+k3vq8c5a5r\r\n3q+0W0osyj3rlvB8KZu9KgWKjtLU7FdguXc=\r\n=blb/\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_2.0.1-beta.1_1651243306247_0.13160610538973994"},"_hasShrinkwrap":false},"2.0.3-beta.0":{"name":"@asemirsk/youtube","version":"2.0.3-beta.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^2.0.3-beta.0","@asemirsk/core":"^2.0.3-beta.0","@asemirsk/fclasses":"^2.0.3-beta.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"95b0d427717d1ca0bfedc22f3f23323acc223e94","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@2.0.3-beta.0","_nodeVersion":"16.9.1","_npmVersion":"lerna/4.0.0/node@v16.9.1+x64 (linux)","dist":{"integrity":"sha512-tWPonplYf2hRtG5QJDCMmeLVPg0dohRzb7pisZo8DwtgM8M5BbhKwSTxVXno/7mlWsAwaGDvjKgtvrPUGeNfQQ==","shasum":"c77e30f4fe0ec705a5b40f5d1b31d44f215cfeac","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-2.0.3-beta.0.tgz","fileCount":7,"unpackedSize":193611,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBqklh99FrDTieU+T0kL9cU9nFttF/xwz1HVZ35soRApAiAtfM2L79RsBQP5BqQiej6TVE8xhSjkagdTHpLdeXEEOw=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJia/sTACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqYVg//e1/sLjY9rvJn3sw0Q1IMVjBdRL/YKsigkWcc/nsWTiM0MaeR\r\nOUdon6WXZgfFcX8xLRdX9UfPfbljMPkzzu4WaacYoJr7D9fK3KOV/zneR7FB\r\npcxxNXoLXcgurN02y4MP9XZs+Vs0oUmZsKrBe9iCv7sQ06HbkamYFbuhAKIv\r\nZn/enejxXSKIIav2iTAwUUHHcX/KJDLl6AWduvk90/2p4WjgbAiwficQbtzP\r\n5s3ndX+4LIbRd+blLNLAsV5WN5XSIWBMQoRp12EDIsF7kNvtzxnakr8I5/Jc\r\nvvazROU0bt9ShwZWrnQ1WIXHmrinDv0rLqrzZ/A/JLRzOwhJQX8NeVVARB1v\r\nl0sCwO5/pmCBR/ZQzwbL8XIUyJ+xRMuqLwIEYpRz1WF3rsdTma7yr57VyDJM\r\nLqU/9gGbIQiTOvYJOPpnwdGeOVCVTcDDQPKDvZqv/kKj9EuI0tbRZO9p8E69\r\ndFd3AEy65ahqIe0cmSr6UH+tLdDI/+H8UeEueEv++tSQHMNLbhRQRbhWNtnb\r\nkN2iKwK76Nz2FKOZzzZHhGJBoUhKtoduFhe0ZkuQpnczSomkRVLiXfxLSoW9\r\ny5QG4RfCjAVuxE6BiuPMh3sWwtIIPVftzGZLt+S4F/C7W3JcopQXHRvEiRYh\r\nknUEeTID8fCf/rjzi3ViOmIUEaEH7fr/wdg=\r\n=l9tT\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_2.0.3-beta.0_1651243795401_0.6067784257597055"},"_hasShrinkwrap":false},"2.0.3-beta.1":{"name":"@asemirsk/youtube","version":"2.0.3-beta.1","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^2.0.3-beta.1","@asemirsk/core":"^2.0.3-beta.1","@asemirsk/fclasses":"^2.0.3-beta.1","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"1be4d3bb997d192b34b946c04f840a2a82b34a5b","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@2.0.3-beta.1","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-K72C3/EEouJkMSXv1bp6t4BG4NU4fZMhwFfgz00xWwDJc4tzm9vCjOsKyj0w1LWn1yx1cn0ztEAarlWSf1qRFQ==","shasum":"dd1d5bf151bc9a92a5d055dfa1fed24caf572ffc","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-2.0.3-beta.1.tgz","fileCount":7,"unpackedSize":193611,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIClDVOazSUUXW4PO6rbNJP/QBF7P1Wl4oyitVc9Cac1IAiEA2adoQCAb2+O1ZgWDFYn3pCiHtqZKaF6iyBfWxNEPJdw="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJia/uKACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpgVA/+PqN7sAZSaAs+sR0wsZvbvIFMCPTLdnQHS6MCF7yAG+Vfg8GG\r\n4AzIk+tirb6puUGbRwoLfP7MmuVxVJnvYkPJkDoSTUPRIiLGg+IW8Wk3CNbh\r\nHkyBmV4kGByWDR5V9o/UJoC/2trUGz6YSgAFhwSR8E7YXMnBNltWYrpyQtQA\r\nIYRfkF54A7rygP7L2+fusd8PYezzCF6JTXYOebu67rvl1in2Ey0itSttQPOE\r\nzJ8p49TF3+Tqi95ctGpV5wjml4HYcQnubJ+aswW7fHblZfwlVahXraPqo5HO\r\nMPs5YYyqmRsWgzpYEL+mw+F/VvvMzLZ0e88TwBB1EWsucQPr8iQPeeg39Ljh\r\nYxUkCR0tOx2htvh8F9W94/B6ukwJMlfmNL9JvZqr+FfzWpvWjC8YVGr3OWXH\r\nvrrNGwXYbsnH4xpGcjOurgzsx4H/f8djBqGmprzU1T1W/dV49z6k+ibHvmrW\r\nXnEPjSIi9KunIr8KB5hIi3m1F4daRaBhOh0jq2sxyJbolpav/mhZJXF228hF\r\nHtqJ8ctaNi9MlG+xjxWV9urNjfV3m1hpRadel4U4m7t+4IBPVva5aWKIvAV5\r\n1AKQ8s0amEOFayZBVvzXxuabghHw4qU7Pu4rhnq38uPTEll6S/N8rUjx+qxJ\r\nO8c4noiiLoXUUinK0Zp8iJSBFjlzuNMoESg=\r\n=2Mua\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_2.0.3-beta.1_1651243914510_0.2884494829669495"},"_hasShrinkwrap":false},"2.0.5-beta.0":{"name":"@asemirsk/youtube","version":"2.0.5-beta.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^2.0.5-beta.0","@asemirsk/core":"^2.0.5-beta.0","@asemirsk/fclasses":"^2.0.5-beta.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"9b047b3a72ac828e21a6e31cb9a8e77e5225f5c9","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@2.0.5-beta.0","_nodeVersion":"16.9.1","_npmVersion":"lerna/4.0.0/node@v16.9.1+x64 (linux)","dist":{"integrity":"sha512-0zZMk+N8R0nn0Sdc7Pqj5az8yIbrlbTFijtjT6WXeHFca2PujyiZXR6dartwWdfQyqnulUigd2D2/NiRa7fX7g==","shasum":"f98c1d19d400e4ae9d95fd4a90db6dce599c02b7","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-2.0.5-beta.0.tgz","fileCount":7,"unpackedSize":193611,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE+FicYKi/tNXqVcrw/tilb1zw0sRBfyXssV3Rp6NIhyAiBKNYXjr4oU6mjyxzA7vJKKOXBrUxEPTH1av9ki4Rkb4Q=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJia/8QACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmphKw//cUw3yGpv1yHqKDK2pd63zHm8+H7mPNhMgt/TPmzwtLzm8XzB\r\naAtY4VuwIGdWy9FUHoGJ7fs+/0mWX8XashZCg4D9nPT8n6zA+0vhFcy68DZ9\r\n9dNVdXiLDI7ozfcvaYI6JWbWN2qbS+6vQ53NWgMiJB8y5Apwq25ZqbZKZDP8\r\nwxknr3HC0fai8DISEdJ6qgM+YvTJ1H44oNPKZ3aCVxG65L5GoSAoxPZdnKvd\r\n5wkcLSFGwADowGha60zfT44VAT3B997R+bWiIRXRtM3ENFFi0TddtEAewl6m\r\nhTrUkrOlk8cZFFcsH+oLxz3MSnRifRHVtvZ6hFcoWhqAMw1nQtuY9yaAb8wn\r\n2qWc21Qqq3Z16R2K51OyCrsLEKJlbGRuTmHhprZSZjVm7EFSDiFCJvr3X0f6\r\n7B8O9Ibe7Fv9xJfxM1K1MtoYNQ4RteY62gBHeEq+uwmhxEmd5FV404VT30KP\r\n8V9AV8AJAK4jklvFx9O3vXcRJRbdDpyvv95ubuEdbPu/JMG9tfckZDq3djSK\r\nX5JjaJbGg0/vGBJVYa/2D1i30835W26F+qeIXR23/nJZESqTJKroQQEB4Jt4\r\n8Ou/Ax24uwu0fBLoC3Nfa1D72T6tO/RImj7/LLXS4R0rXEEdkiia9f7I2Erl\r\nbkK0m8TTt8g5FGYjMAl92NFIpdb9Rsmyn9U=\r\n=ao82\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_2.0.5-beta.0_1651244816184_0.8485640604215869"},"_hasShrinkwrap":false},"2.0.6-beta.0":{"name":"@asemirsk/youtube","version":"2.0.6-beta.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^2.0.6-beta.0","@asemirsk/core":"^2.0.6-beta.0","@asemirsk/fclasses":"^2.0.6-beta.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"e98b014aabae41353460b67b25ad4d50f0133fca","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@2.0.6-beta.0","_nodeVersion":"16.9.1","_npmVersion":"lerna/4.0.0/node@v16.9.1+x64 (linux)","dist":{"integrity":"sha512-DHl8RzoHmBk3X9WkAPhKzo7XDk5N1Hq8pwa5QeRYoYc1EHUFP4PaPrNzhg66cxjfD4FO2fwsgOqE3Kw7mmrgcg==","shasum":"9bf9645c7f13d7c1fc64c607edd0bbbcce1e159b","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-2.0.6-beta.0.tgz","fileCount":7,"unpackedSize":193611,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC2PukX0NSS6n4d8N0gNsM3wyUr+QxZyMJ5qCxm5LAL+gIgN2hvGf50lc96aR4ZZtyLpv5zTewdxLdMChNTHoX8Ieg="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJib62YACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrJvQ//cB+c4QSTZ00Kjin8lO9JYL2LfA071PXbdKk1wEehxqgEO+JC\r\nGhCFKqNKF6sRBOGIt8iLk8xyOlf2vnMIvyAsFb5pYtYxAx+BaM10AVIuRy7N\r\nIFB0GqPS0sHETmE5sERGSEPQaE4Ceor/cxxwX9yAKMWx7Dz5KLj+AGhLdZEH\r\nasIqdv/bItsRq3qJ2SBXO+/dr0uIPGNpezr8OkYZUClhIfEPFqTfXT4N3g6H\r\nggXQq+ZjTUBzsCVVUX1jr3/Y+6jCYck79Qxjb7FxzGwFbFAOkSP8Ek4hBcXL\r\n9mAl6/D5r81OO60yg2PjqKqO1hieYpa8QsrEmwbg/jmc7PDsAQmCmQL0p+KU\r\nmMZWMDstdzoa5y1KgYf8byNboyJrjGyYlMX5s1it0hRyeupDKQSD617Xp+my\r\nbe4q5ceGAO8w4CcNbpNrnYn374w2/GyILrsU54aY15aYzan2E4259IBdCW1O\r\n/fjS3Qe4YhDFc5DKTjtUgUN7W1uK3YC566AmmoS7FUAyTuIvYyUuEIQjxREz\r\no48ITI/wbK5vMCVvYpFGRwvdfcXAKEbq+vkNoujdI/RLvOmx6hGS5v+7wtme\r\nGARc1j+WrKwFWkWdPyKU+ehTlM7q8KRyJy988NRcAczeThcAFJZws2FZzTeZ\r\ndzzAdKykXC8YVqg7p/LUA0k3QrkEn5xsZZE=\r\n=S+4G\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_2.0.6-beta.0_1651486104711_0.8239623103944491"},"_hasShrinkwrap":false},"3.0.0":{"name":"@asemirsk/youtube","version":"3.0.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.6","@asemirsk/components":"^3.0.0","@asemirsk/core":"^3.0.0","@asemirsk/fclasses":"^3.0.0","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"6cf8b4df75f61c7e648a17bd5eafcd3965785c77","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@3.0.0","_nodeVersion":"16.9.1","_npmVersion":"lerna/4.0.0/node@v16.9.1+x64 (linux)","dist":{"integrity":"sha512-bD2y2Zr/pff+TVbiR8BylOhuL9pxnrSTvUwqKyoSLri+P7LwMIEKMLsliXv/Ksb+79XoLazbUrhuR7Zyu5RMkw==","shasum":"29761cc4fb556a43300514cd391f23e853734466","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-3.0.0.tgz","fileCount":7,"unpackedSize":193583,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDaNdr7PfZOpvvrY0qx6ZnfqaIPisM7y7S9v7Vy9eZKzgIhAPKTfVqdAGTwex/O+5SdVakxHPzbOzDxTbS4V+6sa5PP"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJib7C/ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqTYg/+Kclt9Am5NjqquyN7Cz3uyX4gHcqTNGY6PrZ6DOnRfDVutk2f\r\nHzgXy/ZNzEsFVHt6fUePnQ/wBpEl6qL5MjLOvAMRBBzKIB7tAdfJ2RlIo9q9\r\nGTto1tp2tU8bt/y2768z6mY28krNrBQv7Y7KBMbSIvc2K+Wdu5x7Bvt1O29c\r\naTDiE8HeEfaW47fgpw0WKQhPPTtZUxFMYvdS6e4BgbP3IJ5ZZwve7kNWuEZq\r\nGciBluA6pJz0injMXLZMtSmKY1gHuY9Io9LCXZLfnpeGDgccUe2P9kQE/kYm\r\nHvjzCycyXwlZQNBge3H8QAYoZonx0By/4fiU2Fd3+/vA6CCic70rPJTiJYTK\r\ni/W630qLMHnn+tawgBO6RSxR22apKh3lM4/kwPYi99TmV6/cXm/PPpAUbuSm\r\n0b4T1WoUTpPZ0yAF3qGlq/jwe4vXCPquEG0EB/lQrPv3Qam8KNOZb7oZYXeL\r\n8oAilc9LFIYD4AT1iRkvRAmT3cKwvGfzLdq63hW0TeLgf/B9UnFgBro+EvYk\r\nitc6pMVoz+YDffzXs+2IDrY6DcmSE/bZ8zF2LKSCYNEHKf4K7KIwAiNUFyy0\r\ngGHKwuhfF7lPu3sa2skWTi7y6MXM0ZYeSig9twWVq4fQQM4ZeEKp/UfT5U/8\r\nXAAbMQw0Ehc7kdp7T+TiP22CPmb0eokMWlU=\r\n=7t05\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_3.0.0_1651486910921_0.8901360996056371"},"_hasShrinkwrap":false},"1.0.0-beta.16":{"name":"@asemirsk/youtube","version":"1.0.0-beta.16","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"npm run copy && tsc -p ./tsconfig.json && npm run build:api-doc","build:watch":"npm run build -- --watch","build:api-doc":"typedoc --out doc/api src","lint":"tslint ./src/**/*.ts?x","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/cli":"^1.0.0-beta.15","@asemirsk/components":"^1.0.0-beta.16","@asemirsk/core":"^1.0.0-beta.16","@asemirsk/fclasses":"^1.0.0-beta.16","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"0ff46789373c0ccb710fa463d6cbd035aeb8eb1f","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/) on a page via the\nBodilessJS edit interface. The YouTube Component is responsive and features \na 16:9 ratio by default. \n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n---\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the \nBodilessJS edit interface.\n\n?> Please note that the [Embed Component](../../../Components/Embed) must be activated on your site for the YouTube Component to work.\n\n\n``` js\n import { YouTube } from '@bodiless/youtube';\n\n \n ```\n\nYou can also use the HOC version of this which can then be applied to \nother components. But the underlining component must accept the same props\nas an `iframe` tag. Simply pass the node key to the asBodilessYouTube function\nand then use the returned HOC\n\n ``` js\n import { CustomYouTube } from 'my-library';\n import { asBodilessYouTube } from '@bodiless/youtube';\n\n const YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n \n ```\n\nYou can configure YouTube player settings leveraging withYouTubePlayerSettings \nHOC. For example, to configure AutoPlay for the YouTube component:\n\n ``` js\n import { YouTube } from '@bodiless/youtube';\n\n const AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n })(YouTube);\n\n \n ```\n\n### Props\n\n| name | default | description |\n|----------------|-----------|-------------------------------------------------------------------------------------|\n| nodeKey | undefined | Identifies where the component data will be stored. |\n| playerSettings | undefined | YouTube embed player settings. Check YouTubePlayerSettings type from 'Youtube.tsx'. |\n\nIn addition, you can pass `HTMLIFrameElement` props (id, src, width, etc.). Check `HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters \n\nThe YouTube Component utilizes an API that allows you to change the following\nproperties/parameters. You can use defaultPlayerSettings to set parameters that\nare commonly used together. For more details on each individual parameter see [YouTube Player API Reference for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference). \n\n\n| Parameters | Suggested Default | \n| -------- | -------- |\n| autoplay | 0 |\n| cc_lang_pref | no default |\n| cc_load_policy | 0 |\n| controls | 1 |\n| loop | 0 |\n| enablejsapi | 1 |\n| modestbranding | 1 |\n| origin | canonical URL |\n| rel | 0 |\n| mute | |\n| version | |\n| playlist | |\n\n\ne.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n\n```\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```\n\n```\n\n---\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```\n\n```\n\n?> There are optional parameters on the src that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-beta.16","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-xPS5CXK9tML+NCiX33pWGupVmkW3/EkRHAKuVSdlwqIv8JbxTyXGcJpw+K+Pstz8Si8B9lR/qD3VkKHKn0nrYg==","shasum":"33a55b4daaf396a12a39206c6ffb031d1a3d0cb7","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-beta.16.tgz","fileCount":7,"unpackedSize":193616,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEXaTj5tUmae5W5GDkJYSa2cAXitc3PR6p+DTi4DYjk5AiEAi7Nttze99URoqAKUzNWXsQMvr6EUm/Kpmxx+VvuTEqI="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJidOejACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmro7A//QHvDSJE+mTyXiV6FSX/D+t6ZYxSjlAfk8XDPcq17I4vuEBiq\r\nsQ815hEHCUFN5Ml54oNClPv8Lc5HeicstWjEARwYFd685wmV5/7iWjJh0Ei0\r\nlfjNr1fVjXaeHKhyBrQncyZdhtHmMxYPahVbwdv5vh/Q6l31J4EMbjnDwjy6\r\nTpSvmdb+fgJGmlMoGLfNWGtGnMrN0QdqufFS9/BSoogTI5KLL+zwYefBXZHo\r\nMiwf+P9KrAwlrKria2xJ+GJUDqh7nj1YLYz/9RTqSq2SjjgjI415isPGyHMY\r\n54c5ukGYYBpheWBxpSR4hl0MHgyvdXK0feFTu5fxDh0BbRfgnZxpzUYgBoTD\r\nf/EhFsCOG5YAo7rdz47KE7VwGgK82wNG6d76WC6f4aiDZgwxvpKJbXrK4czM\r\nv18KsJRLo4Aq7R4iEQftbmnxlvT/Dq81uOrcnqTsKhnppJT4J+KGcVjF3LSL\r\nTARamcucBbY0ml/RUfv5OTca+u3W+GUELP7fVJbOB6qVWyUWc9nl2Oksb1jU\r\nRoQyegrFyvWhggZCZWjKLWBqb8/eOPAjd+ysv8ONldUOg7PnsWkExPuekvwI\r\nlczf5A/6Bl+H2H8RzHLTOuCUXSZTejRDVA2GMnGLl1lriNCIF+YI568Bn7MA\r\nIqQxEVFPhA20kkVISqNUzDLsy8pkobAoZXI=\r\n=q0RT\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-beta.16_1651828642816_0.7928918208897686"},"_hasShrinkwrap":false},"1.0.0-canary-24-22.0":{"name":"@asemirsk/youtube","version":"1.0.0-canary-24-22.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"run-p copy build:lib","build:lib":"tsc -p ./tsconfig.json","build:watch":"npm run build:lib -- --watch","build:api-doc":"typedoc --options ../../typedoc.js --out doc/api ./src","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/components":"1.0.0-canary-24-22.0+a48e91c","@asemirsk/core":"1.0.0-canary-24-22.0+a48e91c","@asemirsk/fclasses":"1.0.0-canary-24-22.0+a48e91c","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"a48e91c77704024ccd08e24d4f85d1cd6971ccb1","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/\n':target=_blank') on a page via the BodilessJS Edit Interface. The YouTube Component is responsive\nand features a 16:9 aspect ratio by default.\n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the BodilessJS Edit\nInterface.\n\n?> **Note:** The [Embed Component](/Components/Embed) must be activated on your site for the YouTube\nComponent to work.\n\n```jsx\nimport { YouTube } from '@bodiless/youtube';\n\n\n```\n\nYou can also use the HOC version of this, which can then be applied to other components. But the\nunderlining component must accept the same props as an `iframe` tag. Simply pass the node key to the\n`asBodilessYouTube` function and then use the returned HOC:\n\n```jsx\nimport { CustomYouTube } from 'my-library';\nimport { asBodilessYouTube } from '@bodiless/youtube';\n\nconst YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n\n```\n\nYou can configure YouTube player settings leveraging the `withYouTubePlayerSettings` HOC. For\nexample, to configure AutoPlay for the YouTube component:\n\n```jsx\nimport { YouTube } from '@bodiless/youtube';\n\nconst AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n})(YouTube);\n\n\n```\n\n### Props\n\n| Name | Default | Description |\n| ---------------- | ----------- | ----------------------------------------------------------------------------------------- |\n| `nodeKey` | `undefined` | Identifies where the component data will be stored. |\n| `playerSettings` | `undefined` | YouTube embed player settings. Check the `YouTubePlayerSettings` type from `Youtube.tsx`. |\n\nIn addition, you can pass `HTMLIFrameElement` props (`id`, `src`, `width`, etc.). Check the\n`HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters\n\nThe YouTube Component utilizes an API that allows you to change the properties/parameters listed\nbelow. You can use `defaultPlayerSettings` to set parameters that are commonly used together. For\nmore details on each individual parameter, see: [YouTube Embedded Players and Player Parameters :\nSupported Parameters | Google\nDevelopers](https://developers.google.com/youtube/player_parameters#Parameters ':target=_blank').\n\n| Parameters | Suggested Default |\n| ---------------- | ----------------- |\n| `autoplay` | `0` |\n| `cc_lang_pref` | No default |\n| `cc_load_policy` | `0` |\n| `controls` | `1` |\n| `loop` | `0` |\n| `enablejsapi` | `1` |\n| `modestbranding` | `1` |\n| `origin` | Canonical URL |\n| `rel` | `0` |\n| `mute` | |\n| `version` | |\n| `playlist` | |\n\nE.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n```js\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```jsx\n\n```\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```html\n\n```\n\n?> **Note:** There are optional parameters on the `src` that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-canary-24-22.0","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-SqaJpIAu0W6guq2umFjwG4dl+2EEkYWRySetgnduaYfWKR2qU3oaRFVtM8VgAqLZa3MW2Tg4EjrXdDnQxXlN2A==","shasum":"9e5356c0bf36e6fe889e7fd3dea437cd23dfb257","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-canary-24-22.0.tgz","fileCount":7,"unpackedSize":194009,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE+aVWaBPnKy/2mLKidcvAQsASaLAF8vybAaz0SWeVIQAiBOoDY9pvT7e4EgAeuo9xyLl70PX1ayYrIR1rfI6r6kRA=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJijezlACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpGABAAlVsCUT4rJlQO+Pjx7YlfSKLL6Yahwad5bubkv/pYgaiux7qu\r\n/06/FC0ZmlZXwWZa6pYPhNcUrANDyy4KOSsi4wozzDcWqLP+x7gH7BIq4tIT\r\nFNOq17WQZD8H2JjCvqccnUKmie4YG/phFvBluQS4cMkRYNFtKwy2Yz7aEyMU\r\noVuZZzKCHlvV1oZw5nVJ+kkU6B8tRUWZB4EcdQQ2BlBF/spuAOVLQc+qCcFQ\r\nfzbHFsjnqJfSikzarYzx3ahWRvRk9urNsAgi9h1N7m47AjL2S5CSXsXIM8iw\r\niIh58kDHq15mAqxQ4vdabiFIKy96TpIvFuVG88MSf50BDlge1f5FlqtRvLmL\r\nxYqYXCkDe3xZtqaIfYVk4HDh2SHtRTMc5R2bO/zUThyoWsRHR/If+v+z9mQ2\r\nYSqKEeLgtSYMclx9QqjIYjhdHc1veroq6f2/0udr8md7aj/MvVibfEswNibb\r\n1WJGcpr1ITKr5G3XXF3S6ZnjYlN/q7DmmvaOD1WPnxwQ625W9wUFA1LNDG5m\r\nG9WsxrL/5mHlbSuUo/z6tQlvs5w+3z9/ag5DgnK/BgX8jESwuN+i7MIsQVx3\r\nhc2MloFNU8LWAdtnd22j8fpIXrDXaryhbyqYoi5qIrH/6hPIhem0kJLnq2df\r\nWcZHsRqFnuihtzfVaf+2T7vBEbj3UEOakts=\r\n=awbw\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-canary-24-22.0_1653468389366_0.6660008514596272"},"_hasShrinkwrap":false},"1.0.0-canary-24-23.0":{"name":"@asemirsk/youtube","version":"1.0.0-canary-24-23.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"run-p copy build:lib","build:lib":"tsc -p ./tsconfig.json","build:watch":"npm run build:lib -- --watch","build:api-doc":"typedoc --options ../../typedoc.js --out doc/api ./src","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/components":"1.0.0-canary-24-23.0+2cab1ea","@asemirsk/core":"1.0.0-canary-24-23.0+2cab1ea","@asemirsk/fclasses":"1.0.0-canary-24-23.0+2cab1ea","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"2cab1eaf4ac4d1a8ef3ef53ba3228ff16f7504eb","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/\n':target=_blank') on a page via the BodilessJS Edit Interface. The YouTube Component is responsive\nand features a 16:9 aspect ratio by default.\n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the BodilessJS Edit\nInterface.\n\n?> **Note:** The [Embed Component](/Components/Embed) must be activated on your site for the YouTube\nComponent to work.\n\n```jsx\nimport { YouTube } from '@asemirsk/youtube';\n\n\n```\n\nYou can also use the HOC version of this, which can then be applied to other components. But the\nunderlining component must accept the same props as an `iframe` tag. Simply pass the node key to the\n`asBodilessYouTube` function and then use the returned HOC:\n\n```jsx\nimport { CustomYouTube } from 'my-library';\nimport { asBodilessYouTube } from '@asemirsk/youtube';\n\nconst YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n\n```\n\nYou can configure YouTube player settings leveraging the `withYouTubePlayerSettings` HOC. For\nexample, to configure AutoPlay for the YouTube component:\n\n```jsx\nimport { YouTube } from '@asemirsk/youtube';\n\nconst AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n})(YouTube);\n\n\n```\n\n### Props\n\n| Name | Default | Description |\n| ---------------- | ----------- | ----------------------------------------------------------------------------------------- |\n| `nodeKey` | `undefined` | Identifies where the component data will be stored. |\n| `playerSettings` | `undefined` | YouTube embed player settings. Check the `YouTubePlayerSettings` type from `Youtube.tsx`. |\n\nIn addition, you can pass `HTMLIFrameElement` props (`id`, `src`, `width`, etc.). Check the\n`HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters\n\nThe YouTube Component utilizes an API that allows you to change the properties/parameters listed\nbelow. You can use `defaultPlayerSettings` to set parameters that are commonly used together. For\nmore details on each individual parameter, see: [YouTube Embedded Players and Player Parameters :\nSupported Parameters | Google\nDevelopers](https://developers.google.com/youtube/player_parameters#Parameters ':target=_blank').\n\n| Parameters | Suggested Default |\n| ---------------- | ----------------- |\n| `autoplay` | `0` |\n| `cc_lang_pref` | No default |\n| `cc_load_policy` | `0` |\n| `controls` | `1` |\n| `loop` | `0` |\n| `enablejsapi` | `1` |\n| `modestbranding` | `1` |\n| `origin` | Canonical URL |\n| `rel` | `0` |\n| `mute` | |\n| `version` | |\n| `playlist` | |\n\nE.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n```js\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```jsx\n\n```\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```html\n\n```\n\n?> **Note:** There are optional parameters on the `src` that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-canary-24-23.0","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-VU/hFqATTXGs5QK/TBGweXTxW37646UA/RfG3GCCNBqtfGCNfnQnEMDUYR/oMBX9CGs36wGKujVOBLcR8lAYGA==","shasum":"30eaec45d89f6a57591f5649dff26c070507f171","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-canary-24-23.0.tgz","fileCount":7,"unpackedSize":194009,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCSRe/TUqs69OBksiZIHKBpxGSZ30hI6r840qKSk8D1PwIgVPU/DiOwgJjZeW8zEBGkqNbU/0qQazBvx/64PHWNTCM="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJijfH0ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr6VxAAn8uLXa2b1a6gJYZfUJrodDGO9ukHdIYxO/zkKyMdp3c5OUcg\r\nyACNknaWS+D8p73y+3Lofu2qEshM+bd1gi/pBVC8fmdISVP0Mh/exP7hf1wq\r\n6eYGbC0xIy+4lCfWDUF7MO1Av5tPdWI7o2GtQYlCx74gk2yYLjLYyRezHedY\r\nNA0FH5d53n8SR6iO00an/zM74UiXiINqZ6qFFsoxsJJpisgxPnbcGa/jNljJ\r\nK0Shf/1ymL/ztyRcXwmixezWQoJeVr4ZP5Ftj684RtLzmHBpqQDdbgkJr2o3\r\nSWud090kbzrFKWvKY9ppbW+633GInfWtsEHGqUyxKU8oHQ78DMxElS5pA5WN\r\nYpDiEe9W1SeBECkPPwnpfk32AEEUZJqYiou6ovTRsq/rMJTSpc+ee7PvMjo5\r\nPm27/xhK1Hdne840QpsbBQagHDAkOLNFj+mPwX8encI+ZUPnPQzR5+ItqEYj\r\nB/g4sHYAr4lN7rbxtAoE8aY1hiI+BJedh/7rw18qAIcbOxqMxHyo5nZ4RWcO\r\nDh3pPpruM0ji7u0vovrT8g7/KyHs++M1UrTZE7pubBb2EoGwAr2avW9xaWqw\r\nb843mPuiqW5QU1QRWAWW09wu4eaBKePJXnw7fjVk2rWB/6X28XUCwpJ25bTQ\r\npQhWfUZY7tZLSZyi3cElzqPg0GPXXmmiZq4=\r\n=nxwU\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-canary-24-23.0_1653469684198_0.48958598790007835"},"_hasShrinkwrap":false},"1.0.0-canary-24-24.0":{"name":"@asemirsk/youtube","version":"1.0.0-canary-24-24.0","description":"Bodiless YouTube component.","author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"license":"Apache-2.0","main":"lib/index.js","sideEffects":false,"typings":"lib/index.d.ts","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"publishConfig":{"access":"public"},"scripts":{"build":"run-p copy build:lib","build:lib":"tsc -p ./tsconfig.json","build:watch":"npm run build:lib -- --watch","build:api-doc":"typedoc --options ../../typedoc.js --out doc/api ./src","clean":"rimraf \"lib/*\" && rimraf tsconfig.tsbuildinfo && rimraf \"doc/api\"","copy":"copyfiles -u 1 \"./src/**/*.{css,png}\" \"./lib/\""},"dependencies":{"@asemirsk/components":"1.0.0-canary-24-24.0+af2c8ac","@asemirsk/core":"1.0.0-canary-24-24.0+af2c8ac","@asemirsk/fclasses":"1.0.0-canary-24-24.0+af2c8ac","lodash":"^4.17.19"},"peerDependencies":{"react":"^17.0.2"},"gitHead":"af2c8ace172b3dc3a1f237c51eb55be1e21978bb","readme":"# YouTube Component\n\nThe YouTube Component can be used to place a [YouTube video](https://www.youtube.com/\n':target=_blank') on a page via the BodilessJS Edit Interface. The YouTube Component is responsive\nand features a 16:9 aspect ratio by default.\n\n## Content Editor Details\n\nTo add a YouTube Component to your site:\n\n01. In [Edit Mode](/ContentEditorUserGuide/#edit-mode), select the YouTube Component from the\n Component Library. \n \n\n01. Click on your newly added YouTube Component, and, within its context menu, under \"YouTube,\"\n click **Settings**. \n \n\n01. Enter the target YouTube URL, and click the checkmark (or press Enter) to confirm.\n\n \n \n Note: Please note the following accepted URL formats:\n\n * **Share** (e.g., https://youtu.be/_LBdqpscwi0)\n * **Watch** (e.g., https://www.youtube.com/watch?v=_LBdqpscwi0)\n * **Embed** (e.g., https://www.youtube.com/embed/_LBdqpscwi0)\n\n
\n\n01. Resize or reposition the YouTube Component using the Flow Container controls.\n\n## Site Builder Details\n\nThe YouTube Component can be used to place a YouTube video on a page via the BodilessJS Edit\nInterface.\n\n?> **Note:** The [Embed Component](/Components/Embed) must be activated on your site for the YouTube\nComponent to work.\n\n```jsx\nimport { YouTube } from '@asemirsk/youtube';\n\n\n```\n\nYou can also use the HOC version of this, which can then be applied to other components. But the\nunderlining component must accept the same props as an `iframe` tag. Simply pass the node key to the\n`asBodilessYouTube` function and then use the returned HOC:\n\n```jsx\nimport { CustomYouTube } from 'my-library';\nimport { asBodilessYouTube } from '@asemirsk/youtube';\n\nconst YouTube = asBodilessYouTube('customYouTube')(CustomYouTube);\n\n\n```\n\nYou can configure YouTube player settings leveraging the `withYouTubePlayerSettings` HOC. For\nexample, to configure AutoPlay for the YouTube component:\n\n```jsx\nimport { YouTube } from '@asemirsk/youtube';\n\nconst AutoPlayYouTube = withYouTubePlayerSettings({\n autoplay: true,\n mute: true,\n})(YouTube);\n\n\n```\n\n### Props\n\n| Name | Default | Description |\n| ---------------- | ----------- | ----------------------------------------------------------------------------------------- |\n| `nodeKey` | `undefined` | Identifies where the component data will be stored. |\n| `playerSettings` | `undefined` | YouTube embed player settings. Check the `YouTubePlayerSettings` type from `Youtube.tsx`. |\n\nIn addition, you can pass `HTMLIFrameElement` props (`id`, `src`, `width`, etc.). Check the\n`HTMLIFrameElement` type for more details.\n\n### `playerSettings` Parameters\n\nThe YouTube Component utilizes an API that allows you to change the properties/parameters listed\nbelow. You can use `defaultPlayerSettings` to set parameters that are commonly used together. For\nmore details on each individual parameter, see: [YouTube Embedded Players and Player Parameters :\nSupported Parameters | Google\nDevelopers](https://developers.google.com/youtube/player_parameters#Parameters ':target=_blank').\n\n| Parameters | Suggested Default |\n| ---------------- | ----------------- |\n| `autoplay` | `0` |\n| `cc_lang_pref` | No default |\n| `cc_load_policy` | `0` |\n| `controls` | `1` |\n| `loop` | `0` |\n| `enablejsapi` | `1` |\n| `modestbranding` | `1` |\n| `origin` | Canonical URL |\n| `rel` | `0` |\n| `mute` | |\n| `version` | |\n| `playlist` | |\n\nE.g.: Responsive YouTube with 16:9 ratio with custom language preferences:\n\n```js\nconst withCustomLangPref = flowRight(\n withYouTubePlayerSettings({\n ...defaultPlayerSettings,\n cc_lang_pref: 'de',\n cc_load_policy: 1,\n }),\n addProps({\n src: 'https://www.youtube.com/embed/9No-FiEInLA',\n }),\n);\n\nconst YouTubeWithCustomLangPref = withDesign({\n Item: withCustomLangPref,\n})(DefaultReponsive16By9YouTube);\n```\n\n### Usage\n\n```jsx\n\n```\n\n## Architectural Details\n\nThe YouTube Component renders the following code:\n\n```html\n\n```\n\n?> **Note:** There are optional parameters on the `src` that are configurable.\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","_id":"@asemirsk/youtube@1.0.0-canary-24-24.0","_nodeVersion":"16.13.2","_npmVersion":"lerna/4.0.0/node@v16.13.2+x64 (linux)","dist":{"integrity":"sha512-HkftecURnitJH/+3+/CmNq7+G7aUE4uDvE+JTbsTRbr+pprIjnsin7wzXhIl/8ISTJBan6agZwfaPwUfahiWYg==","shasum":"3eccad157f7bed620cbda0e55e234c64c38b7657","tarball":"https://registry.npmjs.org/@asemirsk/youtube/-/youtube-1.0.0-canary-24-24.0.tgz","fileCount":7,"unpackedSize":194009,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEveEV97STTKTP5wTRhLH2E5qu0XIClU9qjvuy17ANnFAiAZnHGNYAun1VRZ/iYJnwB4xlga680EZa2XgAf/nTUSng=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJijfRHACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmr7nw/+KUt9aDM1mD3mzmJ81RjgIxQMpGjBNCjEcu/PTPilDU0vYSnL\r\nriEWIM/96frPz4mT63RzyIN+6aXsHXyrRAiKCiFSlV8hTYKU0bxxJJpB+Wuu\r\ns7fzCilGcjpTbC0Gw8LphN/zgkwxU+ZMmbWaDf5CrHIaOYvPR6Us5MGVO3T1\r\n66cd/sIFu1a7tyY8sJ4+7bBdlQ5evw5k02yt6MwR+7jE5v3Qqx7jEDQ1YLpG\r\nJYC4jlYbOdgiFJyvrtG/aFQrsjqJ12Zbo/+5gzX5rZZcbdNHcXYkMuhKLrqm\r\n/yuZxk9g+ViZw7u7rwzXfXwc4z0KwLZH1K62AM+UEgpWcAxHbOPCxgqDw8j9\r\nFwxYb0wsmSU8sxTSMaNa6daVGfWI/eOedMDLuPzu6aqWyZs11TIu0c+NxFZj\r\n1jL7vRKvNFm1fU1tY13OnjjxivrTaK59PVB5g1HOReXBiJOw6Ly5XFaWqzuX\r\nslmiNLbrltECr4HfBNC0KCI/7HAWWsBnCo+YOztOBhRSt5J/ScoGyZAPzn1a\r\n+9pRoHwYOOVfjqG8KVRv2R47W03hgr+8yWGrn3aN2tOoy3lbvPOV4083Z03i\r\n4cjtF+b9EprILJQx7B8uPopDBbecvrBOaYtUGrasmgEgonOrmozGWwTsCIT2\r\n5EApjcNc04E1ZErvR8yMRSVZepZ65DqpHro=\r\n=Uodu\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"asemirsk","email":"al.semirski@gmail.com"},"directories":{},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/youtube_1.0.0-canary-24-24.0_1653470279625_0.7672769465201079"},"_hasShrinkwrap":false}},"maintainers":[{"name":"asemirsk","email":"al.semirski@gmail.com"}],"description":"Bodiless YouTube component.","homepage":"https://github.com/johnsonandjohnson/bodiless-js#readme","repository":{"type":"git","url":"git+https://github.com/johnsonandjohnson/bodiless-js.git"},"author":{"name":"Ivan Rudiuk","email":"IRudiuk@its.jnj.com"},"bugs":{"url":"https://github.com/johnsonandjohnson/bodiless-js/issues"},"license":"Apache-2.0","readme":"","readmeFilename":""}