@ongov/ontario-design-system-component-library 6.0.0-alpha.3 → 6.0.0-alpha.4

package/dist/ontario-design-system-components/ontario-icon-sort-alphabetical-descending.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ontario-icon-sort-alphabetical-descending.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-sort-alphabetical-descending&encapsulation=shadow","src/components/ontario-icon/ontario-icon-sort-alphabetical-descending.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-sort-alphabetical-descending',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconSortAlphabeticalDescending implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-sort-alphabetical-descending> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-sort-alphabetical-descending> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\twidth=\"24\"\n\t\t\t\t\theight=\"24\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tid=\"sort-alphabetical-descending\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M19 7H22L18 3L14 7H17V21H19M11 13V15L7.67 19H11V21H5V19L8.33 15H5V13M9 3H7C5.9 3 5 3.9 5 5V11H7V9H9V11H11V5C11 3.9 10.11 3 9 3ZM9 7H7V5H9V7Z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCana,qCAAqC,GAAA,MAAA;AALlD,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAiChC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAe,OAAO;AAmFpC;AA/GA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,+CAA+C;AAChE,iBAAA,cAAc,CACd,CAAG,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAA8B,0DAA0D;iBAEtJ,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAqBtC;;;;AAIG;IAEH,cAAc,GAAA;QACb,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,CAAC;QACnE,IAAI,OAAO,EAAE;AACZ,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM;;aAC5B;AACN,YAAA,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,MAAM;;iBAClC;AACN,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,EAAE;;;;AAKlD;;;AAGG;IACK,iBAAiB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,UAAU;aAC3B,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,+CAA+C;aAChE,cAAc,CAAC,oCAAoC;aACnD,gBAAgB,CAAC,8BAA8B;aAC/C,cAAc,CAAC,mCAAmC;aAClD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;AAChB,QAAA,OAAO,OAAO;;AAGf;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;AACL,QAAA,QACC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAA8B,2BAAA,EAAA,IAAI,CAAC,eAAe,CAAA,qBAAA,EAAwB,IAAI,CAAC,cAAc,CAAE,CAAA,EACtG,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,cAAc,IAAI,EAAE,EAAA,EAE5C,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,EAAE,EAAC,8BAA8B,EAAA,EAEjC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,8IAA8I,GAAG,CACpJ,CACD;;;;;;;;;;;"}

package/dist/ontario-design-system-components/ontario-icon-sort-ascending.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ontario-icon-sort-ascending.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-sort-ascending&encapsulation=shadow","src/components/ontario-icon/ontario-icon-sort-ascending.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-sort-ascending',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconSortAscending implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-sort-ascending> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-sort-ascending> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\twidth=\"24\"\n\t\t\t\t\theight=\"24\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tid=\"sort-ascending\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M19 17H22L18 21L14 17H17V3H19M2 17H12V19H2M6 5V7H2V5M2 11H9V13H2V11Z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCana,wBAAwB,GAAA,MAAA;AALrC,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAiChC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAe,OAAO;AAmFpC;AA/GA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,iCAAiC;AAClD,iBAAA,cAAc,CACd,CAAG,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAA8B,0DAA0D;iBAEtJ,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAqBtC;;;;AAIG;IAEH,cAAc,GAAA;QACb,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,CAAC;QACnE,IAAI,OAAO,EAAE;AACZ,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM;;aAC5B;AACN,YAAA,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,MAAM;;iBAClC;AACN,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,EAAE;;;;AAKlD;;;AAGG;IACK,iBAAiB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,UAAU;aAC3B,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,iCAAiC;aAClD,cAAc,CAAC,oCAAoC;aACnD,gBAAgB,CAAC,8BAA8B;aAC/C,cAAc,CAAC,mCAAmC;aAClD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;AAChB,QAAA,OAAO,OAAO;;AAGf;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;AACL,QAAA,QACC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAA8B,2BAAA,EAAA,IAAI,CAAC,eAAe,CAAA,qBAAA,EAAwB,IAAI,CAAC,cAAc,CAAE,CAAA,EACtG,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,cAAc,IAAI,EAAE,EAAA,EAE5C,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,EAAE,EAAC,gBAAgB,EAAA,EAEnB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,sEAAsE,GAAG,CAC5E,CACD;;;;;;;;;;;"}

