npm - @ongov/ontario-design-system-component-library - Versions diffs - 5.0.0-alpha.4 → 5.0.0-alpha.6 - Mend

@ongov/ontario-design-system-component-library 5.0.0-alpha.4 → 5.0.0-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2369) hide show

package/dist/collection/components/ontario-table/ontario-table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ontario-table.js","sourceRoot":"","sources":["../../../src/components/ontario-table/ontario-table.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Prop, State, Watch, getAssetPath } from '@stencil/core';\n\nimport { Table, TableColumnOptions, TableRowOptions } from './table.interface';\n\nimport { validateTableColumns, validateTableRowOptions } from './utils/ontario-table-validation';\n\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { ConsoleType } from '../../utils/console-message/console-message.enum';\nimport { extractValuesByKey, organizeObjectKeys, removeObjectsBySpecificKey } from '../../utils/helper/utils';\n\n@Component({\n\ttag: 'ontario-table',\n\tstyleUrl: 'ontario-table.scss',\n\tshadow: true,\n\tassetsDirs: ['./assets'],\n})\nexport class OntarioTable implements Table {\n\t@Element() element: HTMLElement;\n\tprivate tableScrollWrapper: HTMLElement;\n\tprivate tableScrollDiv: HTMLElement;\n\tprivate table: HTMLElement;\n\n\t/*\n\t Specifies the caption (or title) of the table.\n\t \n\t This is optional.\n\t /\n\t@Prop() caption?: string \| undefined;\n\n\t/\n\t Used to define the columns of the table.\n\t \n\t @example;\n\t * <ontario-table\n\t * table-columns='[\n\t * { \"title\": \"Type of service\", \"key\": \"service\" },\n\t * { \"title\": \"Processing and delivery\", \"key\": \"processing\" },\n\t * { \"title\": \"Cost\", \"key\": \"cost\", \"type\": \"numeric\" }\n\t * ]'\n\t * >\n\t * </ontario-table>\n\t /\n\t@Prop() tableColumns: string \| TableColumnOptions[];\n\n\t/\n\t Used to define the table body data. Note that the keys passed to the `data` object in the tableData should match the keys of the columns defined in the tableColumns prop.\n\t \n\t @example\n\t * <ontario-table\n\t * table-data='[\n\t * {\n\t * \"data\": {\n\t * \"service\": \"Regular service (online)\",\n\t * \"processing\": \"15 business days plus delivery by Canada Post\",\n\t * \"cost\": \"$15\"\n\t * }\n\t * },\n\t * {\n\t * \"data\": {\n\t * \"service\": \"Premium service (online)\",\n\t * \"cost\": \"$45\",\n\t * \"processing\": \"5 business days including delivery by courier\"\n\t * }\n\t * }\n\t * ]'\n\t * >\n\t * </ontario-table>\n\t /\n\t@Prop() tableData: string \| TableRowOptions[];\n\n\t/\n\t Indicates whether or not the table data should have alternate row zebra striping.\n\t \n\t This is optional. By default, zebra striping will be added when the table rows extend 5 rows. If zebra striping is needed to table rows less than 5 rows, the prop should be set to “enabled”. If no zebra stripes are needed, it should be set to “disabled”.\n\t \n\t The default will be set to “auto”.\n\t /\n\t@Prop() zebraStripes?: 'auto' \| 'disabled' \| 'enabled' \| undefined = 'auto';\n\n\t/\n\t Used to specify whether or not table data in cells should have reduced top and bottom padding. This is useful for pages with multiple data-heavy tables such as a budget or financial data.\n\t \n\t This is optional. By default it will be set to “false”.\n\t /\n\t@Prop() condensed?: boolean \| undefined = false;\n\n\t/\n\t Used to specify whether or not the table should extend the full width of its container.\n\t \n\t This is optional. By default, it will be set to “false”\n\t */\n\t@Prop() fullWidth?: boolean \| undefined = false;\n\n\t@State() private tableColumnsState: TableColumnOptions[];\n\n\t@State() private tableDataState: TableRowOptions[];\n\n\t@State() private tableFooterState: TableRowOptions[];\n\n\t@Watch('tableColumns')\n\tprivate processTableColumns() {\n\t\tthis.tableColumns && this.parseOptions(this.tableColumns);\n\t\tvalidateTableColumns(this.tableColumnsState);\n\t}\n\n\t@Watch('tableData')\n\tprivate processTableData() {\n\t\tthis.tableData && this.parseOptions(this.tableData);\n\t\tvalidateTableRowOptions(this.tableDataState);\n\t}\n\n\t// Parse the tableColumn & tableData options if they are strings\n\t// Transforms the data and stores it in respective state objects\n\tprivate parseOptions(options: any) {\n\t\tconst isString = typeof options === 'string';\n\n\t\tif (!options) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tif (options === this.tableColumns) {\n\t\t\t\tthis.tableColumnsState = isString ? JSON.parse(options) : options;\n\t\t\t} else {\n\t\t\t\tthis.tableDataState = isString ? JSON.parse(options) : options;\n\t\t\t\tthis.transformTableData(this.tableDataState);\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addRegularText(' failed to parse props for ')\n\t\t\t\t.addMonospaceText('<ontario-table>')\n\t\t\t\t.addRegularText(' in ')\n\t\t\t\t.addMonospaceText('parseOptions()')\n\t\t\t\t.addRegularText(' method \\n ')\n\t\t\t\t.addMonospaceText(error.stack)\n\t\t\t\t.printMessage(ConsoleType.Error);\n\t\t}\n\t}\n\n\tprivate transformTableData = (tableData: TableRowOptions[]) => {\n\t\t// get column keys\n\t\tconst columns = extractValuesByKey<TableColumnOptions>(this.tableColumnsState, 'key').filter(\n\t\t\t(column): column is keyof TableRowOptions => column !== undefined,\n\t\t);\n\n\t\t// organize table data data object according to the order of the column keys\n\t\tconst organizedTableData = organizeObjectKeys(tableData, columns);\n\n\t\t// remove the footer table data into it's own state so that it can be rendered in a `tfoot` element\n\t\tconst [updatedTableData, tableFooterData] = removeObjectsBySpecificKey(organizedTableData, 'footer', true);\n\n\t\tthis.tableDataState = updatedTableData;\n\t\tthis.tableFooterState = tableFooterData;\n\t};\n\n\tprivate getZebraStripeClass = () => {\n\t\treturn this.zebraStripes === 'disabled'\n\t\t\t? `ontario-table--no-zebra-stripes`\n\t\t\t: this.zebraStripes === 'enabled'\n\t\t\t? `ontario-table--zebra-stripes-enabled`\n\t\t\t: ``;\n\t};\n\n\tprivate getTableClasses = () => {\n\t\tlet tableClass = '';\n\t\tif (this.condensed && this.fullWidth) {\n\t\t\ttableClass = `ontario-table--condensed ontario-table--full-container-width`;\n\t\t} else if (this.condensed) {\n\t\t\ttableClass = `ontario-table--condensed`;\n\t\t} else if (this.fullWidth) {\n\t\t\ttableClass = `ontario-table--full-container-width`;\n\t\t}\n\n\t\tconst zebraStripesClass = this.getZebraStripeClass();\n\t\tif (tableClass) {\n\t\t\ttableClass = `${tableClass} ${zebraStripesClass}`;\n\t\t} else {\n\t\t\ttableClass = zebraStripesClass;\n\t\t}\n\n\t\treturn tableClass;\n\t};\n\n\tprivate getColumnClasses = (columnData: TableColumnOptions) => {\n\t\tif (columnData.type === 'numeric' && columnData.colSpan) {\n\t\t\treturn `ontario-table-cell--numeric ontario-table-header--column-span-${columnData.colSpan}`;\n\t\t} else if (columnData.type === 'numeric') {\n\t\t\treturn `ontario-table-cell--numeric`;\n\t\t} else if (columnData.colSpan) {\n\t\t\treturn `ontario-table-header--column-span-${columnData.colSpan}`;\n\t\t}\n\n\t\treturn;\n\t};\n\n\t// A function used to generate the table header and table definitions for the table body and table footer sections.\n\tprivate generateTableDataHTML = (\n\t\tdataType: 'tableData' \| 'tableFooter',\n\t\trowData: any,\n\t\tcolumns: (string \| number \| undefined)[],\n\t\trowClass?: string \| undefined,\n\t) => {\n\t\treturn (\n\t\t\t<tr class={dataType === 'tableData' ? rowClass : ''}>\n\t\t\t\t{this.tableColumnsState.map((column, index) => {\n\t\t\t\t\tconst type = column.type;\n\t\t\t\t\tconst tdClass = type === 'numeric' ? `ontario-table-cell--numeric` : '';\n\n\t\t\t\t\treturn index === 0 ? (\n\t\t\t\t\t\t<th scope=\"row\" innerHTML={rowData.data[`${columns[0]}`]}>\n\t\t\t\t\t\t\t{dataType === 'tableData' && rowData.highlight && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tclass=\"ontario-table--highlight-indicator\"\n\t\t\t\t\t\t\t\t\tsrc={getAssetPath('./assets/highlight-indicator.svg')}\n\t\t\t\t\t\t\t\t></img>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</th>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<td class={tdClass} innerHTML={rowData.data[`${columns[index]}`]}></td>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</tr>\n\t\t);\n\t};\n\n\t// Helper function to apply the scrollbar styles to the tops of tables\n\tprivate applyScrollbar(tableElement: Element, scrollerDiv: HTMLElement) {\n\t\tscrollerDiv.style.visibility = 'visible';\n\t\tscrollerDiv.style.height = '20px';\n\t\tscrollerDiv.style.width = `${tableElement.scrollWidth}px`;\n\t}\n\n\t// The following logic adds scrollbar functionality to the tops of tables depending on their size.\n\tcomponentDidLoad() {\n\t\tconst tables = this.table;\n\t\tconst scrollerDivs = this.tableScrollDiv;\n\t\tconst scrollerWrappers = this.tableScrollWrapper;\n\n\t\tlet resizeObserver = new ResizeObserver(() => {\n\t\t\tthis.applyScrollbar(tables, scrollerDivs);\n\t\t});\n\n\t\tthis.applyScrollbar(tables, scrollerDivs);\n\t\tresizeObserver.observe(tables);\n\n\t\ttables.addEventListener('scroll', () => {\n\t\t\tthis.applyScrollbar(tables, scrollerDivs);\n\n\t\t\tscrollerWrappers.scrollLeft = tables.scrollLeft;\n\t\t});\n\n\t\tscrollerWrappers.addEventListener('scroll', () => {\n\t\t\tthis.applyScrollbar(tables, scrollerDivs);\n\n\t\t\ttables.scrollLeft = scrollerWrappers.scrollLeft;\n\t\t});\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.processTableColumns();\n\t\tthis.processTableData();\n\t}\n\n\trender() {\n\t\tconst columns = extractValuesByKey(this.tableColumnsState, 'key');\n\n\t\treturn (\n\t\t\t<div class=\"ontario-table-container\">\n\t\t\t\t<div class=\"ontario-table-scroll--wrapper\" ref={(el) => (this.tableScrollWrapper = el as HTMLElement)}>\n\t\t\t\t\t<div class=\"ontario-table-scroll--div\" ref={(el) => (this.tableScrollDiv = el as HTMLElement)}></div>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"ontario-table-div\" ref={(el) => (this.table = el as HTMLElement)}>\n\t\t\t\t\t<table class={this.getTableClasses()}>\n\t\t\t\t\t\t{this.caption && <caption>{this.caption}</caption>}\n\t\t\t\t\t\t{this.tableColumnsState && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t\t\t{this.tableColumnsState.map((columnData) => {\n\t\t\t\t\t\t\t\t\t\tconst columnClass = this.getColumnClasses(columnData);\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\t\t\t\t\t\t\tkey={columnData.key}\n\t\t\t\t\t\t\t\t\t\t\t\tdata-type={columnData.type}\n\t\t\t\t\t\t\t\t\t\t\t\tclass={columnClass}\n\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={columnData.title}\n\t\t\t\t\t\t\t\t\t\t\t></th>\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t</thead>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{this.tableDataState && (\n\t\t\t\t\t\t\t<tbody>\n\t\t\t\t\t\t\t\t{this.tableDataState.map((rowData) => {\n\t\t\t\t\t\t\t\t\tconst rowClass = rowData.highlight\n\t\t\t\t\t\t\t\t\t\t? `ontario-table-row--highlight`\n\t\t\t\t\t\t\t\t\t\t: rowData.subtotal\n\t\t\t\t\t\t\t\t\t\t? `ontario-table-row--subtotal`\n\t\t\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\t\t\treturn this.generateTableDataHTML('tableData', rowData, columns, rowClass);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</tbody>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{!!this.tableFooterState.length && (\n\t\t\t\t\t\t\t<tfoot>\n\t\t\t\t\t\t\t\t{this.tableFooterState.map((footerData) => {\n\t\t\t\t\t\t\t\t\treturn this.generateTableDataHTML('tableData', footerData, columns, undefined);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</tfoot>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</table>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}
1	+ {"version":3,"file":"ontario-table.js","sourceRoot":"","sources":["../../../src/components/ontario-table/ontario-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAIxF,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAEjG,OAAO,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AAClF,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,0BAA0B,EAAE,MAAM,0BAA0B,CAAC;AAQ9G,MAAM,OAAO,YAAY;IACb,OAAO,CAAc;IACxB,kBAAkB,CAAc;IAChC,cAAc,CAAc;IAC5B,KAAK,CAAc;IAE3B;;;;OAIG;IACK,OAAO,CAAsB;IAErC;;;;;;;;;;;;OAYG;IACK,YAAY,CAAgC;IAEpD;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IACK,SAAS,CAA6B;IAE9C;;;;;;OAMG;IACK,YAAY,GAAiD,MAAM,CAAC;IAE5E;;;;OAIG;IACK,SAAS,GAAyB,KAAK,CAAC;IAEhD;;;;OAIG;IACK,SAAS,GAAyB,KAAK,CAAC;IAE/B,iBAAiB,CAAuB;IAExC,cAAc,CAAoB;IAElC,gBAAgB,CAAoB;IAG7C,mBAAmB;QAC1B,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC1D,oBAAoB,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IAC9C,CAAC;IAGO,gBAAgB;QACvB,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QACpD,uBAAuB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAC9C,CAAC;IAED,gEAAgE;IAChE,gEAAgE;IACxD,YAAY,CAAC,OAAY;QAChC,MAAM,QAAQ,GAAG,OAAO,OAAO,KAAK,QAAQ,CAAC;QAE7C,IAAI,CAAC,OAAO,EAAE,CAAC;YACd,OAAO;QACR,CAAC;QAED,IAAI,CAAC;YACJ,IAAI,OAAO,KAAK,IAAI,CAAC,YAAY,EAAE,CAAC;gBACnC,IAAI,CAAC,iBAAiB,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;YACnE,CAAC;iBAAM,CAAC;gBACP,IAAI,CAAC,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;gBAC/D,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;YAC9C,CAAC;QACF,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YAChB,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE,CAAC;YAC1C,OAAO;iBACL,kBAAkB,EAAE;iBACpB,cAAc,CAAC,6BAA6B,CAAC;iBAC7C,gBAAgB,CAAC,iBAAiB,CAAC;iBACnC,cAAc,CAAC,MAAM,CAAC;iBACtB,gBAAgB,CAAC,gBAAgB,CAAC;iBAClC,cAAc,CAAC,aAAa,CAAC;iBAC7B,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC;iBAC7B,YAAY,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;IACF,CAAC;IAEO,kBAAkB,GAAG,CAAC,SAA4B,EAAE,EAAE;QAC7D,kBAAkB;QAClB,MAAM,OAAO,GAAG,kBAAkB,CAAqB,IAAI,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC,MAAM,CAC3F,CAAC,MAAM,EAAmC,EAAE,CAAC,MAAM,KAAK,SAAS,CACjE,CAAC;QAEF,4EAA4E;QAC5E,MAAM,kBAAkB,GAAG,kBAAkB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAElE,mGAAmG;QACnG,MAAM,CAAC,gBAAgB,EAAE,eAAe,CAAC,GAAG,0BAA0B,CAAC,kBAAkB,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;QAE3G,IAAI,CAAC,cAAc,GAAG,gBAAgB,CAAC;QACvC,IAAI,CAAC,gBAAgB,GAAG,eAAe,CAAC;IACzC,CAAC,CAAC;IAEM,mBAAmB,GAAG,GAAG,EAAE;QAClC,OAAO,IAAI,CAAC,YAAY,KAAK,UAAU;YACtC,CAAC,CAAC,iCAAiC;YACnC,CAAC,CAAC,IAAI,CAAC,YAAY,KAAK,SAAS;gBAChC,CAAC,CAAC,sCAAsC;gBACxC,CAAC,CAAC,EAAE,CAAC;IACR,CAAC,CAAC;IAEM,eAAe,GAAG,GAAG,EAAE;QAC9B,IAAI,UAAU,GAAG,EAAE,CAAC;QACpB,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACtC,UAAU,GAAG,8DAA8D,CAAC;QAC7E,CAAC;aAAM,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YAC3B,UAAU,GAAG,0BAA0B,CAAC;QACzC,CAAC;aAAM,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YAC3B,UAAU,GAAG,qCAAqC,CAAC;QACpD,CAAC;QAED,MAAM,iBAAiB,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QACrD,IAAI,UAAU,EAAE,CAAC;YAChB,UAAU,GAAG,GAAG,UAAU,IAAI,iBAAiB,EAAE,CAAC;QACnD,CAAC;aAAM,CAAC;YACP,UAAU,GAAG,iBAAiB,CAAC;QAChC,CAAC;QAED,OAAO,UAAU,CAAC;IACnB,CAAC,CAAC;IAEM,gBAAgB,GAAG,CAAC,UAA8B,EAAE,EAAE;QAC7D,IAAI,UAAU,CAAC,IAAI,KAAK,SAAS,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YACzD,OAAO,iEAAiE,UAAU,CAAC,OAAO,EAAE,CAAC;QAC9F,CAAC;aAAM,IAAI,UAAU,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YAC1C,OAAO,6BAA6B,CAAC;QACtC,CAAC;aAAM,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YAC/B,OAAO,qCAAqC,UAAU,CAAC,OAAO,EAAE,CAAC;QAClE,CAAC;QAED,OAAO;IACR,CAAC,CAAC;IAEF,mHAAmH;IAC3G,qBAAqB,GAAG,CAC/B,QAAqC,EACrC,OAAY,EACZ,OAAwC,EACxC,QAA6B,EAC5B,EAAE;QACH,OAAO,CACN,UAAI,KAAK,EAAE,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,IACjD,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YAC7C,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC;YACzB,MAAM,OAAO,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,EAAE,CAAC;YAExE,OAAO,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CACpB,UAAI,KAAK,EAAC,KAAK,EAAC,SAAS,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,IACtD,QAAQ,KAAK,WAAW,IAAI,OAAO,CAAC,SAAS,IAAI,CACjD,WACC,KAAK,EAAC,oCAAoC,EAC1C,GAAG,EAAE,YAAY,CAAC,kCAAkC,CAAC,GAC/C,CACP,CACG,CACL,CAAC,CAAC,CAAC,CACH,UAAI,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,GAAO,CACvE,CAAC;QACH,CAAC,CAAC,CACE,CACL,CAAC;IACH,CAAC,CAAC;IAEF,sEAAsE;IAC9D,cAAc,CAAC,YAAqB,EAAE,WAAwB;QACrE,WAAW,CAAC,KAAK,CAAC,UAAU,GAAG,SAAS,CAAC;QACzC,WAAW,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;QAClC,WAAW,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,YAAY,CAAC,WAAW,IAAI,CAAC;IAC3D,CAAC;IAED,kGAAkG;IAClG,gBAAgB;QACf,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC;QAC1B,MAAM,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC;QACzC,MAAM,gBAAgB,GAAG,IAAI,CAAC,kBAAkB,CAAC;QAEjD,IAAI,cAAc,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;YAC5C,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;QAC3C,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;QAC1C,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAE/B,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE;YACtC,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;YAE1C,gBAAgB,CAAC,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;QACjD,CAAC,CAAC,CAAC;QAEH,gBAAgB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE;YAChD,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;YAE1C,MAAM,CAAC,UAAU,GAAG,gBAAgB,CAAC,UAAU,CAAC;QACjD,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,iBAAiB;QAChB,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC3B,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACL,MAAM,OAAO,GAAG,kBAAkB,CAAC,IAAI,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC;QAElE,OAAO,CACN,4DAAK,KAAK,EAAC,yBAAyB;YACnC,4DAAK,KAAK,EAAC,+BAA+B,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,kBAAkB,GAAG,EAAiB,CAAC;gBACpG,4DAAK,KAAK,EAAC,2BAA2B,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,EAAiB,CAAC,GAAQ,CAChG;YACN,4DAAK,KAAK,EAAC,mBAAmB,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,EAAiB,CAAC;gBAC3E,8DAAO,KAAK,EAAE,IAAI,CAAC,eAAe,EAAE;oBAClC,IAAI,CAAC,OAAO,IAAI,kEAAU,IAAI,CAAC,OAAO,CAAW;oBACjD,IAAI,CAAC,iBAAiB,IAAI,CAC1B;wBACC,6DACE,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE;4BAC1C,MAAM,WAAW,GAAG,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC;4BACtD,OAAO,CACN,UACC,KAAK,EAAC,KAAK,EACX,GAAG,EAAE,UAAU,CAAC,GAAG,eACR,UAAU,CAAC,IAAI,EAC1B,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,UAAU,CAAC,KAAK,GACtB,CACN,CAAC;wBACH,CAAC,CAAC,CACE,CACE,CACR;oBACA,IAAI,CAAC,cAAc,IAAI,CACvB,gEACE,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;wBACpC,MAAM,QAAQ,GAAG,OAAO,CAAC,SAAS;4BACjC,CAAC,CAAC,8BAA8B;4BAChC,CAAC,CAAC,OAAO,CAAC,QAAQ;gCACjB,CAAC,CAAC,6BAA6B;gCAC/B,CAAC,CAAC,SAAS,CAAC;wBAEd,OAAO,IAAI,CAAC,qBAAqB,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC;oBAC5E,CAAC,CAAC,CACK,CACR;oBACA,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,IAAI,CAClC,gEACE,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE;wBACzC,OAAO,IAAI,CAAC,qBAAqB,CAAC,WAAW,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC;oBAChF,CAAC,CAAC,CACK,CACR,CACM,CACH,CACD,CACN,CAAC;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, h, Element, Prop, State, Watch, getAssetPath } from '@stencil/core';\n\nimport { Table, TableColumnOptions, TableRowOptions } from './table.interface';\n\nimport { validateTableColumns, validateTableRowOptions } from './utils/ontario-table-validation';\n\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { ConsoleType } from '../../utils/console-message/console-message.enum';\nimport { extractValuesByKey, organizeObjectKeys, removeObjectsBySpecificKey } from '../../utils/helper/utils';\n\n@Component({\n\ttag: 'ontario-table',\n\tstyleUrl: 'ontario-table.scss',\n\tshadow: true,\n\tassetsDirs: ['./assets'],\n})\nexport class OntarioTable implements Table {\n\t@Element() element: HTMLElement;\n\tprivate tableScrollWrapper: HTMLElement;\n\tprivate tableScrollDiv: HTMLElement;\n\tprivate table: HTMLElement;\n\n\t/*\n\t Specifies the caption (or title) of the table.\n\t \n\t This is optional.\n\t /\n\t@Prop() caption?: string \| undefined;\n\n\t/\n\t Used to define the columns of the table.\n\t \n\t @example;\n\t * <ontario-table\n\t * table-columns='[\n\t * { \"title\": \"Type of service\", \"key\": \"service\" },\n\t * { \"title\": \"Processing and delivery\", \"key\": \"processing\" },\n\t * { \"title\": \"Cost\", \"key\": \"cost\", \"type\": \"numeric\" }\n\t * ]'\n\t * >\n\t * </ontario-table>\n\t /\n\t@Prop() tableColumns: string \| TableColumnOptions[];\n\n\t/\n\t Used to define the table body data. Note that the keys passed to the `data` object in the tableData should match the keys of the columns defined in the tableColumns prop.\n\t \n\t @example\n\t * <ontario-table\n\t * table-data='[\n\t * {\n\t * \"data\": {\n\t * \"service\": \"Regular service (online)\",\n\t * \"processing\": \"15 business days plus delivery by Canada Post\",\n\t * \"cost\": \"$15\"\n\t * }\n\t * },\n\t * {\n\t * \"data\": {\n\t * \"service\": \"Premium service (online)\",\n\t * \"cost\": \"$45\",\n\t * \"processing\": \"5 business days including delivery by courier\"\n\t * }\n\t * }\n\t * ]'\n\t * >\n\t * </ontario-table>\n\t /\n\t@Prop() tableData: string \| TableRowOptions[];\n\n\t/\n\t Indicates whether or not the table data should have alternate row zebra striping.\n\t \n\t This is optional. By default, zebra striping will be added when the table rows extend 5 rows. If zebra striping is needed to table rows less than 5 rows, the prop should be set to “enabled”. If no zebra stripes are needed, it should be set to “disabled”.\n\t \n\t The default will be set to “auto”.\n\t /\n\t@Prop() zebraStripes?: 'auto' \| 'disabled' \| 'enabled' \| undefined = 'auto';\n\n\t/\n\t Used to specify whether or not table data in cells should have reduced top and bottom padding. This is useful for pages with multiple data-heavy tables such as a budget or financial data.\n\t \n\t This is optional. By default it will be set to “false”.\n\t /\n\t@Prop() condensed?: boolean \| undefined = false;\n\n\t/\n\t Used to specify whether or not the table should extend the full width of its container.\n\t \n\t This is optional. By default, it will be set to “false”\n\t */\n\t@Prop() fullWidth?: boolean \| undefined = false;\n\n\t@State() private tableColumnsState: TableColumnOptions[];\n\n\t@State() private tableDataState: TableRowOptions[];\n\n\t@State() private tableFooterState: TableRowOptions[];\n\n\t@Watch('tableColumns')\n\tprivate processTableColumns() {\n\t\tthis.tableColumns && this.parseOptions(this.tableColumns);\n\t\tvalidateTableColumns(this.tableColumnsState);\n\t}\n\n\t@Watch('tableData')\n\tprivate processTableData() {\n\t\tthis.tableData && this.parseOptions(this.tableData);\n\t\tvalidateTableRowOptions(this.tableDataState);\n\t}\n\n\t// Parse the tableColumn & tableData options if they are strings\n\t// Transforms the data and stores it in respective state objects\n\tprivate parseOptions(options: any) {\n\t\tconst isString = typeof options === 'string';\n\n\t\tif (!options) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tif (options === this.tableColumns) {\n\t\t\t\tthis.tableColumnsState = isString ? JSON.parse(options) : options;\n\t\t\t} else {\n\t\t\t\tthis.tableDataState = isString ? JSON.parse(options) : options;\n\t\t\t\tthis.transformTableData(this.tableDataState);\n\t\t\t}\n\t\t} catch (error) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addRegularText(' failed to parse props for ')\n\t\t\t\t.addMonospaceText('<ontario-table>')\n\t\t\t\t.addRegularText(' in ')\n\t\t\t\t.addMonospaceText('parseOptions()')\n\t\t\t\t.addRegularText(' method \\n ')\n\t\t\t\t.addMonospaceText(error.stack)\n\t\t\t\t.printMessage(ConsoleType.Error);\n\t\t}\n\t}\n\n\tprivate transformTableData = (tableData: TableRowOptions[]) => {\n\t\t// get column keys\n\t\tconst columns = extractValuesByKey<TableColumnOptions>(this.tableColumnsState, 'key').filter(\n\t\t\t(column): column is keyof TableRowOptions => column !== undefined,\n\t\t);\n\n\t\t// organize table data data object according to the order of the column keys\n\t\tconst organizedTableData = organizeObjectKeys(tableData, columns);\n\n\t\t// remove the footer table data into it's own state so that it can be rendered in a `tfoot` element\n\t\tconst [updatedTableData, tableFooterData] = removeObjectsBySpecificKey(organizedTableData, 'footer', true);\n\n\t\tthis.tableDataState = updatedTableData;\n\t\tthis.tableFooterState = tableFooterData;\n\t};\n\n\tprivate getZebraStripeClass = () => {\n\t\treturn this.zebraStripes === 'disabled'\n\t\t\t? `ontario-table--no-zebra-stripes`\n\t\t\t: this.zebraStripes === 'enabled'\n\t\t\t\t? `ontario-table--zebra-stripes-enabled`\n\t\t\t\t: ``;\n\t};\n\n\tprivate getTableClasses = () => {\n\t\tlet tableClass = '';\n\t\tif (this.condensed && this.fullWidth) {\n\t\t\ttableClass = `ontario-table--condensed ontario-table--full-container-width`;\n\t\t} else if (this.condensed) {\n\t\t\ttableClass = `ontario-table--condensed`;\n\t\t} else if (this.fullWidth) {\n\t\t\ttableClass = `ontario-table--full-container-width`;\n\t\t}\n\n\t\tconst zebraStripesClass = this.getZebraStripeClass();\n\t\tif (tableClass) {\n\t\t\ttableClass = `${tableClass} ${zebraStripesClass}`;\n\t\t} else {\n\t\t\ttableClass = zebraStripesClass;\n\t\t}\n\n\t\treturn tableClass;\n\t};\n\n\tprivate getColumnClasses = (columnData: TableColumnOptions) => {\n\t\tif (columnData.type === 'numeric' && columnData.colSpan) {\n\t\t\treturn `ontario-table-cell--numeric ontario-table-header--column-span-${columnData.colSpan}`;\n\t\t} else if (columnData.type === 'numeric') {\n\t\t\treturn `ontario-table-cell--numeric`;\n\t\t} else if (columnData.colSpan) {\n\t\t\treturn `ontario-table-header--column-span-${columnData.colSpan}`;\n\t\t}\n\n\t\treturn;\n\t};\n\n\t// A function used to generate the table header and table definitions for the table body and table footer sections.\n\tprivate generateTableDataHTML = (\n\t\tdataType: 'tableData' \| 'tableFooter',\n\t\trowData: any,\n\t\tcolumns: (string \| number \| undefined)[],\n\t\trowClass?: string \| undefined,\n\t) => {\n\t\treturn (\n\t\t\t<tr class={dataType === 'tableData' ? rowClass : ''}>\n\t\t\t\t{this.tableColumnsState.map((column, index) => {\n\t\t\t\t\tconst type = column.type;\n\t\t\t\t\tconst tdClass = type === 'numeric' ? `ontario-table-cell--numeric` : '';\n\n\t\t\t\t\treturn index === 0 ? (\n\t\t\t\t\t\t<th scope=\"row\" innerHTML={rowData.data[`${columns[0]}`]}>\n\t\t\t\t\t\t\t{dataType === 'tableData' && rowData.highlight && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tclass=\"ontario-table--highlight-indicator\"\n\t\t\t\t\t\t\t\t\tsrc={getAssetPath('./assets/highlight-indicator.svg')}\n\t\t\t\t\t\t\t\t></img>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</th>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<td class={tdClass} innerHTML={rowData.data[`${columns[index]}`]}></td>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</tr>\n\t\t);\n\t};\n\n\t// Helper function to apply the scrollbar styles to the tops of tables\n\tprivate applyScrollbar(tableElement: Element, scrollerDiv: HTMLElement) {\n\t\tscrollerDiv.style.visibility = 'visible';\n\t\tscrollerDiv.style.height = '20px';\n\t\tscrollerDiv.style.width = `${tableElement.scrollWidth}px`;\n\t}\n\n\t// The following logic adds scrollbar functionality to the tops of tables depending on their size.\n\tcomponentDidLoad() {\n\t\tconst tables = this.table;\n\t\tconst scrollerDivs = this.tableScrollDiv;\n\t\tconst scrollerWrappers = this.tableScrollWrapper;\n\n\t\tlet resizeObserver = new ResizeObserver(() => {\n\t\t\tthis.applyScrollbar(tables, scrollerDivs);\n\t\t});\n\n\t\tthis.applyScrollbar(tables, scrollerDivs);\n\t\tresizeObserver.observe(tables);\n\n\t\ttables.addEventListener('scroll', () => {\n\t\t\tthis.applyScrollbar(tables, scrollerDivs);\n\n\t\t\tscrollerWrappers.scrollLeft = tables.scrollLeft;\n\t\t});\n\n\t\tscrollerWrappers.addEventListener('scroll', () => {\n\t\t\tthis.applyScrollbar(tables, scrollerDivs);\n\n\t\t\ttables.scrollLeft = scrollerWrappers.scrollLeft;\n\t\t});\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.processTableColumns();\n\t\tthis.processTableData();\n\t}\n\n\trender() {\n\t\tconst columns = extractValuesByKey(this.tableColumnsState, 'key');\n\n\t\treturn (\n\t\t\t<div class=\"ontario-table-container\">\n\t\t\t\t<div class=\"ontario-table-scroll--wrapper\" ref={(el) => (this.tableScrollWrapper = el as HTMLElement)}>\n\t\t\t\t\t<div class=\"ontario-table-scroll--div\" ref={(el) => (this.tableScrollDiv = el as HTMLElement)}></div>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"ontario-table-div\" ref={(el) => (this.table = el as HTMLElement)}>\n\t\t\t\t\t<table class={this.getTableClasses()}>\n\t\t\t\t\t\t{this.caption && <caption>{this.caption}</caption>}\n\t\t\t\t\t\t{this.tableColumnsState && (\n\t\t\t\t\t\t\t<thead>\n\t\t\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t\t\t{this.tableColumnsState.map((columnData) => {\n\t\t\t\t\t\t\t\t\t\tconst columnClass = this.getColumnClasses(columnData);\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\t\t\t\t\t\t\tkey={columnData.key}\n\t\t\t\t\t\t\t\t\t\t\t\tdata-type={columnData.type}\n\t\t\t\t\t\t\t\t\t\t\t\tclass={columnClass}\n\t\t\t\t\t\t\t\t\t\t\t\tinnerHTML={columnData.title}\n\t\t\t\t\t\t\t\t\t\t\t></th>\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t</thead>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{this.tableDataState && (\n\t\t\t\t\t\t\t<tbody>\n\t\t\t\t\t\t\t\t{this.tableDataState.map((rowData) => {\n\t\t\t\t\t\t\t\t\tconst rowClass = rowData.highlight\n\t\t\t\t\t\t\t\t\t\t? `ontario-table-row--highlight`\n\t\t\t\t\t\t\t\t\t\t: rowData.subtotal\n\t\t\t\t\t\t\t\t\t\t\t? `ontario-table-row--subtotal`\n\t\t\t\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\t\t\treturn this.generateTableDataHTML('tableData', rowData, columns, rowClass);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</tbody>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{!!this.tableFooterState.length && (\n\t\t\t\t\t\t\t<tfoot>\n\t\t\t\t\t\t\t\t{this.tableFooterState.map((footerData) => {\n\t\t\t\t\t\t\t\t\treturn this.generateTableDataHTML('tableData', footerData, columns, undefined);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</tfoot>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</table>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/ontario-textarea/ontario-textarea.css CHANGED Viewed

@@ -27,6 +27,27 @@
 /* callout backgrounds */
 /* icon colours */
 /* service ontario header colours */
+/* -------------------------------
+    Global font variables
+--------------------------------- */
+/* -------------------------------
+    Focus placeholder variables
+--------------------------------- */
+/* -------------------------------
+    Focus placeholder
+--------------------------------- */
+.ontario-textarea:focus,
+.ontario-textarea:active,
+.ontario-input:focus,
+.ontario-input:active {
+	box-shadow: 0 0 0 4px #009adb;
+	outline: 4px solid transparent;
+	transition: box-shadow 0.1s ease-in-out;
+}
+/* -------------------------------
+    Global font-size variables
+--------------------------------- */
 /* -------------------------------
     Global font-weight variables
 --------------------------------- */
@@ -183,24 +204,6 @@ h6,
 	}
 }
-/* -------------------------------
-    Focus placeholder variables
---------------------------------- */
-/* -------------------------------
-    Focus placeholder
---------------------------------- */
-.ontario-textarea:focus,
-.ontario-textarea:active,
-.ontario-input:focus,
-.ontario-input:active {
-	box-shadow: 0 0 0 4px #009adb;
-	outline: 4px solid transparent;
-	transition: box-shadow 0.1s ease-in-out;
-}
-/* -------------------------------
-    Global font-size variables
---------------------------------- */
 /*
 *  Global elements
 *

package/dist/collection/components/ontario-textarea/ontario-textarea.js CHANGED Viewed

@@ -9,25 +9,130 @@ import { handleInputEvent } from '../../utils/events/event-handler';
 import { default as translations } from '../../translations/global.i18n.json';
 import { ErrorMessage } from '../../utils/components/error-message/error-message';
 export class OntarioTextarea {
-	constructor() {
-		this.caption = undefined;
-		this.name = undefined;
-		this.elementId = undefined;
-		this.required = false;
-		this.value = undefined;
-		this.hintText = undefined;
-		this.hintExpander = undefined;
-		this.language = undefined;
-		this.errorMessage = undefined;
-		this.customOnInput = undefined;
-		this.customOnChange = undefined;
-		this.customOnBlur = undefined;
-		this.customOnFocus = undefined;
-		this.hintTextId = undefined;
-		this.internalHintText = undefined;
-		this.internalHintExpander = undefined;
-		this.captionState = undefined;
-	}
+	element;
+	internals;
+	hintTextRef;
+	/**
+	 * The text to display as the textarea label.
+	 *
+	 * @example
+	 * <ontario-input
+	 *   caption='{
+	 *     "captionText": "Address",
+	 *     "captionType": "heading",
+	 *   }'
+	 *   required="true"
+	 *   ...>
+	 * </ontario-input>
+	 */
+	caption;
+	/**
+	 * The name assigned to the textarea. The name value is used to reference form data after a form is submitted.
+	 */
+	name;
+	/**
+	 * The unique identifier of the textarea. This is optional - if no ID is passed, one will be generated.
+	 */
+	elementId;
+	/**
+	 * This is used to determine whether the textarea is required or not.
+	 * This prop also gets passed to the InputCaption utility to display either an optional or required flag in the label.
+	 * If no prop is set, it will default to false (optional).
+	 */
+	required = false;
+	/**
+	 * The textarea content value.
+	 */
+	value;
+	/**
+     * Used to include the ontario-hint-text component for the textarea.
+     * This is optional.
+     */
+	hintText;
+	/**
+	 * Used to include the ontario-hint-expander component for the textarea component.
+	 * This is passed in as an object with key-value pairs.
+	 *
+	 * This is optional.
+	 *
+	 * @example
+	 * <ontario-textarea
+	 *   caption='{
+	 *     "captionText": "What are your thoughts",
+	 *     "captionType": "heading",
+	 *   }'
+	 * 	 name: "textarea"
+	 *   hint-expander='{
+	 *     "hint": "This is the hint expander",
+	 *     "content": "This is the content for the hint expander"
+	 *   }'
+	 *   required="true"
+	 * >
+	 * </ontario-textarea>
+	 */
+	hintExpander;
+	/**
+	 * The language of the component.
+	 * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.
+	 */
+	language;
+	/**
+	 * Set this to display an error message
+	 */
+	errorMessage;
+	/**
+	 * Used to add a custom function to the textarea onInput event.
+	 */
+	customOnInput;
+	/**
+	 * Used to add a custom function to the textarea onChange event.
+	 */
+	customOnChange;
+	/**
+	 * Used to add a custom function to the textarea onBlur event.
+	 */
+	customOnBlur;
+	/**
+	 * Used to add a custom function to the textarea onFocus event.
+	 */
+	customOnFocus;
+	/**
+	 * Used for the `aria-describedby` value of the textarea. This will match with the id of the hint text.
+	 */
+	hintTextId;
+	/**
+	 * The hint text options are re-assigned to the internalHintText array.
+	 */
+	internalHintText;
+	/**
+	 * The hint expander options are re-assigned to the internalHintExpander array.
+	 */
+	internalHintExpander;
+	/**
+	 * Instantiate an InputCaption object for internal logic use
+	 */
+	captionState;
+	/**
+	 * Emitted when a input event occurs when an input has been changed.
+	 */
+	inputOnInput;
+	/**
+	 * Emitted when a keyboard input or mouse event occurs when an input has been changed.
+	 */
+	inputOnChange;
+	/**
+	 * Emitted when a keyboard input event occurs when an input has lost focus.
+	 */
+	inputOnBlur;
+	/**
+	 * Emitted when a keyboard input event occurs when an input has gained focus.
+	 */
+	inputOnFocus;
+	/**
+	 * Emitted when an error message is reported to the component.
+	 */
+	inputErrorOccurred;
 	/**
 	 * This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the textarea component loads.
 	 */
@@ -103,25 +208,15 @@ export class OntarioTextarea {
 		this.updateCaptionState(this.caption);
 	}
 	broadcastInputErrorOccurredEvent() {
-		var _a;
 		// Emit event to notify anyone who wants to listen for errors occurring
-		this.inputErrorOccurred.emit({
-			inputId: this.getId(),
-			errorMessage: (_a = this.errorMessage) !== null && _a !== void 0 ? _a : '',
-		});
+		this.inputErrorOccurred.emit({ inputId: this.getId(), errorMessage: this.errorMessage ?? '' });
 	}
 	/**
 	 * Function to handle textarea events and the information pertaining to the textarea to emit.
 	 */
 	handleEvent(event, eventType) {
-		var _a, _b, _c;
 		const input = event.target;
-		(_b = (_a = this.internals) === null || _a === void 0 ? void 0 : _a.setFormValue) === null || _b === void 0
-			? void 0
-			: _b.call(
-					_a,
-					(_c = input === null || input === void 0 ? void 0 : input.value) !== null && _c !== void 0 ? _c : '',
-			  );
+		this.internals?.setFormValue?.(input?.value ?? '');
 		handleInputEvent(
 			event,
 			eventType,
@@ -139,12 +234,10 @@ export class OntarioTextarea {
 		);
 	}
 	getId() {
-		var _a;
-		return (_a = this.elementId) !== null && _a !== void 0 ? _a : '';
+		return this.elementId ?? '';
 	}
 	getValue() {
-		var _a;
-		return (_a = this.value) !== null && _a !== void 0 ? _a : '';
+		return this.value ?? '';
 	}
 	getClass() {
 		return this.hintExpander ? `ontario-textarea ontario-textarea-hint-expander--true` : `ontario-textarea`;
@@ -153,13 +246,11 @@ export class OntarioTextarea {
 	 * If a `hintText` prop is passed, the id generated from it will be set to the internal `hintTextId` state to match with the textarea `aria-describedBy` attribute.
 	 */
 	async componentDidLoad() {
-		var _a;
-		this.hintTextId = await ((_a = this.hintTextRef) === null || _a === void 0 ? void 0 : _a.getHintTextId());
+		this.hintTextId = await this.hintTextRef?.getHintTextId();
 	}
 	componentWillLoad() {
-		var _a;
 		this.updateCaptionState(this.caption);
-		this.elementId = (_a = this.elementId) !== null && _a !== void 0 ? _a : uuid();
+		this.elementId = this.elementId ?? uuid();
 		this.parseHintText();
 		this.parseHintExpander();
 		this.validateName(this.name);
@@ -170,19 +261,20 @@ export class OntarioTextarea {
 		return h(
 			'div',
 			{
-				key: '63372c743a7ac103d5bec0fdcb5f1f8623d588e3',
+				key: 'f4c99e0155073f0a5272fe21216ef3c6a48093ee',
 				class: `ontario-form-group ${error ? 'ontario-textarea--error' : ''}`,
 			},
 			this.captionState.getCaption(this.getId(), !!this.internalHintExpander),
 			this.internalHintText &&
 				h('ontario-hint-text', {
+					key: 'b560947eb40087f95e09367c6aacb08e33e51a4a',
 					hint: this.internalHintText.hint,
 					hintContentType: this.internalHintText.hintContentType,
 					ref: (el) => (this.hintTextRef = el),
 				}),
-			h(ErrorMessage, { key: '90cece114c1b84a2996d25cb1a9a0548eab7d10a', message: this.errorMessage, error: error }),
+			h(ErrorMessage, { key: 'caf24478560b50925dc47aa20604dc36461394aa', message: this.errorMessage, error: error }),
 			h('textarea', {
-				'key': 'c6bc6014372f7f4839c9ce5070a484ac253c92e6',
+				'key': '63ca361d023d55b91933bc6a229d038468a1f0ec',
 				'aria-describedby': this.hintTextId,
 				'class': this.getClass(),
 				'id': this.getId(),
@@ -196,6 +288,7 @@ export class OntarioTextarea {
 			}),
 			this.internalHintExpander &&
 				h('ontario-hint-expander', {
+					'key': 'dcac37a52925f69a3e936877646139de6c7a811c',
 					'hint': this.internalHintExpander.hint,
 					'content': this.internalHintExpander.content,
 					'hintContentType': this.internalHintExpander.hintContentType,
@@ -249,6 +342,8 @@ export class OntarioTextarea {
 					],
 					text: 'The text to display as the textarea label.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'caption',
 				reflect: false,
 			},
@@ -266,6 +361,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'The name assigned to the textarea. The name value is used to reference form data after a form is submitted.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'name',
 				reflect: false,
 			},
@@ -283,6 +380,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'The unique identifier of the textarea. This is optional - if no ID is passed, one will be generated.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'element-id',
 				reflect: false,
 			},
@@ -300,6 +399,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'This is used to determine whether the textarea is required or not.\nThis prop also gets passed to the InputCaption utility to display either an optional or required flag in the label.\nIf no prop is set, it will default to false (optional).',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'required',
 				reflect: false,
 				defaultValue: 'false',
@@ -318,6 +419,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'The textarea content value.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'value',
 				reflect: false,
 			},
@@ -341,6 +444,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'Used to include the ontario-hint-text component for the textarea.\nThis is optional.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'hint-text',
 				reflect: false,
 			},
@@ -369,6 +474,8 @@ export class OntarioTextarea {
 					],
 					text: 'Used to include the ontario-hint-expander component for the textarea component.\nThis is passed in as an object with key-value pairs.\n\nThis is optional.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'hint-expander',
 				reflect: false,
 			},
@@ -392,6 +499,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'The language of the component.\nThis is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'language',
 				reflect: false,
 			},
@@ -409,6 +518,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'Set this to display an error message',
 				},
+				getter: false,
+				setter: false,
 				attribute: 'error-message',
 				reflect: false,
 			},
@@ -431,6 +542,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'Used to add a custom function to the textarea onInput event.',
 				},
