@c15t/react 1.5.0 → 1.6.0
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.
- package/README.md +108 -45
- package/dist/components/consent-manager-dialog/__tests__/styles.spec.cjs +1 -1
- package/dist/components/consent-manager-dialog/__tests__/styles.spec.js +1 -1
- package/dist/components/consent-manager-dialog/atoms/dialog-card.cjs +1 -1
- package/dist/components/consent-manager-dialog/atoms/dialog-card.d.ts +2 -3
- package/dist/components/consent-manager-dialog/atoms/dialog-card.d.ts.map +1 -1
- package/dist/components/consent-manager-dialog/atoms/dialog-card.js +1 -1
- package/dist/components/consent-manager-dialog/atoms/overlay.cjs +1 -1
- package/dist/components/consent-manager-dialog/atoms/overlay.d.ts +12 -33
- package/dist/components/consent-manager-dialog/atoms/overlay.d.ts.map +1 -1
- package/dist/components/consent-manager-dialog/atoms/overlay.js +1 -1
- package/dist/components/consent-manager-dialog/atoms/root.cjs +2 -0
- package/dist/components/consent-manager-dialog/atoms/root.d.ts +60 -0
- package/dist/components/consent-manager-dialog/atoms/root.d.ts.map +1 -0
- package/dist/components/consent-manager-dialog/atoms/root.js +2 -0
- package/dist/components/consent-manager-dialog/consent-manager-dialog.cjs +1 -1
- package/dist/components/consent-manager-dialog/consent-manager-dialog.d.ts +14 -33
- package/dist/components/consent-manager-dialog/consent-manager-dialog.d.ts.map +1 -1
- package/dist/components/consent-manager-dialog/consent-manager-dialog.js +1 -1
- package/dist/components/consent-manager-dialog/consent-manager-dialog.module.cjs +1 -1
- package/dist/components/consent-manager-dialog/consent-manager-dialog.module.js +1 -1
- package/dist/components/consent-manager-dialog/index.cjs +1 -1
- package/dist/components/consent-manager-dialog/index.d.ts +76 -2
- package/dist/components/consent-manager-dialog/index.d.ts.map +1 -1
- package/dist/components/consent-manager-dialog/index.js +1 -1
- package/dist/components/consent-manager-widget/__tests__/styles.spec.cjs +1 -1
- package/dist/components/consent-manager-widget/__tests__/styles.spec.js +3 -3
- package/dist/components/consent-manager-widget/atoms/accordion.cjs +1 -1
- package/dist/components/consent-manager-widget/atoms/accordion.d.ts.map +1 -1
- package/dist/components/consent-manager-widget/atoms/accordion.js +1 -1
- package/dist/components/consent-manager-widget/atoms/root.cjs +1 -1
- package/dist/components/consent-manager-widget/atoms/root.d.ts.map +1 -1
- package/dist/components/consent-manager-widget/atoms/root.js +1 -1
- package/dist/components/consent-manager-widget/consent-manager-widget.d.ts +0 -41
- package/dist/components/consent-manager-widget/consent-manager-widget.d.ts.map +1 -1
- package/dist/components/consent-manager-widget/index.cjs +1 -2
- package/dist/components/consent-manager-widget/index.d.ts +79 -5
- package/dist/components/consent-manager-widget/index.d.ts.map +1 -1
- package/dist/components/consent-manager-widget/index.js +1 -2
- package/dist/components/consent-manager-widget/theme.d.ts +1 -1
- package/dist/components/consent-manager-widget/theme.d.ts.map +1 -1
- package/dist/components/cookie-banner/__tests__/styles.spec.cjs +3 -3
- package/dist/components/cookie-banner/__tests__/styles.spec.js +3 -3
- package/dist/components/cookie-banner/atoms/overlay.cjs +1 -1
- package/dist/components/cookie-banner/atoms/overlay.d.ts.map +1 -1
- package/dist/components/cookie-banner/atoms/overlay.js +1 -1
- package/dist/components/cookie-banner/atoms/root.cjs +1 -1
- package/dist/components/cookie-banner/atoms/root.d.ts.map +1 -1
- package/dist/components/cookie-banner/atoms/root.js +1 -1
- package/dist/components/cookie-banner/cookie-banner.cjs +1 -1
- package/dist/components/cookie-banner/cookie-banner.d.ts +0 -60
- package/dist/components/cookie-banner/cookie-banner.d.ts.map +1 -1
- package/dist/components/cookie-banner/cookie-banner.js +1 -1
- package/dist/components/cookie-banner/cookie-banner.module.cjs +1 -1
- package/dist/components/cookie-banner/cookie-banner.module.js +1 -1
- package/dist/components/cookie-banner/index.cjs +2 -1
- package/dist/components/cookie-banner/index.d.ts +83 -35
- package/dist/components/cookie-banner/index.d.ts.map +1 -1
- package/dist/components/cookie-banner/index.js +2 -1
- package/dist/components/shared/libs/recursive-clone-children.d.ts.map +1 -1
- package/dist/components/shared/primitives/box.d.ts.map +1 -1
- package/dist/components/shared/primitives/button.types.d.ts +1 -2
- package/dist/components/shared/primitives/button.types.d.ts.map +1 -1
- package/dist/components/shared/ui/accordion/accordion.d.ts.map +1 -1
- package/dist/components/shared/ui/accordion/accordion.module.cjs +1 -1
- package/dist/components/shared/ui/accordion/accordion.module.js +1 -1
- package/dist/components/shared/ui/icon.d.ts.map +1 -1
- package/dist/components/shared/ui/switch/switch.module.cjs +1 -1
- package/dist/components/shared/ui/switch/switch.module.js +1 -1
- package/dist/headless.cjs +1 -1
- package/dist/headless.d.ts +5 -5
- package/dist/headless.d.ts.map +1 -1
- package/dist/headless.js +1 -1
- package/dist/hooks/index.cjs +1 -1
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +1 -1
- package/dist/hooks/use-color-scheme.cjs +1 -0
- package/dist/hooks/use-color-scheme.d.ts.map +1 -1
- package/dist/hooks/use-color-scheme.js +1 -0
- package/dist/hooks/use-consent-manager.d.ts +18 -12
- package/dist/hooks/use-consent-manager.d.ts.map +1 -1
- package/dist/hooks/use-focus-trap.cjs +1 -0
- package/dist/hooks/use-focus-trap.d.ts.map +1 -1
- package/dist/hooks/use-focus-trap.js +1 -0
- package/dist/hooks/use-scroll-lock.cjs +1 -0
- package/dist/hooks/use-scroll-lock.d.ts +0 -4
- package/dist/hooks/use-scroll-lock.d.ts.map +1 -1
- package/dist/hooks/use-scroll-lock.js +1 -0
- package/dist/hooks/use-styles.d.ts +1 -2
- package/dist/hooks/use-styles.d.ts.map +1 -1
- package/dist/hooks/use-text-direction.cjs +2 -0
- package/dist/hooks/use-text-direction.d.ts +6 -0
- package/dist/hooks/use-text-direction.d.ts.map +1 -0
- package/dist/hooks/use-text-direction.js +2 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +10 -10
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/providers/__tests__/provider-context.test.cjs +1 -1
- package/dist/providers/__tests__/provider-context.test.js +1 -1
- package/dist/providers/__tests__/provider-errors.test.cjs +1 -1
- package/dist/providers/__tests__/provider-errors.test.js +1 -1
- package/dist/providers/consent-manager-provider.cjs +1 -1
- package/dist/providers/consent-manager-provider.d.ts.map +1 -1
- package/dist/providers/consent-manager-provider.js +1 -1
- package/dist/types/consent-manager.d.ts +5 -1
- package/dist/types/consent-manager.d.ts.map +1 -1
- package/dist/version.cjs +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +33 -9
- package/readme.json +37 -0
package/README.md
CHANGED
|
@@ -1,66 +1,129 @@
|
|
|
1
|
-
<
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
<p align="center">
|
|
2
|
+
<a href="https://c15t.com?utm_source=github&utm_medium=repopage_%40c15t%2Freact" target="_blank" rel="noopener noreferrer">
|
|
3
|
+
<picture>
|
|
4
|
+
<source media="(prefers-color-scheme: dark)" srcset="../../docs/assets/c15t-banner-readme-dark.svg" type="image/svg+xml">
|
|
5
|
+
<img src="../../docs/assets/c15t-banner-readme-light.svg" alt="c15t Banner" type="image/svg+xml">
|
|
6
|
+
</picture>
|
|
7
|
+
</a>
|
|
8
|
+
<br />
|
|
9
|
+
<h1 align="center">@c15t/react: React Consent Components</h1>
|
|
10
|
+
</p>
|
|
11
|
+
|
|
12
|
+
[](https://github.com/c15t/c15t)
|
|
13
|
+
[](https://github.com/c15t/c15t/actions/workflows/ci.yml)
|
|
14
|
+
[](https://github.com/c15t/c15t/blob/main/LICENSE.md)
|
|
15
|
+
[](https://c15t.com/discord)
|
|
16
|
+
[](https://www.npmjs.com/package/@c15t/react)
|
|
17
|
+
[](https://github.com/c15t/c15t)
|
|
18
|
+
[](https://github.com/c15t/c15t/commits/main)
|
|
19
|
+
[](https://github.com/c15t/c15t/issues)
|
|
20
|
+
|
|
21
|
+
Developer-first CMP for React: cookie banner, consent manager, preferences centre. GDPR ready with minimal setup and rich customization
|
|
22
|
+
|
|
23
|
+
## Key Features
|
|
24
|
+
|
|
25
|
+
- Works with React 19, 18, 17, and 16.8
|
|
26
|
+
- Full 'use client' support for React Server Components
|
|
27
|
+
- Headless and fully customizable UI components
|
|
28
|
+
- Automatic GDPR, CCPA, and LGPD compliance
|
|
29
|
+
- Minimal configuration with TypeScript-first design
|
|
30
|
+
- Comprehensive Consent Management Platform (CMP)
|
|
31
|
+
- Flexible Cookie Banner and Consent Dialog components
|
|
32
|
+
- Built-in internationalization support
|
|
33
|
+
- Seamless consent storage and tracking
|
|
34
|
+
|
|
35
|
+
## Prerequisites
|
|
36
|
+
|
|
37
|
+
- React 16.8 or later
|
|
38
|
+
- Node.js 18.17.0 or later
|
|
39
|
+
- A hosted [c15t instance](https://consent.io) (free sign-up) or [self-hosted deployment](https://c15t.com/docs/self-host/v2)
|
|
40
|
+
|
|
41
|
+
## Quick Start
|
|
42
|
+
|
|
43
|
+
Easiest setup with @c15t/cli:
|
|
5
44
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
## Features
|
|
15
|
-
|
|
16
|
-
- 🎯 **Privacy-First Components**: Pre-built UI components for consent management
|
|
17
|
-
- 🎨 **Highly Customizable**: Flexible theming and styling system
|
|
18
|
-
- ♿ **Accessible**: WCAG compliant with full keyboard navigation
|
|
19
|
-
- 🌐 **Regulation Ready**: Built to meet GDPR, CCPA, and other privacy requirements
|
|
20
|
-
- 🔧 **Composable**: Uses compound component pattern for maximum flexibility
|
|
45
|
+
```bash
|
|
46
|
+
# Generate schema and code
|
|
47
|
+
pnpm dlx @c15t/cli generate
|
|
48
|
+
# Alternatives:
|
|
49
|
+
# npx @c15t/cli generate
|
|
50
|
+
# bunx --bun @c15t/cli generate
|
|
51
|
+
```
|
|
21
52
|
|
|
22
|
-
|
|
53
|
+
The CLI will:
|
|
23
54
|
|
|
24
|
-
|
|
25
|
-
|
|
55
|
+
- Install necessary packages
|
|
56
|
+
- Configure your c15t instance
|
|
57
|
+
- Set up environment variables
|
|
58
|
+
- Add consent management components to your app
|
|
26
59
|
|
|
27
|
-
##
|
|
60
|
+
## Manual Installation
|
|
28
61
|
|
|
29
62
|
```bash
|
|
30
|
-
|
|
31
|
-
npx @c15t/cli generate
|
|
32
|
-
pnpm dlx @c15t/cli generate
|
|
33
|
-
bunx --bun @c15t/cli generate
|
|
34
|
-
|
|
35
|
-
# Database Migrations (If you're self hosting c15t)
|
|
36
|
-
npx @c15t/cli migrate
|
|
37
|
-
pnpm dlx @c15t/cli migrate
|
|
38
|
-
bunx --bun @c15t/cli migrate
|
|
63
|
+
pnpm add @c15t/react
|
|
39
64
|
```
|
|
40
65
|
|
|
41
|
-
|
|
66
|
+
To manually install, follow the guide in our [docs – manual setup](https://c15t.com/docs/frameworks/react/quickstart#manual-setup).
|
|
67
|
+
|
|
68
|
+
## Usage
|
|
69
|
+
|
|
70
|
+
1. Import `ConsentManagerProvider` in your app's root component
|
|
71
|
+
2. Add `CookieBanner` and `ConsentManagerDialog` components
|
|
72
|
+
3. Customise styling and behaviour to fit your app
|
|
73
|
+
4. For full implementation details, see the [React quickstart docs](https://c15t.com/docs/frameworks/react/quickstart)
|
|
42
74
|
|
|
43
75
|
```tsx
|
|
44
|
-
|
|
45
|
-
import {
|
|
76
|
+
// App.tsx
|
|
77
|
+
import { ConsentManagerProvider, CookieBanner } from '@c15t/react'
|
|
46
78
|
|
|
47
|
-
|
|
79
|
+
function App() {
|
|
48
80
|
return (
|
|
49
|
-
<ConsentManagerProvider
|
|
81
|
+
<ConsentManagerProvider>
|
|
82
|
+
<YourApp />
|
|
50
83
|
<CookieBanner />
|
|
51
|
-
<ConsentManagerDialog/>
|
|
52
|
-
{/* Your app content */}
|
|
53
84
|
</ConsentManagerProvider>
|
|
54
|
-
)
|
|
85
|
+
)
|
|
55
86
|
}
|
|
56
87
|
```
|
|
57
88
|
|
|
58
|
-
##
|
|
89
|
+
## Documentation
|
|
90
|
+
|
|
91
|
+
For further information, guides, and examples visit the [reference documentation](https://c15t.com/docs/frameworks/react/quickstart).
|
|
92
|
+
|
|
93
|
+
## Support
|
|
94
|
+
|
|
95
|
+
- Join our [Discord community](https://c15t.com/discord)
|
|
96
|
+
- Open an issue on our [GitHub repository](https://github.com/c15t/c15t/issues)
|
|
97
|
+
- Visit [consent.io](https://consent.io) and use the chat widget
|
|
98
|
+
- Contact our support team via email [support@consent.io](mailto:support@consent.io)
|
|
99
|
+
|
|
100
|
+
## Contributing
|
|
101
|
+
|
|
102
|
+
- We're open to all community contributions!
|
|
103
|
+
- Read our [Contribution Guidelines](https://c15t.com/docs/oss/contributing)
|
|
104
|
+
- Review our [Code of Conduct](https://c15t.com/docs/oss/code-of-conduct)
|
|
105
|
+
- Fork the repository
|
|
106
|
+
- Create a new branch for your feature
|
|
107
|
+
- Submit a pull request
|
|
108
|
+
- **All contributions, big or small, are welcome and appreciated!**
|
|
109
|
+
|
|
110
|
+
## Security
|
|
111
|
+
|
|
112
|
+
If you believe you have found a security vulnerability in c15t, we encourage you to **_responsibly disclose this and NOT open a public issue_**. We will investigate all legitimate reports.
|
|
113
|
+
|
|
114
|
+
Our preference is that you make use of GitHub's private vulnerability reporting feature to disclose potential security vulnerabilities in our Open Source Software. To do this, please visit [https://github.com/c15t/c15t/security](https://github.com/c15t/c15t/security) and click the "Report a vulnerability" button.
|
|
115
|
+
|
|
116
|
+
### Security Policy
|
|
117
|
+
|
|
118
|
+
- Please do not share security vulnerabilities in public forums, issues, or pull requests
|
|
119
|
+
- Provide detailed information about the potential vulnerability
|
|
120
|
+
- Allow reasonable time for us to address the issue before any public disclosure
|
|
121
|
+
- We are committed to addressing security concerns promptly and transparently
|
|
122
|
+
|
|
123
|
+
## License
|
|
59
124
|
|
|
60
|
-
[GNU General Public License v3.0](https://github.com/c15t/c15t/blob/main/LICENSE.md)
|
|
125
|
+
[GNU General Public License v3.0](https://github.com/c15t/c15t/blob/main/LICENSE.md)
|
|
61
126
|
|
|
62
127
|
---
|
|
63
128
|
|
|
64
|
-
|
|
65
|
-
<strong>Built with ❤️ by the <a href="www.consent.io"/>consent.io</a> team</strong>
|
|
66
|
-
</div>
|
|
129
|
+
**Built with ❤️ by the [consent.io](https://www.consent.io?utm_source=github&utm_medium=repopage_%40c15t%2Freact) team**
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(t,{a:t}),t},__webpack_require__.d=(e,t)=>{for(var a in t)__webpack_require__.o(t,a)&&!__webpack_require__.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},__webpack_require__.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var __webpack_exports__={};let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_c15t_namespaceObject=require("c15t"),external_vitest_namespaceObject=require("vitest"),external_consent_manager_dialog_cjs_namespaceObject=require("../consent-manager-dialog.cjs"),test_helpers_cjs_namespaceObject=require("../../../utils/test-helpers.cjs");var test_helpers_cjs_default=__webpack_require__.n(test_helpers_cjs_namespaceObject);let external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let ALL_COMPONENTS=[{testId:"consent-manager-dialog-root",themeKey:"dialog.root",styles:"custom-dialog-root"},{testId:"consent-manager-dialog-overlay",themeKey:"dialog.overlay",styles:"custom-dialog-overlay"},{testId:"consent-manager-dialog-header",themeKey:"dialog.header",styles:"custom-dialog-header"},{testId:"consent-manager-dialog-title",themeKey:"dialog.title",styles:"custom-dialog-title"},{testId:"consent-manager-dialog-description",themeKey:"dialog.description",styles:"custom-dialog-description"},{testId:"consent-manager-dialog-content",themeKey:"dialog.content",styles:"custom-dialog-content"},{testId:"consent-manager-dialog-footer",themeKey:"dialog.footer",styles:"custom-dialog-footer"}];for(var __webpack_i__ in external_vitest_namespaceObject.vi.mock("~/hooks/use-consent-manager",()=>({useConsentManager:()
|
|
1
|
+
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(t,{a:t}),t},__webpack_require__.d=(e,t)=>{for(var a in t)__webpack_require__.o(t,a)&&!__webpack_require__.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},__webpack_require__.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var __webpack_exports__={};let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_c15t_namespaceObject=require("c15t"),external_vitest_namespaceObject=require("vitest"),external_consent_manager_dialog_cjs_namespaceObject=require("../consent-manager-dialog.cjs"),test_helpers_cjs_namespaceObject=require("../../../utils/test-helpers.cjs");var test_helpers_cjs_default=__webpack_require__.n(test_helpers_cjs_namespaceObject);let external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let ALL_COMPONENTS=[{testId:"consent-manager-dialog-root",themeKey:"dialog.root",styles:"custom-dialog-root"},{testId:"consent-manager-dialog-overlay",themeKey:"dialog.overlay",styles:"custom-dialog-overlay"},{testId:"consent-manager-dialog-header",themeKey:"dialog.header",styles:"custom-dialog-header"},{testId:"consent-manager-dialog-title",themeKey:"dialog.title",styles:"custom-dialog-title"},{testId:"consent-manager-dialog-description",themeKey:"dialog.description",styles:"custom-dialog-description"},{testId:"consent-manager-dialog-content",themeKey:"dialog.content",styles:"custom-dialog-content"},{testId:"consent-manager-dialog-footer",themeKey:"dialog.footer",styles:"custom-dialog-footer"}];for(var __webpack_i__ in external_vitest_namespaceObject.vi.mock("~/hooks/use-consent-manager",()=>({useConsentManager:external_vitest_namespaceObject.vi.fn().mockReturnValue({isPrivacyDialogOpen:!0,getDisplayedConsents:external_vitest_namespaceObject.vi.fn().mockReturnValue([]),saveConsents:external_vitest_namespaceObject.vi.fn(),setShowPopup:external_vitest_namespaceObject.vi.fn(),setIsPrivacyDialogOpen:external_vitest_namespaceObject.vi.fn(),translationConfig:{defaultLanguage:"en"}})})),external_vitest_namespaceObject.vi.mock("~/hooks/use-translations",()=>({useTranslations:external_vitest_namespaceObject.vi.fn().mockReturnValue(external_c15t_namespaceObject.defaultTranslationConfig.translations.en)})),(0,external_vitest_namespaceObject.test)("should apply string classNames from theme prop to all dialog elements",async()=>{let e=(0,jsx_runtime_namespaceObject.jsx)(external_consent_manager_dialog_cjs_namespaceObject.ConsentManagerDialog,{open:!0,scrollLock:!0,theme:ALL_COMPONENTS.reduce((e,{themeKey:t,styles:a})=>(e[t]=a,e),{})});await test_helpers_cjs_default()({component:e,testCases:ALL_COMPONENTS.map(({testId:e,styles:t})=>({testId:e,styles:t}))})}),(0,external_vitest_namespaceObject.test)("should apply className and style objects from theme prop to all dialog elements",async()=>{let e={backgroundColor:"#ffffff",padding:"20px",border:"1px solid #000000"},t=ALL_COMPONENTS.map(({testId:t,themeKey:a,styles:s})=>({testId:t,themeKey:a,className:s,style:e})),a=(0,jsx_runtime_namespaceObject.jsx)(external_consent_manager_dialog_cjs_namespaceObject.ConsentManagerDialog,{open:!0,scrollLock:!0,theme:t.reduce((e,{themeKey:t,className:a,style:s})=>(e[t]={className:a,style:s},e),{})});await test_helpers_cjs_default()({component:a,testCases:t.map(({testId:e,className:t,style:a})=>({testId:e,styles:{className:t,style:a}}))})}),(0,external_vitest_namespaceObject.test)("should remove default styles but keep custom classNames when top-level noStyle prop is true",async()=>{let e=(0,jsx_runtime_namespaceObject.jsx)(external_consent_manager_dialog_cjs_namespaceObject.ConsentManagerDialog,{scrollLock:!0,noStyle:!0,open:!0,theme:ALL_COMPONENTS.reduce((e,{themeKey:t,styles:a})=>(e[t]=a,e),{})});await test_helpers_cjs_default()({component:e,testCases:ALL_COMPONENTS.map(({testId:e,styles:t})=>({testId:e,styles:t})),noStyle:!0})}),(0,external_vitest_namespaceObject.test)("should remove default styles but keep custom classNames when theme object provides noStyle: true",async()=>{let e=ALL_COMPONENTS.reduce((e,{themeKey:t,styles:a})=>(e[t]={className:a,noStyle:!0},e),{}),t=(0,jsx_runtime_namespaceObject.jsx)(external_consent_manager_dialog_cjs_namespaceObject.ConsentManagerDialog,{scrollLock:!0,open:!0,theme:e});await test_helpers_cjs_default()({component:t,testCases:ALL_COMPONENTS.map(({testId:e,styles:t})=>({testId:e,styles:{className:t}}))})}),(0,external_vitest_namespaceObject.test)("should correctly apply styles when theme prop uses mixed string and object formats",async()=>{let e=(0,jsx_runtime_namespaceObject.jsx)(external_consent_manager_dialog_cjs_namespaceObject.ConsentManagerDialog,{scrollLock:!0,theme:{"dialog.root":{className:"custom-dialog-root",style:{backgroundColor:"rgb(255, 255, 255)",padding:"16px"}},"dialog.overlay":"custom-dialog-overlay"},open:!0});await test_helpers_cjs_default()({component:e,testCases:[{testId:"consent-manager-dialog-root",styles:{className:"custom-dialog-root",style:{backgroundColor:"rgb(255, 255, 255)",padding:"16px"}}},{testId:"consent-manager-dialog-overlay",styles:"custom-dialog-overlay"}]})}),(0,external_vitest_namespaceObject.test)("should handle empty strings and empty style objects in theme prop gracefully",async()=>{let e=(0,jsx_runtime_namespaceObject.jsx)(external_consent_manager_dialog_cjs_namespaceObject.ConsentManagerDialog,{scrollLock:!0,open:!0,theme:{"dialog.root":"","dialog.overlay":"","dialog.content":{className:"",style:{margin:"0",padding:"0"}}}});await test_helpers_cjs_default()({component:e,testCases:[{testId:"consent-manager-dialog-root",styles:""},{testId:"consent-manager-dialog-overlay",styles:""},{testId:"consent-manager-dialog-content",styles:{className:"",style:{margin:"0",padding:"0"}}}]})}),(0,external_vitest_namespaceObject.test)("should override base layer styles",async()=>{let e=document.createElement("style");e.textContent=`
|
|
2
2
|
.custom-dialog-background {
|
|
3
3
|
background-color: rgb(255, 0, 0) !important;
|
|
4
4
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import*as e from"react/jsx-runtime";import*as t from"c15t";import*as o from"vitest";import*as a from"../consent-manager-dialog.js";import*as s from"../../../utils/test-helpers.js";import*as n from"../consent-manager-dialog.module.js";let l=[{testId:"consent-manager-dialog-root",themeKey:"dialog.root",styles:"custom-dialog-root"},{testId:"consent-manager-dialog-overlay",themeKey:"dialog.overlay",styles:"custom-dialog-overlay"},{testId:"consent-manager-dialog-header",themeKey:"dialog.header",styles:"custom-dialog-header"},{testId:"consent-manager-dialog-title",themeKey:"dialog.title",styles:"custom-dialog-title"},{testId:"consent-manager-dialog-description",themeKey:"dialog.description",styles:"custom-dialog-description"},{testId:"consent-manager-dialog-content",themeKey:"dialog.content",styles:"custom-dialog-content"},{testId:"consent-manager-dialog-footer",themeKey:"dialog.footer",styles:"custom-dialog-footer"}];o.vi.mock("~/hooks/use-consent-manager",()=>({useConsentManager:()
|
|
1
|
+
import*as e from"react/jsx-runtime";import*as t from"c15t";import*as o from"vitest";import*as a from"../consent-manager-dialog.js";import*as s from"../../../utils/test-helpers.js";import*as n from"../consent-manager-dialog.module.js";let l=[{testId:"consent-manager-dialog-root",themeKey:"dialog.root",styles:"custom-dialog-root"},{testId:"consent-manager-dialog-overlay",themeKey:"dialog.overlay",styles:"custom-dialog-overlay"},{testId:"consent-manager-dialog-header",themeKey:"dialog.header",styles:"custom-dialog-header"},{testId:"consent-manager-dialog-title",themeKey:"dialog.title",styles:"custom-dialog-title"},{testId:"consent-manager-dialog-description",themeKey:"dialog.description",styles:"custom-dialog-description"},{testId:"consent-manager-dialog-content",themeKey:"dialog.content",styles:"custom-dialog-content"},{testId:"consent-manager-dialog-footer",themeKey:"dialog.footer",styles:"custom-dialog-footer"}];o.vi.mock("~/hooks/use-consent-manager",()=>({useConsentManager:o.vi.fn().mockReturnValue({isPrivacyDialogOpen:!0,getDisplayedConsents:o.vi.fn().mockReturnValue([]),saveConsents:o.vi.fn(),setShowPopup:o.vi.fn(),setIsPrivacyDialogOpen:o.vi.fn(),translationConfig:{defaultLanguage:"en"}})})),o.vi.mock("~/hooks/use-translations",()=>({useTranslations:o.vi.fn().mockReturnValue(t.defaultTranslationConfig.translations.en)})),(0,o.test)("should apply string classNames from theme prop to all dialog elements",async()=>{let t=(0,e.jsx)(a.ConsentManagerDialog,{open:!0,scrollLock:!0,theme:l.reduce((e,{themeKey:t,styles:o})=>(e[t]=o,e),{})});await (0,s.default)({component:t,testCases:l.map(({testId:e,styles:t})=>({testId:e,styles:t}))})}),(0,o.test)("should apply className and style objects from theme prop to all dialog elements",async()=>{let t={backgroundColor:"#ffffff",padding:"20px",border:"1px solid #000000"},o=l.map(({testId:e,themeKey:o,styles:a})=>({testId:e,themeKey:o,className:a,style:t})),n=(0,e.jsx)(a.ConsentManagerDialog,{open:!0,scrollLock:!0,theme:o.reduce((e,{themeKey:t,className:o,style:a})=>(e[t]={className:o,style:a},e),{})});await (0,s.default)({component:n,testCases:o.map(({testId:e,className:t,style:o})=>({testId:e,styles:{className:t,style:o}}))})}),(0,o.test)("should remove default styles but keep custom classNames when top-level noStyle prop is true",async()=>{let t=(0,e.jsx)(a.ConsentManagerDialog,{scrollLock:!0,noStyle:!0,open:!0,theme:l.reduce((e,{themeKey:t,styles:o})=>(e[t]=o,e),{})});await (0,s.default)({component:t,testCases:l.map(({testId:e,styles:t})=>({testId:e,styles:t})),noStyle:!0})}),(0,o.test)("should remove default styles but keep custom classNames when theme object provides noStyle: true",async()=>{let t=l.reduce((e,{themeKey:t,styles:o})=>(e[t]={className:o,noStyle:!0},e),{}),o=(0,e.jsx)(a.ConsentManagerDialog,{scrollLock:!0,open:!0,theme:t});await (0,s.default)({component:o,testCases:l.map(({testId:e,styles:t})=>({testId:e,styles:{className:t}}))})}),(0,o.test)("should correctly apply styles when theme prop uses mixed string and object formats",async()=>{let t=(0,e.jsx)(a.ConsentManagerDialog,{scrollLock:!0,theme:{"dialog.root":{className:"custom-dialog-root",style:{backgroundColor:"rgb(255, 255, 255)",padding:"16px"}},"dialog.overlay":"custom-dialog-overlay"},open:!0});await (0,s.default)({component:t,testCases:[{testId:"consent-manager-dialog-root",styles:{className:"custom-dialog-root",style:{backgroundColor:"rgb(255, 255, 255)",padding:"16px"}}},{testId:"consent-manager-dialog-overlay",styles:"custom-dialog-overlay"}]})}),(0,o.test)("should handle empty strings and empty style objects in theme prop gracefully",async()=>{let t=(0,e.jsx)(a.ConsentManagerDialog,{scrollLock:!0,open:!0,theme:{"dialog.root":"","dialog.overlay":"","dialog.content":{className:"",style:{margin:"0",padding:"0"}}}});await (0,s.default)({component:t,testCases:[{testId:"consent-manager-dialog-root",styles:""},{testId:"consent-manager-dialog-overlay",styles:""},{testId:"consent-manager-dialog-content",styles:{className:"",style:{margin:"0",padding:"0"}}}]})}),(0,o.test)("should override base layer styles",async()=>{let t=document.createElement("style");t.textContent=`
|
|
2
2
|
.custom-dialog-background {
|
|
3
3
|
background-color: rgb(255, 0, 0) !important;
|
|
4
4
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(a,{a:a}),a},__webpack_require__.d=(e,a)=>{for(var t in a)__webpack_require__.o(a,t)&&!__webpack_require__.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:a[t]})},__webpack_require__.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{DialogHeader:()=>DialogHeader,Content:()=>Content,Footer:()=>Footer,DialogFooter:()=>DialogFooter,ConsentCustomizationCard:()=>ConsentCustomizationCard,Card:()=>Card,DialogContent:()=>DialogContent,Header:()=>Header,DialogHeaderTitle:()=>DialogHeaderTitle,HeaderTitle:()=>HeaderTitle,HeaderDescription:()=>HeaderDescription,DialogHeaderDescription:()=>DialogHeaderDescription,BrandingFooter:()=>BrandingFooter});let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_react_namespaceObject=require("react"),consent_manager_widget_cjs_namespaceObject=require("../../consent-manager-widget/consent-manager-widget.cjs"),box_cjs_namespaceObject=require("../../shared/primitives/box.cjs"),logo_cjs_namespaceObject=require("../../shared/ui/logo.cjs"),index_cjs_namespaceObject=require("../../../hooks/index.cjs"),use_translations_cjs_namespaceObject=require("../../../hooks/use-translations.cjs"),external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let DialogCard=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().card,...a,themeKey:"dialog.root","data-testid":"consent-manager-dialog-root",children:e})),DialogHeader=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().header,...a,themeKey:"dialog.header","data-testid":"consent-manager-dialog-header",children:e})),DialogHeaderTitle=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().title,themeKey:"dialog.title",...a,"data-testid":"consent-manager-dialog-title",children:e})),DialogHeaderDescription=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().description,themeKey:"dialog.description",...a,"data-testid":"consent-manager-dialog-description",children:e})),DialogContent=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().content,themeKey:"dialog.content","data-testid":"consent-manager-dialog-content",...a,children:e})),DialogFooter=(0,external_react_namespaceObject.forwardRef)(({children:e,themeKey:a,...t},r)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:r,className:external_consent_manager_dialog_module_cjs_default().footer,themeKey:a||"dialog.footer",...t,"data-testid":"consent-manager-dialog-footer",children:e})),BrandingFooter=()=>{let
|
|
2
|
+
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(a,{a:a}),a},__webpack_require__.d=(e,a)=>{for(var t in a)__webpack_require__.o(a,t)&&!__webpack_require__.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:a[t]})},__webpack_require__.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{DialogHeader:()=>DialogHeader,Content:()=>Content,Footer:()=>Footer,DialogFooter:()=>DialogFooter,ConsentCustomizationCard:()=>ConsentCustomizationCard,Card:()=>Card,DialogContent:()=>DialogContent,Header:()=>Header,DialogHeaderTitle:()=>DialogHeaderTitle,HeaderTitle:()=>HeaderTitle,HeaderDescription:()=>HeaderDescription,DialogHeaderDescription:()=>DialogHeaderDescription,BrandingFooter:()=>BrandingFooter});let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_react_namespaceObject=require("react"),consent_manager_widget_cjs_namespaceObject=require("../../consent-manager-widget/consent-manager-widget.cjs"),box_cjs_namespaceObject=require("../../shared/primitives/box.cjs"),logo_cjs_namespaceObject=require("../../shared/ui/logo.cjs"),index_cjs_namespaceObject=require("../../../hooks/index.cjs"),use_translations_cjs_namespaceObject=require("../../../hooks/use-translations.cjs"),external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let DialogCard=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().card,...a,themeKey:"dialog.root","data-testid":"consent-manager-dialog-root",children:e})),DialogHeader=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().header,...a,themeKey:"dialog.header","data-testid":"consent-manager-dialog-header",children:e})),DialogHeaderTitle=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().title,themeKey:"dialog.title",...a,"data-testid":"consent-manager-dialog-title",children:e})),DialogHeaderDescription=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().description,themeKey:"dialog.description",...a,"data-testid":"consent-manager-dialog-description",children:e})),DialogContent=(0,external_react_namespaceObject.forwardRef)(({children:e,...a},t)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:t,className:external_consent_manager_dialog_module_cjs_default().content,themeKey:"dialog.content","data-testid":"consent-manager-dialog-content",...a,children:e})),DialogFooter=(0,external_react_namespaceObject.forwardRef)(({children:e,themeKey:a,...t},r)=>(0,jsx_runtime_namespaceObject.jsx)(box_cjs_namespaceObject.Box,{ref:r,className:external_consent_manager_dialog_module_cjs_default().footer,themeKey:a||"dialog.footer",...t,"data-testid":"consent-manager-dialog-footer",children:e})),BrandingFooter=()=>{let{branding:e}=(0,index_cjs_namespaceObject.useConsentManager)();if("none"===e)return null;let a="undefined"!=typeof window?`?ref=${window.location.hostname}`:"";return(0,jsx_runtime_namespaceObject.jsxs)("a",{dir:"ltr",className:external_consent_manager_dialog_module_cjs_default().branding,href:"consent"===e?`https://consent.io${a}`:`https://c15t.com${a}`,children:["Secured by"," ","consent"===e?(0,jsx_runtime_namespaceObject.jsx)(logo_cjs_namespaceObject.ConsentLogo,{className:external_consent_manager_dialog_module_cjs_default().brandingConsent}):(0,jsx_runtime_namespaceObject.jsx)(logo_cjs_namespaceObject.C15TIcon,{className:external_consent_manager_dialog_module_cjs_default().brandingC15T})]})},ConsentCustomizationCard=({noStyle:e})=>{let{consentManagerDialog:a}=(0,use_translations_cjs_namespaceObject.useTranslations)();return(0,jsx_runtime_namespaceObject.jsxs)(DialogCard,{children:[(0,jsx_runtime_namespaceObject.jsxs)(DialogHeader,{children:[(0,jsx_runtime_namespaceObject.jsx)(DialogHeaderTitle,{children:a.title}),(0,jsx_runtime_namespaceObject.jsx)(DialogHeaderDescription,{children:a.description})]}),(0,jsx_runtime_namespaceObject.jsx)(DialogContent,{children:(0,jsx_runtime_namespaceObject.jsx)(consent_manager_widget_cjs_namespaceObject.ConsentManagerWidget,{hideBrading:!0,noStyle:e,useProvider:!0})}),(0,jsx_runtime_namespaceObject.jsx)(DialogFooter,{themeKey:"dialog.footer",children:(0,jsx_runtime_namespaceObject.jsx)(BrandingFooter,{})})]})},Card=DialogCard,Header=DialogHeader,HeaderTitle=DialogHeaderTitle,HeaderDescription=DialogHeaderDescription,Content=DialogContent,Footer=DialogFooter;for(var __webpack_i__ in exports.BrandingFooter=__webpack_exports__.BrandingFooter,exports.Card=__webpack_exports__.Card,exports.ConsentCustomizationCard=__webpack_exports__.ConsentCustomizationCard,exports.Content=__webpack_exports__.Content,exports.DialogContent=__webpack_exports__.DialogContent,exports.DialogFooter=__webpack_exports__.DialogFooter,exports.DialogHeader=__webpack_exports__.DialogHeader,exports.DialogHeaderDescription=__webpack_exports__.DialogHeaderDescription,exports.DialogHeaderTitle=__webpack_exports__.DialogHeaderTitle,exports.Footer=__webpack_exports__.Footer,exports.Header=__webpack_exports__.Header,exports.HeaderDescription=__webpack_exports__.HeaderDescription,exports.HeaderTitle=__webpack_exports__.HeaderTitle,__webpack_exports__)-1===["BrandingFooter","Card","ConsentCustomizationCard","Content","DialogContent","DialogFooter","DialogHeader","DialogHeaderDescription","DialogHeaderTitle","Footer","Header","HeaderDescription","HeaderTitle"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
|
|
@@ -59,7 +59,7 @@ declare const DialogFooter: import("react").ForwardRefExoticComponent<BoxProps &
|
|
|
59
59
|
/**
|
|
60
60
|
* The branding footer with configurable logo
|
|
61
61
|
*/
|
|
62
|
-
export declare const BrandingFooter: () => import("react/jsx-runtime").JSX.Element;
|
|
62
|
+
export declare const BrandingFooter: () => import("react/jsx-runtime").JSX.Element | null;
|
|
63
63
|
/**
|
|
64
64
|
* A pre-configured privacy settings dialog card.
|
|
65
65
|
* Combines all dialog components with default content for privacy customization.
|
|
@@ -79,9 +79,8 @@ export declare const BrandingFooter: () => import("react/jsx-runtime").JSX.Eleme
|
|
|
79
79
|
* - Includes consent type management
|
|
80
80
|
* - Built-in accessibility features
|
|
81
81
|
*/
|
|
82
|
-
declare const ConsentCustomizationCard: ({ noStyle
|
|
82
|
+
declare const ConsentCustomizationCard: ({ noStyle }: {
|
|
83
83
|
noStyle?: boolean;
|
|
84
|
-
useConsentLogo?: boolean;
|
|
85
84
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
86
85
|
declare const Card: import("react").ForwardRefExoticComponent<{
|
|
87
86
|
/** The content to be rendered inside the dialog card */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog-card.d.ts","sourceRoot":"","sources":["../../../../src/components/consent-manager-dialog/atoms/dialog-card.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"dialog-card.d.ts","sourceRoot":"","sources":["../../../../src/components/consent-manager-dialog/atoms/dialog-card.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,EAAc,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAG7D,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAIxE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AA4BpD;;;;;;;;GAQG;AACH,QAAA,MAAM,YAAY,uHAcjB,CAAC;AAEF;;;;;;;;GAQG;AACH,QAAA,MAAM,iBAAiB,uHAerB,CAAC;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,uBAAuB,uHAe3B,CAAC;AAEH;;;;;;;;GAQG;AACH,QAAA,MAAM,aAAa,uHAclB,CAAC;AAEF;;;;;;;;GAQG;AACH,QAAA,MAAM,YAAY,qGAcjB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,sDA4B1B,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,wBAAwB,GAAI,aAAa;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,4CAuBnE,CAAC;AAEF,QAAA,MAAM,IAAI;IAhOT,wDAAwD;eAC7C,SAAS;mEA+NE,CAAC;AACxB,QAAA,MAAM,MAAM,uHAAe,CAAC;AAC5B,QAAA,MAAM,WAAW,uHAAoB,CAAC;AACtC,QAAA,MAAM,iBAAiB,uHAA0B,CAAC;AAClD,QAAA,MAAM,OAAO,uHAAgB,CAAC;AAC9B,QAAA,MAAM,MAAM,qGAAe,CAAC;AAE5B,OAAO,EACN,IAAI,EACJ,MAAM,EACN,WAAW,EACX,iBAAiB,EACjB,OAAO,EACP,MAAM,EACN,wBAAwB,EACxB,YAAY,EACZ,YAAY,EACZ,iBAAiB,EACjB,uBAAuB,EACvB,aAAa,GACb,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import*as e from"react/jsx-runtime";import*as a from"react";import*as
|
|
2
|
+
import*as e from"react/jsx-runtime";import*as a from"react";import*as t from"../../consent-manager-widget/consent-manager-widget.js";import*as o from"../../shared/primitives/box.js";import*as r from"../../shared/ui/logo.js";import*as n from"../../../hooks/index.js";import*as s from"../../../hooks/use-translations.js";import*as i from"../consent-manager-dialog.module.js";let d=(0,a.forwardRef)(({children:a,...t},r)=>(0,e.jsx)(o.Box,{ref:r,className:i.default.card,...t,themeKey:"dialog.root","data-testid":"consent-manager-dialog-root",children:a})),l=(0,a.forwardRef)(({children:a,...t},r)=>(0,e.jsx)(o.Box,{ref:r,className:i.default.header,...t,themeKey:"dialog.header","data-testid":"consent-manager-dialog-header",children:a})),c=(0,a.forwardRef)(({children:a,...t},r)=>(0,e.jsx)(o.Box,{ref:r,className:i.default.title,themeKey:"dialog.title",...t,"data-testid":"consent-manager-dialog-title",children:a})),m=(0,a.forwardRef)(({children:a,...t},r)=>(0,e.jsx)(o.Box,{ref:r,className:i.default.description,themeKey:"dialog.description",...t,"data-testid":"consent-manager-dialog-description",children:a})),f=(0,a.forwardRef)(({children:a,...t},r)=>(0,e.jsx)(o.Box,{ref:r,className:i.default.content,themeKey:"dialog.content","data-testid":"consent-manager-dialog-content",...t,children:a})),g=(0,a.forwardRef)(({children:a,themeKey:t,...r},n)=>(0,e.jsx)(o.Box,{ref:n,className:i.default.footer,themeKey:t||"dialog.footer",...r,"data-testid":"consent-manager-dialog-footer",children:a})),h=()=>{let{branding:a}=(0,n.useConsentManager)();if("none"===a)return null;let t="undefined"!=typeof window?`?ref=${window.location.hostname}`:"";return(0,e.jsxs)("a",{dir:"ltr",className:i.default.branding,href:"consent"===a?`https://consent.io${t}`:`https://c15t.com${t}`,children:["Secured by"," ","consent"===a?(0,e.jsx)(r.ConsentLogo,{className:i.default.brandingConsent}):(0,e.jsx)(r.C15TIcon,{className:i.default.brandingC15T})]})},x=({noStyle:a})=>{let{consentManagerDialog:o}=(0,s.useTranslations)();return(0,e.jsxs)(d,{children:[(0,e.jsxs)(l,{children:[(0,e.jsx)(c,{children:o.title}),(0,e.jsx)(m,{children:o.description})]}),(0,e.jsx)(f,{children:(0,e.jsx)(t.ConsentManagerWidget,{hideBrading:!0,noStyle:a,useProvider:!0})}),(0,e.jsx)(g,{themeKey:"dialog.footer",children:(0,e.jsx)(h,{})})]})},j=d,u=l,p=c,w=m,C=f,y=g;export{h as BrandingFooter,j as Card,x as ConsentCustomizationCard,C as Content,f as DialogContent,g as DialogFooter,l as DialogHeader,m as DialogHeaderDescription,c as DialogHeaderTitle,y as Footer,u as Header,w as HeaderDescription,p as HeaderTitle};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var _=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(_,{a:_}),_},__webpack_require__.d=(e,_)=>{for(var a in _)__webpack_require__.o(_,a)&&!__webpack_require__.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:_[a]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Overlay:()=>Overlay,ConsentManagerDialogOverlay:()=>ConsentManagerDialogOverlay});let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_clsx_namespaceObject=require("clsx");var external_clsx_default=__webpack_require__.n(external_clsx_namespaceObject);let external_react_namespaceObject=require("react"),use_consent_manager_cjs_namespaceObject=require("../../../hooks/use-consent-manager.cjs"),use_scroll_lock_cjs_namespaceObject=require("../../../hooks/use-scroll-lock.cjs"),use_styles_cjs_namespaceObject=require("../../../hooks/use-styles.cjs"),use_theme_cjs_namespaceObject=require("../../../hooks/use-theme.cjs"),external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let ConsentManagerDialogOverlay=({noStyle:e,style:_
|
|
1
|
+
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var _=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(_,{a:_}),_},__webpack_require__.d=(e,_)=>{for(var a in _)__webpack_require__.o(_,a)&&!__webpack_require__.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:_[a]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Overlay:()=>Overlay,ConsentManagerDialogOverlay:()=>ConsentManagerDialogOverlay});let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_clsx_namespaceObject=require("clsx");var external_clsx_default=__webpack_require__.n(external_clsx_namespaceObject);let external_react_namespaceObject=require("react"),use_consent_manager_cjs_namespaceObject=require("../../../hooks/use-consent-manager.cjs"),use_scroll_lock_cjs_namespaceObject=require("../../../hooks/use-scroll-lock.cjs"),use_styles_cjs_namespaceObject=require("../../../hooks/use-styles.cjs"),use_theme_cjs_namespaceObject=require("../../../hooks/use-theme.cjs"),external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let ConsentManagerDialogOverlay=({noStyle:e,style:_})=>{let a,{isPrivacyDialogOpen:r}=(0,use_consent_manager_cjs_namespaceObject.useConsentManager)(),{disableAnimation:t,noStyle:s,scrollLock:n=!0}=(0,use_theme_cjs_namespaceObject.useTheme)(),[c,l]=(0,external_react_namespaceObject.useState)(!1);(0,external_react_namespaceObject.useEffect)(()=>{if(r)l(!0);else if(t)l(!1);else{let e=setTimeout(()=>{l(!1)},Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue("--dialog-animation-duration")||"200",10));return()=>clearTimeout(e)}},[r,t]);let o="string"==typeof _?_:_?.className,u=(0,use_styles_cjs_namespaceObject.useStyles)("dialog.overlay",{baseClassName:!(s||e)&&external_consent_manager_dialog_module_cjs_default().overlay,className:o,noStyle:s||e});a=s||e||t?void 0:c?external_consent_manager_dialog_module_cjs_default().overlayVisible:external_consent_manager_dialog_module_cjs_default().overlayHidden;let i=external_clsx_default()(u.className,a),p=!!(open||r)&&n;return(0,use_scroll_lock_cjs_namespaceObject.useScrollLock)(p),p?(0,jsx_runtime_namespaceObject.jsx)("div",{style:"object"==typeof _&&"style"in _?{...u.style,..._.style}:u.style,className:i,"data-testid":"consent-manager-dialog-overlay"}):null},Overlay=ConsentManagerDialogOverlay;for(var __webpack_i__ in exports.ConsentManagerDialogOverlay=__webpack_exports__.ConsentManagerDialogOverlay,exports.Overlay=__webpack_exports__.Overlay,__webpack_exports__)-1===["ConsentManagerDialogOverlay","Overlay"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Provides the overlay backdrop component for the consent management interface.
|
|
4
4
|
* Implements accessible modal behavior with animation support.
|
|
5
5
|
*/
|
|
6
|
-
import { type FC } from 'react';
|
|
6
|
+
import { type FC, type PropsWithChildren } from 'react';
|
|
7
7
|
import type { ThemeValue } from '../../../types/theme';
|
|
8
8
|
/**
|
|
9
9
|
* Props for the Overlay component.
|
|
@@ -15,7 +15,16 @@ import type { ThemeValue } from '../../../types/theme';
|
|
|
15
15
|
*
|
|
16
16
|
* @public
|
|
17
17
|
*/
|
|
18
|
-
|
|
18
|
+
/**
|
|
19
|
+
* Props for the Overlay component.
|
|
20
|
+
*
|
|
21
|
+
* @remarks
|
|
22
|
+
* Extends {@link PropsWithChildren} so that the overlay can optionally wrap
|
|
23
|
+
* its compound components (e.g. `ConsentManagerDialog.Card`). This resolves
|
|
24
|
+
* TypeScript errors when consumers nest elements inside
|
|
25
|
+
* `<ConsentManagerDialog.Root>`.
|
|
26
|
+
*/
|
|
27
|
+
export type OverlayProps = PropsWithChildren<{
|
|
19
28
|
/**
|
|
20
29
|
* Custom styles to override default overlay styling.
|
|
21
30
|
*
|
|
@@ -34,37 +43,7 @@ interface OverlayProps {
|
|
|
34
43
|
* - Maintains functionality without visual opinions
|
|
35
44
|
*/
|
|
36
45
|
noStyle?: boolean;
|
|
37
|
-
|
|
38
|
-
* Opens the overlay when true.
|
|
39
|
-
*
|
|
40
|
-
* @remarks
|
|
41
|
-
* - Useful for testing purposes
|
|
42
|
-
*/
|
|
43
|
-
open?: boolean;
|
|
44
|
-
}
|
|
45
|
-
/**
|
|
46
|
-
* Overlay component that provides a backdrop for the consent management interface.
|
|
47
|
-
*
|
|
48
|
-
* @remarks
|
|
49
|
-
* Key features:
|
|
50
|
-
* - Renders a semi-transparent backdrop
|
|
51
|
-
* - Implements fade in/out animations (when enabled)
|
|
52
|
-
* - Manages proper z-indexing for modal behavior
|
|
53
|
-
* - Supports theme-based styling
|
|
54
|
-
* - Automatically handles visibility based on dialog state
|
|
55
|
-
*
|
|
56
|
-
* @example
|
|
57
|
-
* ```tsx
|
|
58
|
-
* <ConsentManager>
|
|
59
|
-
* <Overlay />
|
|
60
|
-
* <DialogCard>
|
|
61
|
-
* // Dialog content
|
|
62
|
-
* </DialogCard>
|
|
63
|
-
* </ConsentManager>
|
|
64
|
-
* ```
|
|
65
|
-
*
|
|
66
|
-
* @public
|
|
67
|
-
*/
|
|
46
|
+
}>;
|
|
68
47
|
declare const ConsentManagerDialogOverlay: FC<OverlayProps>;
|
|
69
48
|
declare const Overlay: FC<OverlayProps>;
|
|
70
49
|
export { Overlay, ConsentManagerDialogOverlay };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/consent-manager-dialog/atoms/overlay.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,EAAE,KAAK,EAAE,EAAuB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../../src/components/consent-manager-dialog/atoms/overlay.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAK7E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhD;;;;;;;;;GASG;AAEH;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,iBAAiB,CAAC;IAC5C;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IAEnB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC,CAAC;AAEH,QAAA,MAAM,2BAA2B,EAAE,EAAE,CAAC,YAAY,CAsEjD,CAAC;AAEF,QAAA,MAAM,OAAO,kBAA8B,CAAC;AAE5C,OAAO,EAAE,OAAO,EAAE,2BAA2B,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react/jsx-runtime";import*as s from"clsx";import*as t from"react";import*as o from"../../../hooks/use-consent-manager.js";import*as a from"../../../hooks/use-scroll-lock.js";import*as l from"../../../hooks/use-styles.js";import*as r from"../../../hooks/use-theme.js";import*as m from"../consent-manager-dialog.module.js";let n=({noStyle:n,style:i
|
|
1
|
+
import*as e from"react/jsx-runtime";import*as s from"clsx";import*as t from"react";import*as o from"../../../hooks/use-consent-manager.js";import*as a from"../../../hooks/use-scroll-lock.js";import*as l from"../../../hooks/use-styles.js";import*as r from"../../../hooks/use-theme.js";import*as m from"../consent-manager-dialog.module.js";let n=({noStyle:n,style:i})=>{let u,{isPrivacyDialogOpen:y}=(0,o.useConsentManager)(),{disableAnimation:c,noStyle:d,scrollLock:f=!0}=(0,r.useTheme)(),[p,g]=(0,t.useState)(!1);(0,t.useEffect)(()=>{if(y)g(!0);else if(c)g(!1);else{let e=setTimeout(()=>{g(!1)},Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue("--dialog-animation-duration")||"200",10));return()=>clearTimeout(e)}},[y,c]);let v="string"==typeof i?i:i?.className,j=(0,l.useStyles)("dialog.overlay",{baseClassName:!(d||n)&&m.default.overlay,className:v,noStyle:d||n});u=d||n||c?void 0:p?m.default.overlayVisible:m.default.overlayHidden;let h=(0,s.default)(j.className,u),k=!!(open||y)&&f;return(0,a.useScrollLock)(k),k?(0,e.jsx)("div",{style:"object"==typeof i&&"style"in i?{...j.style,...i.style}:j.style,className:h,"data-testid":"consent-manager-dialog-overlay"}):null},i=n;export{n as ConsentManagerDialogOverlay,i as Overlay};
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.n=e=>{var _=e&&e.__esModule?()=>e.default:()=>e;return __webpack_require__.d(_,{a:_}),_},__webpack_require__.d=(e,_)=>{for(var a in _)__webpack_require__.o(_,a)&&!__webpack_require__.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:_[a]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Root:()=>Root,ConsentManagerDialogRoot:()=>ConsentManagerDialogRoot});let jsx_runtime_namespaceObject=require("react/jsx-runtime"),external_clsx_namespaceObject=require("clsx");var external_clsx_default=__webpack_require__.n(external_clsx_namespaceObject);let external_react_namespaceObject=require("react"),external_react_dom_namespaceObject=require("react-dom"),theme_context_cjs_namespaceObject=require("../../../context/theme-context.cjs"),index_cjs_namespaceObject=require("../../../hooks/index.cjs"),use_consent_manager_cjs_namespaceObject=require("../../../hooks/use-consent-manager.cjs"),use_focus_trap_cjs_namespaceObject=require("../../../hooks/use-focus-trap.cjs"),use_scroll_lock_cjs_namespaceObject=require("../../../hooks/use-scroll-lock.cjs"),use_styles_cjs_namespaceObject=require("../../../hooks/use-styles.cjs"),use_theme_cjs_namespaceObject=require("../../../hooks/use-theme.cjs"),external_consent_manager_dialog_module_cjs_namespaceObject=require("../consent-manager-dialog.module.cjs");var external_consent_manager_dialog_module_cjs_default=__webpack_require__.n(external_consent_manager_dialog_module_cjs_namespaceObject);let external_overlay_cjs_namespaceObject=require("./overlay.cjs"),ConsentManagerDialogRoot=({children:e,open:_,noStyle:a,disableAnimation:t,scrollLock:c=!0,trapFocus:r=!0,overlay:n,className:s,style:o,theme:l,...u})=>{let i=(0,use_theme_cjs_namespaceObject.useTheme)(),m={...i.theme,...l},p=t??i.disableAnimation??!1,j=a??i.noStyle??!1,d=c??i.scrollLock??!0,b=r??i.trapFocus??!0,{isPrivacyDialogOpen:x,translationConfig:g}=(0,use_consent_manager_cjs_namespaceObject.useConsentManager)(),O=(0,index_cjs_namespaceObject.useTextDirection)(g.defaultLanguage),f=_??x,[k,y]=(0,external_react_namespaceObject.useState)(!1),q=(0,external_react_namespaceObject.useRef)(null),w=(0,external_react_namespaceObject.useRef)(null),[h,v]=(0,external_react_namespaceObject.useState)(!1);(0,external_react_namespaceObject.useEffect)(()=>{v(!0)},[]),(0,external_react_namespaceObject.useEffect)(()=>{if(f)y(!0);else if(p)y(!1);else{let e=setTimeout(()=>y(!1),Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue("--dialog-animation-duration")||"200",10));return()=>clearTimeout(e)}},[f,p]),(0,use_focus_trap_cjs_namespaceObject.useFocusTrap)(f&&b,q),(0,use_scroll_lock_cjs_namespaceObject.useScrollLock)(f&&d);let R=external_clsx_default()(external_consent_manager_dialog_module_cjs_default().root,!p&&(k?external_consent_manager_dialog_module_cjs_default().dialogVisible:external_consent_manager_dialog_module_cjs_default().dialogHidden),s),S=(0,use_styles_cjs_namespaceObject.useStyles)("dialog.root",{baseClassName:void 0,className:R,style:o,noStyle:j}),M=(0,jsx_runtime_namespaceObject.jsx)(theme_context_cjs_namespaceObject.LocalThemeContext.Provider,{value:{disableAnimation:p,noStyle:j,scrollLock:d,trapFocus:b,theme:m},children:f&&(0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment,{children:[!1===n?null:n??(0,jsx_runtime_namespaceObject.jsx)(external_overlay_cjs_namespaceObject.Overlay,{}),(0,jsx_runtime_namespaceObject.jsx)("dialog",{ref:q,...u,...S,className:S.className,"aria-labelledby":"privacy-settings-title",tabIndex:-1,dir:O,children:(0,jsx_runtime_namespaceObject.jsx)("div",{ref:w,className:external_clsx_default()(external_consent_manager_dialog_module_cjs_default().container,!p&&k?external_consent_manager_dialog_module_cjs_default().contentVisible:external_consent_manager_dialog_module_cjs_default().contentHidden),children:e})})]})});return h?(0,external_react_dom_namespaceObject.createPortal)(M,document.body):null},Root=ConsentManagerDialogRoot;for(var __webpack_i__ in exports.ConsentManagerDialogRoot=__webpack_exports__.ConsentManagerDialogRoot,exports.Root=__webpack_exports__.Root,__webpack_exports__)-1===["ConsentManagerDialogRoot","Root"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import type { FC, HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { type ThemeContextValue } from '../../../context/theme-context';
|
|
3
|
+
import type { ConsentManagerDialogTheme } from '../theme';
|
|
4
|
+
/**
|
|
5
|
+
* Props for the root component of the ConsentManagerDialog.
|
|
6
|
+
*
|
|
7
|
+
* @public
|
|
8
|
+
*/
|
|
9
|
+
export interface ConsentManagerDialogRootProps extends ThemeContextValue<ConsentManagerDialogTheme>, HTMLAttributes<HTMLDialogElement> {
|
|
10
|
+
/**
|
|
11
|
+
* React children that will be rendered inside the dialog container.
|
|
12
|
+
* Typically this includes `ConsentManagerDialog.Card` and its sub-components.
|
|
13
|
+
*/
|
|
14
|
+
children: ReactNode;
|
|
15
|
+
/**
|
|
16
|
+
* Explicitly control the open state of the dialog. If omitted, the dialog
|
|
17
|
+
* relies on the consent manager (`isPrivacyDialogOpen`) value.
|
|
18
|
+
*/
|
|
19
|
+
open?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* When true, the component will not apply any internal styles.
|
|
22
|
+
*/
|
|
23
|
+
noStyle?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Disable entrance / exit animations when true.
|
|
26
|
+
*/
|
|
27
|
+
disableAnimation?: boolean;
|
|
28
|
+
/**
|
|
29
|
+
* Lock body scroll while the dialog is open. Defaults to `true`.
|
|
30
|
+
*/
|
|
31
|
+
scrollLock?: boolean;
|
|
32
|
+
/**
|
|
33
|
+
* Trap focus within the dialog while it is open. Defaults to `true`.
|
|
34
|
+
*/
|
|
35
|
+
trapFocus?: boolean;
|
|
36
|
+
/**
|
|
37
|
+
* Custom backdrop element. Pass a React node to replace the built-in
|
|
38
|
+
* semi-transparent overlay or pass `false` to render no backdrop at all.
|
|
39
|
+
*
|
|
40
|
+
* @default undefined (builtin overlay)
|
|
41
|
+
*/
|
|
42
|
+
overlay?: ReactNode | false;
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* Provides theming context, focus-management and portal rendering for the
|
|
46
|
+
* Consent Manager Dialog. This component is also exposed as
|
|
47
|
+
* `ConsentManagerDialog.Root` to enable the compound-component usage:
|
|
48
|
+
*
|
|
49
|
+
* ```tsx
|
|
50
|
+
* <ConsentManagerDialog.Root>
|
|
51
|
+
* <ConsentManagerDialog.Card>
|
|
52
|
+
* …
|
|
53
|
+
* </ConsentManagerDialog.Card>
|
|
54
|
+
* </ConsentManagerDialog.Root>
|
|
55
|
+
* ```
|
|
56
|
+
*/
|
|
57
|
+
declare const ConsentManagerDialogRoot: FC<ConsentManagerDialogRootProps>;
|
|
58
|
+
declare const Root: FC<ConsentManagerDialogRootProps>;
|
|
59
|
+
export { Root, ConsentManagerDialogRoot };
|
|
60
|
+
//# sourceMappingURL=root.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../../../src/components/consent-manager-dialog/atoms/root.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,EAAE,EAAE,cAAc,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAGtE,OAAO,EAEN,KAAK,iBAAiB,EACtB,MAAM,yBAAyB,CAAC;AASjC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AAG1D;;;;GAIG;AACH,MAAM,WAAW,6BAChB,SAAQ,iBAAiB,CAAC,yBAAyB,CAAC,EACnD,cAAc,CAAC,iBAAiB,CAAC;IAClC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,KAAK,CAAC;CAC5B;AAED;;;;;;;;;;;;GAYG;AACH,QAAA,MAAM,wBAAwB,EAAE,EAAE,CAAC,6BAA6B,CAuI/D,CAAC;AAEF,QAAA,MAAM,IAAI,mCAA2B,CAAC;AAEtC,OAAO,EAAE,IAAI,EAAE,wBAAwB,EAAE,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import*as e from"react/jsx-runtime";import*as o from"clsx";import*as t from"react";import*as s from"react-dom";import*as a from"../../../context/theme-context.js";import*as r from"../../../hooks/index.js";import*as l from"../../../hooks/use-consent-manager.js";import*as i from"../../../hooks/use-focus-trap.js";import*as n from"../../../hooks/use-scroll-lock.js";import*as m from"../../../hooks/use-styles.js";import*as u from"../../../hooks/use-theme.js";import*as c from"../consent-manager-dialog.module.js";import*as d from"./overlay.js";let f=({children:f,open:p,noStyle:g,disableAnimation:h,scrollLock:j=!0,trapFocus:x=!0,overlay:y,className:b,style:k,theme:v,...S})=>{let N=(0,u.useTheme)(),T={...N.theme,...v},C=h??N.disableAnimation??!1,L=g??N.noStyle??!1,F=j??N.scrollLock??!0,R=x??N.trapFocus??!0,{isPrivacyDialogOpen:E,translationConfig:P}=(0,l.useConsentManager)(),V=(0,r.useTextDirection)(P.defaultLanguage),A=p??E,[D,H]=(0,t.useState)(!1),I=(0,t.useRef)(null),M=(0,t.useRef)(null),[O,q]=(0,t.useState)(!1);(0,t.useEffect)(()=>{q(!0)},[]),(0,t.useEffect)(()=>{if(A)H(!0);else if(C)H(!1);else{let e=setTimeout(()=>H(!1),Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue("--dialog-animation-duration")||"200",10));return()=>clearTimeout(e)}},[A,C]),(0,i.useFocusTrap)(A&&R,I),(0,n.useScrollLock)(A&&F);let w=(0,o.default)(c.default.root,!C&&(D?c.default.dialogVisible:c.default.dialogHidden),b),z=(0,m.useStyles)("dialog.root",{baseClassName:void 0,className:w,style:k,noStyle:L}),B=(0,e.jsx)(a.LocalThemeContext.Provider,{value:{disableAnimation:C,noStyle:L,scrollLock:F,trapFocus:R,theme:T},children:A&&(0,e.jsxs)(e.Fragment,{children:[!1===y?null:y??(0,e.jsx)(d.Overlay,{}),(0,e.jsx)("dialog",{ref:I,...S,...z,className:z.className,"aria-labelledby":"privacy-settings-title",tabIndex:-1,dir:V,children:(0,e.jsx)("div",{ref:M,className:(0,o.default)(c.default.container,!C&&D?c.default.contentVisible:c.default.contentHidden),children:f})})]})});return O?(0,s.createPortal)(B,document.body):null},p=f;export{f as ConsentManagerDialogRoot,p as Root};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.
|
|
2
|
+
"use strict";let __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,_)=>{for(var r in _)__webpack_require__.o(_,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:_[r]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ConsentManagerDialog:()=>ConsentManagerDialog});let jsx_runtime_namespaceObject=require("react/jsx-runtime"),use_consent_manager_cjs_namespaceObject=require("../../hooks/use-consent-manager.cjs"),use_theme_cjs_namespaceObject=require("../../hooks/use-theme.cjs"),dialog_card_cjs_namespaceObject=require("./atoms/dialog-card.cjs"),root_cjs_namespaceObject=require("./atoms/root.cjs"),ConsentManagerDialog=({open:e,theme:_,noStyle:r,disableAnimation:a,scrollLock:t=!0,trapFocus:o=!0})=>{let n=(0,use_theme_cjs_namespaceObject.useTheme)(),{isPrivacyDialogOpen:c}=(0,use_consent_manager_cjs_namespaceObject.useConsentManager)(),s={open:e??c,theme:{...n.theme,..._},noStyle:r??n.noStyle,disableAnimation:a??n.disableAnimation,scrollLock:t??n.scrollLock,trapFocus:o??n.trapFocus};return(0,jsx_runtime_namespaceObject.jsx)(root_cjs_namespaceObject.Root,{...s,children:(0,jsx_runtime_namespaceObject.jsx)(dialog_card_cjs_namespaceObject.ConsentCustomizationCard,{noStyle:s.noStyle})})};for(var __webpack_i__ in exports.ConsentManagerDialog=__webpack_exports__.ConsentManagerDialog,__webpack_exports__)-1===["ConsentManagerDialog"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
|
|
@@ -1,45 +1,26 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @packageDocumentation
|
|
3
|
-
*
|
|
4
|
-
*
|
|
3
|
+
* Default implementation of the Consent-Manager dialog that ships with c15t.
|
|
4
|
+
*
|
|
5
|
+
* The new compound-component API exposes all primitives (Root, Card, etc.).
|
|
6
|
+
* This default export simply composes those primitives so consumers that
|
|
7
|
+
* prefer a one-line `<ConsentManagerDialog />` usage still have it.
|
|
5
8
|
*/
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
9
|
+
import type { FC } from 'react';
|
|
10
|
+
import type { ThemeContextValue } from '../../context/theme-context';
|
|
8
11
|
import type { ConsentManagerDialogTheme } from './theme';
|
|
9
12
|
/**
|
|
10
|
-
* Props for the ConsentManagerDialog component
|
|
13
|
+
* Props for the `<ConsentManagerDialog />` convenience component.
|
|
11
14
|
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
* while maintaining type safety for consent management specific features.
|
|
15
|
+
* Extends the theme context props so that the caller can override styling or
|
|
16
|
+
* disable animations exactly the same way as when using the compound API.
|
|
15
17
|
*/
|
|
16
18
|
export interface ConsentManagerDialogProps extends ThemeContextValue<ConsentManagerDialogTheme> {
|
|
17
|
-
/**
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
/**
|
|
20
|
+
* Control the open state. If omitted the dialog follows
|
|
21
|
+
* `useConsentManager().isPrivacyDialogOpen`.
|
|
22
|
+
*/
|
|
20
23
|
open?: boolean;
|
|
21
24
|
}
|
|
22
|
-
/**
|
|
23
|
-
* A modal dialog component for detailed privacy consent management.
|
|
24
|
-
*
|
|
25
|
-
* @remarks
|
|
26
|
-
* Key features:
|
|
27
|
-
* - Provides an accessible modal interface for consent customization
|
|
28
|
-
* - Implements smooth enter/exit animations
|
|
29
|
-
* - Manages proper focus handling
|
|
30
|
-
* - Supports theme customization
|
|
31
|
-
* - Handles client-side portal rendering
|
|
32
|
-
*
|
|
33
|
-
* @example
|
|
34
|
-
* ```tsx
|
|
35
|
-
* <ConsentManagerDialog
|
|
36
|
-
* theme={customTheme}
|
|
37
|
-
* disableAnimation={false}
|
|
38
|
-
* noStyle={false}
|
|
39
|
-
* />
|
|
40
|
-
* ```
|
|
41
|
-
*
|
|
42
|
-
* @public
|
|
43
|
-
*/
|
|
44
25
|
export declare const ConsentManagerDialog: FC<ConsentManagerDialogProps>;
|
|
45
26
|
//# sourceMappingURL=consent-manager-dialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"consent-manager-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/consent-manager-dialog/consent-manager-dialog.tsx"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"consent-manager-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/consent-manager-dialog/consent-manager-dialog.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAKjE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAEzD;;;;;GAKG;AACH,MAAM,WAAW,yBAChB,SAAQ,iBAAiB,CAAC,yBAAyB,CAAC;IACpD;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CACf;AAED,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,yBAAyB,CAmC9D,CAAC"}
|