package/dist/ontario-design-system-components/ontario-icon-sort-descending.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ontario-icon-sort-descending.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-sort-descending&encapsulation=shadow","src/components/ontario-icon/ontario-icon-sort-descending.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-sort-descending',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconSortDescending implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-sort-descending> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-sort-descending> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\twidth=\"24\"\n\t\t\t\t\theight=\"24\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tid=\"sort-descending\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M19 7H22L18 3L14 7H17V21H19M2 17H12V19H2M6 5V7H2V5M2 11H9V13H2V11Z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCana,yBAAyB,GAAA,MAAA;AALtC,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAiChC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAe,OAAO;AAmFpC;AA/GA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,kCAAkC;AACnD,iBAAA,cAAc,CACd,CAAG,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAA8B,0DAA0D;iBAEtJ,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAqBtC;;;;AAIG;IAEH,cAAc,GAAA;QACb,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,CAAC;QACnE,IAAI,OAAO,EAAE;AACZ,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM;;aAC5B;AACN,YAAA,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,MAAM;;iBAClC;AACN,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,EAAE;;;;AAKlD;;;AAGG;IACK,iBAAiB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,UAAU;aAC3B,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,kCAAkC;aACnD,cAAc,CAAC,oCAAoC;aACnD,gBAAgB,CAAC,8BAA8B;aAC/C,cAAc,CAAC,mCAAmC;aAClD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;AAChB,QAAA,OAAO,OAAO;;AAGf;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;AACL,QAAA,QACC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAA8B,2BAAA,EAAA,IAAI,CAAC,eAAe,CAAA,qBAAA,EAAwB,IAAI,CAAC,cAAc,CAAE,CAAA,EACtG,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,cAAc,IAAI,EAAE,EAAA,EAE5C,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,EAAE,EAAC,iBAAiB,EAAA,EAEpB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,oEAAoE,GAAG,CAC1E,CACD;;;;;;;;;;;"}

package/dist/ontario-design-system-components/ontario-icon-sort-variant.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ontario-icon-sort-variant.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-sort-variant&encapsulation=shadow","src/components/ontario-icon/ontario-icon-sort-variant.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-sort-variant',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconSortVariant implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-sort-variant> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-sort-variant> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\twidth=\"24\"\n\t\t\t\t\theight=\"24\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tid=\"sort-variant\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M3 13H15V11H3M3 6V8H21V6M3 18H9V16H3V18Z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCana,sBAAsB,GAAA,MAAA;AALnC,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAiChC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAe,OAAO;AAmFpC;AA/GA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,+BAA+B;AAChD,iBAAA,cAAc,CACd,CAAG,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAA8B,0DAA0D;iBAEtJ,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAqBtC;;;;AAIG;IAEH,cAAc,GAAA;QACb,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,CAAC;QACnE,IAAI,OAAO,EAAE;AACZ,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM;;aAC5B;AACN,YAAA,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,MAAM;;iBAClC;AACN,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,EAAE;;;;AAKlD;;;AAGG;IACK,iBAAiB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,UAAU;aAC3B,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,+BAA+B;aAChD,cAAc,CAAC,oCAAoC;aACnD,gBAAgB,CAAC,8BAA8B;aAC/C,cAAc,CAAC,mCAAmC;aAClD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;AAChB,QAAA,OAAO,OAAO;;AAGf;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;AACL,QAAA,QACC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAA8B,2BAAA,EAAA,IAAI,CAAC,eAAe,CAAA,qBAAA,EAAwB,IAAI,CAAC,cAAc,CAAE,CAAA,EACtG,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,cAAc,IAAI,EAAE,EAAA,EAE5C,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAClC,EAAE,EAAC,cAAc,EAAA,EAEjB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,0CAA0C,GAAG,CAChD,CACD;;;;;;;;;;;"}

