video-privacy 1.0.0-beta.3 → 1.0.0-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.js +36 -15
  2. package/package.json +2 -4
package/dist/index.js CHANGED
@@ -2,7 +2,36 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
2
2
  import React, { useState } from 'react';
3
3
  import { jsx, jsxs } from 'react/jsx-runtime';
4
4
 
5
- var styles = ".container {\n position: relative;\n background-color: black;\n aspect-ratio: 16 / 9;\n}\n\n.backdrop {\n background-size: cover;\n width: 100%;\n height: 100%;\n filter: blur(5px);\n opacity: 0.25;\n}\n\n.content {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.info {\n font-family: Arial, Helvetica, sans-serif;\n color: white;\n text-align: center;\n}\n\n.button {\n font-family: Arial, Helvetica, sans-serif;\n border: solid;\n border-width: 1px;\n border-color: white;\n border-radius: 0;\n background-color: transparent;\n padding: 10px 20px;\n color: white;\n font-weight: bold;\n cursor: pointer;\n}\n\n.button:hover {\n background-color: white;\n color: black;\n transition: all 0.3s;\n}\n";
5
+ function styleInject(css, ref) {
6
+ if ( ref === void 0 ) ref = {};
7
+ var insertAt = ref.insertAt;
8
+
9
+ if (typeof document === 'undefined') { return; }
10
+
11
+ var head = document.head || document.getElementsByTagName('head')[0];
12
+ var style = document.createElement('style');
13
+ style.type = 'text/css';
14
+
15
+ if (insertAt === 'top') {
16
+ if (head.firstChild) {
17
+ head.insertBefore(style, head.firstChild);
18
+ } else {
19
+ head.appendChild(style);
20
+ }
21
+ } else {
22
+ head.appendChild(style);
23
+ }
24
+
25
+ if (style.styleSheet) {
26
+ style.styleSheet.cssText = css;
27
+ } else {
28
+ style.appendChild(document.createTextNode(css));
29
+ }
30
+ }
31
+
32
+ var css_248z = ".video-privacy-module_vidprivContainer__z9I5r {\n position: relative;\n background-color: black;\n aspect-ratio: 16 / 9;\n}\n\n.video-privacy-module_vidprivBackdrop__QIkNm {\n background-size: cover;\n width: 100%;\n height: 100%;\n filter: blur(5px);\n opacity: 0.25;\n}\n\n.video-privacy-module_vidprivContent__9Ctbc {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.video-privacy-module_vidprivInfo__4cZn9 {\n font-family: Arial, Helvetica, sans-serif;\n color: white;\n text-align: center;\n}\n\n.video-privacy-module_vidprivButton__OZSiX {\n font-family: Arial, Helvetica, sans-serif;\n border: solid;\n border-width: 1px;\n border-color: white;\n border-radius: 0;\n background-color: transparent;\n padding: 10px 20px;\n color: white;\n font-weight: bold;\n cursor: pointer;\n}\n\n.video-privacy-module_vidprivButton__OZSiX:hover {\n background-color: white;\n color: black;\n transition: all 0.3s;\n}\n";
33
+ var styles = {"vidprivContainer":"video-privacy-module_vidprivContainer__z9I5r","vidprivBackdrop":"video-privacy-module_vidprivBackdrop__QIkNm","vidprivContent":"video-privacy-module_vidprivContent__9Ctbc","vidprivInfo":"video-privacy-module_vidprivInfo__4cZn9","vidprivButton":"video-privacy-module_vidprivButton__OZSiX"};
34
+ styleInject(css_248z);
6
35
 
7
36
  function VideoPrivacy(props) {
8
37
  // State to determine if the user has acknowledged the privacy notice
@@ -17,16 +46,8 @@ function VideoPrivacy(props) {
17
46
  var info = props.info || "Info text";
18
47
  var buttonText = props.buttonText || "I agree";
19
48
 
20
- // Style definitions, either from module CSS or from props
49
+ // Style definitions
21
50
 
22
- var customInfoClass = styles.info;
23
- if (props.customInfoClass) {
24
- customInfoClass = props.customInfoClass;
25
- }
26
- var customButtonClass = styles.button;
27
- if (props.customButtonClass) {
28
- customButtonClass = props.customButtonClass;
29
- }
30
51
  var containerStyle = {
31
52
  width: props.width || 800
32
53
  };
@@ -45,18 +66,18 @@ function VideoPrivacy(props) {
45
66
  // Otherwise, render the privacy notice container
46
67
 
47
68
  return /*#__PURE__*/jsxs("div", {
48
- className: styles.container,
69
+ className: styles.vidprivContainer,
49
70
  style: containerStyle,
50
71
  children: [/*#__PURE__*/jsx("div", {
51
- className: styles.backdrop,
72
+ className: styles.vidprivBackdrop,
52
73
  style: backdropStyle
53
74
  }), /*#__PURE__*/jsxs("div", {
54
- className: styles.content,
75
+ className: styles.vidprivContent,
55
76
  children: [/*#__PURE__*/jsx("h2", {
56
- className: customInfoClass,
77
+ className: props.customInfoClass || styles.vidprivInfo,
57
78
  children: info
58
79
  }), /*#__PURE__*/jsx("button", {
59
- className: customButtonClass,
80
+ className: props.customButtonClass || styles.vidprivButton,
60
81
  onClick: function onClick() {
61
82
  return setAcknowledged(true);
62
83
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "video-privacy",
3
- "version": "1.0.0-beta.3",
3
+ "version": "1.0.0-beta.5",
4
4
  "scripts": {
5
5
  "rollup": "node_modules/rollup/dist/rollup.js",
6
6
  "dev": "next dev",
@@ -46,13 +46,11 @@
46
46
  "eslint-config-next": "14.2.4",
47
47
  "eslint-plugin-storybook": "^0.8.0",
48
48
  "rollup": "^4.18.0",
49
- "rollup-plugin-import-css": "^3.5.0",
49
+ "rollup-plugin-postcss": "^4.0.2",
50
50
  "semantic-release": "^24.0.0",
51
51
  "storybook": "^8.1.10"
52
52
  },
53
53
  "peerDependencies": {
54
- "@docusaurus/core": "^3.4.0",
55
- "@docusaurus/preset-classic": "^3.4.0",
56
54
  "next": "14.2.4",
57
55
  "react": "^18",
58
56
  "react-dom": "^18"