fix(core): Remove deprecated GitLab CI configuration and update metadata for improved compatibility and efficiency.
This commit is contained in:
parent
8abdeba706
commit
7a8dde06dd
146
.gitlab-ci.yml
146
.gitlab-ci.yml
@ -1,146 +0,0 @@
|
||||
# gitzone ci_default_private
|
||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
|
||||
cache:
|
||||
paths:
|
||||
- .npmci_cache/
|
||||
key: '$CI_BUILD_STAGE'
|
||||
|
||||
stages:
|
||||
- security
|
||||
- test
|
||||
- release
|
||||
- metadata
|
||||
|
||||
before_script:
|
||||
- npm install -g @shipzone/npmci
|
||||
|
||||
# ====================
|
||||
# security stage
|
||||
# ====================
|
||||
mirror:
|
||||
stage: security
|
||||
script:
|
||||
- npmci git mirror
|
||||
only:
|
||||
- tags
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
auditProductionDependencies:
|
||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
stage: security
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci command npm install --production --ignore-scripts
|
||||
- npmci command npm config set registry https://registry.npmjs.org
|
||||
- npmci command npm audit --audit-level=high --only=prod --production
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
allow_failure: true
|
||||
|
||||
auditDevDependencies:
|
||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
stage: security
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci command npm install --ignore-scripts
|
||||
- npmci command npm config set registry https://registry.npmjs.org
|
||||
- npmci command npm audit --audit-level=high --only=dev
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
allow_failure: true
|
||||
|
||||
# ====================
|
||||
# test stage
|
||||
# ====================
|
||||
|
||||
testStable:
|
||||
stage: test
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci node install stable
|
||||
- npmci npm install
|
||||
- npmci npm test
|
||||
coverage: /\d+.?\d+?\%\s*coverage/
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
testBuild:
|
||||
stage: test
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci node install stable
|
||||
- npmci npm install
|
||||
- npmci command npm run build
|
||||
coverage: /\d+.?\d+?\%\s*coverage/
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
release:
|
||||
stage: release
|
||||
script:
|
||||
- npmci node install stable
|
||||
- npmci npm publish
|
||||
only:
|
||||
- tags
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
# ====================
|
||||
# metadata stage
|
||||
# ====================
|
||||
codequality:
|
||||
stage: metadata
|
||||
allow_failure: true
|
||||
only:
|
||||
- tags
|
||||
script:
|
||||
- npmci command npm install -g typescript
|
||||
- npmci npm prepare
|
||||
- npmci npm install
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- priv
|
||||
|
||||
trigger:
|
||||
stage: metadata
|
||||
script:
|
||||
- npmci trigger
|
||||
only:
|
||||
- tags
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
pages:
|
||||
stage: metadata
|
||||
script:
|
||||
- npmci node install lts
|
||||
- npmci command npm install -g @gitzone/tsdoc
|
||||
- npmci npm prepare
|
||||
- npmci npm install
|
||||
- npmci command tsdoc
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
only:
|
||||
- tags
|
||||
artifacts:
|
||||
expire_in: 1 week
|
||||
paths:
|
||||
- public
|
||||
allow_failure: true
|
||||
11
changelog.md
Normal file
11
changelog.md
Normal file
@ -0,0 +1,11 @@
|
||||
# Changelog
|
||||
|
||||
## 2025-01-09 - 1.0.80 - fix(core)
|
||||
Remove deprecated GitLab CI configuration and update metadata for improved compatibility and efficiency.
|
||||
|
||||
- Removed the .gitlab-ci.yml file to eliminate outdated CI configuration
|
||||
- Updated the package.json and npmextra.json to include missing keywords
|
||||
- Updated the description in package.json and npmextra.json for better clarity
|
||||
|
||||
## 2025-01-09 - 1.0.79 - Initial Release
|
||||
Initial release of the project.
|
||||
@ -5,10 +5,22 @@
|
||||
"githost": "gitlab.com",
|
||||
"gitscope": "consentsoftware",
|
||||
"gitrepo": "private/catalog",
|
||||
"description": "webcomponents for consent.software widget",
|
||||
"description": "A library of web components designed to integrate robust consent management capabilities into web applications, ensuring compliance with privacy regulations.",
|
||||
"npmPackagename": "@consentsoftware_private/catalog",
|
||||
"license": "UNLICENSED",
|
||||
"projectDomain": "consent.software"
|
||||
"projectDomain": "consent.software",
|
||||
"keywords": [
|
||||
"consent management",
|
||||
"web components",
|
||||
"cookie consent",
|
||||
"privacy compliance",
|
||||
"GDPR",
|
||||
"ES modules",
|
||||
"frontend",
|
||||
"typescript",
|
||||
"user privacy",
|
||||
"modern web"
|
||||
]
|
||||
}
|
||||
},
|
||||
"npmci": {
|
||||
|
||||
14
package.json
14
package.json
@ -2,7 +2,7 @@
|
||||
"name": "@consent.software_private/catalog",
|
||||
"version": "1.0.79",
|
||||
"private": false,
|
||||
"description": "webcomponents for consent.software widget",
|
||||
"description": "A library of web components designed to integrate robust consent management capabilities into web applications, ensuring compliance with privacy regulations.",
|
||||
"main": "dist_ts_web/index.js",
|
||||
"typings": "dist_ts_web/index.d.ts",
|
||||
"type": "module",
|
||||
@ -42,5 +42,17 @@
|
||||
],
|
||||
"browserslist": [
|
||||
"last 1 Chrome versions"
|
||||
],
|
||||
"keywords": [
|
||||
"consent management",
|
||||
"web components",
|
||||
"cookie consent",
|
||||
"privacy compliance",
|
||||
"GDPR",
|
||||
"ES modules",
|
||||
"frontend",
|
||||
"typescript",
|
||||
"user privacy",
|
||||
"modern web"
|
||||
]
|
||||
}
|
||||
0
readme.hints.md
Normal file
0
readme.hints.md
Normal file
156
readme.md
156
readme.md
@ -1,34 +1,138 @@
|
||||
# @consentsoftware/private/catalog
|
||||
webcomponents for consent.software widget
|
||||
# @consent.software_private/catalog
|
||||
|
||||
## Availabililty and Links
|
||||
* [npmjs.org (npm package)](https://www.npmjs.com/package/@consentsoftware_private/catalog)
|
||||
* [gitlab.com (source)](https://gitlab.com/consentsoftware/private/catalog)
|
||||
* [github.com (source mirror)](https://github.com/consentsoftware/private/catalog)
|
||||
* [docs (typedoc)](https://consentsoftware.gitlab.io/private/catalog/)
|
||||
Webcomponents for consent.software widget.
|
||||
|
||||
## Status for master
|
||||
## Install
|
||||
|
||||
Status Category | Status Badge
|
||||
-- | --
|
||||
GitLab Pipelines | [](https://lossless.cloud)
|
||||
GitLab Pipline Test Coverage | [](https://lossless.cloud)
|
||||
npm | [](https://lossless.cloud)
|
||||
Snyk | [](https://lossless.cloud)
|
||||
TypeScript Support | [](https://lossless.cloud)
|
||||
node Support | [](https://nodejs.org/dist/latest-v10.x/docs/api/)
|
||||
Code Style | [](https://lossless.cloud)
|
||||
PackagePhobia (total standalone install weight) | [](https://lossless.cloud)
|
||||
PackagePhobia (package size on registry) | [](https://lossless.cloud)
|
||||
BundlePhobia (total size when bundled) | [](https://lossless.cloud)
|
||||
Platform support | [](https://lossless.cloud) [](https://lossless.cloud)
|
||||
To install this module, you need to have [Node.js](https://nodejs.org/) and [npm](https://www.npmjs.com/) installed on your machine. You can then run the following command in your terminal to add the module to your project:
|
||||
|
||||
```shell
|
||||
npm install @consent.software_private/catalog
|
||||
```
|
||||
|
||||
Ensure you have ESM support enabled in your TypeScript configuration, as this package uses ES module syntax.
|
||||
|
||||
## Usage
|
||||
|
||||
Use TypeScript for best in class intellisense
|
||||
For further information read the linked docs at the top of this readme.
|
||||
The `@consent.software_private/catalog` module offers a set of web components to integrate consent management capabilities into your web application. These components leverage modern browser APIs and employ a system for cookie management that aligns with regulatory requirements.
|
||||
|
||||
> UNLICENSED licensed | **©** [Lossless GmbH](https://lossless.gmbh)
|
||||
| By using this npm module you agree to our [privacy policy](https://lossless.gmbH/privacy)
|
||||
### Initial Setup
|
||||
|
||||
[](https://maintainedby.lossless.com)
|
||||
First, import the necessary modules and set up your project to use the web components provided:
|
||||
|
||||
```typescript
|
||||
import '@consent.software_private/catalog';
|
||||
```
|
||||
|
||||
Ensure this import statement is included in your main JavaScript/TypeScript file where you want to utilize the consent management web components. It is vital to transpile with TypeScript compiler settings that support ES modules.
|
||||
|
||||
### Building a Consent Modal
|
||||
|
||||
A primary feature of this module is the `consentsoftware-cookieconsent` component. This component can be embedded into your application to allow users to select their preferred cookie levels.
|
||||
|
||||
#### Setting Up the Environment
|
||||
|
||||
Before creating instances of the components, make sure your project environment is ready. Setup the DOM tools and any associated dependencies:
|
||||
|
||||
```typescript
|
||||
import { domtools } from '@design.estate/dees-domtools';
|
||||
|
||||
domtools.elementBasic.setup();
|
||||
```
|
||||
|
||||
#### Using the Consentsoftware-Cookieconsent Component
|
||||
|
||||
Here's how you can include the `consentsoftware-cookieconsent` component in your application:
|
||||
|
||||
```typescript
|
||||
import { html, render } from 'lit-html';
|
||||
|
||||
const template = html`
|
||||
<consentsoftware-cookieconsent></consentsoftware-cookieconsent>
|
||||
`;
|
||||
|
||||
render(template, document.body);
|
||||
```
|
||||
|
||||
This will add the consent banner to the bottom of the page, providing users options to set their preferences.
|
||||
|
||||
#### Customizing the Component
|
||||
|
||||
The `consentsoftware-cookieconsent` component allows you to customize its design via CSS properties. Leverage light and dark themes through the CSS manager used in styling attributes:
|
||||
|
||||
```typescript
|
||||
const styles = `
|
||||
:host {
|
||||
--cookieconsent-height: 70px;
|
||||
--cookieconsent-background: #222;
|
||||
--cookieconsent-text-color: #fff;
|
||||
}
|
||||
`;
|
||||
```
|
||||
|
||||
Apply these custom styles to modify the appearance to match your site's design language.
|
||||
|
||||
#### Handling User Interactions
|
||||
|
||||
The component is interactive, responding to user actions to set cookie levels. Here’s how the interaction flow works:
|
||||
|
||||
1. **User Interaction**: Users click one of the consent buttons (e.g., "Functional Cookies").
|
||||
2. **Handling Consent Levels**: The component's `setLevel` method is invoked, updating the user's cookie preferences, e.g.:
|
||||
|
||||
```typescript
|
||||
private async setLevel(event: MouseEvent, levelsArg: Array<TCookieLevel>) {
|
||||
await this.csWebclientInstance.setCookieLevels(levelsArg);
|
||||
// Adjust styling and visibility
|
||||
this.setAttribute('gotIt', 'true');
|
||||
await delayFor(300);
|
||||
this.setAttribute('show', 'false');
|
||||
// Update other business logic based on consent levels
|
||||
}
|
||||
```
|
||||
|
||||
The system remembers user choices using a backend managed by the `consent.software` infrastructure.
|
||||
|
||||
### Integrating with Your Backend
|
||||
|
||||
For full functionality, the component interacts with a backend to manage user consent states. Using `@consent.software/webclient`, you can query the user's current consent levels, perform updates, and verify whether consent has been previously granted:
|
||||
|
||||
```typescript
|
||||
const webclientInstance = new CsWebclient();
|
||||
const cookieLevels = await webclientInstance.getCookieLevels();
|
||||
|
||||
if (!cookieLevels) {
|
||||
// Show consent dialog if no consent levels are set
|
||||
document.querySelector('consentsoftware-cookieconsent').show = true;
|
||||
} else {
|
||||
// Apply the consent settings to your analytics, advertisements, etc.
|
||||
applyConsentSettings(cookieLevels);
|
||||
}
|
||||
```
|
||||
|
||||
### Advanced Considerations
|
||||
|
||||
#### Responsive Design
|
||||
|
||||
The component is responsive, optimized for various screen sizes using a grid layout. Ensure your main HTML elements are responsive to accommodate the consent bar.
|
||||
|
||||
#### Accessibility and Compliance
|
||||
|
||||
Ensure your application properly adheres to legal and accessibility standards by aligning with the consent management system's features. This often involves using correct semantics, polyfills for custom elements, and thorough testing on different devices and browsers.
|
||||
|
||||
#### Managing State Across Sessions
|
||||
|
||||
Store user's consent preferences beyond the session using either localStorage, cookies, or server-side sessions. Adjust the component’s connectedCallback and updated lifecycle methods to fetch and apply these stored settings.
|
||||
|
||||
Proper handling ensures a seamless user experience, helping companies comply with international privacy laws like GDPR.
|
||||
|
||||
### Integration and Testing
|
||||
|
||||
Test extensively in your development environment, ensure correct rendering, and simulate various user interactions to gain confidence in production-level functionality. Automated testing might include:
|
||||
|
||||
- Unit tests for lifecycle behavior using testing libraries such as Mocha or Jest.
|
||||
- Integration trials ensuring the component plays well with surrounding UI elements.
|
||||
|
||||
### Conclusion
|
||||
|
||||
With these guidelines, developers can integrate, customize, and extend the consent management capabilities within their applications using `@consent.software_private/catalog`. Adapt the styling, maximize UX, and ensure regulatory compliance for a robust implementation. Mastery of the component enables seamless user consent handling and enhances your app's governance credentials.
|
||||
undefined
|
||||
@ -1,8 +1,8 @@
|
||||
/**
|
||||
* autocreated commitinfo by @pushrocks/commitinfo
|
||||
* autocreated commitinfo by @push.rocks/commitinfo
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@consent.software_private/catalog',
|
||||
version: '1.0.79',
|
||||
description: 'webcomponents for consent.software widget'
|
||||
version: '1.0.80',
|
||||
description: 'A library of web components designed to integrate robust consent management capabilities into web applications, ensuring compliance with privacy regulations.'
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user