npm - @ukic/web-components - Versions diffs - 3.0.0-alpha.5 → 3.0.0-alpha.7 - Mend

@ukic/web-components 3.0.0-alpha.5 → 3.0.0-alpha.7

Files changed (629) hide show

package/dist/collection/components/ic-text-field/test/basic/ic-text-field.input.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-text-field.input.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-text-field/test/basic/ic-text-field.input.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAE5D,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;IAC7B,EAAE,CAAC,eAAe,EAAE,KAAK,IAAI,EAAE;QAC7B,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,2DAA2D;SAClE,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAC9C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,qFAAqF;SAC5F,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,0BAA0B,CAAC,CAAC;IAChE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0BAA0B,EAAE,KAAK,IAAI,EAAE;QACxC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,uEAAuE;SAC9E,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mDAAmD,EAAE,KAAK,IAAI,EAAE;QACjE,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,+GAA+G;SACtH,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,yBAAyB,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8BAA8B,EAAE,KAAK,IAAI,EAAE;QAC5C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,6IAA6I;SACpJ,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,wBAAwB,CAAC,CAAC;IAC9D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,uFAAuF;SAC9F,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,2BAA2B,CAAC,CAAC;IACjE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;QACvC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE;;;;;;;;;;;;;;uBAcW;SAClB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,mBAAmB,CAAC,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE;QACtC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,qFAAqF;SAC5F,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;IACxD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wBAAwB,EAAE,KAAK,IAAI,EAAE;QACtC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,qFAAqF;SAC5F,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;IACxD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,yFAAyF;SAChG,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,6BAA6B,CAAC,CAAC;IACnE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC5E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,yGAAyG;SAChH,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,gCAAgC,CAAC,CAAC;IACtE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8FAA8F,EAAE,KAAK,IAAI,EAAE;QAC5G,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,4HAA4H;SACnI,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,wCAAwC,CAAC,CAAC;IAC9E,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC5E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,yGAAyG;SAChH,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,gCAAgC,CAAC,CAAC;IACtE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8FAA8F,EAAE,KAAK,IAAI,EAAE;QAC5G,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,4HAA4H;SACnI,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,wCAAwC,CAAC,CAAC;IAC9E,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sCAAsC,EAAE,KAAK,IAAI,EAAE;QACpD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,4GAA4G;SACnH,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,8BAA8B,CAAC,CAAC;IACpE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uCAAuC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,kIAAkI;SACzI,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,iCAAiC,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uCAAuC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,kIAAkI;SACzI,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,iCAAiC,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,8HAA8H;SACrI,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,+BAA+B,CAAC,CAAC;IACrE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;QAC5D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,2JAA2J;SAClK,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,wCAAwC,CAAC,CAAC;IAC9E,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,cAAc,EAAE,KAAK,IAAI,EAAE;QAC5B,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,2DAA2D;SAClE,CAAC,CAAC;QAEH,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC7B,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;QACjD,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC1D,MAAM,KAAK,CAAC,KAAK,EAAE,CAAC;QACpB,MAAM,CAAC,UAAU,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACxC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,aAAa,EAAE,KAAK,IAAI,EAAE;QAC3B,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,2DAA2D;SAClE,CAAC,CAAC;QAEH,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC7B,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;QAChD,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC1D,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC;QACnB,MAAM,CAAC,UAAU,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACxC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qDAAqD,EAAE,KAAK,IAAI,EAAE;QACnE,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE;;;;;;;;;;;;;;uBAcW;SAClB,CAAC,CAAC;QAEH,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;QACjE,MAAM,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;IAC1B,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qBAAqB,EAAE,KAAK,IAAI,EAAE;QACnC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,oDAAoD;SAC3D,CAAC,CAAC;QAEH,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC3B,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QACjD,MAAM,KAAK,GAAG,IAAI,aAAa,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;QACzD,MAAM,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC7C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;QACjC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,oDAAoD;SAC3D,CAAC,CAAC;QAEH,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACxB,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QAE5C,MAAM,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,CAAC,CAAC;QACrE,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACnD,MAAM,CAAC,KAAK,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACnC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8BAA8B,EAAE,KAAK,IAAI,EAAE;QAC5C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE;;;cAGE;SACT,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACzC,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,WAAW,CAAC;QACtC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAElD,MAAM,IAAI,CAAC,YAAY,CAAC,eAAe,EAAE,CAAC;QAC1C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAEzC,4BAA4B;QAC5B,6DAA6D;QAC7D,MAAM,cAAc,CAAC,GAAG,CAAC,CAAC;QAC1B,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,+CAA+C,EAAE,KAAK,IAAI,EAAE;IAC7D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;QAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;QACvB,IAAI,EAAE,mHAAmH;KAC1H,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;AACxD,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,+CAA+C,EAAE,KAAK,IAAI,EAAE;IAC7D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;QAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;QACvB,IAAI,EAAE,mHAAmH;KAC1H,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;AACxD,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,uDAAuD,EAAE,KAAK,IAAI,EAAE;IACrE,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;QAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;QACvB,IAAI,EAAE,+FAA+F;KACtG,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAE9C,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;IAC1D,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;AAChD,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;IAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;QAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;QACvB,IAAI,EAAE,4EAA4E;KACnF,CAAC,CAAC;IAEH,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAC5C,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3D,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC;IAC/C,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC5D,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;IAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;QAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;QACvB,IAAI,EAAE,yFAAyF;KAChG,CAAC,CAAC;IAEH,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC1D,KAAK,CAAC,IAAI,EAAE,CAAC;IACb,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,uBAAuB,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAE7D,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,SAAS,CAAC;IACpC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,KAAK,CAAC,IAAI,EAAE,CAAC;IACb,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,uBAAuB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AAChE,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,uEAAuE,EAAE,KAAK,IAAI,EAAE;IACrF,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;QAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;QACvB,IAAI,EAAE,oDAAoD;KAC3D,CAAC,CAAC;IACH,MAAM,CACJ,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAClE,CAAC,QAAQ,EAAE,CAAC;IAEb,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IAC7C,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC;IACrE,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CACJ,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAClE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;AACtB,CAAC,CAAC,CAAC","sourcesContent":["import { TextField } from \"../../ic-text-field\";\nimport { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\n\ndescribe(\"ic-text-field\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders\");\n });\n\n it(\"should render with placeholder\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" placeholder=\"placeholder\" rows=0></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-placeholder\");\n });\n\n it(\"should render with value\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-value\");\n });\n\n it(\"should render with helperText, required and small\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" helper-text=\"helper text value\" required=true size=\"small\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-helpertext\");\n });\n\n it(\"should render with autoprops\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" autofocus=true autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-autoprops\");\n });\n\n it(\"should render with hidden label\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" hide-label=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-label\");\n });\n\n it(\"should render with icon\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-icon\");\n });\n\n it(\"should render disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" disabled=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-disabled\");\n });\n\n it(\"should render readonly\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" readonly=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-readonly\");\n });\n\n it(\"should render with max characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters\");\n });\n\n it(\"should render with max characters and hidden character count\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25 hide-char-count></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-char-count\");\n });\n\n it(\"should render with max characters and a value set which exceeds the max number of characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"A long value which exceeds the max characters\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters-long-value\");\n });\n\n it(\"should render with max characters and hidden character count\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25 hide-char-count></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-char-count\");\n });\n\n it(\"should render with max characters and a value set which exceeds the max number of characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"A long value which exceeds the max characters\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters-long-value\");\n });\n\n it(\"should render with name & full width\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" name=\"mycontrolname\" full-width=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-name-full-width\");\n });\n\n it(\"should render with success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-success-validation\");\n });\n\n it(\"should render with warning validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-warning-validation\");\n });\n\n it(\"should render with error validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-error-validation\");\n });\n\n it(\"should render with inline success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" validation-inline=\"true\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-inline-success-validation\");\n });\n\n it(\"should focus\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icFocus\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.focus();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should blur\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icBlur\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.blur();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should not show left icon if text field is disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 disabled>\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n const slot = page.root.shadowRoot.querySelector(`[slot=\"icon\"]`);\n expect(slot).toBeNull();\n });\n\n it(\"should test keydown\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const eventSpy = jest.fn();\n page.win.addEventListener(\"icKeydown\", eventSpy);\n const event = new KeyboardEvent(\"keydown\", { key: \"A\" });\n await page.rootInstance.handleKeyDown(event);\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should test input\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const event = jest.fn();\n page.win.addEventListener(\"icInput\", event);\n\n await page.rootInstance.onInput({ target: { value: \"test value\" } });\n await page.waitForChanges();\n expect(page.rootInstance.value).toBe(\"test value\");\n expect(event).toHaveBeenCalled();\n });\n\n it(\"should test form reset event\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<form>\n <ic-text-field label=\"Test label\"></ic-text-field>\n <button id=\"resetButton\" type=\"reset\">Reset</button> \n </form>`,\n });\n\n expect(page.rootInstance.value).toBe(\"\");\n page.rootInstance.value = \"New value\";\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"New value\");\n\n await page.rootInstance.handleFormReset();\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"\");\n\n //test disconnected callback\n //delay to wait for icchange event to prevent console warning\n await waitForTimeout(500);\n page.setContent(\"\");\n });\n});\n\nit(\"should render with min/max and max validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"6\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max\");\n});\n\nit(\"should render with min/max and min validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"0\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-min\");\n});\n\nit(\"should test setting value cannot exceed maxCharacters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5 value=\"Test value\"></ic-text-field>`,\n });\n\n expect(page.rootInstance.value).toBe(\"Test \");\n\n page.rootInstance.watchValueHandler(\"Another test value\");\n expect(page.rootInstance.value).toBe(\"Anoth\");\n});\n\nit(\"should test maxCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5></ic-text-field>`,\n });\n\n page.rootInstance.watchValueHandler(\"test\");\n expect(page.rootInstance.maxCharactersReached).toBe(false);\n page.rootInstance.watchValueHandler(\"testing\");\n expect(page.rootInstance.maxCharactersReached).toBe(true);\n});\n\nit(\"should test minCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min-characters=5 value=\"test\"></ic-text-field>`,\n });\n\n const input = page.root.shadowRoot.querySelector(\"input\");\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(true);\n\n page.rootInstance.value = \"testing\";\n await page.waitForChanges();\n\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(false);\n});\n\nit(\"should update any attributes that are inherited from the root element\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBeNull();\n\n page.root.setAttribute(\"title\", \"new-label\");\n page.rootInstance.hostMutationCallback([{ attributeName: \"title\" }]);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBe(\"new-label\");\n});\n"]}
1	+ {"version":3,"file":"ic-text-field.input.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-text-field/test/basic/ic-text-field.input.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextField } from \"../../ic-text-field\";\nimport { InputContainer } from \"../../../ic-input-container/ic-input-container\";\nimport { InputLabel } from \"../../../ic-input-label/ic-input-label\";\nimport { Typography } from \"../../../ic-typography/ic-typography\";\nimport { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\n\ndescribe(\"ic-text-field\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders\");\n });\n\n it(\"should render with placeholder\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" placeholder=\"placeholder\" rows=0></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-placeholder\");\n });\n\n it(\"should render with value\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-value\");\n });\n\n it(\"should render with helperText, required and small\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" helper-text=\"helper text value\" required=true size=\"small\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-helpertext\");\n });\n\n it(\"should render with autoprops\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-autoprops\");\n });\n\n it(\"should render with hidden label\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" hide-label=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-label\");\n });\n\n it(\"should render with icon\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-icon\");\n });\n\n it(\"should render disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" disabled=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-disabled\");\n\n page.rootInstance.disabled = false;\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot(\"disabled-removed\");\n });\n\n it(\"should render readonly\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" readonly=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-readonly\");\n });\n\n it(\"should render with max characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters\");\n });\n\n it(\"should render with max characters and hidden character count\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25 hide-char-count></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-char-count\");\n });\n\n it(\"should render with max characters and a value set which exceeds the max number of characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"A long value which exceeds the max characters\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters-long-value\");\n });\n\n it(\"should render with max characters and hidden character count\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25 hide-char-count></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-char-count\");\n });\n\n it(\"should render with max characters and a value set which exceeds the max number of characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"A long value which exceeds the max characters\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters-long-value\");\n });\n\n it(\"should render with name & full width\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" name=\"mycontrolname\" full-width=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-name-full-width\");\n });\n\n it(\"should render with success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-success-validation\");\n });\n\n it(\"should render with warning validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-warning-validation\");\n });\n\n it(\"should render with error validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-error-validation\");\n });\n\n it(\"should render with inline success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" validation-inline=\"true\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-inline-success-validation\");\n });\n\n it(\"should blur\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icBlur\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.blur();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should not show left icon if text field is disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 disabled>\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n const slot = page.root.shadowRoot.querySelector(`[slot=\"icon\"]`);\n expect(slot).toBeNull();\n });\n\n it(\"should test keydown\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const eventSpy = jest.fn();\n page.win.addEventListener(\"icKeydown\", eventSpy);\n const event = new KeyboardEvent(\"keydown\", { key: \"A\" });\n await page.rootInstance.handleKeyDown(event);\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should test input\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const event = jest.fn();\n page.win.addEventListener(\"icInput\", event);\n\n await page.rootInstance.onInput({ target: { value: \"test value\" } });\n await page.waitForChanges();\n expect(page.rootInstance.value).toBe(\"test value\");\n expect(event).toHaveBeenCalled();\n });\n\n it(\"should test form reset event\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<form>\n <ic-text-field label=\"Test label\"></ic-text-field>\n <button id=\"resetButton\" type=\"reset\">Reset</button> \n </form>`,\n });\n\n expect(page.rootInstance.value).toBe(\"\");\n page.rootInstance.value = \"New value\";\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"New value\");\n\n await page.rootInstance.handleFormReset();\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"\");\n\n //test disconnected callback\n //delay to wait for icchange event to prevent console warning\n await waitForTimeout(500);\n page.setContent(\"\");\n });\n});\n\nit(\"should render with min/max and max validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"6\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max\");\n});\n\nit(\"should render with min/max and min validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"0\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-min\");\n});\n\nit(\"should test setting value cannot exceed maxCharacters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5 value=\"Test value\"></ic-text-field>`,\n });\n\n expect(page.rootInstance.value).toBe(\"Test \");\n\n page.rootInstance.watchValueHandler(\"Another test value\");\n expect(page.rootInstance.value).toBe(\"Anoth\");\n});\n\nit(\"should test maxCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5></ic-text-field>`,\n });\n\n page.rootInstance.watchValueHandler(\"test\");\n expect(page.rootInstance.maxCharactersReached).toBe(false);\n page.rootInstance.watchValueHandler(\"testing\");\n expect(page.rootInstance.maxCharactersReached).toBe(true);\n});\n\nit(\"should test minCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min-characters=5 value=\"test\"></ic-text-field>`,\n });\n\n const input = page.root.shadowRoot.querySelector(\"input\");\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(true);\n\n page.rootInstance.value = \"testing\";\n await page.waitForChanges();\n\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(false);\n});\n\nit(\"should update any attributes that are inherited from the root element\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBeNull();\n\n page.root.setAttribute(\"title\", \"new-label\");\n page.rootInstance.hostMutationCallback([{ attributeName: \"title\" }]);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBe(\"new-label\");\n});\n\nit(\"should autofocus\", async () => {\n jest.useFakeTimers();\n const page = await newSpecPage({\n components: [TextField, InputContainer, InputLabel, Typography],\n html: `<ic-text-field label=\"Test label\" autofocus>\n <ic-typography>Helper text</ic-typography>\n </ic-text-field>`,\n });\n\n await page.waitForChanges();\n const textField = page.rootInstance;\n\n expect(textField.autofocus).toBe(true);\n\n const typo = page.root.shadowRoot.querySelector(\"ic-typography\");\n typo.classList.add(\"hydrated\");\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icFocus\", callbackFn);\n\n jest.advanceTimersByTime(100);\n await page.waitForChanges();\n\n expect(callbackFn).toHaveBeenCalled();\n});\n"]}