package/dist/ontario-design-system-components/ontario-icon-sort.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-sort.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-sort&encapsulation=shadow","src/components/ontario-icon/ontario-icon-sort.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-sort',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconSort implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-sort> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-sort> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"sort\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-sort.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-sort&encapsulation=shadow","src/components/ontario-icon/ontario-icon-sort.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-sort',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconSort implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-sort> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-sort> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" id=\"sort\">\n\t\t\t\t\t<path d=\"M18 21L14 17H17V7H14L18 3L22 7H19V17H22M2 19V17H12V19M2 13V11H9V13M2 7V5H6V7H2Z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCana,eAAe,GAAA,MAAA;AAL5B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAiChC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAe,OAAO;AA4EpC;AAxGA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,uBAAuB;AACxC,iBAAA,cAAc,CACd,CAAG,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAA8B,0DAA0D;iBAEtJ,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAqBtC;;;;AAIG;IAEH,cAAc,GAAA;QACb,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,CAAC;QACnE,IAAI,OAAO,EAAE;AACZ,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM;;aAC5B;AACN,YAAA,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,MAAM;;iBAClC;AACN,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,EAAE;;;;AAKlD;;;AAGG;IACK,iBAAiB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,UAAU;aAC3B,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,uBAAuB;aACxC,cAAc,CAAC,oCAAoC;aACnD,gBAAgB,CAAC,8BAA8B;aAC/C,cAAc,CAAC,mCAAmC;aAClD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;AAChB,QAAA,OAAO,OAAO;;AAGf;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;AACL,QAAA,QACC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAA8B,2BAAA,EAAA,IAAI,CAAC,eAAe,CAAA,qBAAA,EAAwB,IAAI,CAAC,cAAc,CAAE,CAAA,EACtG,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,cAAc,IAAI,EAAE,EAAA,EAE5C,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAC,EAAE,EAAC,MAAM,EAAA,EACvG,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,iFAAiF,GAAG,CACvF,CACD;;;;;;;;;;;"}

