@allomambo/galletita NPM

🍪 Galletita

Extra simple cookie policy solution.

Required

Node 16.14.2
VueJS 3.2.37

Note
Complete documentation in progress

Installation

Installation - Plugin version

1. Add script to web page

# At end of body
<script id="galletita-js" type="module" src="https://unpkg.com/@allomambo/galletita@0.0.4/dist/index.js"></script>

2. Custom configs

<script>
const galletita = {
    cookie_name: "privacy_policy_consent",
    text_content: {
        title: "...",
        description: "...",
        consent_button_label: "...",
        learn_more_button_label: "...",
    },
    privacy_policy_url: "https://...",
};
</script>

<script>
const galletita = {
    cookie_name: "privacy_policy_consent",
    fr: {
        text_content: {
            title: "...",
            description: "...",
            consent_button_label: "...",
            learn_more_button_label: "...",
        },
        privacy_policy_url: "https://...",
    },
    en: {
        text_content: {
            title: "...",
            description: "...",
            consent_button_label: "...",
            learn_more_button_label: "...",
        },
        privacy_policy_url: "https://...",
    },
};
</script>

Installation - VueJS library version

1. Install the package

# With Yarn:
yarn add @allomambo/galletita

# With npm:
npm install @allomambo/galletita

2. Use component in your project

<template>
    <galletita :cookie-name="..." :text-content="{...}" :privacy-policy-url="..." />
</template>

<script setup>
import { Galletita } from "@allomambo/galletita";
</script>

Props

Property	Type	Description	Default Value
cookie_name	String	The name of the cookie.	`privacy_policy_consent`
text_content	Object	Contains the textual elements	See table below
privacy_policy_url	String	The complete URL of the privacy policy. Ex. "https://example.com/privacy-policy"	`null`

`text_content`

Sub-properties	Type	Description	Default Value (English EN)	Default Value (Français FR)
title	String	The title of the privacy policy.	`We value your privacy`	`Nous respectons votre vie privée`
description	String	The description of the privacy policy.	`<p>We use cookies to enhance your browsing experience, serve personalized ads or content, and analyze our traffic.</p><p>By clicking "Accept", you consent to our use of cookies.</p>`	`<p>Nous utilisons des cookies pour améliorer votre expérience de navigation, diffuser des publicités ou des contenus personnalisés et analyser notre trafic.</p><p>En cliquant sur « Accepter », vous consentez à notre utilisation des cookies.</p>`
consent_button_label	String	The label of the consent button.	`Accept`	`Accepter`
learn_more_button_label	String	The button label to learn more about the privacy policy.	`Learn more`	`En savoir plus`

Slots

Name	Description
`default`	Wrap the entirety of `.galletita-box`
`copy`	The text content (title and description)
`actions`	The buttons to consent and see more

Exposed data on every slots

Name	Type	Description
`isGalletitaVisible`	boolean	If modal is visible of not
`cookieName`	string	The name of the cookie
`textContent`	object	The complete object containing the text content (title, description, button labels)
`privacyPolicyUrl`	string	The name of the cookie
`openGalletita`	method	Open modal
`closeGalletita`	method	Close modal and trigger `consent`
`consent`	method	Add the cookie. Automatically triggered on `closeGalletita`

Emits

Name	Description
`galletita:open`	When modal is opened
`galletita:close`	When modal is closed
`galletita:consent`	When cookie is created

universal-cookie vite-plugin-lib-inject-css vue

@everything-registry/sub-chunk-57

0.0.4

4 months ago

0.0.3

6 months ago

0.0.1

6 months ago