package/dist/collection/components/ic-theme/ic-theme.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Host, h, } from "@stencil/core";
-import { convertToRGBA, getThemeForegroundColor } from "../../utils/helpers";
-import { getThemeColorBrightness } from "../../utils/helpers";
+import { convertToRGBA, getBrandForegroundAppearance, } from "../../utils/helpers";
+import { getBrandColorBrightness } from "../../utils/helpers";
 import { BLACK_MIN_COLOR_BRIGHTNESS, WHITE_MAX_COLOR_BRIGHTNESS, } from "../../utils/constants";
 export class Theme {
     constructor() {
@@ -16,41 +16,41 @@ export class Theme {
                 this.themeClass = `ic-theme-${this.theme}`;
             }
         };
-        this.checkThemeColorContrast = () => {
-            if (getThemeColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&
-                getThemeColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS) {
-                console.warn(`The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`);
+        this.checkBrandColorContrast = () => {
+            if (getBrandColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&
+                getBrandColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS) {
+                console.warn(`The brand colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`);
             }
         };
-        this.setThemeColor = () => {
-            const colorRGBA = convertToRGBA(this.color);
+        this.setBrandColor = () => {
+            const colorRGBA = convertToRGBA(this.brandColor);
             if (colorRGBA) {
                 const { r, g, b, a } = colorRGBA;
                 const { style } = document.documentElement;
-                style.setProperty("--ic-theme-primary-r", `${r}`);
-                style.setProperty("--ic-theme-primary-g", `${g}`);
-                style.setProperty("--ic-theme-primary-b", `${b}`);
-                style.setProperty("--ic-theme-primary-a", `${a}`);
-                this.checkThemeColorContrast();
-                this.themeChange.emit({
-                    mode: getThemeForegroundColor(),
+                style.setProperty("--ic-brand-color-primary-r", `${r}`);
+                style.setProperty("--ic-brand-color-primary-g", `${g}`);
+                style.setProperty("--ic-brand-color-primary-b", `${b}`);
+                style.setProperty("--ic-brand-color-primary-a", `${a}`);
+                this.checkBrandColorContrast();
+                this.brandChange.emit({
+                    mode: getBrandForegroundAppearance(),
                     color: colorRGBA,
                 });
             }
         };
         this.themeClass = "";
-        this.color = null;
+        this.brandColor = null;
         this.theme = "light";
     }
-    watchColorPropHandler() {
-        this.setThemeColor();
+    watchBrandColorPropHandler() {
+        this.setBrandColor();
     }
     watchThemePropHandler() {
         this.darkModeChangeHandler();
     }
     componentWillLoad() {
         this.darkModeChangeHandler();
-        this.setThemeColor();
+        this.setBrandColor();
         window.matchMedia &&
             window
                 .matchMedia("(prefers-color-scheme: dark)")
@@ -63,7 +63,7 @@ export class Theme {
     static get is() { return "ic-theme"; }
     static get properties() {
         return {
-            "color": {
+            "brandColor": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -81,9 +81,9 @@ export class Theme {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "The theme colour. Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\"."
+                    "text": "The brand colour. Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\"."
                 },
-                "attribute": "color",
+                "attribute": "brand-color",
                 "reflect": false,
                 "defaultValue": "null"
             },
@@ -114,26 +114,26 @@ export class Theme {
     }
     static get events() {
         return [{
-                "method": "themeChange",
-                "name": "themeChange",
+                "method": "brandChange",
+                "name": "brandChange",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
                     "tags": [{
                             "name": "internal",
-                            "text": "Emitted when the theme is changed."
+                            "text": "Emitted when the brand color is changed."
                         }],
                     "text": ""
                 },
                 "complexType": {
-                    "original": "IcTheme",
-                    "resolved": "{ mode: IcThemeForeground; color: IcColorRGB; }",
+                    "original": "IcBrand",
+                    "resolved": "{ mode: IcBrandForeground; color: IcColorRGB; }",
                     "references": {
-                        "IcTheme": {
+                        "IcBrand": {
                             "location": "import",
                             "path": "../../utils/types",
-                            "id": "src/utils/types.ts::IcTheme"
+                            "id": "src/utils/types.ts::IcBrand"
                         }
                     }
                 }
@@ -141,8 +141,8 @@ export class Theme {
     }
     static get watchers() {
         return [{
-                "propName": "color",
-                "methodName": "watchColorPropHandler"
+                "propName": "brandColor",
+                "methodName": "watchBrandColorPropHandler"
             }, {
                 "propName": "theme",
                 "methodName": "watchThemePropHandler"

package/dist/collection/components/ic-theme/ic-theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-theme.js","sourceRoot":"","sources":["../../../src/components/ic-theme/ic-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,KAAK,EAEL,CAAC,EACD,KAAK,EACL,IAAI,EACJ,KAAK,GACN,MAAM,eAAe,CAAC;AAGvB,OAAO,~~EAAE~~,aAAa,~~EAAE~~,~~uBAAuB~~,~~EAAE~~,MAAM,qBAAqB,CAAC;~~AAC7E~~,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EACL,0BAA0B,EAC1B,0BAA0B,GAC3B,MAAM,uBAAuB,CAAC;AAK/B,MAAM,OAAO,KAAK;;QAsCR,0BAAqB,GAAG,GAAS,EAAE;YACzC,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE,CAAC;gBAC5B,IAAI,CAAC,UAAU;oBACb,MAAM,CAAC,UAAU;wBACjB,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO;wBACvD,CAAC,CAAC,eAAe;wBACjB,CAAC,CAAC,gBAAgB,CAAC;YACzB,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,UAAU,GAAG,YAAY,IAAI,CAAC,KAAK,EAAE,CAAC;YAC7C,CAAC;QACH,CAAC,CAAC;QAEM,4BAAuB,GAAG,GAAS,EAAE;YAC3C,IACE,uBAAuB,EAAE,GAAG,0BAA0B;gBACtD,uBAAuB,EAAE,GAAG,0BAA0B,EACtD,CAAC;gBACD,OAAO,CAAC,IAAI,CACV,2TAA2T,CAC5T,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,GAAG,EAAE;YAC3B,MAAM,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,~~KAAK~~,CAAC,CAAC;~~YAE5C~~,IAAI,SAAS,EAAE,CAAC;gBACd,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC;gBACjC,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,eAAe,CAAC;gBAC3C,KAAK,CAAC,WAAW,CAAC,~~sBAAsB~~,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;~~gBAClD~~,KAAK,CAAC,WAAW,CAAC,~~sBAAsB~~,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;~~gBAClD~~,KAAK,CAAC,WAAW,CAAC,~~sBAAsB~~,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;~~gBAClD~~,KAAK,CAAC,WAAW,CAAC,~~sBAAsB~~,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;~~gBAElD~~,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAE/B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;oBACpB,IAAI,EAAE,~~uBAAuB~~,EAAE;~~oBAC/B~~,KAAK,EAAE,SAAS;iBACjB,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;0BA9E4B,EAAE;~~qBAKN~~,IAAI;~~qBAUe~~,OAAO;;IAPpD,~~qBAAqB~~;~~QACnB~~,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAQD,qBAAqB;QACnB,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC;IAOD,iBAAiB;QACf,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,MAAM,CAAC,UAAU;YACf,MAAM;iBACH,UAAU,CAAC,8BAA8B,CAAC;iBAC1C,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAC9D,CAAC;IA6CD,MAAM;QACJ,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAE5B,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,UAAU;YACrB,eAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Host,\n Event,\n EventEmitter,\n h,\n Watch,\n Prop,\n State,\n} from \"@stencil/core\";\n\nimport { IcColor, ~~IcTheme~~ } from \"../../utils/types\";\nimport { convertToRGBA~~, getThemeForegroundColor~~ } from \"../../utils/helpers\";\nimport { ~~getThemeColorBrightness~~ } from \"../../utils/helpers\";\nimport {\n BLACK_MIN_COLOR_BRIGHTNESS,\n WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../utils/constants\";\n\n@Component({\n tag: \"ic-theme\",\n})\nexport class Theme {\n @State() themeClass: string = \"\";\n\n /*\n The ~~theme~~ colour. Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n /\n @Prop() ~~color~~?: IcColor = null;\n\n @Watch(\"~~color~~\")\n ~~watchColorPropHandler~~(): void {\n this.~~setThemeColor~~();\n }\n\n /\n The theme mode. Can be \"dark\", \"light\", or \"system\". \"system\" will use the device or browser settings.\n /\n @Prop() theme: \"dark\" \| \"light\" \| \"system\" = \"light\";\n\n @Watch(\"theme\")\n watchThemePropHandler(): void {\n this.darkModeChangeHandler();\n }\n\n /\n @internal Emitted when the ~~theme~~ is changed.\n */\n @Event() ~~themeChange~~: EventEmitter<~~IcTheme~~>;\n\n componentWillLoad(): void {\n this.darkModeChangeHandler();\n this.~~setThemeColor~~();\n\n window.matchMedia &&\n window\n .matchMedia(\"(prefers-color-scheme: dark)\")\n .addEventListener(\"change\", this.darkModeChangeHandler);\n }\n\n private darkModeChangeHandler = (): void => {\n if (this.theme === \"system\") {\n this.themeClass =\n window.matchMedia &&\n window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n ? \"ic-theme-dark\"\n : \"ic-theme-light\";\n } else {\n this.themeClass = `ic-theme-${this.theme}`;\n }\n };\n\n private ~~checkThemeColorContrast~~ = (): void => {\n if (\n ~~getThemeColorBrightness~~() < BLACK_MIN_COLOR_BRIGHTNESS &&\n ~~getThemeColorBrightness~~() > WHITE_MAX_COLOR_BRIGHTNESS\n ) {\n console.warn(\n `The ~~theme~~ colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`\n );\n }\n };\n\n private ~~setThemeColor~~ = () => {\n const colorRGBA = convertToRGBA(this.~~color~~);\n\n if (colorRGBA) {\n const { r, g, b, a } = colorRGBA;\n const { style } = document.documentElement;\n style.setProperty(\"--ic-~~theme~~-primary-r\", `${r}`);\n style.setProperty(\"--ic-~~theme~~-primary-g\", `${g}`);\n style.setProperty(\"--ic-~~theme~~-primary-b\", `${b}`);\n style.setProperty(\"--ic-~~theme~~-primary-a\", `${a}`);\n\n this.~~checkThemeColorContrast~~();\n\n this.~~themeChange~~.emit({\n mode: ~~getThemeForegroundColor~~(),\n color: colorRGBA,\n });\n }\n };\n\n render() {\n const { themeClass } = this;\n\n return (\n <Host class={themeClass}>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-theme.js","sourceRoot":"","sources":["../../../src/components/ic-theme/ic-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,KAAK,EAEL,CAAC,EACD,KAAK,EACL,IAAI,EACJ,KAAK,GACN,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,aAAa,EACb,4BAA4B,GAC7B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EACL,0BAA0B,EAC1B,0BAA0B,GAC3B,MAAM,uBAAuB,CAAC;AAK/B,MAAM,OAAO,KAAK;;QAsCR,0BAAqB,GAAG,GAAS,EAAE;YACzC,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE,CAAC;gBAC5B,IAAI,CAAC,UAAU;oBACb,MAAM,CAAC,UAAU;wBACjB,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO;wBACvD,CAAC,CAAC,eAAe;wBACjB,CAAC,CAAC,gBAAgB,CAAC;YACzB,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,UAAU,GAAG,YAAY,IAAI,CAAC,KAAK,EAAE,CAAC;YAC7C,CAAC;QACH,CAAC,CAAC;QAEM,4BAAuB,GAAG,GAAS,EAAE;YAC3C,IACE,uBAAuB,EAAE,GAAG,0BAA0B;gBACtD,uBAAuB,EAAE,GAAG,0BAA0B,EACtD,CAAC;gBACD,OAAO,CAAC,IAAI,CACV,2TAA2T,CAC5T,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,GAAG,EAAE;YAC3B,MAAM,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAEjD,IAAI,SAAS,EAAE,CAAC;gBACd,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC;gBACjC,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,eAAe,CAAC;gBAC3C,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBAExD,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAE/B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;oBACpB,IAAI,EAAE,4BAA4B,EAAE;oBACpC,KAAK,EAAE,SAAS;iBACjB,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;0BA9E4B,EAAE;0BAKD,IAAI;qBAUU,OAAO;;IAPpD,0BAA0B;QACxB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAQD,qBAAqB;QACnB,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC;IAOD,iBAAiB;QACf,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,aAAa,EAAE,CAAC;QAErB,MAAM,CAAC,UAAU;YACf,MAAM;iBACH,UAAU,CAAC,8BAA8B,CAAC;iBAC1C,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAC9D,CAAC;IA6CD,MAAM;QACJ,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAE5B,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,UAAU;YACrB,eAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Host,\n Event,\n EventEmitter,\n h,\n Watch,\n Prop,\n State,\n} from \"@stencil/core\";\n\nimport { IcColor, IcBrand } from \"../../utils/types\";\nimport {\n convertToRGBA,\n getBrandForegroundAppearance,\n} from \"../../utils/helpers\";\nimport { getBrandColorBrightness } from \"../../utils/helpers\";\nimport {\n BLACK_MIN_COLOR_BRIGHTNESS,\n WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../utils/constants\";\n\n@Component({\n tag: \"ic-theme\",\n})\nexport class Theme {\n @State() themeClass: string = \"\";\n\n /*\n The brand colour. Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n /\n @Prop() brandColor?: IcColor = null;\n\n @Watch(\"brandColor\")\n watchBrandColorPropHandler(): void {\n this.setBrandColor();\n }\n\n /\n The theme mode. Can be \"dark\", \"light\", or \"system\". \"system\" will use the device or browser settings.\n /\n @Prop() theme: \"dark\" \| \"light\" \| \"system\" = \"light\";\n\n @Watch(\"theme\")\n watchThemePropHandler(): void {\n this.darkModeChangeHandler();\n }\n\n /\n @internal Emitted when the brand color is changed.\n */\n @Event() brandChange: EventEmitter<IcBrand>;\n\n componentWillLoad(): void {\n this.darkModeChangeHandler();\n this.setBrandColor();\n\n window.matchMedia &&\n window\n .matchMedia(\"(prefers-color-scheme: dark)\")\n .addEventListener(\"change\", this.darkModeChangeHandler);\n }\n\n private darkModeChangeHandler = (): void => {\n if (this.theme === \"system\") {\n this.themeClass =\n window.matchMedia &&\n window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n ? \"ic-theme-dark\"\n : \"ic-theme-light\";\n } else {\n this.themeClass = `ic-theme-${this.theme}`;\n }\n };\n\n private checkBrandColorContrast = (): void => {\n if (\n getBrandColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&\n getBrandColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS\n ) {\n console.warn(\n `The brand colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`\n );\n }\n };\n\n private setBrandColor = () => {\n const colorRGBA = convertToRGBA(this.brandColor);\n\n if (colorRGBA) {\n const { r, g, b, a } = colorRGBA;\n const { style } = document.documentElement;\n style.setProperty(\"--ic-brand-color-primary-r\", `${r}`);\n style.setProperty(\"--ic-brand-color-primary-g\", `${g}`);\n style.setProperty(\"--ic-brand-color-primary-b\", `${b}`);\n style.setProperty(\"--ic-brand-color-primary-a\", `${a}`);\n\n this.checkBrandColorContrast();\n\n this.brandChange.emit({\n mode: getBrandForegroundAppearance(),\n color: colorRGBA,\n });\n }\n };\n\n render() {\n const { themeClass } = this;\n\n return (\n <Host class={themeClass}>\n <slot></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ic-theme/test/basic/ic-theme.e2e.js CHANGED Viewed

@@ -6,12 +6,12 @@ describe("ic-theme", () => {
         const element = await page.find("ic-theme");
         expect(element).toHaveClass("hydrated");
     });
-    it("should emit themeChange when setThemeRGB method called", async () => {
+    it("should emit brandChange event when brandColor is changed", async () => {
         const page = await newE2EPage();
         await page.setContent(`<ic-theme></ic-theme>`);
-        const spy = await page.spyOnEvent("themeChange");
+        const spy = await page.spyOnEvent("brandChange");
         await page.$eval("ic-theme", (elm) => {
-            elm.color = "rgb(255, 201, 60)";
+            elm.brandColor = "rgb(255, 201, 60)";
         });
         await page.waitForChanges();
         expect(spy).toHaveReceivedEventDetail({
@@ -24,7 +24,7 @@ describe("ic-theme", () => {
             },
         });
         await page.$eval("ic-theme", (elm) => {
-            elm.color = "rgb(35, 81, 142)";
+            elm.brandColor = "rgb(35, 81, 142)";
         });
         await page.waitForChanges();
         expect(spy).toHaveReceivedEventDetail({
@@ -40,9 +40,9 @@ describe("ic-theme", () => {
     it("should emit correct textColor when rgb values invalid", async () => {
         const page = await newE2EPage();
         await page.setContent("<ic-theme></ic-theme>");
-        const spy = await page.spyOnEvent("themeChange");
+        const spy = await page.spyOnEvent("brandChange");
         await page.$eval("ic-theme", (elm) => {
-            elm.color = "rgb(1000, 1000, 1000)";
+            elm.brandColor = "rgb(1000, 1000, 1000)";
         });
         await page.waitForChanges();
         expect(spy).toHaveReceivedEventDetail({
@@ -55,7 +55,7 @@ describe("ic-theme", () => {
             },
         });
         await page.$eval("ic-theme", (elm) => {
-            elm.color = "rgb(-1, -1, -1)";
+            elm.brandColor = "rgb(-1, -1, -1)";
         });
         await page.waitForChanges();
         expect(spy).toHaveReceivedEventDetail({

package/dist/collection/components/ic-theme/test/basic/ic-theme.e2e.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-theme.e2e.js","sourceRoot":"","sources":["../../../../../src/components/ic-theme/test/basic/ic-theme.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,eAAe,EAAE,KAAK,IAAI,EAAE;QAC7B,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC5C,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,~~wDAAwD~~,EAAE,KAAK,IAAI,EAAE;~~QACtE~~,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;QAEhC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,GAAG,GAAG,MAAM,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;QAEjD,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,~~KAAK~~,GAAG,mBAAmB,CAAC;~~QAClC~~,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,EAAE;gBACL,CAAC,EAAE,GAAG;gBACN,CAAC,EAAE,GAAG;aACP;SACF,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,~~KAAK~~,GAAG,kBAAkB,CAAC;~~QACjC~~,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,OAAO;YACb,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,GAAG;gBACN,CAAC,EAAE,EAAE;gBACL,CAAC,EAAE,EAAE;aACN;SACF,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uDAAuD,EAAE,KAAK,IAAI,EAAE;QACrE,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,GAAG,GAAG,MAAM,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;QAEjD,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,~~KAAK~~,GAAG,uBAAuB,CAAC;~~QACtC~~,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,IAAI;gBACP,CAAC,EAAE,IAAI;gBACP,CAAC,EAAE,IAAI;aACR;SACF,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,~~KAAK~~,GAAG,iBAAiB,CAAC;~~QAChC~~,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,OAAO;YACb,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,CAAC,CAAC;gBACL,CAAC,EAAE,CAAC,CAAC;gBACL,CAAC,EAAE,CAAC,CAAC;aACN;SACF,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-theme\", () => {\n it(\"should render\", async () => {\n const page = await newE2EPage();\n await page.setContent(`<ic-theme></ic-theme>`);\n\n const element = await page.find(\"ic-theme\");\n expect(element).toHaveClass(\"hydrated\");\n });\n\n it(\"should emit ~~themeChange~~ when ~~setThemeRGB~~ ~~method~~ ~~called~~\", async () => {\n const page = await newE2EPage();\n\n await page.setContent(`<ic-theme></ic-theme>`);\n\n const spy = await page.spyOnEvent(\"~~themeChange~~\");\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.~~color~~ = \"rgb(255, 201, 60)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"dark\",\n color: {\n a: 1,\n b: 60,\n g: 201,\n r: 255,\n },\n });\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.~~color~~ = \"rgb(35, 81, 142)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"light\",\n color: {\n a: 1,\n b: 142,\n g: 81,\n r: 35,\n },\n });\n });\n\n it(\"should emit correct textColor when rgb values invalid\", async () => {\n const page = await newE2EPage();\n await page.setContent(\"<ic-theme></ic-theme>\");\n\n const spy = await page.spyOnEvent(\"~~themeChange~~\");\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.~~color~~ = \"rgb(1000, 1000, 1000)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"dark\",\n color: {\n a: 1,\n b: 1000,\n g: 1000,\n r: 1000,\n },\n });\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.~~color~~ = \"rgb(-1, -1, -1)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"light\",\n color: {\n a: 1,\n b: -1,\n g: -1,\n r: -1,\n },\n });\n });\n});\n"]}
1	+ {"version":3,"file":"ic-theme.e2e.js","sourceRoot":"","sources":["../../../../../src/components/ic-theme/test/basic/ic-theme.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,eAAe,EAAE,KAAK,IAAI,EAAE;QAC7B,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC5C,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0DAA0D,EAAE,KAAK,IAAI,EAAE;QACxE,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;QAEhC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,GAAG,GAAG,MAAM,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;QAEjD,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,UAAU,GAAG,mBAAmB,CAAC;QACvC,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,EAAE;gBACL,CAAC,EAAE,GAAG;gBACN,CAAC,EAAE,GAAG;aACP;SACF,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,UAAU,GAAG,kBAAkB,CAAC;QACtC,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,OAAO;YACb,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,GAAG;gBACN,CAAC,EAAE,EAAE;gBACL,CAAC,EAAE,EAAE;aACN;SACF,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uDAAuD,EAAE,KAAK,IAAI,EAAE;QACrE,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,GAAG,GAAG,MAAM,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;QAEjD,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,UAAU,GAAG,uBAAuB,CAAC;QAC3C,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,IAAI;gBACP,CAAC,EAAE,IAAI;gBACP,CAAC,EAAE,IAAI;aACR;SACF,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,GAAuB,EAAE,EAAE;YACvD,GAAG,CAAC,UAAU,GAAG,iBAAiB,CAAC;QACrC,CAAC,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,GAAG,CAAC,CAAC,yBAAyB,CAAC;YACpC,IAAI,EAAE,OAAO;YACb,KAAK,EAAE;gBACL,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,CAAC,CAAC;gBACL,CAAC,EAAE,CAAC,CAAC;gBACL,CAAC,EAAE,CAAC,CAAC;aACN;SACF,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-theme\", () => {\n it(\"should render\", async () => {\n const page = await newE2EPage();\n await page.setContent(`<ic-theme></ic-theme>`);\n\n const element = await page.find(\"ic-theme\");\n expect(element).toHaveClass(\"hydrated\");\n });\n\n it(\"should emit brandChange event when brandColor is changed\", async () => {\n const page = await newE2EPage();\n\n await page.setContent(`<ic-theme></ic-theme>`);\n\n const spy = await page.spyOnEvent(\"brandChange\");\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.brandColor = \"rgb(255, 201, 60)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"dark\",\n color: {\n a: 1,\n b: 60,\n g: 201,\n r: 255,\n },\n });\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.brandColor = \"rgb(35, 81, 142)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"light\",\n color: {\n a: 1,\n b: 142,\n g: 81,\n r: 35,\n },\n });\n });\n\n it(\"should emit correct textColor when rgb values invalid\", async () => {\n const page = await newE2EPage();\n await page.setContent(\"<ic-theme></ic-theme>\");\n\n const spy = await page.spyOnEvent(\"brandChange\");\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.brandColor = \"rgb(1000, 1000, 1000)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"dark\",\n color: {\n a: 1,\n b: 1000,\n g: 1000,\n r: 1000,\n },\n });\n\n await page.$eval(\"ic-theme\", (elm: HTMLIcThemeElement) => {\n elm.brandColor = \"rgb(-1, -1, -1)\";\n });\n\n await page.waitForChanges();\n\n expect(spy).toHaveReceivedEventDetail({\n mode: \"light\",\n color: {\n a: 1,\n b: -1,\n g: -1,\n r: -1,\n },\n });\n });\n});\n"]}

package/dist/collection/components/ic-theme/test/basic/ic-theme.spec.js CHANGED Viewed

@@ -2,20 +2,20 @@ import { newSpecPage } from "@stencil/core/testing";
 import { Theme } from "../../ic-theme";
 import * as helpers from "../../../../utils/helpers";
 import { BLACK_MIN_COLOR_BRIGHTNESS, WHITE_MAX_COLOR_BRIGHTNESS, } from "../../../../utils/constants";
-//mocked as getThemeColorBrightness is NaN when run in test context
+//mocked as getBrandColorBrightness is NaN when run in test context
 //instead we return a value which will trigger the console warning about theme color contrast
 const mockThemeColorContrastFail = () => {
     const func = jest.fn(() => {
         return (BLACK_MIN_COLOR_BRIGHTNESS + WHITE_MAX_COLOR_BRIGHTNESS) / 2;
     });
-    Object.defineProperty(helpers, "getThemeColorBrightness", {
+    Object.defineProperty(helpers, "getBrandColorBrightness", {
         value: func,
     });
 };
 const expectRGBToBe = (page, expectR, expectG, expectB) => {
-    const r = page.doc.documentElement.style.getPropertyValue("--ic-theme-primary-r");
-    const g = page.doc.documentElement.style.getPropertyValue("--ic-theme-primary-g");
-    const b = page.doc.documentElement.style.getPropertyValue("--ic-theme-primary-b");
+    const r = page.doc.documentElement.style.getPropertyValue("--ic-brand-color-primary-r");
+    const g = page.doc.documentElement.style.getPropertyValue("--ic-brand-color-primary-g");
+    const b = page.doc.documentElement.style.getPropertyValue("--ic-brand-color-primary-b");
     expect(r).toBe(expectR);
     expect(g).toBe(expectG);
     expect(b).toBe(expectB);
@@ -27,28 +27,28 @@ describe("ic-theme", () => {
     it("should set theme colour with hex", async () => {
         const page = await newSpecPage({
             components: [Theme],
-            html: `<ic-theme color="#FFC0CB"></ic-theme>`,
+            html: `<ic-theme brand-color="#FFC0CB"></ic-theme>`,
         });
         expectRGBToBe(page, "255", "192", "203");
     });
     it("should set theme colour with 3 character hex", async () => {
         const page = await newSpecPage({
             components: [Theme],
-            html: `<ic-theme color="#FFF"></ic-theme>`,
+            html: `<ic-theme brand-color="#FFF"></ic-theme>`,
         });
         expectRGBToBe(page, "255", "255", "255");
     });
     it("should set theme colour with rgb", async () => {
         const page = await newSpecPage({
             components: [Theme],
-            html: `<ic-theme color="rgb(159, 43, 104)"></ic-theme>`,
+            html: `<ic-theme brand-color="rgb(159, 43, 104)"></ic-theme>`,
         });
         expectRGBToBe(page, "159", "43", "104");
     });
     it("should set theme colour with rgba", async () => {
         const page = await newSpecPage({
             components: [Theme],
-            html: `<ic-theme color="rgba(159, 43, 104, 1)"></ic-theme>`,
+            html: `<ic-theme brand-color="rgba(159, 43, 104, 1)"></ic-theme>`,
         });
         expectRGBToBe(page, "159", "43", "104");
     });
@@ -56,9 +56,9 @@ describe("ic-theme", () => {
         mockThemeColorContrastFail();
         const page = await newSpecPage({
             components: [Theme],
-            html: `<ic-theme color="rgba(159, 43, 104)"></ic-theme>`,
+            html: `<ic-theme brand-color="rgba(159, 43, 104)"></ic-theme>`,
         });
-        page.root.color = "rgba(133, 133, 133, 1)";
+        page.root.brandColor = "rgba(133, 133, 133, 1)";
         await page.waitForChanges();
         expectRGBToBe(page, "133", "133", "133");
     });

package/dist/collection/components/ic-theme/test/basic/ic-theme.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-theme.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-theme/test/basic/ic-theme.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAY,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC;AACrD,OAAO,EACL,0BAA0B,EAC1B,0BAA0B,GAC3B,MAAM,6BAA6B,CAAC;AAErC,mEAAmE;AACnE,6FAA6F;AAC7F,MAAM,0BAA0B,GAAG,GAAG,EAAE;IACtC,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,GAAG,EAAE;QACxB,OAAO,CAAC,0BAA0B,GAAG,0BAA0B,CAAC,GAAG,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,yBAAyB,EAAE;QACxD,KAAK,EAAE,IAAI;KACZ,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CACpB,IAAc,EACd,OAAe,EACf,OAAe,EACf,OAAe,EACf,EAAE;IACF,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,KAAK,CAAC,gBAAgB,CACvD,~~sBAAsB~~,~~CACvB~~,CAAC;IACF,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,KAAK,CAAC,gBAAgB,CACvD,~~sBAAsB~~,~~CACvB~~,CAAC;IACF,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,KAAK,CAAC,gBAAgB,CACvD,~~sBAAsB~~,~~CACvB~~,CAAC;IAEF,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACxB,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACxB,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;AAC1B,CAAC,CAAC;AAEF,SAAS,CAAC,GAAG,EAAE;IACb,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,kBAAkB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;AAC5D,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,KAAK,CAAC;YACnB,IAAI,EAAE,~~uCAAuC~~;~~SAC9C~~,CAAC,CAAC;QAEH,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IAC3C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;QAC5D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,KAAK,CAAC;YACnB,IAAI,EAAE,~~oCAAoC~~;~~SAC3C~~,CAAC,CAAC;QAEH,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IAC3C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,KAAK,CAAC;YACnB,IAAI,EAAE,~~iDAAiD~~;~~SACxD~~,CAAC,CAAC;QAEH,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,KAAK,CAAC;YACnB,IAAI,EAAE,~~qDAAqD~~;~~SAC5D~~,CAAC,CAAC;QACH,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,0BAA0B,EAAE,CAAC;QAE7B,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,KAAK,CAAC;YACnB,IAAI,EAAE,~~kDAAkD~~;~~SACzD~~,CAAC,CAAC;QAEH,IAAI,CAAC,IAAI,CAAC,~~KAAK~~,GAAG,wBAAwB,CAAC;~~QAC3C~~,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IAC3C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0BAA0B,EAAE,KAAK,IAAI,EAAE;QACxC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,KAAK,CAAC;YACnB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;QAE/C,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC;QAE1B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC;QAEhD,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;QAE3B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC;IAClD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage, SpecPage } from \"@stencil/core/testing\";\nimport { Theme } from \"../../ic-theme\";\nimport * as helpers from \"../../../../utils/helpers\";\nimport {\n BLACK_MIN_COLOR_BRIGHTNESS,\n WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../../../utils/constants\";\n\n//mocked as ~~getThemeColorBrightness~~ is NaN when run in test context\n//instead we return a value which will trigger the console warning about theme color contrast\nconst mockThemeColorContrastFail = () => {\n const func = jest.fn(() => {\n return (BLACK_MIN_COLOR_BRIGHTNESS + WHITE_MAX_COLOR_BRIGHTNESS) / 2;\n });\n\n Object.defineProperty(helpers, \"~~getThemeColorBrightness~~\", {\n value: func,\n });\n};\n\nconst expectRGBToBe = (\n page: SpecPage,\n expectR: string,\n expectG: string,\n expectB: string\n) => {\n const r = page.doc.documentElement.style.getPropertyValue(\n \"--ic-~~theme~~-primary-r\"\n );\n const g = page.doc.documentElement.style.getPropertyValue(\n \"--ic-~~theme~~-primary-g\"\n );\n const b = page.doc.documentElement.style.getPropertyValue(\n \"--ic-~~theme~~-primary-b\"\n );\n\n expect(r).toBe(expectR);\n expect(g).toBe(expectG);\n expect(b).toBe(expectB);\n};\n\nbeforeAll(() => {\n jest.spyOn(console, \"warn\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-theme\", () => {\n it(\"should set theme colour with hex\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme color=\"#FFC0CB\"></ic-theme>`,\n });\n\n expectRGBToBe(page, \"255\", \"192\", \"203\");\n });\n\n it(\"should set theme colour with 3 character hex\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme color=\"#FFF\"></ic-theme>`,\n });\n\n expectRGBToBe(page, \"255\", \"255\", \"255\");\n });\n\n it(\"should set theme colour with rgb\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme color=\"rgb(159, 43, 104)\"></ic-theme>`,\n });\n\n expectRGBToBe(page, \"159\", \"43\", \"104\");\n });\n\n it(\"should set theme colour with rgba\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme color=\"rgba(159, 43, 104, 1)\"></ic-theme>`,\n });\n expectRGBToBe(page, \"159\", \"43\", \"104\");\n });\n\n it(\"should test updating theme color\", async () => {\n mockThemeColorContrastFail();\n\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme color=\"rgba(159, 43, 104)\"></ic-theme>`,\n });\n\n page.root.~~color~~ = \"rgba(133, 133, 133, 1)\";\n await page.waitForChanges();\n\n expectRGBToBe(page, \"133\", \"133\", \"133\");\n });\n\n it(\"should test 'theme' prop\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme theme=\"dark\"></ic-theme>`,\n });\n\n expect(page.root).toHaveClass(\"ic-theme-dark\");\n\n page.root.theme = \"light\";\n\n await page.waitForChanges();\n\n expect(page.root).toHaveClass(\"ic-theme-light\");\n\n page.root.theme = \"system\";\n\n await page.waitForChanges();\n\n expect(page.root).toHaveClass(\"ic-theme-light\");\n });\n});\n"]}
1	+ {"version":3,"file":"ic-theme.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-theme/test/basic/ic-theme.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage, SpecPage } from \"@stencil/core/testing\";\nimport { Theme } from \"../../ic-theme\";\nimport * as helpers from \"../../../../utils/helpers\";\nimport {\n BLACK_MIN_COLOR_BRIGHTNESS,\n WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../../../utils/constants\";\n\n//mocked as getBrandColorBrightness is NaN when run in test context\n//instead we return a value which will trigger the console warning about theme color contrast\nconst mockThemeColorContrastFail = () => {\n const func = jest.fn(() => {\n return (BLACK_MIN_COLOR_BRIGHTNESS + WHITE_MAX_COLOR_BRIGHTNESS) / 2;\n });\n\n Object.defineProperty(helpers, \"getBrandColorBrightness\", {\n value: func,\n });\n};\n\nconst expectRGBToBe = (\n page: SpecPage,\n expectR: string,\n expectG: string,\n expectB: string\n) => {\n const r = page.doc.documentElement.style.getPropertyValue(\n \"--ic-brand-color-primary-r\"\n );\n const g = page.doc.documentElement.style.getPropertyValue(\n \"--ic-brand-color-primary-g\"\n );\n const b = page.doc.documentElement.style.getPropertyValue(\n \"--ic-brand-color-primary-b\"\n );\n\n expect(r).toBe(expectR);\n expect(g).toBe(expectG);\n expect(b).toBe(expectB);\n};\n\nbeforeAll(() => {\n jest.spyOn(console, \"warn\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-theme\", () => {\n it(\"should set theme colour with hex\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme brand-color=\"#FFC0CB\"></ic-theme>`,\n });\n\n expectRGBToBe(page, \"255\", \"192\", \"203\");\n });\n\n it(\"should set theme colour with 3 character hex\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme brand-color=\"#FFF\"></ic-theme>`,\n });\n\n expectRGBToBe(page, \"255\", \"255\", \"255\");\n });\n\n it(\"should set theme colour with rgb\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme brand-color=\"rgb(159, 43, 104)\"></ic-theme>`,\n });\n\n expectRGBToBe(page, \"159\", \"43\", \"104\");\n });\n\n it(\"should set theme colour with rgba\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme brand-color=\"rgba(159, 43, 104, 1)\"></ic-theme>`,\n });\n expectRGBToBe(page, \"159\", \"43\", \"104\");\n });\n\n it(\"should test updating theme color\", async () => {\n mockThemeColorContrastFail();\n\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme brand-color=\"rgba(159, 43, 104)\"></ic-theme>`,\n });\n\n page.root.brandColor = \"rgba(133, 133, 133, 1)\";\n await page.waitForChanges();\n\n expectRGBToBe(page, \"133\", \"133\", \"133\");\n });\n\n it(\"should test 'theme' prop\", async () => {\n const page = await newSpecPage({\n components: [Theme],\n html: `<ic-theme theme=\"dark\"></ic-theme>`,\n });\n\n expect(page.root).toHaveClass(\"ic-theme-dark\");\n\n page.root.theme = \"light\";\n\n await page.waitForChanges();\n\n expect(page.root).toHaveClass(\"ic-theme-light\");\n\n page.root.theme = \"system\";\n\n await page.waitForChanges();\n\n expect(page.root).toHaveClass(\"ic-theme-light\");\n });\n});\n"]}

package/dist/collection/components/ic-toggle-button/ic-toggle-button.js CHANGED Viewed

@@ -28,6 +28,9 @@ export class ToggleButton {
         this.theme = "inherit";
         this.variant = "default";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse(this.disabled, this.el);
+    }
     componentWillLoad() {
         removeDisabledFalse(this.disabled, this.el);
         const parentIconPlacement = this.el.parentElement.iconPlacement;
@@ -304,6 +307,12 @@ export class ToggleButton {
             }];
     }
     static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "disabled",
+                "methodName": "watchDisabledHandler"
+            }];
+    }
     static get listeners() {
         return [{
                 "name": "click",

package/dist/collection/components/ic-toggle-button/ic-toggle-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-toggle-button.js","sourceRoot":"","sources":["../../../src/components/ic-toggle-button/ic-toggle-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,KAAK,EAEL,MAAM,EACN,CAAC,~~GACF~~,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,UAAU,EACV,gCAAgC,EAChC,mBAAmB,GACpB,MAAM,qBAAqB,CAAC;AAG7B;;;GAGG;AASH,MAAM,OAAO,YAAY;;~~QAiGf~~,gBAAW,GAAG,CAAC,EAAc,EAAE,EAAE;YACvC,EAAE,CAAC,wBAAwB,EAAE,CAAC;QAChC,CAAC,CAAC;QAEM,gBAAW,GAAG,GAAS,EAAE;YAC/B,CAAC,IAAI,CAAC,OAAO;gBACX,CAAC,IAAI,CAAC,QAAQ;gBACd,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;oBACxB,OAAO,EAAE,IAAI,CAAC,OAAO;iBACtB,CAAC,CAAC;QACP,CAAC,CAAC;;~~uBA9FyD~~,KAAK;wBAKnC,KAAK;~~yBAKJ~~,KAAK;;;uBAeP,KAAK;0BAKF,KAAK;oBAKX,QAAQ;qBAKH,SAAS;uBAKgB,SAAS;;~~IAShE~~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","sourcesContent":["import {\n Component,\n Element,\n Host,\n Prop,\n Event,\n EventEmitter,\n Listen,\n h,\n} from \"@stencil/core\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\n\n/*\n @slot icon - Content will be displayed alongside the toggle button label.\n * @slot badge - Badge component overlaying the top right of the toggle button.\n /\n\n@Component({\n tag: \"ic-toggle-button\",\n styleUrl: \"ic-toggle-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class ToggleButton {\n private iconPosition: \"left\" \| \"right\" \| \"top\";\n\n @Element() el: HTMLIcToggleButtonElement;\n\n /\n The accessible label that will be applied to the toggle button. This is required for the icon variant of toggle buttons.\n /\n @Prop() accessibleLabel?: string;\n\n /\n If `true`, the toggle button will be in a checked state.\n /\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /\n If `true`, the toggle button will be in disabled state.\n /\n @Prop() disabled?: boolean = false;\n\n /\n If `true`, the toggle button will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n The placement of the icon in relation to the toggle button label.\n /\n @Prop() iconPlacement?: \"left\" \| \"right\" \| \"top\";\n\n /\n The label to display in the toggle button. This is required for the default variant of toggle buttons.\n /\n @Prop() label?: string;\n\n /\n If `true`, the toggle button will be in loading state.\n /\n @Prop() loading?: boolean = false;\n\n /\n If `true`, the toggle button will display as black in the light theme, and white in dark theme.\n /\n @Prop() monochrome?: boolean = false;\n\n /\n The size of the toggle button to be displayed.\n /\n @Prop() size?: IcSizes = \"medium\";\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /\n The variant of the toggle button.\n /\n @Prop({ reflect: true }) variant: \"default\" \| \"icon\" = \"default\";\n\n /\n Emitted when the user clicks a toggle button.\n */\n @Event() icToggleChecked: EventEmitter<{\n checked: boolean;\n }>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n const parentIconPlacement = (\n this.el.parentElement as HTMLIcToggleButtonGroupElement\n ).iconPlacement;\n this.iconPosition = this.iconPlacement \|\| parentIconPlacement \|\| \"left\";\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n {\n prop: this.variant === \"icon\" ? this.accessibleLabel : this.label,\n propName: this.variant === \"icon\" ? \"accessible-label\" : \"label\",\n },\n ],\n \"Toggle button\"\n );\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n } else if (!this.loading) {\n this.checked = !this.checked;\n }\n }\n\n private handleFocus = (ev: FocusEvent) => {\n ev.stopImmediatePropagation();\n };\n\n private handleClick = (): void => {\n !this.loading &&\n !this.disabled &&\n this.icToggleChecked.emit({\n checked: this.checked,\n });\n };\n\n render() {\n return (\n <Host\n class={{\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n [\"ic-toggle-button-disabled\"]: this.disabled,\n [\"ic-toggle-button-checked\"]: this.checked,\n [\"ic-toggle-button-icon\"]: this.variant === \"icon\",\n [`ic-toggle-button-${this.size}`]: true,\n [\"ic-toggle-button-loading\"]: this.loading,\n [\"ic-toggle-button-monochrome\"]: this.monochrome,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n }}\n onFocus={this.handleFocus}\n >\n <ic-button\n aria-pressed={this.checked.toString()}\n variant={this.variant === \"icon\" ? \"icon\" : \"secondary\"}\n onClick={this.handleClick}\n title={this.accessibleLabel}\n aria-label={`${\n this.accessibleLabel ? this.accessibleLabel : this.label\n }, ${this.checked ? \"ticked\" : \"unticked\"}`}\n disabled={this.disabled}\n size={this.size}\n fullWidth={this.fullWidth}\n loading={this.loading}\n aria-disabled={`${this.disabled}`}\n >\n {this.variant !== \"icon\" && this.label}\n <slot />\n {isSlotUsed(this.el, \"icon\") && (\n <slot name=\"icon\" slot={`${this.iconPosition}-icon`}></slot>\n )}\n {isSlotUsed(this.el, \"badge\") && (\n <slot name=\"badge\" slot=\"badge\"></slot>\n )}\n </ic-button>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-toggle-button.js","sourceRoot":"","sources":["../../../src/components/ic-toggle-button/ic-toggle-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Host,\n Prop,\n Event,\n EventEmitter,\n Listen,\n h,\n Watch,\n} from \"@stencil/core\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\n\n/*\n @slot icon - Content will be displayed alongside the toggle button label.\n * @slot badge - Badge component overlaying the top right of the toggle button.\n /\n\n@Component({\n tag: \"ic-toggle-button\",\n styleUrl: \"ic-toggle-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class ToggleButton {\n private iconPosition: \"left\" \| \"right\" \| \"top\";\n\n @Element() el: HTMLIcToggleButtonElement;\n\n /\n The accessible label that will be applied to the toggle button. This is required for the icon variant of toggle buttons.\n /\n @Prop() accessibleLabel?: string;\n\n /\n If `true`, the toggle button will be in a checked state.\n /\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n /\n If `true`, the toggle button will be in disabled state.\n /\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the toggle button will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n The placement of the icon in relation to the toggle button label.\n /\n @Prop() iconPlacement?: \"left\" \| \"right\" \| \"top\";\n\n /\n The label to display in the toggle button. This is required for the default variant of toggle buttons.\n /\n @Prop() label?: string;\n\n /\n If `true`, the toggle button will be in loading state.\n /\n @Prop() loading?: boolean = false;\n\n /\n If `true`, the toggle button will display as black in the light theme, and white in dark theme.\n /\n @Prop() monochrome?: boolean = false;\n\n /\n The size of the toggle button to be displayed.\n /\n @Prop() size?: IcSizes = \"medium\";\n\n /\n Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /\n The variant of the toggle button.\n /\n @Prop({ reflect: true }) variant: \"default\" \| \"icon\" = \"default\";\n\n /\n Emitted when the user clicks a toggle button.\n */\n @Event() icToggleChecked: EventEmitter<{\n checked: boolean;\n }>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n const parentIconPlacement = (\n this.el.parentElement as HTMLIcToggleButtonGroupElement\n ).iconPlacement;\n this.iconPosition = this.iconPlacement \|\| parentIconPlacement \|\| \"left\";\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n {\n prop: this.variant === \"icon\" ? this.accessibleLabel : this.label,\n propName: this.variant === \"icon\" ? \"accessible-label\" : \"label\",\n },\n ],\n \"Toggle button\"\n );\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n } else if (!this.loading) {\n this.checked = !this.checked;\n }\n }\n\n private handleFocus = (ev: FocusEvent) => {\n ev.stopImmediatePropagation();\n };\n\n private handleClick = (): void => {\n !this.loading &&\n !this.disabled &&\n this.icToggleChecked.emit({\n checked: this.checked,\n });\n };\n\n render() {\n return (\n <Host\n class={{\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n [\"ic-toggle-button-disabled\"]: this.disabled,\n [\"ic-toggle-button-checked\"]: this.checked,\n [\"ic-toggle-button-icon\"]: this.variant === \"icon\",\n [`ic-toggle-button-${this.size}`]: true,\n [\"ic-toggle-button-loading\"]: this.loading,\n [\"ic-toggle-button-monochrome\"]: this.monochrome,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n }}\n onFocus={this.handleFocus}\n >\n <ic-button\n aria-pressed={this.checked.toString()}\n variant={this.variant === \"icon\" ? \"icon\" : \"secondary\"}\n onClick={this.handleClick}\n title={this.accessibleLabel}\n aria-label={`${\n this.accessibleLabel ? this.accessibleLabel : this.label\n }, ${this.checked ? \"ticked\" : \"unticked\"}`}\n disabled={this.disabled}\n size={this.size}\n fullWidth={this.fullWidth}\n loading={this.loading}\n aria-disabled={`${this.disabled}`}\n >\n {this.variant !== \"icon\" && this.label}\n <slot />\n {isSlotUsed(this.el, \"icon\") && (\n <slot name=\"icon\" slot={`${this.iconPosition}-icon`}></slot>\n )}\n {isSlotUsed(this.el, \"badge\") && (\n <slot name=\"badge\" slot=\"badge\"></slot>\n )}\n </ic-button>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ic-toggle-button/test/basic/ic-toggle-button.spec.js CHANGED Viewed

@@ -79,6 +79,16 @@ describe("ic-toggle-button component", () => {
         });
         expect(page.root).toMatchSnapshot();
     });
+    it("should render disabled", async () => {
+        const page = await newSpecPage({
+            components: [ToggleButton],
+            html: `<ic-toggle-button label="Toggle" disabled></ic-toggle-button>`,
+        });
+        expect(page.root).toMatchSnapshot();
+        page.rootInstance.disabled = false;
+        await page.waitForChanges();
+        expect(page.root).toMatchSnapshot("disabled-removed");
+    });
     it("should update checked value on click", async () => {
         const page = await newSpecPage({
             components: [ToggleButton],

package/dist/collection/components/ic-toggle-button/test/basic/ic-toggle-button.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-toggle-button.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-toggle-button/test/basic/ic-toggle-button.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { ToggleButton } from \"../../ic-toggle-button\";\n\ndescribe(\"ic-toggle-button component\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\"></ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render icon variant\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button variant=\"icon\" accessible-label=\"Refresh the page\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path\n d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"\n />\n </svg>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render slotted icon\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path\n d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"\n />\n </svg>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render slotted icon with icon placement\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" icon-placement=\"right\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path\n d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"\n />\n </svg>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render slotted badge\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\">\n <ic-badge label=\"1\" slot=\"badge\" variant=\"success\"></ic-badge>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should update checked value on click\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" id='test-button' onclick='alert('test')'></ic-toggle-button>`,\n });\n\n expect(page.rootInstance.checked).toBeFalsy();\n\n const element = document.getElementById(\"test-button\");\n\n element.click();\n\n await page.waitForChanges();\n\n expect(page.rootInstance.checked).toBeTruthy();\n });\n\n it(\"should emit icToggleChecked on click\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" id='test-button' onclick='alert('test')'></ic-toggle-button>`,\n });\n\n const eventSpy = jest.fn();\n\n page.win.addEventListener(\"icToggleChecked\", eventSpy);\n\n page.rootInstance.handleClick();\n\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should stop immediate propagation of a click event when disabled\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" id='test-button' disabled=true onclick='alert('test')'></ic-toggle-button>`,\n });\n\n jest.spyOn(window, \"alert\").mockImplementation();\n\n const element = document.getElementById(\"test-button\");\n\n element.click();\n\n await page.waitForChanges();\n\n expect(window.alert).not.toHaveBeenCalled;\n });\n});\n"]}
1	+ {"version":3,"file":"ic-toggle-button.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-toggle-button/test/basic/ic-toggle-button.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { ToggleButton } from \"../../ic-toggle-button\";\n\ndescribe(\"ic-toggle-button component\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\"></ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render icon variant\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button variant=\"icon\" accessible-label=\"Refresh the page\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path\n d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"\n />\n </svg>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render slotted icon\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path\n d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"\n />\n </svg>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render slotted icon with icon placement\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" icon-placement=\"right\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path\n d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"\n />\n </svg>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render slotted badge\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\">\n <ic-badge label=\"1\" slot=\"badge\" variant=\"success\"></ic-badge>\n </ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render disabled\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" disabled></ic-toggle-button>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n page.rootInstance.disabled = false;\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot(\"disabled-removed\");\n });\n\n it(\"should update checked value on click\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" id='test-button' onclick='alert('test')'></ic-toggle-button>`,\n });\n\n expect(page.rootInstance.checked).toBeFalsy();\n\n const element = document.getElementById(\"test-button\");\n\n element.click();\n\n await page.waitForChanges();\n\n expect(page.rootInstance.checked).toBeTruthy();\n });\n\n it(\"should emit icToggleChecked on click\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" id='test-button' onclick='alert('test')'></ic-toggle-button>`,\n });\n\n const eventSpy = jest.fn();\n\n page.win.addEventListener(\"icToggleChecked\", eventSpy);\n\n page.rootInstance.handleClick();\n\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should stop immediate propagation of a click event when disabled\", async () => {\n const page = await newSpecPage({\n components: [ToggleButton],\n html: `<ic-toggle-button label=\"Toggle\" id='test-button' disabled=true onclick='alert('test')'></ic-toggle-button>`,\n });\n\n jest.spyOn(window, \"alert\").mockImplementation();\n\n const element = document.getElementById(\"test-button\");\n\n element.click();\n\n await page.waitForChanges();\n\n expect(window.alert).not.toHaveBeenCalled;\n });\n});\n"]}