+				getter: false,
+				setter: false,
 			},
 			customOnChange: {
 				type: 'unknown',
@@ -451,6 +564,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'Used to add a custom function to the textarea onChange event.',
 				},
+				getter: false,
+				setter: false,
 			},
 			customOnBlur: {
 				type: 'unknown',
@@ -471,6 +586,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'Used to add a custom function to the textarea onBlur event.',
 				},
+				getter: false,
+				setter: false,
 			},
 			customOnFocus: {
 				type: 'unknown',
@@ -491,6 +608,8 @@ export class OntarioTextarea {
 					tags: [],
 					text: 'Used to add a custom function to the textarea onFocus event.',
 				},
+				getter: false,
+				setter: false,
 			},
 		};
 	}

package/dist/collection/components/ontario-textarea/ontario-textarea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ontario-textarea.js","sourceRoot":"","sources":["../../../src/components/ontario-textarea/ontario-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, h, Prop, State, Listen, Watch, Element, EventEmitter, AttachInternals } from '@stencil/core';\nimport { v4 as uuid } from 'uuid';\n\nimport { HintExpander } from '../ontario-hint-expander/hint-expander.interface';\n\nimport { Hint, Input } from '../../utils/common/common.interface';\nimport { InputCaption } from '../../utils/common/input-caption/input-caption';\nimport { Caption } from '../../utils/common/input-caption/caption.interface';\nimport { validatePropExists, validateLanguage } from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { Language } from '../../utils/common/language-types';\nimport { constructHintTextObject } from '../../utils/components/hints/hints';\nimport {\n\tInputFocusBlurEvent,\n\tEventType,\n\tInputInteractionEvent,\n\tInputInputEvent,\n} from '../../utils/events/event-handler.interface';\nimport { handleInputEvent } from '../../utils/events/event-handler';\n\nimport { default as translations } from '../../translations/global.i18n.json';\nimport { ErrorMessage } from '../../utils/components/error-message/error-message';\n\n@Component({\n\ttag: 'ontario-textarea',\n\tstyleUrl: 'ontario-textarea.scss',\n\tshadow: true,\n\tformAssociated: true,\n})\nexport class OntarioTextarea implements Input {\n\t@Element() element: HTMLElement;\n\t@AttachInternals() internals: ElementInternals;\n\n\thintTextRef: HTMLOntarioHintTextElement \| undefined;\n\n\t/*\n\t The text to display as the textarea label.\n\t \n\t @example\n\t * <ontario-input\n\t * caption='{\n\t * \"captionText\": \"Address\",\n\t * \"captionType\": \"heading\",\n\t * }'\n\t * required=\"true\"\n\t * ...>\n\t * </ontario-input>\n\t /\n\t@Prop() caption: Caption \| string;\n\n\t/\n\t The name assigned to the textarea. The name value is used to reference form data after a form is submitted.\n\t /\n\t@Prop() name: string;\n\n\t/\n\t The unique identifier of the textarea. This is optional - if no ID is passed, one will be generated.\n\t /\n\t@Prop({ mutable: true }) elementId?: string;\n\n\t/\n\t This is used to determine whether the textarea is required or not.\n\t * This prop also gets passed to the InputCaption utility to display either an optional or required flag in the label.\n\t * If no prop is set, it will default to false (optional).\n\t /\n\t@Prop() required?: boolean = false;\n\n\t/\n\t The textarea content value.\n\t /\n\t@Prop({ mutable: true }) value?: string;\n\n\t/\n\t Used to include the ontario-hint-text component for the textarea.\n\t * This is optional.\n\n\t /\n\t@Prop() hintText?: string \| Hint;\n\n\t/\n\t Used to include the ontario-hint-expander component for the textarea component.\n\t * This is passed in as an object with key-value pairs.\n\t \n\t This is optional.\n\t \n\t @example\n\t * <ontario-textarea\n\t * caption='{\n\t * \"captionText\": \"What are your thoughts\",\n\t * \"captionType\": \"heading\",\n\t * }'\n\t * \t name: \"textarea\"\n\t * hint-expander='{\n\t * \"hint\": \"This is the hint expander\",\n\t * \"content\": \"This is the content for the hint expander\"\n\t * }'\n\t * required=\"true\"\n\t * >\n\t * </ontario-textarea>\n\t /\n\t@Prop() hintExpander?: HintExpander \| string;\n\n\t/\n\t The language of the component.\n\t * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.\n\t /\n\t@Prop({ mutable: true }) language?: Language;\n\n\t/\n\t Set this to display an error message\n\t /\n\t@Prop({ mutable: true }) errorMessage?: string;\n\n\t/\n\t Used to add a custom function to the textarea onInput event.\n\t /\n\t@Prop() customOnInput?: (event: globalThis.Event) => void;\n\n\t/\n\t Used to add a custom function to the textarea onChange event.\n\t /\n\t@Prop() customOnChange?: (event: globalThis.Event) => void;\n\n\t/\n\t Used to add a custom function to the textarea onBlur event.\n\t /\n\t@Prop() customOnBlur?: (event: globalThis.Event) => void;\n\n\t/\n\t Used to add a custom function to the textarea onFocus event.\n\t /\n\t@Prop() customOnFocus?: (event: globalThis.Event) => void;\n\n\t/\n\t Used for the `aria-describedby` value of the textarea. This will match with the id of the hint text.\n\t /\n\t@State() hintTextId: string \| null \| undefined;\n\n\t/\n\t The hint text options are re-assigned to the internalHintText array.\n\t /\n\t@State() private internalHintText: Hint;\n\n\t/\n\t The hint expander options are re-assigned to the internalHintExpander array.\n\t /\n\t@State() private internalHintExpander: HintExpander;\n\n\t/\n\t Instantiate an InputCaption object for internal logic use\n\t /\n\t@State() private captionState: InputCaption;\n\n\t/\n\t Emitted when a input event occurs when an input has been changed.\n\t /\n\t@Event() inputOnInput: EventEmitter<InputInputEvent>;\n\n\t/\n\t Emitted when a keyboard input or mouse event occurs when an input has been changed.\n\t /\n\t@Event() inputOnChange: EventEmitter<InputInteractionEvent>;\n\n\t/\n\t Emitted when a keyboard input event occurs when an input has lost focus.\n\t /\n\t@Event() inputOnBlur: EventEmitter<InputFocusBlurEvent>;\n\n\t/\n\t Emitted when a keyboard input event occurs when an input has gained focus.\n\t /\n\t@Event() inputOnFocus: EventEmitter<InputFocusBlurEvent>;\n\n\t/\n\t Emitted when an error message is reported to the component.\n\t /\n\t@Event() inputErrorOccurred: EventEmitter<{ inputId: string; errorMessage: string }>;\n\n\t/\n\t This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the textarea component loads.\n\t /\n\t@Listen('setAppLanguage', { target: 'window' })\n\thandleSetAppLanguage(event: CustomEvent<Language>) {\n\t\tif (!this.language) {\n\t\t\tthis.language = validateLanguage(event);\n\t\t}\n\t}\n\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleHeaderLanguageToggled(event: CustomEvent<Language>) {\n\t\tthis.language = validateLanguage(event);\n\t}\n\n\t/\n\t Watch for changes to the `hintText` prop.\n\t \n\t If a `hintText` prop is passed, the `constructHintTextObject` function will convert it to the correct format, and set the result to the `internalHintText` state.\n\t /\n\t@Watch('hintText')\n\tprivate parseHintText() {\n\t\tif (this.hintText) {\n\t\t\tconst hintTextObject = constructHintTextObject(this.hintText);\n\t\t\tthis.internalHintText = hintTextObject;\n\t\t}\n\t}\n\n\t/\n\t Watch for changes to the `hintExpander` prop.\n\t \n\t If a `hintExpander` prop is passed, it will be parsed (if it is a string), and the result will be set to the `internalHintExpander` state.\n\t /\n\t@Watch('hintExpander')\n\tprivate parseHintExpander() {\n\t\tconst hintExpander = this.hintExpander;\n\t\tif (hintExpander) {\n\t\t\tif (typeof hintExpander === 'string') this.internalHintExpander = JSON.parse(hintExpander);\n\t\t\telse this.internalHintExpander = hintExpander;\n\t\t}\n\t}\n\n\t/\n\t * Watch for changes in the `name` prop for validation purposes.\n\t \n\t Validate the `name` and make sure the `name` prop has a value.\n\t * Log a warning if user doesn't input a value for the `name`.\n\t /\n\t@Watch('name')\n\tvalidateName(newValue: string) {\n\t\tif (validatePropExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' name ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-textarea> ')\n\t\t\t\t.addRegularText('was not provided')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/\n\t Watch for changes to the `caption` prop.\n\t \n\t The caption will be run through the InputCaption constructor to convert it to the correct format, and set the result to the `captionState` state.\n\t * @param newValue: Caption \| string\n\t /\n\t@Watch('caption')\n\tprivate updateCaptionState(newValue: Caption \| string) {\n\t\tthis.captionState = new InputCaption(\n\t\t\tthis.element.tagName,\n\t\t\tnewValue,\n\t\t\ttranslations,\n\t\t\tthis.language,\n\t\t\tfalse,\n\t\t\tthis.required,\n\t\t);\n\t}\n\n\t/\n\t Watch for changes to the `language` prop to render either the English or French translations\n\t /\n\t@Watch('language')\n\tupdateLanguage() {\n\t\tthis.updateCaptionState(this.caption);\n\t}\n\n\t@Watch('errorMessage')\n\tbroadcastInputErrorOccurredEvent() {\n\t\t// Emit event to notify anyone who wants to listen for errors occurring\n\t\tthis.inputErrorOccurred.emit({ inputId: this.getId(), errorMessage: this.errorMessage ?? '' });\n\t}\n\n\t/\n\t Function to handle textarea events and the information pertaining to the textarea to emit.\n\t /\n\tprivate handleEvent(event: Event, eventType: EventType) {\n\t\tconst input = event.target as HTMLTextAreaElement \| null;\n\n\t\tthis.internals?.setFormValue?.(input?.value ?? '');\n\n\t\thandleInputEvent(\n\t\t\tevent,\n\t\t\teventType,\n\t\t\tinput,\n\t\t\tthis.inputOnChange,\n\t\t\tthis.inputOnFocus,\n\t\t\tthis.inputOnBlur,\n\t\t\tthis.inputOnInput,\n\t\t\t'input',\n\t\t\tthis.customOnChange,\n\t\t\tthis.customOnFocus,\n\t\t\tthis.customOnBlur,\n\t\t\tthis.customOnInput,\n\t\t\tthis.element,\n\t\t);\n\t}\n\n\tpublic getId(): string {\n\t\treturn this.elementId ?? '';\n\t}\n\n\tprivate getValue(): string \| number {\n\t\treturn this.value ?? '';\n\t}\n\n\tprivate getClass(): string {\n\t\treturn this.hintExpander ? `ontario-textarea ontario-textarea-hint-expander--true` : `ontario-textarea`;\n\t}\n\n\t/\n\t If a `hintText` prop is passed, the id generated from it will be set to the internal `hintTextId` state to match with the textarea `aria-describedBy` attribute.\n\t */\n\tasync componentDidLoad() {\n\t\tthis.hintTextId = await this.hintTextRef?.getHintTextId();\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.updateCaptionState(this.caption);\n\t\tthis.elementId = this.elementId ?? uuid();\n\t\tthis.parseHintText();\n\t\tthis.parseHintExpander();\n\t\tthis.validateName(this.name);\n\t\tthis.language = validateLanguage(this.language);\n\t}\n\n\trender() {\n\t\tconst error = !!this.errorMessage;\n\t\treturn (\n\t\t\t<div class={`ontario-form-group ${error ? 'ontario-textarea--error' : ''}`}>\n\t\t\t\t{this.captionState.getCaption(this.getId(), !!this.internalHintExpander)}\n\t\t\t\t{this.internalHintText && (\n\t\t\t\t\t<ontario-hint-text\n\t\t\t\t\t\thint={this.internalHintText.hint}\n\t\t\t\t\t\thintContentType={this.internalHintText.hintContentType}\n\t\t\t\t\t\tref={(el) => (this.hintTextRef = el)}\n\t\t\t\t\t></ontario-hint-text>\n\t\t\t\t)}\n\t\t\t\t<ErrorMessage message={this.errorMessage} error={error} />\n\t\t\t\t<textarea\n\t\t\t\t\taria-describedby={this.hintTextId}\n\t\t\t\t\tclass={this.getClass()}\n\t\t\t\t\tid={this.getId()}\n\t\t\t\t\tname={this.name}\n\t\t\t\t\tvalue={this.getValue()}\n\t\t\t\t\tonInput={(e) => this.handleEvent(e, EventType.Input)}\n\t\t\t\t\tonChange={(e) => this.handleEvent(e, EventType.Change)}\n\t\t\t\t\tonBlur={(e) => this.handleEvent(e, EventType.Blur)}\n\t\t\t\t\tonFocus={(e) => this.handleEvent(e, EventType.Focus)}\n\t\t\t\t\trequired={!!this.required}\n\t\t\t\t></textarea>\n\t\t\t\t{this.internalHintExpander && (\n\t\t\t\t\t<ontario-hint-expander\n\t\t\t\t\t\thint={this.internalHintExpander.hint}\n\t\t\t\t\t\tcontent={this.internalHintExpander.content}\n\t\t\t\t\t\thintContentType={this.internalHintExpander.hintContentType}\n\t\t\t\t\t\tinput-exists\n\t\t\t\t\t></ontario-hint-expander>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}
1	+ {"version":3,"file":"ontario-textarea.js","sourceRoot":"","sources":["../../../src/components/ontario-textarea/ontario-textarea.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, h, Prop, State, Listen, Watch, Element, EventEmitter, AttachInternals } from '@stencil/core';\nimport { v4 as uuid } from 'uuid';\n\nimport { HintExpander } from '../ontario-hint-expander/hint-expander.interface';\n\nimport { Hint, Input } from '../../utils/common/common.interface';\nimport { InputCaption } from '../../utils/common/input-caption/input-caption';\nimport { Caption } from '../../utils/common/input-caption/caption.interface';\nimport { validatePropExists, validateLanguage } from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { Language } from '../../utils/common/language-types';\nimport { constructHintTextObject } from '../../utils/components/hints/hints';\nimport {\n\tInputFocusBlurEvent,\n\tEventType,\n\tInputInteractionEvent,\n\tInputInputEvent,\n} from '../../utils/events/event-handler.interface';\nimport { handleInputEvent } from '../../utils/events/event-handler';\n\nimport { default as translations } from '../../translations/global.i18n.json';\nimport { ErrorMessage } from '../../utils/components/error-message/error-message';\n\n@Component({\n\ttag: 'ontario-textarea',\n\tstyleUrl: 'ontario-textarea.scss',\n\tshadow: true,\n\tformAssociated: true,\n})\nexport class OntarioTextarea implements Input {\n\t@Element() element: HTMLElement;\n\t@AttachInternals() internals: ElementInternals;\n\n\thintTextRef: HTMLOntarioHintTextElement \| undefined;\n\n\t/*\n\t The text to display as the textarea label.\n\t \n\t @example\n\t * <ontario-input\n\t * caption='{\n\t * \"captionText\": \"Address\",\n\t * \"captionType\": \"heading\",\n\t * }'\n\t * required=\"true\"\n\t * ...>\n\t * </ontario-input>\n\t /\n\t@Prop() caption: Caption \| string;\n\n\t/\n\t The name assigned to the textarea. The name value is used to reference form data after a form is submitted.\n\t /\n\t@Prop() name: string;\n\n\t/\n\t The unique identifier of the textarea. This is optional - if no ID is passed, one will be generated.\n\t /\n\t@Prop({ mutable: true }) elementId?: string;\n\n\t/\n\t This is used to determine whether the textarea is required or not.\n\t * This prop also gets passed to the InputCaption utility to display either an optional or required flag in the label.\n\t * If no prop is set, it will default to false (optional).\n\t /\n\t@Prop() required?: boolean = false;\n\n\t/\n\t The textarea content value.\n\t /\n\t@Prop({ mutable: true }) value?: string;\n\n\t/\n\t Used to include the ontario-hint-text component for the textarea.\n\t * This is optional.\n\n\t /\n\t@Prop() hintText?: string \| Hint;\n\n\t/\n\t Used to include the ontario-hint-expander component for the textarea component.\n\t * This is passed in as an object with key-value pairs.\n\t \n\t This is optional.\n\t \n\t @example\n\t * <ontario-textarea\n\t * caption='{\n\t * \"captionText\": \"What are your thoughts\",\n\t * \"captionType\": \"heading\",\n\t * }'\n\t * \t name: \"textarea\"\n\t * hint-expander='{\n\t * \"hint\": \"This is the hint expander\",\n\t * \"content\": \"This is the content for the hint expander\"\n\t * }'\n\t * required=\"true\"\n\t * >\n\t * </ontario-textarea>\n\t /\n\t@Prop() hintExpander?: HintExpander \| string;\n\n\t/\n\t The language of the component.\n\t * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.\n\t /\n\t@Prop({ mutable: true }) language?: Language;\n\n\t/\n\t Set this to display an error message\n\t /\n\t@Prop({ mutable: true }) errorMessage?: string;\n\n\t/\n\t Used to add a custom function to the textarea onInput event.\n\t /\n\t@Prop() customOnInput?: (event: globalThis.Event) => void;\n\n\t/\n\t Used to add a custom function to the textarea onChange event.\n\t /\n\t@Prop() customOnChange?: (event: globalThis.Event) => void;\n\n\t/\n\t Used to add a custom function to the textarea onBlur event.\n\t /\n\t@Prop() customOnBlur?: (event: globalThis.Event) => void;\n\n\t/\n\t Used to add a custom function to the textarea onFocus event.\n\t /\n\t@Prop() customOnFocus?: (event: globalThis.Event) => void;\n\n\t/\n\t Used for the `aria-describedby` value of the textarea. This will match with the id of the hint text.\n\t /\n\t@State() hintTextId: string \| null \| undefined;\n\n\t/\n\t The hint text options are re-assigned to the internalHintText array.\n\t /\n\t@State() private internalHintText: Hint;\n\n\t/\n\t The hint expander options are re-assigned to the internalHintExpander array.\n\t /\n\t@State() private internalHintExpander: HintExpander;\n\n\t/\n\t Instantiate an InputCaption object for internal logic use\n\t /\n\t@State() private captionState: InputCaption;\n\n\t/\n\t Emitted when a input event occurs when an input has been changed.\n\t /\n\t@Event() inputOnInput: EventEmitter<InputInputEvent>;\n\n\t/\n\t Emitted when a keyboard input or mouse event occurs when an input has been changed.\n\t /\n\t@Event() inputOnChange: EventEmitter<InputInteractionEvent>;\n\n\t/\n\t Emitted when a keyboard input event occurs when an input has lost focus.\n\t /\n\t@Event() inputOnBlur: EventEmitter<InputFocusBlurEvent>;\n\n\t/\n\t Emitted when a keyboard input event occurs when an input has gained focus.\n\t /\n\t@Event() inputOnFocus: EventEmitter<InputFocusBlurEvent>;\n\n\t/\n\t Emitted when an error message is reported to the component.\n\t /\n\t@Event() inputErrorOccurred: EventEmitter<{ inputId: string; errorMessage: string }>;\n\n\t/\n\t This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the textarea component loads.\n\t /\n\t@Listen('setAppLanguage', { target: 'window' })\n\thandleSetAppLanguage(event: CustomEvent<Language>) {\n\t\tif (!this.language) {\n\t\t\tthis.language = validateLanguage(event);\n\t\t}\n\t}\n\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleHeaderLanguageToggled(event: CustomEvent<Language>) {\n\t\tthis.language = validateLanguage(event);\n\t}\n\n\t/\n\t Watch for changes to the `hintText` prop.\n\t \n\t If a `hintText` prop is passed, the `constructHintTextObject` function will convert it to the correct format, and set the result to the `internalHintText` state.\n\t /\n\t@Watch('hintText')\n\tprivate parseHintText() {\n\t\tif (this.hintText) {\n\t\t\tconst hintTextObject = constructHintTextObject(this.hintText);\n\t\t\tthis.internalHintText = hintTextObject;\n\t\t}\n\t}\n\n\t/\n\t Watch for changes to the `hintExpander` prop.\n\t \n\t If a `hintExpander` prop is passed, it will be parsed (if it is a string), and the result will be set to the `internalHintExpander` state.\n\t /\n\t@Watch('hintExpander')\n\tprivate parseHintExpander() {\n\t\tconst hintExpander = this.hintExpander;\n\t\tif (hintExpander) {\n\t\t\tif (typeof hintExpander === 'string') this.internalHintExpander = JSON.parse(hintExpander);\n\t\t\telse this.internalHintExpander = hintExpander;\n\t\t}\n\t}\n\n\t/\n\t * Watch for changes in the `name` prop for validation purposes.\n\t \n\t Validate the `name` and make sure the `name` prop has a value.\n\t * Log a warning if user doesn't input a value for the `name`.\n\t /\n\t@Watch('name')\n\tvalidateName(newValue: string) {\n\t\tif (validatePropExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' name ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-textarea> ')\n\t\t\t\t.addRegularText('was not provided')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/\n\t Watch for changes to the `caption` prop.\n\t \n\t The caption will be run through the InputCaption constructor to convert it to the correct format, and set the result to the `captionState` state.\n\t * @param newValue: Caption \| string\n\t /\n\t@Watch('caption')\n\tprivate updateCaptionState(newValue: Caption \| string) {\n\t\tthis.captionState = new InputCaption(\n\t\t\tthis.element.tagName,\n\t\t\tnewValue,\n\t\t\ttranslations,\n\t\t\tthis.language,\n\t\t\tfalse,\n\t\t\tthis.required,\n\t\t);\n\t}\n\n\t/\n\t Watch for changes to the `language` prop to render either the English or French translations\n\t /\n\t@Watch('language')\n\tupdateLanguage() {\n\t\tthis.updateCaptionState(this.caption);\n\t}\n\n\t@Watch('errorMessage')\n\tbroadcastInputErrorOccurredEvent() {\n\t\t// Emit event to notify anyone who wants to listen for errors occurring\n\t\tthis.inputErrorOccurred.emit({ inputId: this.getId(), errorMessage: this.errorMessage ?? '' });\n\t}\n\n\t/\n\t Function to handle textarea events and the information pertaining to the textarea to emit.\n\t /\n\tprivate handleEvent(event: Event, eventType: EventType) {\n\t\tconst input = event.target as HTMLTextAreaElement \| null;\n\n\t\tthis.internals?.setFormValue?.(input?.value ?? '');\n\n\t\thandleInputEvent(\n\t\t\tevent,\n\t\t\teventType,\n\t\t\tinput,\n\t\t\tthis.inputOnChange,\n\t\t\tthis.inputOnFocus,\n\t\t\tthis.inputOnBlur,\n\t\t\tthis.inputOnInput,\n\t\t\t'input',\n\t\t\tthis.customOnChange,\n\t\t\tthis.customOnFocus,\n\t\t\tthis.customOnBlur,\n\t\t\tthis.customOnInput,\n\t\t\tthis.element,\n\t\t);\n\t}\n\n\tpublic getId(): string {\n\t\treturn this.elementId ?? '';\n\t}\n\n\tprivate getValue(): string \| number {\n\t\treturn this.value ?? '';\n\t}\n\n\tprivate getClass(): string {\n\t\treturn this.hintExpander ? `ontario-textarea ontario-textarea-hint-expander--true` : `ontario-textarea`;\n\t}\n\n\t/\n\t If a `hintText` prop is passed, the id generated from it will be set to the internal `hintTextId` state to match with the textarea `aria-describedBy` attribute.\n\t */\n\tasync componentDidLoad() {\n\t\tthis.hintTextId = await this.hintTextRef?.getHintTextId();\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.updateCaptionState(this.caption);\n\t\tthis.elementId = this.elementId ?? uuid();\n\t\tthis.parseHintText();\n\t\tthis.parseHintExpander();\n\t\tthis.validateName(this.name);\n\t\tthis.language = validateLanguage(this.language);\n\t}\n\n\trender() {\n\t\tconst error = !!this.errorMessage;\n\t\treturn (\n\t\t\t<div class={`ontario-form-group ${error ? 'ontario-textarea--error' : ''}`}>\n\t\t\t\t{this.captionState.getCaption(this.getId(), !!this.internalHintExpander)}\n\t\t\t\t{this.internalHintText && (\n\t\t\t\t\t<ontario-hint-text\n\t\t\t\t\t\thint={this.internalHintText.hint}\n\t\t\t\t\t\thintContentType={this.internalHintText.hintContentType}\n\t\t\t\t\t\tref={(el) => (this.hintTextRef = el)}\n\t\t\t\t\t></ontario-hint-text>\n\t\t\t\t)}\n\t\t\t\t<ErrorMessage message={this.errorMessage} error={error} />\n\t\t\t\t<textarea\n\t\t\t\t\taria-describedby={this.hintTextId}\n\t\t\t\t\tclass={this.getClass()}\n\t\t\t\t\tid={this.getId()}\n\t\t\t\t\tname={this.name}\n\t\t\t\t\tvalue={this.getValue()}\n\t\t\t\t\tonInput={(e) => this.handleEvent(e, EventType.Input)}\n\t\t\t\t\tonChange={(e) => this.handleEvent(e, EventType.Change)}\n\t\t\t\t\tonBlur={(e) => this.handleEvent(e, EventType.Blur)}\n\t\t\t\t\tonFocus={(e) => this.handleEvent(e, EventType.Focus)}\n\t\t\t\t\trequired={!!this.required}\n\t\t\t\t></textarea>\n\t\t\t\t{this.internalHintExpander && (\n\t\t\t\t\t<ontario-hint-expander\n\t\t\t\t\t\thint={this.internalHintExpander.hint}\n\t\t\t\t\t\tcontent={this.internalHintExpander.content}\n\t\t\t\t\t\thintContentType={this.internalHintExpander.hintContentType}\n\t\t\t\t\t\tinput-exists\n\t\t\t\t\t></ontario-hint-expander>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}