@ongov/ontario-design-system-component-library 4.3.0 → 5.0.0-alpha.1

package/dist/components/global.i18n.js

@@ -1,154 +1,54 @@
-const required = {
-	en: 'required',
-	fr: 'obligatoire',
-};
-const optional = {
-	en: 'optional',
-	fr: 'facultative',
-};
 const accessibility = {
-	moreInfo: {
-		en: 'More information on',
-		fr: 'Des renseignements supplémentaires sur',
-	},
 	checkboxHintExpander: {
 		en: 'is available after the last checkbox item.',
 		fr: 'suivront à la dernière case à cocher.',
 	},
+	moreInfo: {
+		en: 'More information on',
+		fr: 'Des renseignements supplémentaires sur',
+	},
 	singleHintExpander: {
 		en: 'field is available in the next element.',
 		fr: 'suivront au prochain élément.',
 	},
 };
-const backToTop = {
-	top: {
-		en: 'Top',
-		fr: 'Haut',
-	},
-	ariaLabel: {
-		en: 'Scroll back to the top',
-		fr: 'Retour en haut de la page',
-	},
-};
-const loading = {
-	en: 'Loading',
-	fr: 'Chargement',
-};
-const dropdownList = {
-	select: {
-		en: 'Select',
-		fr: 'Sélectionner',
-	},
-};
-const contactUs = {
-	en: 'Contact us',
-	fr: 'Contactez-nous',
-};
 const accessibilityLink = {
-	text: {
-		en: 'Accessibility',
-		fr: 'Accessibilité',
-	},
 	link: {
 		en: 'https://www.ontario.ca/page/accessibility',
 		fr: 'https://www.ontario.ca/fr/page/accessibilite',
 	},
-};
-const privacyLink = {
-	text: {
-		en: 'Privacy',
-		fr: 'Confidentialité',
-	},
-	link: {
-		en: 'https://www.ontario.ca/page/privacy-statement',
-		fr: 'https://www.ontario.ca/fr/page/declaration-concernant-la-protection-de-la-vie-privee',
-	},
-};
-const printerLink = {
 	text: {
-		en: "King's Printer for Ontario,",
-		fr: 'Imprimeur du Roi pour l’Ontario,',
-	},
-	link: {
-		en: 'https://www.ontario.ca/page/copyright-information',
-		fr: 'https://www.ontario.ca/fr/page/droits-dauteur',
-	},
-};
-const languageToggle = {
-	ariaLabel: {
-		en: 'Click to switch language to French',
-		fr: 'Cliquez pour changer de langue en anglais',
+		en: 'Accessibility',
+		fr: 'Accessibilité',
 	},
 };