package/dist/ontario-design-system-components/ontario-icon-tag.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-tag.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-tag&encapsulation=shadow","src/components/ontario-icon/ontario-icon-tag.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-tag',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTag implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-tag> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-tag> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"tag\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M5.5 7A1.5 1.5 0 0 1 4 5.5 1.5 1.5 0 0 1 5.5 4 1.5 1.5 0 0 1 7 5.5 1.5 1.5 0 0 1 5.5 7zm15.9 4.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.6 1.4l9 9c.37.36.87.6 1.42.6s1.05-.23 1.4-.6l7-7c.37-.36.6-.86.6-1.4a2 2 0 0 0-.59-1.42z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-tag.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-tag&encapsulation=shadow","src/components/ontario-icon/ontario-icon-tag.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-tag',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTag implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-tag> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-tag> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"tag\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M5.5 7A1.5 1.5 0 0 1 4 5.5 1.5 1.5 0 0 1 5.5 4 1.5 1.5 0 0 1 7 5.5 1.5 1.5 0 0 1 5.5 7zm15.9 4.58l-9-9C12.05 2.22 11.55 2 11 2H4c-1.1 0-2 .9-2 2v7c0 .55.22 1.05.6 1.4l9 9c.37.36.87.6 1.42.6s1.05-.23 1.4-.6l7-7c.37-.36.6-.86.6-1.4a2 2 0 0 0-.59-1.42z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-timer.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-timer.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-timer&encapsulation=shadow","src/components/ontario-icon/ontario-icon-timer.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-timer',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTimer implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-timer> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-timer> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"timer\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M15 1H9v2h6V1zm-4 13h2V8h-2v6zm8.03-6.6l1.42-1.42c-.43-.5-.9-1-1.4-1.4l-1.42 1.42A8.96 8.96 0 0 0 12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9 9-4.03 9-9c0-2.12-.74-4.07-1.97-5.6zM12 20c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-timer.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-timer&encapsulation=shadow","src/components/ontario-icon/ontario-icon-timer.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-timer',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTimer implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-timer> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-timer> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"timer\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M15 1H9v2h6V1zm-4 13h2V8h-2v6zm8.03-6.6l1.42-1.42c-.43-.5-.9-1-1.4-1.4l-1.42 1.42A8.96 8.96 0 0 0 12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9 9-4.03 9-9c0-2.12-.74-4.07-1.97-5.6zM12 20c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-transport-bicycle.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-transport-bicycle.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-transport-bicycle&encapsulation=shadow","src/components/ontario-icon/ontario-icon-transport-bicycle.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-transport-bicycle',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTransportBicycle implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-transport-bicycle> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-transport-bicycle> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"transport-bicycle\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M15.208 6.167a1.84 1.84 0 0 0 1.833-1.833A1.84 1.84 0 0 0 15.208 2.5a1.84 1.84 0 0 0-1.833 1.833 1.84 1.84 0 0 0 1.833 1.833zm-9.625 5.958C3.017 12.125 1 14.142 1 16.708s2.017 4.583 4.583 4.583 4.583-2.017 4.583-4.583-2.017-4.583-4.583-4.583zm0 7.792a3.25 3.25 0 0 1-3.208-3.208A3.25 3.25 0 0 1 5.583 13.5a3.25 3.25 0 0 1 3.208 3.208 3.25 3.25 0 0 1-3.208 3.208zM10.9 10.75l2.2-2.2.733.733a6.42 6.42 0 0 0 4.675 1.925V9.375c-1.375 0-2.475-.55-3.3-1.375l-1.742-1.742c-.458-.367-.917-.55-1.467-.55a1.71 1.71 0 0 0-1.283.55L8.15 8.825a1.81 1.81 0 0 0-.55 1.283c0 .55.183 1.008.55 1.283l2.933 2.567v4.583h1.833v-5.683L10.9 10.75zm7.517 1.375c-2.567 0-4.583 2.017-4.583 4.583s2.017 4.583 4.583 4.583S23 19.275 23 16.708s-2.017-4.583-4.583-4.583zm0 7.792a3.25 3.25 0 0 1-3.208-3.208 3.25 3.25 0 0 1 3.208-3.208 3.25 3.25 0 0 1 3.208 3.208 3.25 3.25 0 0 1-3.208 3.208z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-transport-bicycle.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-transport-bicycle&encapsulation=shadow","src/components/ontario-icon/ontario-icon-transport-bicycle.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-transport-bicycle',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTransportBicycle implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-transport-bicycle> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-transport-bicycle> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"transport-bicycle\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M15.208 6.167a1.84 1.84 0 0 0 1.833-1.833A1.84 1.84 0 0 0 15.208 2.5a1.84 1.84 0 0 0-1.833 1.833 1.84 1.84 0 0 0 1.833 1.833zm-9.625 5.958C3.017 12.125 1 14.142 1 16.708s2.017 4.583 4.583 4.583 4.583-2.017 4.583-4.583-2.017-4.583-4.583-4.583zm0 7.792a3.25 3.25 0 0 1-3.208-3.208A3.25 3.25 0 0 1 5.583 13.5a3.25 3.25 0 0 1 3.208 3.208 3.25 3.25 0 0 1-3.208 3.208zM10.9 10.75l2.2-2.2.733.733a6.42 6.42 0 0 0 4.675 1.925V9.375c-1.375 0-2.475-.55-3.3-1.375l-1.742-1.742c-.458-.367-.917-.55-1.467-.55a1.71 1.71 0 0 0-1.283.55L8.15 8.825a1.81 1.81 0 0 0-.55 1.283c0 .55.183 1.008.55 1.283l2.933 2.567v4.583h1.833v-5.683L10.9 10.75zm7.517 1.375c-2.567 0-4.583 2.017-4.583 4.583s2.017 4.583 4.583 4.583S23 19.275 23 16.708s-2.017-4.583-4.583-4.583zm0 7.792a3.25 3.25 0 0 1-3.208-3.208 3.25 3.25 0 0 1 3.208-3.208 3.25 3.25 0 0 1 3.208 3.208 3.25 3.25 0 0 1-3.208 3.208z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-transport-car.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-transport-car.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-transport-car&encapsulation=shadow","src/components/ontario-icon/ontario-icon-transport-car.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-transport-car',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTransportCar implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-transport-car> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-transport-car> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"transport-car\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M18.92 6c-.2-.6-.76-1-1.42-1h-11c-.66 0-1.2.42-1.42 1L3 12v8c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-1h12v1c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-8l-2.08-6zM6.5 16a1.5 1.5 0 1 1 0-3 1.5 1.5 0 1 1 0 3zm11 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 1 1 0 3zM5 11l1.5-4.5h11L19 11H5z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-transport-car.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-transport-car&encapsulation=shadow","src/components/ontario-icon/ontario-icon-transport-car.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-transport-car',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTransportCar implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-transport-car> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-transport-car> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"transport-car\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M18.92 6c-.2-.6-.76-1-1.42-1h-11c-.66 0-1.2.42-1.42 1L3 12v8c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-1h12v1c0 .55.45 1 1 1h1c.55 0 1-.45 1-1v-8l-2.08-6zM6.5 16a1.5 1.5 0 1 1 0-3 1.5 1.5 0 1 1 0 3zm11 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 1 1 0 3zM5 11l1.5-4.5h11L19 11H5z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-transport-walk.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-transport-walk.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-transport-walk&encapsulation=shadow","src/components/ontario-icon/ontario-icon-transport-walk.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-transport-walk',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTransportWalk implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-transport-walk> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-transport-walk> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"transport-walk\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M13.326 5.407a1.96 1.96 0 0 0 1.954-1.953A1.96 1.96 0 0 0 13.326 1.5a1.96 1.96 0 0 0-1.953 1.953 1.96 1.96 0 0 0 1.954 1.953zm-3.614 3.32L6.977 22.5h2.05l1.758-7.814 2.05 1.954v5.86h1.954v-7.326l-2.05-1.953.586-2.93c1.27 1.465 3.026 2.442 5.174 2.442V10.78c-1.856 0-3.22-.977-4.002-2.344l-.977-1.563c-.39-.586-.977-.977-1.66-.977-.193 0-.56.005-.78.098L6 8.142v4.59h1.953v-3.32l1.758-.684z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-transport-walk.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-transport-walk&encapsulation=shadow","src/components/ontario-icon/ontario-icon-transport-walk.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-transport-walk',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTransportWalk implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-transport-walk> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-transport-walk> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"transport-walk\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M13.326 5.407a1.96 1.96 0 0 0 1.954-1.953A1.96 1.96 0 0 0 13.326 1.5a1.96 1.96 0 0 0-1.953 1.953 1.96 1.96 0 0 0 1.954 1.953zm-3.614 3.32L6.977 22.5h2.05l1.758-7.814 2.05 1.954v5.86h1.954v-7.326l-2.05-1.953.586-2.93c1.27 1.465 3.026 2.442 5.174 2.442V10.78c-1.856 0-3.22-.977-4.002-2.344l-.977-1.563c-.39-.586-.977-.977-1.66-.977-.193 0-.56.005-.78.098L6 8.142v4.59h1.953v-3.32l1.758-.684z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-tty.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-tty.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-tty&encapsulation=shadow","src/components/ontario-icon/ontario-icon-tty.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-tty',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTty implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-tty> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-tty> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"tty\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M2.2 6.056c5.41-5.41 14.177-5.403 19.58 0 .237.237.276.605.1.886l-1.688 2.7c-.09.142-.225.25-.385.3s-.333.047-.488-.016l-3.376-1.35c-.144-.058-.266-.16-.346-.293s-.116-.288-.1-.443l.232-2.325a11.07 11.07 0 0 0-7.48 0l.233 2.325c.015.155-.02.3-.1.443s-.202.236-.346.293L4.67 9.928c-.156.062-.33.068-.488.016s-.296-.16-.385-.3L2.11 6.94c-.086-.137-.123-.3-.104-.46s.09-.31.205-.425zm3.54 7.976V12.47A.47.47 0 0 0 5.281 12H3.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469H5.28a.47.47 0 0 0 .469-.469zm3.75 0V12.47A.47.47 0 0 0 9.031 12H7.47a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469H9.03a.47.47 0 0 0 .469-.469zm3.75 0V12.47a.47.47 0 0 0-.469-.469H11.22a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V12.47a.47.47 0 0 0-.469-.469H14.97a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V12.47a.47.47 0 0 0-.469-.469H18.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zM7.625 17.78V16.22a.47.47 0 0 0-.469-.469H5.594a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V16.22a.47.47 0 0 0-.469-.469H9.344a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V16.22a.47.47 0 0 0-.469-.469h-1.562a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V16.22a.47.47 0 0 0-.469-.469h-1.562a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zM5.75 21.53V19.97a.47.47 0 0 0-.469-.469H3.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469H5.28a.47.47 0 0 0 .469-.469zm11.25 0V19.97a.47.47 0 0 0-.469-.469H7.47a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h9.063a.47.47 0 0 0 .469-.469zm3.75 0V19.97a.47.47 0 0 0-.469-.469H18.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-tty.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-tty&encapsulation=shadow","src/components/ontario-icon/ontario-icon-tty.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-tty',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTty implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-tty> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-tty> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"tty\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M2.2 6.056c5.41-5.41 14.177-5.403 19.58 0 .237.237.276.605.1.886l-1.688 2.7c-.09.142-.225.25-.385.3s-.333.047-.488-.016l-3.376-1.35c-.144-.058-.266-.16-.346-.293s-.116-.288-.1-.443l.232-2.325a11.07 11.07 0 0 0-7.48 0l.233 2.325c.015.155-.02.3-.1.443s-.202.236-.346.293L4.67 9.928c-.156.062-.33.068-.488.016s-.296-.16-.385-.3L2.11 6.94c-.086-.137-.123-.3-.104-.46s.09-.31.205-.425zm3.54 7.976V12.47A.47.47 0 0 0 5.281 12H3.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469H5.28a.47.47 0 0 0 .469-.469zm3.75 0V12.47A.47.47 0 0 0 9.031 12H7.47a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469H9.03a.47.47 0 0 0 .469-.469zm3.75 0V12.47a.47.47 0 0 0-.469-.469H11.22a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V12.47a.47.47 0 0 0-.469-.469H14.97a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V12.47a.47.47 0 0 0-.469-.469H18.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zM7.625 17.78V16.22a.47.47 0 0 0-.469-.469H5.594a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V16.22a.47.47 0 0 0-.469-.469H9.344a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V16.22a.47.47 0 0 0-.469-.469h-1.562a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zm3.75 0V16.22a.47.47 0 0 0-.469-.469h-1.562a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469zM5.75 21.53V19.97a.47.47 0 0 0-.469-.469H3.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469H5.28a.47.47 0 0 0 .469-.469zm11.25 0V19.97a.47.47 0 0 0-.469-.469H7.47a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h9.063a.47.47 0 0 0 .469-.469zm3.75 0V19.97a.47.47 0 0 0-.469-.469H18.72a.47.47 0 0 0-.469.469v1.563a.47.47 0 0 0 .469.469h1.563a.47.47 0 0 0 .469-.469z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-twitter-alt.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-twitter-alt.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-twitter-alt&encapsulation=shadow","src/components/ontario-icon/ontario-icon-twitter-alt.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-twitter-alt',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTwitterAlt implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-twitter-alt> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-twitter-alt> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"twitter-alt\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm12.7 6.33c.48-.4 1.04-.88 1.3-1.4-.4.2-.9.34-1.44.4.5-.36.9-.83 1.12-1.47-.52.28-1.05.52-1.7.64-1.55-1.87-5.26-.35-4.6 2.45-2.6-.16-4.2-1.34-5.52-2.8-.75 1.22-.1 3.07.8 3.58-.46-.03-.8-.17-1.14-.33.04 1.54.9 2.28 2.08 2.68-.36.07-.76.1-1.14.03C7.8 14.2 8.58 14.86 9.9 15c-.9.76-2.56 1.3-3.9 1.08 1.15.73 2.46 1.3 4.28 1.23 4.4-.2 7.36-3.36 7.43-7.98z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-twitter-alt.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-twitter-alt&encapsulation=shadow","src/components/ontario-icon/ontario-icon-twitter-alt.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-twitter-alt',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTwitterAlt implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-twitter-alt> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-twitter-alt> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"twitter-alt\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm12.7 6.33c.48-.4 1.04-.88 1.3-1.4-.4.2-.9.34-1.44.4.5-.36.9-.83 1.12-1.47-.52.28-1.05.52-1.7.64-1.55-1.87-5.26-.35-4.6 2.45-2.6-.16-4.2-1.34-5.52-2.8-.75 1.22-.1 3.07.8 3.58-.46-.03-.8-.17-1.14-.33.04 1.54.9 2.28 2.08 2.68-.36.07-.76.1-1.14.03C7.8 14.2 8.58 14.86 9.9 15c-.9.76-2.56 1.3-3.9 1.08 1.15.73 2.46 1.3 4.28 1.23 4.4-.2 7.36-3.36 7.43-7.98z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-twitter.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-twitter.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-twitter&encapsulation=shadow","src/components/ontario-icon/ontario-icon-twitter.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-twitter',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTwitter implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-twitter> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-twitter> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"twitter\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M22.46 6c-.77.35-1.6.58-2.46.7a4.3 4.3 0 0 0 1.88-2.38 8.64 8.64 0 0 1-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.3a4.46 4.46 0 0 0 .11.98C8.28 9.1 5.1 7.38 3 4.8c-.37.63-.58 1.37-.58 2.15 0 1.5.75 2.8 1.9 3.56-.7 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.2a4.22 4.22 0 0 1-1.13.15c-.27 0-.54-.03-.8-.08a4.28 4.28 0 0 0 4 2.98c-1.46 1.16-3.3 1.84-5.33 1.84-.34 0-.68-.02-1.02-.06C3.44 20.3 5.7 21 8.12 21c7.88 0 12.2-6.54 12.2-12.2 0-.2 0-.37-.01-.56.84-.6 1.56-1.36 2.14-2.23z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCana,kBAAkB,GAAA,MAAA;AAL/B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAmChC;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAe,OAAO;AAmFpC;AAjHA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,0BAA0B;AAC3C,iBAAA,cAAc,CACd,CACC,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAC5D,0DAA0D;iBAE1D,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAqBtC;;;;AAIG;IAEH,cAAc,GAAA;QACb,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,CAAC;QACnE,IAAI,OAAO,EAAE;AACZ,YAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,MAAM;;aAC5B;AACN,YAAA,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,MAAM;;iBAClC;AACN,gBAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,EAAE;;;;AAKlD;;;AAGG;IACK,iBAAiB,GAAA;AACxB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,UAAU;aAC3B,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,0BAA0B;aAC3C,cAAc,CAAC,oCAAoC;aACnD,gBAAgB,CAAC,8BAA8B;aAC/C,cAAc,CAAC,mCAAmC;aAClD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;AAChB,QAAA,OAAO,OAAO;;AAGf;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;QACL,QACC,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAA8B,2BAAA,EAAA,IAAI,CAAC,eAAe,CAAA,qBAAA,EAAwB,IAAI,CAAC,cAAc,CAAE,CAAA,EACtG,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,cAAc,CAAI,EAAA,CAAA,EAAE,EAAA,EAE5C,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,KAAK,EAAC,UAAU,EAChB,KAAK,EAAE,EAAE,IAAI,EAAE,CAAA,EAAG,IAAI,CAAC,qBAAqB,EAAE,EAAE,MAAM,EAAE,CAAA,EAAG,IAAI,CAAC,qBAAqB,CAAE,CAAA,EAAE,EACzF,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,EAAE,EAAC,SAAS,EAAA,EAEZ,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,kfAAkf,GAAG,CACxf,CACD;;;;;;;;;;;"}
+{"version":3,"file":"ontario-icon-twitter.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-twitter&encapsulation=shadow","src/components/ontario-icon/ontario-icon-twitter.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-twitter',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconTwitter implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-twitter> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-twitter> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"twitter\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M22.46 6c-.77.35-1.6.58-2.46.7a4.3 4.3 0 0 0 1.88-2.38 8.64 8.64 0 0 1-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.3a4.46 4.46 0 0 0 .11.98C8.28 9.1 5.1 7.38 3 4.8c-.37.63-.58 1.37-.58 2.15 0 1.5.75 2.8 1.9 3.56-.7 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.2a4.22 4.22 0 0 1-1.13.15c-.27 0-.54-.03-.8-.08a4.28 4.28 0 0 0 4 2.98c-1.46 1.16-3.3 1.84-5.33 1.84-.34 0-.68-.02-1.02-.06C3.44 20.3 5.7 21 8.12 21c7.88 0 12.2-6.54 12.2-12.2 0-.2 0-.37-.01-.56.84-.6 1.56-1.36 2.14-2.23z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}

package/dist/ontario-design-system-components/ontario-icon-upload.entry.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ontario-icon-upload.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-upload&encapsulation=shadow","src/components/ontario-icon/ontario-icon-upload.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-upload',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconUpload implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-upload> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-upload> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"upload\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M9 16v-6H5l7-7 7 7h-4v6H9zm-4 4v-2h14v2H5z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ontario-icon-upload.entry.esm.js","sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-upload&encapsulation=shadow","src/components/ontario-icon/ontario-icon-upload.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-upload',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconUpload implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-upload> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-upload> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"upload\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M9 16v-6H5l7-7 7 7h-4v6H9zm-4 4v-2h14v2H5z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"names":[],"mappings":"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"}