-const stepIndicator = {
-	back: {
-		en: 'Back',
-		fr: 'Retour',
-	},
-	step: {
-		en: 'Step',
-		fr: 'Étape',
+const accordion = {
+	collapse: {
+		en: 'Collapse all',
+		fr: 'Réduire tout',
 	},
-	of: {
-		en: 'of',
-		fr: 'sur',
+	expand: {
+		en: 'Expand all',
+		fr: 'Agrandir tout',
 	},
-	complete: {
-		en: 'complete',
-		fr: 'complet',
+	expandCollapseAriaLabel: {
+		en: 'Expand or collapse the accordion',
+		fr: "Agrandissez ou réduisez l'accordéon",
 	},
 };
-const header = {
-	ontarioSearchURL: {
-		en: 'https://www.ontario.ca/search/search-results?query=',
-		fr: 'https://www.ontario.ca/fr/recherche/resultats-de-recherche/?query=',
-	},
-	logoLink: {
-		en: 'https://www.ontario.ca/page/government-ontario',
-		fr: 'https://www.ontario.ca/fr/page/gouvernement-de-lontario',
-	},
-	logoAltText: {
-		en: 'Ontario.ca homepage',
-		fr: 'Page d’accueil Ontario.ca',
-	},
-	clearSearchField: {
-		en: 'Clear field',
-		fr: 'Vider le champ',
-	},
-	submit: {
-		en: 'Submit',
-		fr: 'Soumission',
-	},
-	search: {
-		en: 'Search',
-		fr: 'Rechercher',
-	},
-	serviceOntario: {
-		en: 'ServiceOntario',
-		fr: 'ServiceOntario',
-	},
-	openMenu: {
-		en: 'Show navigation menu',
-		fr: 'Ouvrir le menu de navigation',
-	},
-	closeMenu: {
-		en: 'Hide navigation menu',
-		fr: 'Fermer le menu de navigation',
-	},
-	close: {
-		en: 'close',
-		fr: 'fermer',
+const backToTop = {
+	ariaLabel: {
+		en: 'Scroll back to the top',
+		fr: 'Retour en haut de la page',
 	},
-	closeSearch: {
-		en: 'Close search bar',
-		fr: 'Fermer la barre de recherche',
+	top: {
+		en: 'Top',
+		fr: 'Haut',
 	},
 };
-const input = {
-	requiredFieldError: {
-		en: 'This is a required field.',
-		fr: 'Ce champ est obligatoire.',
-	},
+const contactUs = {
+	en: 'Contact us',
+	fr: 'Contactez-nous',
 };
 const dateInput = {
 	caption: {
@@ -156,43 +56,23 @@ const dateInput = {
 		fr: 'Dates exactes',
 	},
 	day: {
-		label: {
-			en: 'Day',
-			fr: 'Jour',
-		},
 		accessibility: {
 			en: '4 digits',
 			fr: '4 chiffres',
 		},
-	},
-	month: {
 		label: {
-			en: 'Month',
-			fr: 'Mois',
-		},
-		accessibility: {
-			en: '1 or 2 digits',
-			fr: '1 ou 2 chiffres',
-		},
-	},
-	year: {
-		label: {
-			en: 'Year',
-			fr: 'Année',
-		},
-		accessibility: {
-			en: '1 or 2 digits',
-			fr: '1 ou 2 chiffres',
+			en: 'Day',
+			fr: 'Jour',
 		},
 	},
 	error: {
 		en: {
 			emptyDay: 'Enter the day.',
-			emptyMonth: 'Enter the month.',
-			emptyYear: 'Enter the year.',
 			emptyDayAndMonth: 'Enter the month and day.',
 			emptyDayAndYear: 'Enter the year and day.',
+			emptyMonth: 'Enter the month.',
 			emptyMonthAndYear: 'Enter the year and month.',
+			emptyYear: 'Enter the year.',
 			invalidDate: 'Enter a valid date.',
 			invalidDay: 'Enter a valid day.',
 			invalidMonth: 'Enter a valid month.',
@@ -200,49 +80,180 @@ const dateInput = {
 		},
 		fr: {
 			emptyDay: 'Saisissez le jour.',
-			emptyMonth: 'Saisissez le mois.',
-			emptyYear: 'Saisissez l’année.',
 			emptyDayAndMonth: 'Saisissez le mois et le jour.',
 			emptyDayAndYear: 'Saisissez l’année et le jour.',
+			emptyMonth: 'Saisissez le mois.',
 			emptyMonthAndYear: 'Saisissez l’année et le mois.',
+			emptyYear: 'Saisissez l’année.',
 			invalidDate: 'Saisissez une date valide.',
 			invalidDay: 'Saisissez un jour valide.',
 			invalidMonth: 'Saisissez un mois valide.',
 			invalidYear: 'Saisissez une année valide.',
 		},
 	},
+	month: {
+		accessibility: {
+			en: '1 or 2 digits',
+			fr: '1 ou 2 chiffres',
+		},
+		label: {
+			en: 'Month',
+			fr: 'Mois',
+		},
+	},
+	year: {
+		accessibility: {
+			en: '1 or 2 digits',
+			fr: '1 ou 2 chiffres',
+		},
+		label: {
+			en: 'Year',
+			fr: 'Année',
+		},
+	},
 };
-const accordion = {
-	expand: {
-		en: 'Expand all',
-		fr: 'Agrandir tout',
+const dropdownList = {
+	select: {
+		en: 'Select',
+		fr: 'Sélectionner',
 	},
-	collapse: {
-		en: 'Collapse all',
-		fr: 'Réduire tout',
+};
+const header = {
+	clearSearchField: {
+		en: 'Clear field',
+		fr: 'Vider le champ',
 	},
-	expandCollapseAriaLabel: {
-		en: 'Expand or collapse the accordion',
-		fr: "Agrandissez ou réduisez l'accordéon",
+	close: {
+		en: 'close',
+		fr: 'fermer',
+	},
+	closeMenu: {
+		en: 'Hide navigation menu',
+		fr: 'Fermer le menu de navigation',
+	},
+	closeSearch: {
+		en: 'Close search bar',
+		fr: 'Fermer la barre de recherche',
+	},
+	logoAltText: {
+		en: 'Ontario.ca homepage',
+		fr: 'Page d’accueil Ontario.ca',
+	},
+	logoLink: {
+		en: 'https://www.ontario.ca/page/government-ontario',
+		fr: 'https://www.ontario.ca/fr/page/gouvernement-de-lontario',
+	},
+	ontarioSearchURL: {
+		en: 'https://www.ontario.ca/search/search-results?query=',
+		fr: 'https://www.ontario.ca/fr/recherche/resultats-de-recherche/?query=',
+	},
+	openMenu: {
+		en: 'Show navigation menu',
+		fr: 'Ouvrir le menu de navigation',
+	},
+	search: {
+		en: 'Search',
+		fr: 'Rechercher',
+	},
+	serviceOntario: {
+		en: 'ServiceOntario',
+		fr: 'ServiceOntario',
+	},
+	submit: {
+		en: 'Submit',
+		fr: 'Soumission',
+	},
+};
+const input = {
+	requiredFieldError: {
+		en: 'This is a required field.',
+		fr: 'Ce champ est obligatoire.',
+	},
+};
+const languageToggle = {
+	ariaLabel: {
+		en: 'Click to switch the language to English',
+		fr: 'Cliquez pour changer la langue en français',
+	},
+};
+const loading = {
+	en: 'Loading',
+	fr: 'Chargement',
+};
+const optional = {
+	en: 'optional',
+	fr: 'facultative',
+};
+const printerLink = {
+	link: {
+		en: 'https://www.ontario.ca/page/copyright-information',
+		fr: 'https://www.ontario.ca/fr/page/droits-dauteur',
+	},
+	text: {
+		en: "King's Printer for Ontario,",
+		fr: 'Imprimeur du Roi pour l’Ontario,',
+	},
+};
+const privacyLink = {
+	link: {
+		en: 'https://www.ontario.ca/page/privacy-statement',
+		fr: 'https://www.ontario.ca/fr/page/declaration-concernant-la-protection-de-la-vie-privee',
+	},
+	text: {
+		en: 'Privacy',
+		fr: 'Confidentialité',
+	},
+};
+const stepIndicator = {
+	back: {
+		en: 'Back',
+		fr: 'Retour',
+	},
+	complete: {
+		en: 'complete',
+		fr: 'complet',
+	},
+	of: {
+		en: 'of',
+		fr: 'sur',
+	},
+	step: {
+		en: 'Step',
+		fr: 'Étape',
+	},
+};
+const siteLanguage = {
+	fullWord: {
+		en: 'English',
+		fr: 'Français',
+	},
+	abbreviation: {
+		en: 'en',
+		fr: 'fr',
 	},
 };
+const required = {
+	en: 'required',
+	fr: 'obligatoire',
+};
 const translations = {
-	required: required,
-	optional: optional,
 	accessibility: accessibility,
+	accessibilityLink: accessibilityLink,
+	accordion: accordion,
 	backToTop: backToTop,
-	loading: loading,
-	dropdownList: dropdownList,
 	contactUs: contactUs,
-	accessibilityLink: accessibilityLink,
-	privacyLink: privacyLink,
-	printerLink: printerLink,
-	languageToggle: languageToggle,
-	stepIndicator: stepIndicator,
+	dateInput: dateInput,
+	dropdownList: dropdownList,
 	header: header,
 	input: input,
-	dateInput: dateInput,
-	accordion: accordion,
+	languageToggle: languageToggle,
+	loading: loading,
+	optional: optional,
+	printerLink: printerLink,
+	privacyLink: privacyLink,
+	stepIndicator: stepIndicator,
+	siteLanguage: siteLanguage,
+	required: required,
 };
 
 export { translations as t };

package/dist/components/global.i18n.js.map

@@ -1 +1 @@
-{"file":"global.i18n.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
+{"file":"global.i18n.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/input.js

@@ -27,6 +27,7 @@ const Input = (_a) => {
 			onChange,
 			onBlur,
 			onFocus,
+			onClick,
 			ariaInvalid,
 			ariaDescribedBy,
 			ref,
@@ -47,6 +48,7 @@ const Input = (_a) => {
 			'onChange',
 			'onBlur',
 			'onFocus',
+			'onClick',
 			'ariaInvalid',
 			'ariaDescribedBy',
 			'ref',
@@ -70,6 +72,7 @@ const Input = (_a) => {
 				'onChange': onChange,
 				'onBlur': onBlur,
 				'onFocus': onFocus,
+				'onClick': onClick,
 				'inputMode': inputMode,
 				'ref': ref,
 				'aria-invalid': ariaInvalid,

package/dist/components/input.js.map

@@ -1 +1 @@
-{"file":"input.js","mappings":";;;;;;;;;;;;;MAuBa,KAAK,GAAoC,CAAC,EAoBtD;QApBsD,EACtD,YAAY,EACZ,SAAS,EACT,EAAE,EACF,IAAI,EACJ,WAAW,EACX,IAAI,EACJ,KAAK,EACL,OAAO,EACP,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACR,MAAM,EACN,OAAO,EACP,WAAW,EACX,eAAe,EACf,GAAG,EACH,SAAS,OAET,EADG,KAAK,cAnB8C,iNAoBtD,CADQ;IAER,QACC,2BACC,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,SAAS,EAChB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,CAAC,CAAC,QAAQ,EACpB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,GAAG,kBACM,WAAW,sBACP,eAAe,IAC7B,KAAK,EACR,EACD;AACH;;;;","names":[],"sources":["src/utils/common/input/input.tsx"],"sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\n\nexport type InputProps = {\n\tautoComplete?: string;\n\tclassName?: string;\n\tid: string;\n\tname?: string;\n\ttype: string;\n\tvalue?: string | number;\n\tchecked?: boolean;\n\trequired?: boolean;\n\tinputMode?: string;\n\tplaceholder?: string;\n\tariaInvalid?: boolean;\n\tariaDescribedBy?: string;\n\tonKeyDown?: ((event: Event) => void) | undefined;\n\tonInput?: ((event: Event) => void) | undefined;\n\tonChange?: ((event: Event) => void) | undefined;\n\tonBlur?: ((event: Event) => void) | undefined;\n\tonFocus?: ((event: Event) => void) | undefined;\n\tref?: (el: any) => HTMLElement;\n};\n\nexport const Input: FunctionalComponent<InputProps> = ({\n\tautoComplete,\n\tclassName,\n\tid,\n\tname,\n\tplaceholder,\n\ttype,\n\tvalue,\n\tchecked,\n\trequired,\n\tonKeyDown,\n\tonInput,\n\tonChange,\n\tonBlur,\n\tonFocus,\n\tariaInvalid,\n\tariaDescribedBy,\n\tref,\n\tinputMode,\n\t...props\n}) => {\n\treturn (\n\t\t<input\n\t\t\tautoComplete={autoComplete}\n\t\t\tclass={className}\n\t\t\tid={id}\n\t\t\tname={name}\n\t\t\ttype={type}\n\t\t\tvalue={value}\n\t\t\tchecked={checked}\n\t\t\tplaceholder={placeholder}\n\t\t\trequired={!!required}\n\t\t\tonKeyDown={onKeyDown}\n\t\t\tonInput={onInput}\n\t\t\tonChange={onChange}\n\t\t\tonBlur={onBlur}\n\t\t\tonFocus={onFocus}\n\t\t\tinputMode={inputMode}\n\t\t\tref={ref}\n\t\t\taria-invalid={ariaInvalid}\n\t\t\taria-describedby={ariaDescribedBy}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n"],"version":3}
+{"file":"input.js","mappings":";;;;;;;;;;;;;MAwBa,KAAK,GAAoC,CAAC,EAqBtD;QArBsD,EACtD,YAAY,EACZ,SAAS,EACT,EAAE,EACF,IAAI,EACJ,WAAW,EACX,IAAI,EACJ,KAAK,EACL,OAAO,EACP,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,WAAW,EACX,eAAe,EACf,GAAG,EACH,SAAS,OAET,EADG,KAAK,cApB8C,4NAqBtD,CADQ;IAER,QACC,2BACC,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,SAAS,EAChB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,CAAC,CAAC,QAAQ,EACpB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,GAAG,kBACM,WAAW,sBACP,eAAe,IAC7B,KAAK,EACR,EACD;AACH;;;;","names":[],"sources":["src/utils/common/input/input.tsx"],"sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\n\nexport type InputProps = {\n\tautoComplete?: string;\n\tclassName?: string;\n\tid: string;\n\tname?: string;\n\ttype: string;\n\tvalue?: string | number;\n\tchecked?: boolean;\n\trequired?: boolean;\n\tinputMode?: string;\n\tplaceholder?: string;\n\tariaInvalid?: boolean;\n\tariaDescribedBy?: string;\n\tonKeyDown?: ((event: Event) => void) | undefined;\n\tonInput?: ((event: Event) => void) | undefined;\n\tonChange?: ((event: Event) => void) | undefined;\n\tonBlur?: ((event: Event) => void) | undefined;\n\tonFocus?: ((event: Event) => void) | undefined;\n\tonClick?: ((event: Event) => void) | undefined;\n\tref?: (el: HTMLInputElement) => HTMLElement;\n};\n\nexport const Input: FunctionalComponent<InputProps> = ({\n\tautoComplete,\n\tclassName,\n\tid,\n\tname,\n\tplaceholder,\n\ttype,\n\tvalue,\n\tchecked,\n\trequired,\n\tonKeyDown,\n\tonInput,\n\tonChange,\n\tonBlur,\n\tonFocus,\n\tonClick,\n\tariaInvalid,\n\tariaDescribedBy,\n\tref,\n\tinputMode,\n\t...props\n}) => {\n\treturn (\n\t\t<input\n\t\t\tautoComplete={autoComplete}\n\t\t\tclass={className}\n\t\t\tid={id}\n\t\t\tname={name}\n\t\t\ttype={type}\n\t\t\tvalue={value}\n\t\t\tchecked={checked}\n\t\t\tplaceholder={placeholder}\n\t\t\trequired={!!required}\n\t\t\tonKeyDown={onKeyDown}\n\t\t\tonInput={onInput}\n\t\t\tonChange={onChange}\n\t\t\tonBlur={onBlur}\n\t\t\tonFocus={onFocus}\n\t\t\tonClick={onClick}\n\t\t\tinputMode={inputMode}\n\t\t\tref={ref}\n\t\t\taria-invalid={ariaInvalid}\n\t\t\taria-describedby={ariaDescribedBy}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n"],"version":3}