npm - @nanoporetech-digital/components - Versions diffs - 1.15.6 → 2.0.0 - Mend

@nanoporetech-digital/components 1.15.6 → 2.0.0

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

Files changed (981) hide show

package/dist/collection/components/datalist/datalist.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"datalist.js","sourceRoot":"","sources":["../../../src/components/datalist/datalist.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAET,CAAC,EACD,IAAI,EACJ,OAAO,EACP,KAAK,EACL,KAAK,EACL,IAAI,EACJ,KAAK,EAEL,SAAS,EACT,KAAK,EACL,WAAW,GACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAI5C,SAAS,SAAS,CAAC,QAAiB;EAClC,IAAI,UAA4B,CAAC;EAEjC,IAAI,QAAQ,CAAC,EAAE,EAAE;IACf,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,cAAc,QAAQ,CAAC,EAAE,IAAI,CAAC,CAAC;GACpE;EACD,IAAI,CAAC,UAAU,EAAE;IACf,UAAU,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;GACxC;EACD,OAAO,UAAU,CAAC;AACpB,CAAC;AAED,IAAI,OAAO,GAAG,CAAC,CAAC;AAEhB;;;;;;;;;;GAUG;AAMH,MAAM,OAAO,QAAQ;EA4CnB;IA3CA,gBAAgB;IAER,gBAAW,GAAG,KAAK,CAAC;IACpB,iBAAY,GAAG,EAAE,CAAC;IAE1B,iCAAiC;IACzB,eAAU,GAA4B,EAAE,CAAC;IAIzC,WAAM,GAAG,iBAAiB,OAAO,EAAE,EAAE,CAAC;IACtC,eAAU,GAAG,KAAK,CAAC;IAmBnB,gBAAW,GAA4B,EAAE,CAAC;IAIlD,0CAA0C;IACjC,gBAAW,GAA4B,EAAE,CAAC;IAK1C,YAAO,GAAY,IAAI,CAAC;IACxB,cAAS,GAAa,EAAE,CAAC;IAMlC,aAAa;IAEb;+EAC2E;IAClD,aAAQ,GAAa,EAAE,CAAC;IAUzC,oBAAe,GAAsB;MAC3C,QAAQ,EAAE,CAAC,CAAC;KACb,CAAC;IAEF;kHAC8G;IACtG,YAAO,GAAuB,EAAE,CAAC;IAKzC;;OAEG;IACK,SAAI,GAAsC,OAAO,CAAC;IAQ1D,0BAA0B;IACD,SAAI,GAAY,KAAK,CAAC;IAU/C;;OAEG;IACK,kBAAa,GAAG,KAAK,CAAC;IAE9B,iDAAiD;IACzC,aAAQ,GAAG,KAAK,CAAC;IAyOzB,+BAA+B;IACvB,gBAAW,GAAG,CAAC,CAAqC,EAAE,EAAE;MAC9D,CAAC,CAAC,eAAe,EAAE,CAAC;MACpB,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;MAChC,GAAG,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;MAE9B,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ;QAAE,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IACtD,CAAC,CAAC;IAkCF,4EAA4E;IACpE,eAAU,GAAG,KAAK,IAAI,EAAE;MAC9B,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ;QAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC;IACtD,CAAC,CAAC;IA8CM,eAAU,GAAG,GAAG,EAAE;MACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;MACvB,4BAA4B;MAC5B,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC,CAAC;IAEM,iBAAY,GAAG,CAAC,CAAgB,EAAE,EAAE;MAC1C,MAAM,UAAU,GAAG;QACjB,OAAO;QACP,YAAY;QACZ,WAAW;QACX,QAAQ;QACR,OAAO;QACP,KAAK;OACN,CAAC;MACF,IAAI,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;QAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK;UAAE,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC7C,OAAO;OACR;MAED,qEAAqE;MACrE,IACE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACtB,CAAC,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC;QACzC,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,IAAI,CAAC,mBAAmB,CAAC,EAC3C;QACA,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;UAC/C,YAAY,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;UACvC,IAAI,CAAC,mBAAmB,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YAChD,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC;YACvB,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC;UAC/B,CAAC,EAAE,GAAG,CAAC,CAAC;UACR,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,GAAG,CAAC;UAC3B,IAAI,CAAC,gBAAgB,EAAE,CAAC;SACzB;QACD,OAAO;OACR;MACD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;MACvB,4BAA4B;MAC5B,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC,CAAC;IAEF,8CAA8C;IAC9C,8DAA8D;IACtD,kBAAa,GAAG,CACtB,CAAoD,EACpD,EAAE;MACF,MAAM,UAAU,GAAG;QACjB,OAAO;QACP,SAAS;QACT,WAAW;QACX,QAAQ;QACR,OAAO;QACP,KAAK;QACL,OAAO;QACP,GAAG;OACJ,CAAC;MACF,IAAI,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;QAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;UAAE,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC;QACpD,OAAO;OACR;MAED,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;MAC3C,yDAAyD;MACzD,IACE,IAAI,CAAC,IAAI,KAAK,QAAQ;QACtB,CAAC,CAAC,IAAI,CAAC,UAAU,IAAI,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,EAChD;QACA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC;OAC7B;IACH,CAAC,CAAC;IAjcA,IAAI,CAAC,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;EAC/D,CAAC;EAjCD,6DAA6D;EAC7D,uCAAuC;EACvC,IAAY,UAAU;IACpB,OAAO,IAAI,CAAC,WAAW,CAAC;EAC1B,CAAC;EACD,IAAY,UAAU,CAAC,IAAI;;IACzB,iEAAiE;IACjE,yDAAyD;IACzD,+BAA+B;IAC/B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IACxB,IAAI,MAAA,IAAI,CAAC,cAAc,0CAAE,KAAK;MAAE,OAAO;IAEvC,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;MACnB,IAAI,GAAG,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;QACtD,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;OAC5B;IACH,CAAC,CAAC,CAAC;EACL,CAAC;EAwBD,iFAAiF;EACjF,IACI,cAAc;IAChB,OAAO,IAAI,CAAC,eAAe,CAAC;EAC9B,CAAC;EACD,IAAI,cAAc,CAAC,GAAsB;IACvC,IAAI,CAAC,eAAe,mCAAQ,IAAI,CAAC,eAAe,GAAK,GAAG,CAAE,CAAC;EAC7D,CAAC;EAiBD,gGAAgG;EAChG,IACI,aAAa;IACf,OAAO,IAAI,CAAC,UAAU,CAAC;EACzB,CAAC;EAMD,WAAW;IACT,SAAS,CAAC,GAAG,EAAE;MACb,IAAI,CAAC,YAAY,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;MACnC,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC1E,CAAC,CAAC,CAAC;EACL,CAAC;EAUD,wBAAwB;EAGxB,KAAK,CAAC,gBAAgB;IACpB,IAAI,SAAS,CAAC;IACd,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,EAAE;MACjD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;MACxB,IAAI,CAAC,cAAc,GAAG,MAAM,SAAS,CAAC,eAAe,EAAE,CAAC;KACzD;SAAM,IACL,IAAI,CAAC,KAAK;MACV,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;MAC9B,CAAC,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAChD;MACA,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;MACzB,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;KACjC;SAAM,IAAI,IAAI,CAAC,KAAK,YAAY,WAAW,EAAE;MAC5C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC;KAClC;EACH,CAAC;EAGD,wBAAwB;;IACtB,IAAI,CAAC,IAAI,CAAC,IAAI;MAAE,OAAO;IAEvB,2CAA2C;IAC3C,IAAI,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE;MACvD,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE,CAC9C,IAAI,CAAC,qBAAqB,EAAE,CAC7B,CAAC,CAAC;QACH,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;OAC3D;MACD,IAAI,CAAC,qBAAqB,EAAE,CAAC;MAC7B,OAAO;KACR;IAED,2CAA2C;IAC3C,IAAI,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,EAAE;MACxB,IAAI,CAAC,CAAC,IAAI,CAAC,EAAE,EAAE;QACb,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;QACrB,IAAI,CAAC,EAAE,GAAG,SAAS,CAAC;OACrB;MACD,UAAU,CAAC,GAAG,EAAE;;QACd,IAAI,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,KAAK,CAAC,MAAM,KAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;UAC/D,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;;UAAM,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC;MACjD,CAAC,EAAE,EAAE,CAAC,CAAC;KACR;IAED,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACzB,CAAC;EAID,eAAe;IACb,IAAI,CAAC,IAAI,CAAC,cAAc;MAAE,OAAO;IAEjC,IAAI,QAAQ,GAAsB,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC;IAC3D,IAAI,gBAAgB,GAAoB,MAAM,CAAC;IAC/C,IAAI,QAAQ,GAAG,KAAK,CAAC;IAErB,QAAQ,IAAI,CAAC,IAAI,EAAE;MACjB,KAAK,YAAY;QACf,kCAAkC;QAClC,MAAM;MACR,KAAK,QAAQ;QACX,gBAAgB,GAAG,MAAM,CAAC;QAC1B,QAAQ,GAAG,IAAI,CAAC;QAChB,MAAM;KACT;IAED,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;MACrB,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC;KACzC;IAED,IAAI,CAAC,cAAc,mCAAQ,IAAI,CAAC,cAAc,GAAK,QAAQ,CAAE,CAAC;IAC9D,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;IACxE,IAAI,CAAC,cAAc,CAAC,QAAQ,GAAG,QAAQ,CAAC;EAC1C,CAAC;EAGD,iBAAiB,CAAC,QAA2B,EAAE,QAA2B;;IACxE,IAAI,CAAC,CAAC,QAAQ,EAAE;MACd,MAAM,SAAS,GAAG,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;MACjD,IAAI,SAAS,EAAE;QACb,SAAS,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;OAC/D;MACD,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;MACzD,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;MACvD,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;MAC3D,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;MAExD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;MAEvB,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QACjC,QAAQ,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;QAC1C,QAAQ,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;QAC1C,QAAQ,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;QACtC,QAAQ,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;QAC1C,QAAQ,CAAC,eAAe,CAAC,mBAAmB,CAAC,CAAC;QAC9C,QAAQ,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;MAC3C,CAAC,CAAC,CAAC;KACJ;IACD,IAAI,CAAC,CAAC,QAAQ,EAAE;MACd,MAAM,SAAS,GAAG,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;MACjD,IAAI,SAAS,EAAE;QACb,SAAS,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;OAC5D;MACD,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;MACtD,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;MACpD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;MACxD,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;MACrD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,MAAM,CAAC;MAE1C,IAAI,CAAC,UAAU,GAAG,CAAA,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,0CAAE,IAAI,CAAC,CAAC,CAAC,KAAI,SAAS,CAAC,QAAQ,CAAC,CAAC;MAEnE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC;QAC3B,QAAQ,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QAC1C,QAAQ,CAAC,YAAY,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;QAChD,QAAQ,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACpD,QAAQ,CAAC,YAAY,CAAC,WAAW,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAChD,QAAQ,CAAC,YAAY,CAAC,eAAe,EAAE,SAAS,CAAC,CAAC;QAClD,QAAQ,CAAC,YAAY,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC;MAC/C,CAAC,CAAC,CAAC;KACJ;EACH,CAAC;EAID,kBAAkB;;IAChB,IAAI,CAAC,GAAG,CAAC,CAAC;IACV,MAAM,GAAG,GAAG,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,KAAK,KAAI,EAAE,CAAC;IAC7C,MAAM,MAAM,GAAG,EAAE,CAAC;IAElB,SAAS,CAAC,GAAG,EAAE;MACb,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE;QACjC,IAAI,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;UAClC,CAAC,EAAE,CAAC;UACJ,GAAG,CAAC,YAAY,CAAC,eAAe,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC;UAC1C,GAAG,CAAC,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;UAC/D,GAAG,CAAC,MAAM,GAAG,KAAK,CAAC;UACnB,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;SAC3B;aAAM;UACL,GAAG,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;UACrC,GAAG,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;UACpC,GAAG,CAAC,MAAM,GAAG,IAAI,CAAC;UAClB,GAAG,CAAC,QAAQ,GAAG,KAAK,CAAC;SACtB;QACD,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,GAAG,UAAU,GAAG,CAAC,CAAC;QACtC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;MACtB,CAAC,CAAC,CAAC;MACH,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC;IAC1B,CAAC,CAAC,CAAC;EACL,CAAC;EAID,aAAa;IACX,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM,IAAI,IAAI,CAAC,WAAW;MAAE,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;;MAChE,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;EAC5B,CAAC;EAED;;KAEG;EAGH,qBAAqB;IACnB,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ;MAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACxE,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;EAC3D,CAAC;EAGD,mBAAmB;IACjB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;EACjD,CAAC;EAaD,gBAAgB;EAER,UAAU,CAAC,GAA0B,EAAE,GAAW;IACxD,IAAI,GAAG,KAAK,GAAG,CAAC,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;MAC1D,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC;KACrB;;MAAM,GAAG,CAAC,QAAQ,GAAG,KAAK,CAAC;EAC9B,CAAC;EAED,IAAY,aAAa;IACvB,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,IAAI;MAAE,OAAO,KAAK,CAAC;IACnD,OAAO,IAAI,CAAC;EACd,CAAC;EAED,IAAY,UAAU;IACpB,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,CACzB,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,KAAK,GAAG,CAAC,KAAK,CACjD,CAAC;EACJ,CAAC;EAED,8EAA8E;EACtE,gBAAgB,CAAC,GAA0B;;IACjD,IAAI,YAAY,CAAC;IAEjB,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;MACrC,kBAAkB;MAClB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC;MACjE,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAC5C;SAAM;MACL,oBAAoB;MACpB,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;MACnC,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KAC1C;IAED,IAAI,CAAC,YAAY,CAAC,gBAAgB,EAAE;MAClC,IAAI,IAAI,CAAC,cAAc;QAAE,IAAI,CAAC,cAAc,CAAC,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC;MAE/D,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;MACzC,MAAA,IAAI,CAAC,cAAc,0CAAE,aAAa,CAAC,KAAK,CAAC,CAAC;KAC3C;EACH,CAAC;EAWD,kCAAkC;EAClC,wGAAwG;EAChG,gBAAgB;IACtB,MAAM,QAAQ,GAAG,CAAC,MAAc,EAAE,EAAE,CAClC,MAAM,CAAC,WAAW,EAAE,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;MAC3D,IAAI,CAAC,YAAY,CAAC;IAEpB,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CACnC,CAAC,GAAG,EAAE,EAAE,CACN,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC;MAC3B,CAAC,GAAG,CAAC,QAAQ;MACb,CAAC,QAAQ,CAAC,GAAG,CAAC,WAAW,CAAC;QACxB,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;QACnB,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;QACnB,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAC9B,CAAC;IACF,IAAI,QAAQ;MAAE,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;EAChD,CAAC;EAED,iBAAiB;EAET,qBAAqB;IAC3B,GAAG,CAAC,GAAG,EAAE;;MACP,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC,CAAC;MACxE,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;MAEnE,IAAI,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,KAAK,CAAC,MAAM,KAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;QAC/D,IAAI,CAAC,WAAW,EAAE,CAAC;OACpB;;QAAM,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC;IAC5C,CAAC,CAAC,CAAC;EACL,CAAC;EAOD,kFAAkF;EAC1E,WAAW;IACjB,IAAI,IAAI,CAAC,aAAa,EAAE;MACtB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC;MACnC,OAAO;KACR;IAED,MAAM,GAAG,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;IACtC,MAAM,MAAM,GAAG,GAAG,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC;IAExC,IAAI,UAAU,GAAG,KAAK,CAAC;IACvB,MAAM,UAAU,GAAG,EAAE,CAAC;IACtB,MAAM,QAAQ,GAAG,CAAC,MAAc,EAAE,EAAE,CAClC,MAAM,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;IAE5C,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;MAC9B,IACE,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,IAAI,GAAG,KAAK,GAAG,CAAC,KAAK,CAAC;QACxC,IAAI,CAAC,IAAI,KAAK,YAAY,EAC1B;QACA,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC;QACpB,UAAU,GAAG,IAAI,CAAC;OACnB;;QAAM,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;IACnC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;MAC9B,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,UAAU,EAAE;QAChC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;OACtB;WAAM,IACL,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC;QAC3B,CAAC,GAAG,CAAC,QAAQ;QACb,CAAC,QAAQ,CAAC,GAAG,CAAC,WAAW,CAAC;UACxB,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;UACnB,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;UACnB,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,EAC3B;QACA,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;OACtB;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,MAAM,IAAI,CAAC,UAAU,CAAC;IAC/C,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC;EAChC,CAAC;EA0ED,sBAAsB;EAEtB,iBAAiB;IACf,IAAI,CAAC,gBAAgB,EAAE,CAAC;EAC1B,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,wBAAwB,EAAE,CAAC;IAChC,IAAI,CAAC,WAAW,EAAE,CAAC;EACrB,CAAC;EAED,kBAAkB;;IAChB,UAAU,CAAC,GAAG,EAAE;MACd,IAAI,CAAC,IAAI,CAAC,cAAc;QACtB,OAAO,CAAC,IAAI,CACV,2GAA2G,EAC3G,IAAI,CAAC,IAAI,CACV,CAAC;IACN,CAAC,EAAE,GAAG,CAAC,CAAC;IAER,sDAAsD;IACtD,0EAA0E;IAC1E,IAAI,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM;MAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;EAC9D,CAAC;EAED,MAAM;IACJ,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;IACrB,OAAO,CACL,EAAC,IAAI,IACH,IAAI,EAAC,SAAS,eACH,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,gBACxB,oCAAoC;MAE/C,qCACM,IAAI,CAAC,cAAc,IACvB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,EACrC,WAAW,EAAC,oCAAoC,EAChD,KAAK,EAAE;UACL,eAAe,EAAE,IAAI;UACrB,mBAAmB,EAAE,IAAI,CAAC,UAAU;SACrC,EACD,eAAe,EAAE,IAAI,CAAC,UAAU,EAChC,eAAe,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAE3C,iBACE,MAAM,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,EAChC,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAChE,KAAK,EAAE;YACL,WAAW,EAAE,IAAI;YACjB,mBAAmB,EAAE,IAAI,CAAC,aAAa;WACxC,EACD,QAAQ,EAAE,CAAC,CAAC,EACZ,YAAY,EAAE,IAAI,CAAC,WAAW,EAC9B,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;UAEhC,YAAM,IAAI,EAAC,UAAU,GAAG;UACvB,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,eAAQ;UAChC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CACxB,gBACG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC9B,IAAI,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,KAAK,EAAE;cAChC,OAAO,CACL,mBACE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,EACrC,GAAG,EAAE,MAAM,CAAC,KAAK,GAAG,CAAC,EACrB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,KAAK,EAAE,MAAM,CAAC,KAAK,mBACJ,CAAC,kBACF,IAAI,CAAC,OAAO,CAAC,MAAM,EACjC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,EAAE,EAAE,IAAI,CAAC,MAAM,GAAG,UAAU,GAAG,CAAC,IAE/B,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAC/B,CACf,CAAC;aACH;UACH,CAAC,CAAC,CACG,CACR;UACD,YAAM,IAAI,EAAC,aAAa,GAAG,CACjB;QACZ,iBACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,kBAAkB,EACxB,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,EACjC,KAAK,EAAE;YACL,WAAW,EAAE,IAAI;YACjB,mBAAmB,EAAE,IAAI,CAAC,aAAa;WACxC;UAED,YAAM,IAAI,EAAC,WAAW,GAAG,CACf;QACX,CAAC,CAAC,IAAI,CAAC,WAAW,IAAI,CACrB,wBAAe,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,eAAe;UACxD,IAAI,CAAC,WAAW,CAAC,MAAM;;UACvB,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;wBACnC,CACP,CACa,CACX,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n ComponentInterface,\n h,\n Host,\n Element,\n State,\n Watch,\n Prop,\n Event,\n EventEmitter,\n writeTask,\n Build,\n forceUpdate,\n} from '@stencil/core';\nimport { debounce, raf } from '../../utils';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type { OptionInterface } from '../../interface';\n\nfunction findLabel(formCtrl: Element) {\n let foundLabel: HTMLLabelElement;\n\n if (formCtrl.id) {\n foundLabel = document.querySelector(`label[for='${formCtrl.id}']`);\n }\n if (!foundLabel) {\n foundLabel = formCtrl.closest('label');\n }\n return foundLabel;\n}\n\nlet listIds = 0;\n\n/**\n * `nano-datalist` a visually consistent and more flexible replacement for a native\n * [datalist](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist). Can be nested within a `nano-input`\n * or linked to any input control via the `input` prop. Is used internally within `nano-select`.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using the `options` prop\n *\n * @slot - use `<nano-option>` elements for more complex html. Alternatively use the `options` prop\n * @slot list-top - shows at the top of the list when there are options present\n * @slot list-bottom - shows at the bottom of the list when there are options present\n * @slot no-result - shown when there are no results otherwise nothing will be shown\n */\n@Component({\n tag: 'nano-datalist',\n styleUrl: 'datalist.scss',\n shadow: true,\n})\nexport class DataList implements ComponentInterface {\n // Private State\n\n private isNanoInput = false;\n private typeToSelect = '';\n private typeToSelectTimeout: number;\n // options set via `options` prop\n private optionEles: HTMLNanoOptionElement[] = [];\n private nanoDropdown: HTMLNanoDropdownElement;\n private listBox: HTMLNanoMenuElement;\n private mo?: MutationObserver;\n private listId = `nano-datalist-${listIds++}`;\n private isFiltered = false;\n // all potential option eles. Set via slot or `options` prop.\n // Some may get hidden due to filtering\n private get allOptEles() {\n return this._allOptEles;\n }\n private set allOptEles(opts) {\n // when allOptEles are initially set (on slot change / options) -\n // add options to 'selected' and fire selected event *if*\n // value isn't set on the input\n this._allOptEles = opts;\n if (this.connectedInput?.value) return;\n\n opts.forEach((opt) => {\n if (opt.selected && !this.selected.includes(opt.value)) {\n this.changeInputValue(opt);\n }\n });\n }\n private _allOptEles: HTMLNanoOptionElement[] = [];\n\n @Element() host: HTMLNanoDatalistElement;\n\n // active option eles that are not hidden.\n @State() actvOptEles: HTMLNanoOptionElement[] = [];\n @State() connectedInput: HTMLInputElement | HTMLTextAreaElement;\n @State() inputLabel: HTMLLabelElement;\n @State() hasNoResult: boolean;\n @State() shouldOpen: boolean;\n @State() canOpen: boolean = true;\n @State() optionIds: string[] = [];\n\n constructor() {\n this.inputChange = debounce(this.inputChange.bind(this), 50);\n }\n\n // Public API\n\n /** By default, items in the list will appear 'selected' when the value in the linked input control matches.\n * However you can add other selected options via the the selected prop. */\n @Prop({ mutable: true }) selected: string[] = [];\n\n /** nano-dropdown config options you can pass to the nested dropdown component */\n @Prop()\n get dropDownConfig() {\n return this._dropDownConfig;\n }\n set dropDownConfig(ddc: Partial<Dropdown>) {\n this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n }\n private _dropDownConfig: Partial<Dropdown> = {\n skidding: -1,\n };\n\n /** Provide an option list.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using this prop */\n @Prop() options?: OptionInterface[] = [];\n\n /** A selector to a HTMLInputElement */\n @Prop() input?: string | HTMLInputElement;\n\n /** Tweaks the datalist behaviour and linked control semantics and behaviour.\n * e.g. 'select' will make the linked input control readonly.\n */\n @Prop() type: 'select' | 'selctMulti' | 'input' = 'input';\n\n /** return all the active options currently within the datalist. Can be useful for validation */\n @Prop()\n get activeOptions() {\n return this.allOptEles;\n }\n\n /** Force datalist open */\n @Prop({ mutable: true }) open: boolean = false;\n\n @Watch('open')\n openWatcher() {\n writeTask(() => {\n this.nanoDropdown.open = this.open;\n this.connectedInput.setAttribute('aria-expanded', this.open.toString());\n });\n }\n\n /** Use this option to disable to default filtering. This is useful if filtering happens\n * externally via another method (e.g. via ajax)\n */\n @Prop() disableFilter = false;\n\n /** Activate / deactivate the datalist control */\n @Prop() disabled = false;\n\n // State change watchers\n\n @Watch('input')\n async watchInputChange() {\n let nanoInput;\n if ((nanoInput = this.host.closest('nano-input'))) {\n this.isNanoInput = true;\n this.connectedInput = await nanoInput.getInputElement();\n } else if (\n this.input &&\n typeof this.input === 'string' &&\n (nanoInput = document.querySelector(this.input))\n ) {\n this.isNanoInput = false;\n this.connectedInput = nanoInput;\n } else if (this.input instanceof HTMLElement) {\n this.connectedInput = this.input;\n }\n }\n\n @Watch('options')\n manageSlotChangeListener() {\n if (!this.host) return;\n\n // we're not using `options` - setup new MO\n if ((!this.options || !this.options.length) && !this.mo) {\n if (Build.isBrowser) {\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.host, { childList: true, subtree: true });\n }\n this.processSlottedContent();\n return;\n }\n\n // we're using `options` - trash current MO\n if (this.options?.length) {\n if (!!this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n setTimeout(() => {\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = [...this.allOptEles];\n }, 50);\n }\n\n forceUpdate(this.host);\n }\n\n @Watch('type')\n @Watch('connectedInput')\n watchTypeChange() {\n if (!this.connectedInput) return;\n\n let dwConfig: Partial<Dropdown> = { closeOnSelect: false };\n let autocompleteType: 'list' | 'both' = 'both';\n let readonly = false;\n\n switch (this.type) {\n case 'selctMulti':\n // dwConfig.closeOnSelect = false;\n break;\n case 'select':\n autocompleteType = 'list';\n readonly = true;\n break;\n }\n\n if (!this.isNanoInput) {\n dwConfig.tetherTo = this.connectedInput;\n }\n\n this.dropDownConfig = { ...this.dropDownConfig, ...dwConfig };\n this.connectedInput.setAttribute('aria-autocomplete', autocompleteType);\n this.connectedInput.readOnly = readonly;\n }\n\n @Watch('connectedInput')\n manageInputEvents(newInput?: HTMLInputElement, oldInput?: HTMLInputElement) {\n if (!!oldInput) {\n const nanoInput = oldInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.removeEventListener('nanoChange', this.inputChange);\n }\n oldInput.removeEventListener('change', this.inputChange);\n oldInput.removeEventListener('click', this.inputClick);\n oldInput.removeEventListener('keydown', this.inputKeydown);\n oldInput.removeEventListener('input', this.inputChange);\n\n this.inputLabel = null;\n\n writeTask(() => {\n oldInput.removeAttribute('role');\n oldInput.removeAttribute('aria-expanded');\n oldInput.removeAttribute('aria-controls');\n oldInput.removeAttribute('aria-owns');\n oldInput.removeAttribute('aria-haspopup');\n oldInput.removeAttribute('aria-autocomplete');\n oldInput.removeAttribute('autocomplete');\n });\n }\n if (!!newInput) {\n const nanoInput = newInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.addEventListener('nanoChange', this.inputChange);\n }\n newInput.addEventListener('change', this.inputChange);\n newInput.addEventListener('click', this.inputClick);\n newInput.addEventListener('keydown', this.inputKeydown);\n newInput.addEventListener('input', this.inputChange);\n this.listId = this.host.id || this.listId;\n\n this.inputLabel = newInput?.labels?.item(0) || findLabel(newInput);\n\n writeTask(() => {\n this.host.id = this.listId;\n newInput.setAttribute('role', 'combobox');\n newInput.setAttribute('aria-expanded', 'false');\n newInput.setAttribute('aria-controls', this.listId);\n newInput.setAttribute('aria-owns', this.listId);\n newInput.setAttribute('aria-haspopup', 'listbox');\n newInput.setAttribute('autocomplete', 'off');\n });\n }\n }\n\n @Watch('selected')\n @Watch('actvOptEles')\n watchActvOptChange() {\n let c = 0;\n const val = this.connectedInput?.value || '';\n const optIds = [];\n\n writeTask(() => {\n this.allOptEles.forEach((opt, i) => {\n if (this.actvOptEles.includes(opt)) {\n c++;\n opt.setAttribute('aria-posinset', c + '');\n opt.setAttribute('aria-setsize', this.actvOptEles.length + '');\n opt.hidden = false;\n this.isSelected(opt, val);\n } else {\n opt.removeAttribute('aria-posinset');\n opt.removeAttribute('aria-setsize');\n opt.hidden = true;\n opt.selected = false;\n }\n opt.id = this.listId + '-option-' + i;\n optIds.push(opt.id);\n });\n this.optionIds = optIds;\n });\n }\n\n @Watch('actvOptEles')\n @Watch('hasNoResult')\n manageCanOpen() {\n if (this.actvOptEles.length || this.hasNoResult) this.canOpen = true;\n else this.canOpen = false;\n }\n\n /**\n * Opens the dropdown if it can, it should and there are items to display.\n */\n @Watch('shouldOpen')\n @Watch('canOpen')\n manageDropdownDisplay() {\n if (this.shouldOpen && this.canOpen && !this.disabled) this.open = true;\n if (!this.shouldOpen || !this.canOpen) this.open = false;\n }\n\n @Watch('actvOptEles')\n fireActiveOptsEvent() {\n this.nanoOptionsUpdated.emit(this.actvOptEles);\n }\n\n // Events\n\n /** Fired when an item is selected. */\n @Event() nanoSelect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when a currently selected item is reselected. */\n @Event() nanoDeselect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when active options change */\n @Event() nanoOptionsUpdated: EventEmitter<HTMLNanoOptionElement[]>;\n\n // Private logic\n\n private isSelected(opt: HTMLNanoOptionElement, val: string) {\n if (val === opt.value || this.selected.includes(opt.value)) {\n opt.selected = true;\n } else opt.selected = false;\n }\n\n private get dropwdownOpen() {\n if (!this.nanoDropdown || !this.open) return false;\n return true;\n }\n\n private get exactMatch() {\n return this.allOptEles.find(\n (opt) => this.connectedInput.value === opt.value\n );\n }\n\n /** reflect value back to the connected input unless the event is cancelled */\n private changeInputValue(opt: HTMLNanoOptionElement) {\n let nanoSelected;\n\n if (this.selected.includes(opt.value)) {\n // deselect option\n this.selected = this.selected.filter((val) => val !== opt.value);\n nanoSelected = this.nanoDeselect.emit(opt);\n } else {\n // select new option\n this.selected = [...this.selected];\n nanoSelected = this.nanoSelect.emit(opt);\n }\n\n if (!nanoSelected.defaultPrevented) {\n if (this.connectedInput) this.connectedInput.value = opt.value;\n\n const event = new window.Event('change');\n this.connectedInput?.dispatchEvent(event);\n }\n }\n\n // a new option has been picked\n private optSelected = (e: CustomEvent<HTMLNanoOptionElement>) => {\n e.stopPropagation();\n this.changeInputValue(e.detail);\n raf(() => this.inputChange());\n\n if (this.type === 'select') this.shouldOpen = false;\n };\n\n // this is for type=\"select\" only.\n // Filter options that start with text - aggregates letters (as opposed to getting the value from input)\n private setOptStartsWith() {\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().substring(0, this.typeToSelect.length) ===\n this.typeToSelect;\n\n const foundEle = this.allOptEles.find(\n (opt) =>\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n );\n if (foundEle) this.changeInputValue(foundEle);\n }\n\n // Event handlers\n\n private processSlottedContent() {\n raf(() => {\n this.allOptEles = Array.from(this.host.querySelectorAll('nano-option'));\n this.hasNoResult = !!this.host.querySelector('[slot=\"no-result\"]');\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = this.allOptEles;\n });\n }\n\n // sets focus immediately on open when 'select' - mirroring native behaviour\n private handleShow = async () => {\n if (this.type === 'select') this.listBox.setFocus();\n };\n\n // any changes to the connected input value will filter the list of active options\n private inputChange() {\n if (this.disableFilter) {\n this.actvOptEles = this.allOptEles;\n return;\n }\n\n const val = this.connectedInput.value;\n const valStr = val.trim().toLowerCase();\n\n let exactMatch = false;\n const activeEles = [];\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().indexOf(valStr) > -1;\n\n this.allOptEles.forEach((opt) => {\n if (\n (val === opt.value || val === opt.label) &&\n this.type !== 'selctMulti'\n ) {\n opt.selected = true;\n exactMatch = true;\n } else this.isSelected(opt, val);\n });\n\n this.allOptEles.forEach((opt) => {\n if (!valStr.length || exactMatch) {\n activeEles.push(opt);\n } else if (\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n ) {\n activeEles.push(opt);\n }\n });\n\n this.isFiltered = valStr.length && !exactMatch;\n this.actvOptEles = activeEles;\n }\n\n private inputClick = () => {\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n };\n\n private inputKeydown = (e: KeyboardEvent) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowRight',\n 'ArrowLeft',\n 'Escape',\n 'Enter',\n 'Tab',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Tab') this.shouldOpen = false;\n return;\n }\n\n // When select, mirror native select behaviour. Search on closed list\n if (\n this.type === 'select' &&\n !['ArrowDown', 'ArrowUp'].includes(e.key) &&\n (e.key !== ' ' || this.typeToSelectTimeout)\n ) {\n if (e.key === ' ' || /^[a-z0-9]+$/i.test(e.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = window.setTimeout(() => {\n this.typeToSelect = '';\n this.typeToSelectTimeout = 0;\n }, 750);\n this.typeToSelect += e.key;\n this.setOptStartsWith();\n }\n return;\n }\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n };\n\n // handles key down on options. Either 'picks'\n // an option or passes event back to input for search / filter\n private optionKeyDown = (\n e: KeyboardEvent & { target: HTMLNanoOptionElement }\n ) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowUp',\n 'ArrowDown',\n 'Escape',\n 'Enter',\n 'Tab',\n 'Space',\n ' ',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Escape') this.connectedInput.focus();\n return;\n }\n\n const deleteKeys = ['Delete', 'Backspace'];\n // this passes whatever's typed back to our input control\n if (\n this.type !== 'select' &&\n (!this.exactMatch || deleteKeys.includes(e.key))\n ) {\n this.connectedInput.focus();\n }\n };\n\n // Component lifecycle\n\n connectedCallback() {\n this.watchInputChange();\n }\n\n componentDidLoad() {\n this.manageSlotChangeListener();\n this.openWatcher();\n }\n\n componentDidRender(): void {\n setTimeout(() => {\n if (!this.connectedInput)\n console.warn(\n 'no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop',\n this.host\n );\n }, 500);\n\n // if user is using 'options' prop (as oppsed to slot)\n // add those options now - a single source of truth for options and <slot>\n if (this.options?.length) this.allOptEles = this.optionEles;\n }\n\n render() {\n this.optionEles = [];\n return (\n <Host\n role=\"listbox\"\n aria-owns={this.optionIds.join(' ')}\n aria-label=\"Select options from the list below\"\n >\n <nano-dropdown\n {...this.dropDownConfig}\n ref={(el) => (this.nanoDropdown = el)}\n dialogTitle=\"Select options from the list below\"\n class={{\n dlist__dropdown: true,\n 'dlist--isfiltered': this.isFiltered,\n }}\n onNanoAfterShow={this.handleShow}\n onNanoAfterHide={(_) => (this.open = false)}\n >\n <nano-menu\n hidden={!this.actvOptEles.length}\n type=\"listbox\"\n label={this.inputLabel ? this.inputLabel.textContent : undefined}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n tabIndex={-1}\n onNanoSelect={this.optSelected}\n onKeyDown={this.optionKeyDown}\n ref={(el) => (this.listBox = el)}\n >\n <slot name=\"list-top\" />\n {!this.options.length && <slot />}\n {!!this.options.length && (\n <slot>\n {this.options.map((option, i) => {\n if (option.value || option.label) {\n return (\n <nano-option\n ref={(el) => this.optionEles.push(el)}\n key={option.label + i}\n label={option.label}\n value={option.value}\n aria-posinset={i}\n aria-setsize={this.options.length}\n selected={option.selected}\n id={this.listId + '-option-' + i}\n >\n {option.label ? option.label : option.value}\n </nano-option>\n );\n }\n })}\n </slot>\n )}\n <slot name=\"list-bottom\" />\n </nano-menu>\n <nano-menu\n type=\"listbox\"\n label=\"No results found\"\n hidden={!!this.actvOptEles.length}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n >\n <slot name=\"no-result\" />\n </nano-menu>\n {!!this.actvOptEles && (\n <div aria-live=\"polite\" role=\"status\" class=\"dlist__status\">\n {this.actvOptEles.length} result\n {this.actvOptEles.length > 1 ? 's' : ''} available.\n </div>\n )}\n </nano-dropdown>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/date-input/date-input.css CHANGED Viewed

@@ -7,6 +7,9 @@
 *::after {
   box-sizing: border-box;
 }
+[hidden] {
+  display: none !important;
+}
 :host {
   /**
    * @prop --focus-shadow: defaults to var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));

package/dist/collection/components/date-input/date-input.js CHANGED Viewed

@@ -15,6 +15,8 @@ let inputIds = 0;
  *
  * @slot label - if you do not set a label attribute, you can use this slot for more complex markup
  * @slot helper - helper text to accompany the form field underneath.
+ * @slot start - input start slot
+ * @slot end - input end slot
  */
 export class DateInput {
   constructor() {
@@ -125,7 +127,7 @@ export class DateInput {
     };
     this.onDropdownHide = () => {
       setTimeout((_) => (this.pickerOpen = false), 200);
-      setTimeout((_) => this.trigger.focus(), 20);
+      setTimeout((_) => this.trigger.focus(), 50);
     };
     this.onDropdownShow = () => {
       setTimeout((_) => {
@@ -157,6 +159,10 @@ export class DateInput {
         this.pickerEle.setFocus(true);
         e.preventDefault();
       }
+      if (e.key === ' ' || e.key === 'Enter') {
+        if (this.pickerOpen)
+          this.pickerOpen = false;
+      }
     };
   }
   // Public Api / Prop
@@ -309,11 +315,13 @@ export class DateInput {
     return (h(Host, { class: Object.assign({}, createColorClasses(this.color)) },
       h("div", { class: "date-field" },
         h("nano-input", { class: "date-field__input", slot: "trigger", required: this.required || undefined, showInlineError: this.showInlineError, validateOn: this.validateOn, placeholder: this.placeholder !== 'false' ? this.placeholder : undefined, pattern: this.pattern, label: this.label, disabled: this.disabled || undefined, color: this.color || undefined, autofocus: this.autofocus || undefined, clearInput: this.clearInput || undefined, onNanoChange: this.onInputChange, onNanoInput: this.onInputKey, onNanoValidate: this.onInputValidate, name: "", form: this.form || undefined, size: this.size || undefined, readonly: this.readonly, value: this.inputValue, ref: (input) => (this.input = input), floatLabel: this.floatLabel, hideLabel: this.hideLabel, inputmode: 'numeric' },
+          h("slot", { name: "start", slot: "start" }),
           h("slot", { name: "label" }),
+          h("slot", { name: "end", slot: "end" }),
           this.picker && [
-            h("button", { slot: "inline-button", class: "date-field__open", type: "button", onKeyDown: this.onTriggerKey, onClick: this.onTriggerClick, ref: (trigger) => (this.trigger = trigger), disabled: this.disabled || this.readonly },
+            h("button", { slot: "end", class: "date-field__open", type: "button", onKeyDown: this.onTriggerKey, onClick: this.onTriggerClick, ref: (trigger) => (this.trigger = trigger), disabled: this.disabled || this.readonly },
               h("nano-icon", { name: "light/calendar-alt" })),
-            h("nano-dropdown", { slot: "inline-button", placement: placement, onNanoHide: this.onDropdownHide, onNanoShow: this.onDropdownShow, dialogTitle: "Choose a date", class: "date-field__dropdown", ref: (dropdown) => (this.dropdown = dropdown) },
+            h("nano-dropdown", { slot: "end", placement: placement, onNanoHide: this.onDropdownHide, onNanoShow: this.onDropdownShow, dialogTitle: "Choose a date", class: "date-field__dropdown", ref: (dropdown) => (this.dropdown = dropdown) },
               h("div", null,
                 h("div", { class: "date-field__close-bar" },
                   h("button", { class: "date-field__close", type: "button", onMouseDown: this.onCloseClick, onKeyDown: this.onCloseKeyDown, ref: (pickerClose) => (this.pickerCloseBtn = pickerClose) },
@@ -385,7 +393,7 @@ export class DateInput {
         "references": {
           "LocalDateOpts": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -506,7 +514,7 @@ export class DateInput {
         "references": {
           "DaysOfWeek": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/utils/date-utils.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/utils/date-utils.ts"
           }
         }
       },
@@ -530,7 +538,7 @@ export class DateInput {
         "references": {
           "DuetLocalizedText": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -572,7 +580,7 @@ export class DateInput {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -924,7 +932,7 @@ export class DateInput {
         "references": {
           "DateInputChangeEventDetail": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -947,7 +955,7 @@ export class DateInput {
         "references": {
           "ControlValidityEventDetail": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }
@@ -969,7 +977,7 @@ export class DateInput {
           },
           "ControlValidity": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         },
         "return": "Promise<ControlValidity>"

package/dist/collection/components/date-input/date-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"date-input.js","sourceRoot":"","sources":["../../../src/components/date-input/date-input.tsx"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n ComponentInterface,\n Element,\n h,\n Prop,\n Watch,\n State,\n Event,\n EventEmitter,\n Host,\n Method,\n} from '@stencil/core';\nimport {\n createDate,\n DaysOfWeek,\n printISODate,\n parseISODate,\n} from '../../utils/date-utils';\n\nimport {\n PickerChangeEvent,\n DateInputChangeEventDetail,\n Color,\n LocalDateOpts,\n DuetLocalizedText,\n ControlValidity,\n ControlValidityEventDetail,\n} from '../../interface';\nimport { createColorClasses } from '../../utils';\n\nconst DateRegxps = {\n d: '(\\\\d{1,2})',\n m: '(\\\\d{1,2})',\n y: '(\\\\d{4})',\n};\n\nlet inputIds = 0;\n\n/*\n The date-input component combines `nano-dropdown`, `nano-input` and `nano-date-picker` components to make a fully featured date form field. It has specific options for localisation, date formatting and validation.\n \n @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n /\n@Component({\n tag: 'nano-date-input',\n styleUrl: 'date-input.scss',\n scoped: true,\n})\nexport class DateInput implements ComponentInterface {\n private pickerEle!: HTMLNanoDatePickerElement;\n private trigger!: HTMLButtonElement;\n private pickerCloseBtn!: HTMLButtonElement;\n private dropdown!: HTMLNanoDropdownElement;\n private input: HTMLNanoInputElement;\n private pickerOpenSource: 'key' \| 'mouse';\n\n private directInput = false;\n private dateOrderIndeces = { d: 0, m: 1, y: 3 };\n private inputId = `nano-input-${inputIds++}`;\n private locale =\n (window.navigator.languages as string[]) \|\|\n window.navigator.language \|\|\n undefined;\n\n @Element() host: HTMLNanoDateInputElement;\n\n // Private state\n\n @State() pattern!: string;\n @State() inputValue: string;\n\n // Public Api / Prop\n\n /\n This will be true when the control is in an invalid state.\n * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n /\n @Prop({ reflect: true })\n get invalid() {\n return this._invalid;\n }\n @State() _invalid = false;\n\n /\n Whether to show a long form, confirmation date string of the one currently entered\n /\n @Prop() helperText: boolean = true;\n\n /\n Options for the date string display. Refer to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString.\n /\n @Prop() helperTextFormat: LocalDateOpts = {\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n };\n\n /\n Enable floating label behaviour. Will disable placeholder if set.\n /\n @Prop() floatLabel: boolean = false;\n\n /\n The name of the control, which is submitted with the form data.\n /\n @Prop() name: string = this.inputId;\n\n /\n If `true`, the user cannot modify the value.\n /\n @Prop() readonly = false;\n\n /\n The initial size (number of characters) of the control.\n /\n @Prop() size?: number;\n\n /\n The form element to associate the select with (its form owner). Must be the id of a form.\n /\n @Prop() form?: string \| null;\n\n /\n Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday.\n /\n @Prop() firstDayOfWeek?: DaysOfWeek;\n\n /\n Button labels, day names, month names, etc, used for localization.\n * Default is English.\n /\n @Prop() localization?: DuetLocalizedText;\n\n /\n If `true`, the user cannot interact with the input.\n /\n @Prop() disabled = false;\n\n /\n The color to use from the application's color palette.\n /\n @Prop() color?: Color;\n\n /\n This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n /\n @Prop() autofocus = false;\n\n /\n If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.\n /\n @Prop() clearInput = false;\n\n /\n String to place within a label element. Alternatively you may use a label slot.\n /\n @Prop() label?: string;\n\n /\n Instructional text that shows before the input has a value.\n * The pattern prop will be used to create a placeholder automatically if unused.\n /\n @Prop({ mutable: true }) placeholder: string;\n\n /\n Current value. Must be in IS0-8601 format: YYYY-MM-DD.\n /\n @Prop({ reflect: true, mutable: true }) value: string = '';\n\n @Watch('value')\n handleValueChange() {\n if (!this.directInput) this.inputValue = this.formatIsoDate(this.value);\n this.nanoChange.emit({ value: this.value, date: parseISODate(this.value) });\n this.directInput = false;\n }\n\n /\n When should the field perform validation\n /\n @Prop() validateOn?: 'dirty' \| 'submit' \| 'submitThenDirty' = 'submit';\n\n /\n Whether to show validation errors underneath input\n /\n @Prop({ reflect: true }) showInlineError = true;\n\n /\n The order of the date parts for entry and display.\n * e.g. dmy = dd mm yyyy\n /\n @Prop() dateOrder: 'dmy' \| 'mdy' \| 'ymd' \| 'dym' = 'dmy';\n\n @Watch('dateOrder')\n handleDateOrderChange() {\n this.setDatePattern();\n }\n\n /\n If `true`, the user must fill in a value before submitting a form.\n /\n @Prop() required = false;\n\n /\n Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n /\n @Prop() min?: string;\n\n /\n Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n /\n @Prop() max?: string;\n\n /\n Visually hide the label - but make it accessible.\n /\n @Prop() hideLabel?: boolean = false;\n\n @Watch('min')\n @Watch('max')\n @Watch('value')\n testDateValidity() {\n const valueDate = parseISODate(this.value);\n let min: Date,\n max: Date,\n error: string = '';\n\n if (this.value && valueDate) {\n if (this.min && (min = parseISODate(this.min)) && valueDate < min) {\n error =\n 'Date below the minimum: ' +\n min.toLocaleDateString(this.locale, this.helperTextFormat);\n } else if (\n this.max &&\n (max = parseISODate(this.max)) &&\n valueDate > max\n ) {\n error =\n 'Date above the maximum: ' +\n max.toLocaleDateString(this.locale, this.helperTextFormat);\n }\n }\n\n setTimeout(async (_) => {\n if (!this.input) return;\n const input = await this.input.getInputElement();\n if (this.value.length && !valueDate) error = 'Please enter a valid date';\n\n input.setCustomValidity(error);\n if (this.input.validateOn === 'dirty') {\n this.input.showError(error);\n }\n }, 100);\n }\n\n /\n Show a date picker. Date pickers are not very useful\n * if the potential input is too far in the distance or past\n * e.g. Birthdays\n /\n @Prop() picker: boolean = true;\n\n /\n Initial picker date. Will be to `value` if set. Will be today's date if nothing set.\n * Must be in IS0-8601 format: YYYY-MM-DD.\n /\n @Prop() initialPickerDate?: string;\n\n /\n Set / read whether the picker is currently open.\n /\n @Prop({ reflect: true, mutable: true }) pickerOpen: boolean = false;\n\n @Watch('pickerOpen')\n handlePickerOpenChange() {\n this.dropdown.open = this.pickerOpen;\n }\n\n /\n Close the picker after a date is selected\n /\n @Prop() closeAfterPicked: boolean = true;\n\n // Event emitters\n\n /\n Event emitted when a date is selected.\n /\n @Event() nanoChange: EventEmitter<DateInputChangeEventDetail>;\n\n /\n Called when validation is performed (which depends on `validateOn`).\n * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n /\n @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n // Methods\n\n /\n Get the current state of the control.\n * @param validateFirst - perform validation first before reporting\n * @returns `{ isValid: boolean, errorMessage: string }`\n /\n @Method()\n async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n return await this.input.reportValidity(validateFirst);\n }\n\n /\n Sets focus on the child `nano-input`.\n /\n @Method()\n async setFocus() {\n if (this.input) this.input.setFocus();\n }\n\n /\n Returns the native `<input>` element used under the hood.\n /\n @Method()\n async getInputElement() {\n return await this.input.getInputElement();\n }\n\n /\n Invalidate the field and show a custom error message. To clear the error you will need to re-call this method with an empty string.\n */\n @Method()\n async showError(message: string) {\n if (!this.input) return;\n this.input.showError(message);\n }\n\n // Event handlers\n\n private onInputChange = (\n e: CustomEvent & {\n target: HTMLInputElement;\n }\n ) => {\n e.stopPropagation();\n this.setValue(e.target.value);\n };\n\n private onInputValidate = (e: CustomEvent<ControlValidityEventDetail>) => {\n e.stopPropagation();\n this._invalid = !e.detail.isValid;\n this.nanoValidate.emit({\n isValid: e.detail.isValid,\n errorMessage: e.detail.errorMessage,\n originalEvent: e.detail.originalEvent,\n });\n };\n\n private onInputKey = () => {\n this.directInput = true;\n };\n\n private onDatePicked = (e: { detail: PickerChangeEvent }) => {\n this.directInput = false;\n this.value = e.detail.value;\n if (this.closeAfterPicked) this.pickerOpen = false;\n };\n\n private onDropdownHide = () => {\n setTimeout((_) => (this.pickerOpen = false), 200);\n setTimeout((_) => this.trigger.focus(), 20);\n };\n\n private onDropdownShow = () => {\n setTimeout((_) => {\n this.pickerEle.setFocus(false, this.pickerOpenSource === 'key');\n this.pickerOpenSource = null;\n }, 200);\n };\n\n private onTriggerClick = () => {\n if (!this.pickerOpen) {\n this.pickerOpen = true;\n this.pickerOpenSource = 'mouse';\n }\n };\n\n private onTriggerKey = (e: KeyboardEvent) => {\n if ([' ', 'Enter'].includes(e.key)) {\n if (!this.pickerOpen) {\n this.pickerOpen = true;\n this.pickerOpenSource = 'key';\n }\n }\n };\n\n private onCloseClick = () => {\n if (this.pickerOpen) this.pickerOpen = false;\n };\n\n private onCloseKeyDown = (e: KeyboardEvent) => {\n // this ensures focus is trapped inside the picker\n if (e.key === 'Tab' && e.shiftKey) {\n this.pickerEle.setFocus(true);\n e.preventDefault();\n }\n };\n\n // Private logic\n\n // set the regexp input pattern and placeholder (if necessary)\n private setDatePattern() {\n let dateRegexOrdered = [];\n let dateStrOrd = [];\n Array.from(this.dateOrder).map((datepart, i) => {\n dateRegexOrdered.push(DateRegxps[datepart]);\n this.dateOrderIndeces[datepart] = i;\n dateStrOrd.push(datepart === 'y' ? 'yyyy' : datepart + datepart);\n });\n this.pattern = dateRegexOrdered.join('\\\\W+');\n\n if (!this.placeholder && this.placeholder !== 'false')\n this.placeholder = dateStrOrd.join(' ');\n }\n\n // set the public facing date string\n private formatIsoDate(isoDate: string) {\n let dateRegexOrdered = [];\n Array.from('ymd').map((datepart) =>\n dateRegexOrdered.push(DateRegxps[datepart])\n );\n const matches = isoDate.match(new RegExp(dateRegexOrdered.join('\\\\W+')));\n if (!matches) return '';\n\n let formatted = [];\n formatted[this.dateOrderIndeces.d] = matches[3];\n formatted[this.dateOrderIndeces.m] = matches[2];\n formatted[this.dateOrderIndeces.y] = matches[1];\n\n return formatted.join(' ');\n }\n\n // on manual user entry, set the value that will be sent with the form field\n private setValue(inputValue: string) {\n const matches = inputValue.match(new RegExp(this.pattern));\n\n // it's an invalid date, but we still need to set it\n if (!matches) {\n this.value = inputValue;\n return;\n }\n\n let date = createDate(\n matches[this.dateOrderIndeces.y + 1],\n matches[this.dateOrderIndeces.m + 1],\n matches[this.dateOrderIndeces.d + 1]\n );\n\n if (!date) {\n // last ditch attempt - see if the browser can get something\n date = new Date(inputValue);\n\n // it's definitely an invalid date, but set it anyway for validation messages\n if (!date) {\n this.value = inputValue;\n return;\n }\n }\n\n const dateStr = printISODate(date);\n this.value = dateStr;\n return dateStr;\n }\n\n connectedCallback() {\n this.setDatePattern();\n this.handleValueChange();\n }\n\n componentDidLoad() {\n if (!this.pickerCloseBtn \|\| !this.picker) return;\n this.pickerEle.firstFocusEle = this.pickerCloseBtn;\n this.dropdown.tetherTo = this.trigger;\n setTimeout((_) => this.handlePickerOpenChange(), 300);\n }\n\n render() {\n this.locale =\n (navigator.languages as string[]) \|\| navigator.language \|\| undefined;\n let placement: 'bottom-start' \| 'bottom-end' =\n (this.host.ownerDocument as Document).dir === 'rtl'\n ? 'bottom-start'\n : 'bottom-end';\n const valueDate = parseISODate(this.value);\n const hasHelperSlot = !!this.host.querySelector('[slot=\"helper\"]');\n\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <div class=\"date-field\">\n <nano-input\n class=\"date-field__input\"\n slot=\"trigger\"\n required={this.required \|\| undefined}\n showInlineError={this.showInlineError}\n validateOn={this.validateOn}\n placeholder={\n this.placeholder !== 'false' ? this.placeholder : undefined\n }\n pattern={this.pattern}\n label={this.label}\n disabled={this.disabled \|\| undefined}\n color={this.color \|\| undefined}\n autofocus={this.autofocus \|\| undefined}\n clearInput={this.clearInput \|\| undefined}\n onNanoChange={this.onInputChange}\n onNanoInput={this.onInputKey}\n onNanoValidate={this.onInputValidate}\n name=\"\"\n form={this.form \|\| undefined}\n size={this.size \|\| undefined}\n readonly={this.readonly}\n value={this.inputValue}\n ref={(input) => (this.input = input)}\n floatLabel={this.floatLabel}\n hideLabel={this.hideLabel}\n inputmode={'numeric'}\n >\n <slot name=\"label\" />\n {this.picker && [\n <button\n slot=\"inline-button\"\n class=\"date-field__open\"\n type=\"button\"\n onKeyDown={this.onTriggerKey}\n onClick={this.onTriggerClick}\n ref={(trigger) => (this.trigger = trigger)}\n disabled={this.disabled \|\| this.readonly}\n >\n <nano-icon name=\"light/calendar-alt\"></nano-icon>\n </button>,\n\n <nano-dropdown\n slot=\"inline-button\"\n placement={placement}\n onNanoHide={this.onDropdownHide}\n onNanoShow={this.onDropdownShow}\n dialogTitle=\"Choose a date\"\n class=\"date-field__dropdown\"\n ref={(dropdown) => (this.dropdown = dropdown)}\n >\n <div>\n <div class=\"date-field__close-bar\">\n <button\n class=\"date-field__close\"\n type=\"button\"\n onMouseDown={this.onCloseClick}\n onKeyDown={this.onCloseKeyDown}\n ref={(pickerClose) => (this.pickerCloseBtn = pickerClose)}\n >\n <nano-icon name=\"light/times\"></nano-icon>\n <span class=\"vhidden\">Close window</span>\n </button>\n </div>\n <nano-date-picker\n onNanoDatePicked={this.onDatePicked}\n min={this.min \|\| undefined}\n max={this.max \|\| undefined}\n is-modal={true}\n ref={(picker) => (this.pickerEle = picker)}\n localization={this.localization}\n selectedDate={this.value \|\| this.initialPickerDate}\n firstDayOfWeek={this.firstDayOfWeek}\n color={this.color \|\| undefined}\n ></nano-date-picker>\n </div>\n </nano-dropdown>,\n ]}\n {(hasHelperSlot \|\| this.helperText \|\| this.showInlineError) && (\n <span slot=\"helper\">\n <span class={{ vhidden: !!this.value.length }}>\n <slot name=\"helper\" />\n </span>\n {this.helperText && !!valueDate && (\n <span>\n {valueDate.toLocaleDateString(\n this.locale,\n this.helperTextFormat\n )}\n </span>\n )}\n </span>\n )}\n </nano-input>\n <input type=\"hidden\" value={this.value} name={this.name} />\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"date-input.js","sourceRoot":"","sources":["../../../src/components/date-input/date-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EAET,OAAO,EACP,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,EAEL,IAAI,EACJ,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,UAAU,EAEV,YAAY,EACZ,YAAY,GACb,MAAM,wBAAwB,CAAC;AAWhC,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,UAAU,GAAG;EACjB,CAAC,EAAE,YAAY;EACf,CAAC,EAAE,YAAY;EACf,CAAC,EAAE,UAAU;CACd,CAAC;AAEF,IAAI,QAAQ,GAAG,CAAC,CAAC;AAEjB;;;;;;;GAOG;AAMH,MAAM,OAAO,SAAS;EALtB;IAaU,gBAAW,GAAG,KAAK,CAAC;IACpB,qBAAgB,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;IACxC,YAAO,GAAG,cAAc,QAAQ,EAAE,EAAE,CAAC;IACrC,WAAM,GACX,MAAM,CAAC,SAAS,CAAC,SAAsB;MACxC,MAAM,CAAC,SAAS,CAAC,QAAQ;MACzB,SAAS,CAAC;IAmBH,aAAQ,GAAG,KAAK,CAAC;IAE1B;;OAEG;IACK,eAAU,GAAY,IAAI,CAAC;IAEnC;;OAEG;IACK,qBAAgB,GAAkB;MACxC,IAAI,EAAE,SAAS;MACf,KAAK,EAAE,MAAM;MACb,GAAG,EAAE,SAAS;KACf,CAAC;IAEF;;OAEG;IACK,eAAU,GAAY,KAAK,CAAC;IAEpC;;OAEG;IACK,SAAI,GAAW,IAAI,CAAC,OAAO,CAAC;IAEpC;;OAEG;IACK,aAAQ,GAAG,KAAK,CAAC;IAwBzB;;OAEG;IACK,aAAQ,GAAG,KAAK,CAAC;IAOzB;;OAEG;IACK,cAAS,GAAG,KAAK,CAAC;IAE1B;;OAEG;IACK,eAAU,GAAG,KAAK,CAAC;IAa3B;;OAEG;IACqC,UAAK,GAAW,EAAE,CAAC;IAS3D;;OAEG;IACK,eAAU,GAA4C,QAAQ,CAAC;IAEvE;;OAEG;IACsB,oBAAe,GAAG,IAAI,CAAC;IAEhD;;;OAGG;IACK,cAAS,GAAkC,KAAK,CAAC;IAOzD;;OAEG;IACK,aAAQ,GAAG,KAAK,CAAC;IAczB;;OAEG;IACK,cAAS,GAAa,KAAK,CAAC;IAuCpC;;;;OAIG;IACK,WAAM,GAAY,IAAI,CAAC;IAQ/B;;OAEG;IACqC,eAAU,GAAY,KAAK,CAAC;IAOpE;;OAEG;IACK,qBAAgB,GAAY,IAAI,CAAC;IAoDzC,iBAAiB;IAET,kBAAa,GAAG,CACtB,CAEC,EACD,EAAE;MACF,CAAC,CAAC,eAAe,EAAE,CAAC;MACpB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC,CAAC;IAEM,oBAAe,GAAG,CAAC,CAA0C,EAAE,EAAE;MACvE,CAAC,CAAC,eAAe,EAAE,CAAC;MACpB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;MAClC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;QACrB,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO;QACzB,YAAY,EAAE,CAAC,CAAC,MAAM,CAAC,YAAY;QACnC,aAAa,EAAE,CAAC,CAAC,MAAM,CAAC,aAAa;OACtC,CAAC,CAAC;IACL,CAAC,CAAC;IAEM,eAAU,GAAG,GAAG,EAAE;MACxB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IAC1B,CAAC,CAAC;IAEM,iBAAY,GAAG,CAAC,CAAgC,EAAE,EAAE;MAC1D,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;MACzB,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;MAC5B,IAAI,IAAI,CAAC,gBAAgB;QAAE,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IACrD,CAAC,CAAC;IAEM,mBAAc,GAAG,GAAG,EAAE;MAC5B,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,EAAE,GAAG,CAAC,CAAC;MAClD,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEM,mBAAc,GAAG,GAAG,EAAE;MAC5B,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE;QACf,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,KAAK,KAAK,CAAC,CAAC;QAChE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;MAC/B,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC,CAAC;IAEM,mBAAc,GAAG,GAAG,EAAE;MAC5B,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;QACpB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC;OACjC;IACH,CAAC,CAAC;IAEM,iBAAY,GAAG,CAAC,CAAgB,EAAE,EAAE;MAC1C,IAAI,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE;QAClC,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;UACpB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;UACvB,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;SAC/B;OACF;IACH,CAAC,CAAC;IAEM,iBAAY,GAAG,GAAG,EAAE;MAC1B,IAAI,IAAI,CAAC,UAAU;QAAE,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC/C,CAAC,CAAC;IAEM,mBAAc,GAAG,CAAC,CAAgB,EAAE,EAAE;MAC5C,kDAAkD;MAClD,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,CAAC,QAAQ,EAAE;QACjC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QAC9B,CAAC,CAAC,cAAc,EAAE,CAAC;OACpB;MACD,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;QACtC,IAAI,IAAI,CAAC,UAAU;UAAE,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;OAC9C;IACH,CAAC,CAAC;GAkMH;EAlhBC,oBAAoB;EAEpB;;;KAGG;EACH,IACI,OAAO;IACT,OAAO,IAAI,CAAC,QAAQ,CAAC;EACvB,CAAC;EA2FD,iBAAiB;IACf,IAAI,CAAC,IAAI,CAAC,WAAW;MAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACxE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC5E,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;EAC3B,CAAC;EAmBD,qBAAqB;IACnB,IAAI,CAAC,cAAc,EAAE,CAAC;EACxB,CAAC;EA2BD,gBAAgB;IACd,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3C,IAAI,GAAS,EACX,GAAS,EACT,KAAK,GAAW,EAAE,CAAC;IAErB,IAAI,IAAI,CAAC,KAAK,IAAI,SAAS,EAAE;MAC3B,IAAI,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,SAAS,GAAG,GAAG,EAAE;QACjE,KAAK;UACH,0BAA0B;YAC1B,GAAG,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;OAC9D;WAAM,IACL,IAAI,CAAC,GAAG;QACR,CAAC,GAAG,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC9B,SAAS,GAAG,GAAG,EACf;QACA,KAAK;UACH,0BAA0B;YAC1B,GAAG,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;OAC9D;KACF;IAED,UAAU,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;MACrB,IAAI,CAAC,IAAI,CAAC,KAAK;QAAE,OAAO;MACxB,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;MACjD,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,SAAS;QAAE,KAAK,GAAG,2BAA2B,CAAC;MAEzE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;MAC/B,IAAI,IAAI,CAAC,KAAK,CAAC,UAAU,KAAK,OAAO,EAAE;QACrC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;OAC7B;IACH,CAAC,EAAE,GAAG,CAAC,CAAC;EACV,CAAC;EAqBD,sBAAsB;IACpB,IAAI,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC;EACvC,CAAC;EAoBD,UAAU;EAEV;;;;KAIG;EAEH,KAAK,CAAC,cAAc,CAAC,aAAsB;IACzC,OAAO,MAAM,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;EACxD,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,QAAQ;IACZ,IAAI,IAAI,CAAC,KAAK;MAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;EACxC,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,eAAe;IACnB,OAAO,MAAM,IAAI,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;EAC5C,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,SAAS,CAAC,OAAe;IAC7B,IAAI,CAAC,IAAI,CAAC,KAAK;MAAE,OAAO;IACxB,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;EAChC,CAAC;EA4ED,gBAAgB;EAEhB,8DAA8D;EACtD,cAAc;IACpB,IAAI,gBAAgB,GAAG,EAAE,CAAC;IAC1B,IAAI,UAAU,GAAG,EAAE,CAAC;IACpB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC,EAAE,EAAE;MAC7C,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;MAC5C,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;MACpC,UAAU,CAAC,IAAI,CAAC,QAAQ,KAAK,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC;IACnE,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,OAAO,GAAG,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAE7C,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,KAAK,OAAO;MACnD,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;EAC5C,CAAC;EAED,oCAAoC;EAC5B,aAAa,CAAC,OAAe;IACnC,IAAI,gBAAgB,GAAG,EAAE,CAAC;IAC1B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CACjC,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAC5C,CAAC;IACF,MAAM,OAAO,GAAG,OAAO,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACzE,IAAI,CAAC,OAAO;MAAE,OAAO,EAAE,CAAC;IAExB,IAAI,SAAS,GAAG,EAAE,CAAC;IACnB,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;IAChD,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;IAChD,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;IAEhD,OAAO,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;EAC7B,CAAC;EAED,4EAA4E;EACpE,QAAQ,CAAC,UAAkB;IACjC,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3D,oDAAoD;IACpD,IAAI,CAAC,OAAO,EAAE;MACZ,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC;MACxB,OAAO;KACR;IAED,IAAI,IAAI,GAAG,UAAU,CACnB,OAAO,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,EACpC,OAAO,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,EACpC,OAAO,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,CACrC,CAAC;IAEF,IAAI,CAAC,IAAI,EAAE;MACT,4DAA4D;MAC5D,IAAI,GAAG,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC;MAE5B,6EAA6E;MAC7E,IAAI,CAAC,IAAI,EAAE;QACT,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC;QACxB,OAAO;OACR;KACF;IAED,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACnC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC;IACrB,OAAO,OAAO,CAAC;EACjB,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,cAAc,EAAE,CAAC;IACtB,IAAI,CAAC,iBAAiB,EAAE,CAAC;EAC3B,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,MAAM;MAAE,OAAO;IACjD,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI,CAAC,cAAc,CAAC;IACnD,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC;IACtC,UAAU,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,EAAE,GAAG,CAAC,CAAC;EACxD,CAAC;EAED,MAAM;IACJ,IAAI,CAAC,MAAM;MACR,SAAS,CAAC,SAAsB,IAAI,SAAS,CAAC,QAAQ,IAAI,SAAS,CAAC;IACvE,IAAI,SAAS,GACV,IAAI,CAAC,IAAI,CAAC,aAA0B,CAAC,GAAG,KAAK,KAAK;MACjD,CAAC,CAAC,cAAc;MAChB,CAAC,CAAC,YAAY,CAAC;IACnB,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC3C,MAAM,aAAa,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAEnE,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,oBAAO,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC;MAC9C,WAAK,KAAK,EAAC,YAAY;QACrB,kBACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,SAAS,EACd,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS,EACpC,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,WAAW,EACT,IAAI,CAAC,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAE7D,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS,EACpC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,EAC9B,SAAS,EAAE,IAAI,CAAC,SAAS,IAAI,SAAS,EACtC,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,SAAS,EACxC,YAAY,EAAE,IAAI,CAAC,aAAa,EAChC,WAAW,EAAE,IAAI,CAAC,UAAU,EAC5B,cAAc,EAAE,IAAI,CAAC,eAAe,EACpC,IAAI,EAAC,EAAE,EACP,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,SAAS,EAC5B,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,SAAS,EAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,GAAG,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,EACpC,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,SAAS;UAEpB,YAAM,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,GAAG;UAClC,YAAM,IAAI,EAAC,OAAO,GAAG;UACrB,YAAM,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,KAAK,GAAG;UAC7B,IAAI,CAAC,MAAM,IAAI;YACd,cACE,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,kBAAkB,EACxB,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,YAAY,EAC5B,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC,EAC1C,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;cAExC,iBAAW,IAAI,EAAC,oBAAoB,GAAa,CAC1C;YAET,qBACE,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,IAAI,CAAC,cAAc,EAC/B,UAAU,EAAE,IAAI,CAAC,cAAc,EAC/B,WAAW,EAAC,eAAe,EAC3B,KAAK,EAAC,sBAAsB,EAC5B,GAAG,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;cAE7C;gBACE,WAAK,KAAK,EAAC,uBAAuB;kBAChC,cACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE,IAAI,CAAC,YAAY,EAC9B,SAAS,EAAE,IAAI,CAAC,cAAc,EAC9B,GAAG,EAAE,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,WAAW,CAAC;oBAEzD,iBAAW,IAAI,EAAC,aAAa,GAAa;oBAC1C,YAAM,KAAK,EAAC,SAAS,mBAAoB,CAClC,CACL;gBACN,wBACE,gBAAgB,EAAE,IAAI,CAAC,YAAY,EACnC,GAAG,EAAE,IAAI,CAAC,GAAG,IAAI,SAAS,EAC1B,GAAG,EAAE,IAAI,CAAC,GAAG,IAAI,SAAS,cAChB,IAAI,EACd,GAAG,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,EAC1C,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,YAAY,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,iBAAiB,EAClD,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,GACZ,CAChB,CACQ;WACjB;UACA,CAAC,aAAa,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAC7D,YAAM,IAAI,EAAC,QAAQ;YACjB,YAAM,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;cAC3C,YAAM,IAAI,EAAC,QAAQ,GAAG,CACjB;YACN,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC,SAAS,IAAI,CACjC,gBACG,SAAS,CAAC,kBAAkB,CAC3B,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,gBAAgB,CACtB,CACI,CACR,CACI,CACR,CACU;QACb,aAAO,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CACvD,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n ComponentInterface,\n Element,\n h,\n Prop,\n Watch,\n State,\n Event,\n EventEmitter,\n Host,\n Method,\n} from '@stencil/core';\nimport {\n createDate,\n DaysOfWeek,\n printISODate,\n parseISODate,\n} from '../../utils/date-utils';\n\nimport {\n PickerChangeEvent,\n DateInputChangeEventDetail,\n Color,\n LocalDateOpts,\n DuetLocalizedText,\n ControlValidity,\n ControlValidityEventDetail,\n} from '../../interface';\nimport { createColorClasses } from '../../utils';\n\nconst DateRegxps = {\n d: '(\\\\d{1,2})',\n m: '(\\\\d{1,2})',\n y: '(\\\\d{4})',\n};\n\nlet inputIds = 0;\n\n/*\n The date-input component combines `nano-dropdown`, `nano-input` and `nano-date-picker` components to make a fully featured date form field. It has specific options for localisation, date formatting and validation.\n \n @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot start - input start slot\n * @slot end - input end slot\n /\n@Component({\n tag: 'nano-date-input',\n styleUrl: 'date-input.scss',\n scoped: true,\n})\nexport class DateInput implements ComponentInterface {\n private pickerEle!: HTMLNanoDatePickerElement;\n private trigger!: HTMLButtonElement;\n private pickerCloseBtn!: HTMLButtonElement;\n private dropdown!: HTMLNanoDropdownElement;\n private input: HTMLNanoInputElement;\n private pickerOpenSource: 'key' \| 'mouse';\n\n private directInput = false;\n private dateOrderIndeces = { d: 0, m: 1, y: 3 };\n private inputId = `nano-input-${inputIds++}`;\n private locale =\n (window.navigator.languages as string[]) \|\|\n window.navigator.language \|\|\n undefined;\n\n @Element() host: HTMLNanoDateInputElement;\n\n // Private state\n\n @State() pattern!: string;\n @State() inputValue: string;\n\n // Public Api / Prop\n\n /\n This will be true when the control is in an invalid state.\n * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n /\n @Prop({ reflect: true })\n get invalid() {\n return this._invalid;\n }\n @State() _invalid = false;\n\n /\n Whether to show a long form, confirmation date string of the one currently entered\n /\n @Prop() helperText: boolean = true;\n\n /\n Options for the date string display. Refer to https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString.\n /\n @Prop() helperTextFormat: LocalDateOpts = {\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n };\n\n /\n Enable floating label behaviour. Will disable placeholder if set.\n /\n @Prop() floatLabel: boolean = false;\n\n /\n The name of the control, which is submitted with the form data.\n /\n @Prop() name: string = this.inputId;\n\n /\n If `true`, the user cannot modify the value.\n /\n @Prop() readonly = false;\n\n /\n The initial size (number of characters) of the control.\n /\n @Prop() size?: number;\n\n /\n The form element to associate the select with (its form owner). Must be the id of a form.\n /\n @Prop() form?: string \| null;\n\n /\n Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday.\n /\n @Prop() firstDayOfWeek?: DaysOfWeek;\n\n /\n Button labels, day names, month names, etc, used for localization.\n * Default is English.\n /\n @Prop() localization?: DuetLocalizedText;\n\n /\n If `true`, the user cannot interact with the input.\n /\n @Prop() disabled = false;\n\n /\n The color to use from the application's color palette.\n /\n @Prop() color?: Color;\n\n /\n This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n /\n @Prop() autofocus = false;\n\n /\n If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.\n /\n @Prop() clearInput = false;\n\n /\n String to place within a label element. Alternatively you may use a label slot.\n /\n @Prop() label?: string;\n\n /\n Instructional text that shows before the input has a value.\n * The pattern prop will be used to create a placeholder automatically if unused.\n /\n @Prop({ mutable: true }) placeholder: string;\n\n /\n Current value. Must be in IS0-8601 format: YYYY-MM-DD.\n /\n @Prop({ reflect: true, mutable: true }) value: string = '';\n\n @Watch('value')\n handleValueChange() {\n if (!this.directInput) this.inputValue = this.formatIsoDate(this.value);\n this.nanoChange.emit({ value: this.value, date: parseISODate(this.value) });\n this.directInput = false;\n }\n\n /\n When should the field perform validation\n /\n @Prop() validateOn?: 'dirty' \| 'submit' \| 'submitThenDirty' = 'submit';\n\n /\n Whether to show validation errors underneath input\n /\n @Prop({ reflect: true }) showInlineError = true;\n\n /\n The order of the date parts for entry and display.\n * e.g. dmy = dd mm yyyy\n /\n @Prop() dateOrder: 'dmy' \| 'mdy' \| 'ymd' \| 'dym' = 'dmy';\n\n @Watch('dateOrder')\n handleDateOrderChange() {\n this.setDatePattern();\n }\n\n /\n If `true`, the user must fill in a value before submitting a form.\n /\n @Prop() required = false;\n\n /\n Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n /\n @Prop() min?: string;\n\n /\n Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n /\n @Prop() max?: string;\n\n /\n Visually hide the label - but make it accessible.\n /\n @Prop() hideLabel?: boolean = false;\n\n @Watch('min')\n @Watch('max')\n @Watch('value')\n testDateValidity() {\n const valueDate = parseISODate(this.value);\n let min: Date,\n max: Date,\n error: string = '';\n\n if (this.value && valueDate) {\n if (this.min && (min = parseISODate(this.min)) && valueDate < min) {\n error =\n 'Date below the minimum: ' +\n min.toLocaleDateString(this.locale, this.helperTextFormat);\n } else if (\n this.max &&\n (max = parseISODate(this.max)) &&\n valueDate > max\n ) {\n error =\n 'Date above the maximum: ' +\n max.toLocaleDateString(this.locale, this.helperTextFormat);\n }\n }\n\n setTimeout(async (_) => {\n if (!this.input) return;\n const input = await this.input.getInputElement();\n if (this.value.length && !valueDate) error = 'Please enter a valid date';\n\n input.setCustomValidity(error);\n if (this.input.validateOn === 'dirty') {\n this.input.showError(error);\n }\n }, 100);\n }\n\n /\n Show a date picker. Date pickers are not very useful\n * if the potential input is too far in the distance or past\n * e.g. Birthdays\n /\n @Prop() picker: boolean = true;\n\n /\n Initial picker date. Will be to `value` if set. Will be today's date if nothing set.\n * Must be in IS0-8601 format: YYYY-MM-DD.\n /\n @Prop() initialPickerDate?: string;\n\n /\n Set / read whether the picker is currently open.\n /\n @Prop({ reflect: true, mutable: true }) pickerOpen: boolean = false;\n\n @Watch('pickerOpen')\n handlePickerOpenChange() {\n this.dropdown.open = this.pickerOpen;\n }\n\n /\n Close the picker after a date is selected\n /\n @Prop() closeAfterPicked: boolean = true;\n\n // Event emitters\n\n /\n Event emitted when a date is selected.\n /\n @Event() nanoChange: EventEmitter<DateInputChangeEventDetail>;\n\n /\n Called when validation is performed (which depends on `validateOn`).\n * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n /\n @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n // Methods\n\n /\n Get the current state of the control.\n * @param validateFirst - perform validation first before reporting\n * @returns `{ isValid: boolean, errorMessage: string }`\n /\n @Method()\n async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n return await this.input.reportValidity(validateFirst);\n }\n\n /\n Sets focus on the child `nano-input`.\n /\n @Method()\n async setFocus() {\n if (this.input) this.input.setFocus();\n }\n\n /\n Returns the native `<input>` element used under the hood.\n /\n @Method()\n async getInputElement() {\n return await this.input.getInputElement();\n }\n\n /\n Invalidate the field and show a custom error message. To clear the error you will need to re-call this method with an empty string.\n */\n @Method()\n async showError(message: string) {\n if (!this.input) return;\n this.input.showError(message);\n }\n\n // Event handlers\n\n private onInputChange = (\n e: CustomEvent & {\n target: HTMLInputElement;\n }\n ) => {\n e.stopPropagation();\n this.setValue(e.target.value);\n };\n\n private onInputValidate = (e: CustomEvent<ControlValidityEventDetail>) => {\n e.stopPropagation();\n this._invalid = !e.detail.isValid;\n this.nanoValidate.emit({\n isValid: e.detail.isValid,\n errorMessage: e.detail.errorMessage,\n originalEvent: e.detail.originalEvent,\n });\n };\n\n private onInputKey = () => {\n this.directInput = true;\n };\n\n private onDatePicked = (e: { detail: PickerChangeEvent }) => {\n this.directInput = false;\n this.value = e.detail.value;\n if (this.closeAfterPicked) this.pickerOpen = false;\n };\n\n private onDropdownHide = () => {\n setTimeout((_) => (this.pickerOpen = false), 200);\n setTimeout((_) => this.trigger.focus(), 50);\n };\n\n private onDropdownShow = () => {\n setTimeout((_) => {\n this.pickerEle.setFocus(false, this.pickerOpenSource === 'key');\n this.pickerOpenSource = null;\n }, 200);\n };\n\n private onTriggerClick = () => {\n if (!this.pickerOpen) {\n this.pickerOpen = true;\n this.pickerOpenSource = 'mouse';\n }\n };\n\n private onTriggerKey = (e: KeyboardEvent) => {\n if ([' ', 'Enter'].includes(e.key)) {\n if (!this.pickerOpen) {\n this.pickerOpen = true;\n this.pickerOpenSource = 'key';\n }\n }\n };\n\n private onCloseClick = () => {\n if (this.pickerOpen) this.pickerOpen = false;\n };\n\n private onCloseKeyDown = (e: KeyboardEvent) => {\n // this ensures focus is trapped inside the picker\n if (e.key === 'Tab' && e.shiftKey) {\n this.pickerEle.setFocus(true);\n e.preventDefault();\n }\n if (e.key === ' ' \|\| e.key === 'Enter') {\n if (this.pickerOpen) this.pickerOpen = false;\n }\n };\n\n // Private logic\n\n // set the regexp input pattern and placeholder (if necessary)\n private setDatePattern() {\n let dateRegexOrdered = [];\n let dateStrOrd = [];\n Array.from(this.dateOrder).map((datepart, i) => {\n dateRegexOrdered.push(DateRegxps[datepart]);\n this.dateOrderIndeces[datepart] = i;\n dateStrOrd.push(datepart === 'y' ? 'yyyy' : datepart + datepart);\n });\n this.pattern = dateRegexOrdered.join('\\\\W+');\n\n if (!this.placeholder && this.placeholder !== 'false')\n this.placeholder = dateStrOrd.join(' ');\n }\n\n // set the public facing date string\n private formatIsoDate(isoDate: string) {\n let dateRegexOrdered = [];\n Array.from('ymd').map((datepart) =>\n dateRegexOrdered.push(DateRegxps[datepart])\n );\n const matches = isoDate.match(new RegExp(dateRegexOrdered.join('\\\\W+')));\n if (!matches) return '';\n\n let formatted = [];\n formatted[this.dateOrderIndeces.d] = matches[3];\n formatted[this.dateOrderIndeces.m] = matches[2];\n formatted[this.dateOrderIndeces.y] = matches[1];\n\n return formatted.join(' ');\n }\n\n // on manual user entry, set the value that will be sent with the form field\n private setValue(inputValue: string) {\n const matches = inputValue.match(new RegExp(this.pattern));\n\n // it's an invalid date, but we still need to set it\n if (!matches) {\n this.value = inputValue;\n return;\n }\n\n let date = createDate(\n matches[this.dateOrderIndeces.y + 1],\n matches[this.dateOrderIndeces.m + 1],\n matches[this.dateOrderIndeces.d + 1]\n );\n\n if (!date) {\n // last ditch attempt - see if the browser can get something\n date = new Date(inputValue);\n\n // it's definitely an invalid date, but set it anyway for validation messages\n if (!date) {\n this.value = inputValue;\n return;\n }\n }\n\n const dateStr = printISODate(date);\n this.value = dateStr;\n return dateStr;\n }\n\n connectedCallback() {\n this.setDatePattern();\n this.handleValueChange();\n }\n\n componentDidLoad() {\n if (!this.pickerCloseBtn \|\| !this.picker) return;\n this.pickerEle.firstFocusEle = this.pickerCloseBtn;\n this.dropdown.tetherTo = this.trigger;\n setTimeout((_) => this.handlePickerOpenChange(), 300);\n }\n\n render() {\n this.locale =\n (navigator.languages as string[]) \|\| navigator.language \|\| undefined;\n let placement: 'bottom-start' \| 'bottom-end' =\n (this.host.ownerDocument as Document).dir === 'rtl'\n ? 'bottom-start'\n : 'bottom-end';\n const valueDate = parseISODate(this.value);\n const hasHelperSlot = !!this.host.querySelector('[slot=\"helper\"]');\n\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <div class=\"date-field\">\n <nano-input\n class=\"date-field__input\"\n slot=\"trigger\"\n required={this.required \|\| undefined}\n showInlineError={this.showInlineError}\n validateOn={this.validateOn}\n placeholder={\n this.placeholder !== 'false' ? this.placeholder : undefined\n }\n pattern={this.pattern}\n label={this.label}\n disabled={this.disabled \|\| undefined}\n color={this.color \|\| undefined}\n autofocus={this.autofocus \|\| undefined}\n clearInput={this.clearInput \|\| undefined}\n onNanoChange={this.onInputChange}\n onNanoInput={this.onInputKey}\n onNanoValidate={this.onInputValidate}\n name=\"\"\n form={this.form \|\| undefined}\n size={this.size \|\| undefined}\n readonly={this.readonly}\n value={this.inputValue}\n ref={(input) => (this.input = input)}\n floatLabel={this.floatLabel}\n hideLabel={this.hideLabel}\n inputmode={'numeric'}\n >\n <slot name=\"start\" slot=\"start\" />\n <slot name=\"label\" />\n <slot name=\"end\" slot=\"end\" />\n {this.picker && [\n <button\n slot=\"end\"\n class=\"date-field__open\"\n type=\"button\"\n onKeyDown={this.onTriggerKey}\n onClick={this.onTriggerClick}\n ref={(trigger) => (this.trigger = trigger)}\n disabled={this.disabled \|\| this.readonly}\n >\n <nano-icon name=\"light/calendar-alt\"></nano-icon>\n </button>,\n\n <nano-dropdown\n slot=\"end\"\n placement={placement}\n onNanoHide={this.onDropdownHide}\n onNanoShow={this.onDropdownShow}\n dialogTitle=\"Choose a date\"\n class=\"date-field__dropdown\"\n ref={(dropdown) => (this.dropdown = dropdown)}\n >\n <div>\n <div class=\"date-field__close-bar\">\n <button\n class=\"date-field__close\"\n type=\"button\"\n onMouseDown={this.onCloseClick}\n onKeyDown={this.onCloseKeyDown}\n ref={(pickerClose) => (this.pickerCloseBtn = pickerClose)}\n >\n <nano-icon name=\"light/times\"></nano-icon>\n <span class=\"vhidden\">Close window</span>\n </button>\n </div>\n <nano-date-picker\n onNanoDatePicked={this.onDatePicked}\n min={this.min \|\| undefined}\n max={this.max \|\| undefined}\n is-modal={true}\n ref={(picker) => (this.pickerEle = picker)}\n localization={this.localization}\n selectedDate={this.value \|\| this.initialPickerDate}\n firstDayOfWeek={this.firstDayOfWeek}\n color={this.color \|\| undefined}\n ></nano-date-picker>\n </div>\n </nano-dropdown>,\n ]}\n {(hasHelperSlot \|\| this.helperText \|\| this.showInlineError) && (\n <span slot=\"helper\">\n <span class={{ vhidden: !!this.value.length }}>\n <slot name=\"helper\" />\n </span>\n {this.helperText && !!valueDate && (\n <span>\n {valueDate.toLocaleDateString(\n this.locale,\n this.helperTextFormat\n )}\n </span>\n )}\n </span>\n )}\n </nano-input>\n <input type=\"hidden\" value={this.value} name={this.name} />\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/date-picker/date-picker.css CHANGED Viewed

@@ -7,6 +7,9 @@
 *::after {
   box-sizing: border-box;
 }
+[hidden] {
+  display: none !important;
+}
 :host {
   /**
    * @prop --background: defaults to var(--nano-layer-bg, #fff)

package/dist/collection/components/date-picker/date-picker.js CHANGED Viewed

@@ -370,7 +370,7 @@ export class DatePicker {
         "references": {
           "DaysOfWeek": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/utils/date-utils.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/utils/date-utils.ts"
           }
         }
       },
@@ -395,7 +395,7 @@ export class DatePicker {
         "references": {
           "DuetLocalizedText": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -418,7 +418,7 @@ export class DatePicker {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -442,7 +442,7 @@ export class DatePicker {
         "references": {
           "DateDisabledPredicate": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },
@@ -521,7 +521,7 @@ export class DatePicker {
         "references": {
           "PickerChangeEvent": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       }

package/dist/collection/components/details/details.css CHANGED Viewed

@@ -7,6 +7,9 @@
 *::after {
   box-sizing: border-box;
 }
+[hidden] {
+  display: none !important;
+}
 :host {
   /**
     * @prop --padding: Default to 1em;

package/dist/collection/components/details/details.js CHANGED Viewed

@@ -4,7 +4,7 @@
 import { Component, Event, Prop, h, Element, Watch, Host, State, writeTask, readTask, } from '@stencil/core';
 import ResizeObserver from 'resize-observer-polyfill';
 import { createColorClasses } from '../../utils/theme';
-import { testLegacyStyle, displayTransition } from '../../utils';
+import { displayTransition } from '../../utils';
 /**
  * A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.
  */
@@ -106,7 +106,6 @@ export class Details {
     this.attachRO();
   }
   connectedCallback() {
-    testLegacyStyle(this.el);
     const mo = (this.mo = new MutationObserver(() => this.resize()));
     mo.observe(this.el, { childList: true, subtree: true, attributes: false });
     this.attachRO();
@@ -235,7 +234,7 @@ export class Details {
         "references": {
           "Color": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/interface.d.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/interface.d.ts"
           }
         }
       },

package/dist/collection/components/details/details.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"details.js","sourceRoot":"","sources":["../../../src/components/details/details.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,KAAK,EAEL,IAAI,EACJ,CAAC,EACD,OAAO,EACP,KAAK,EACL,IAAI,EACJ,KAAK,EACL,SAAS,EACT,QAAQ,GACT,MAAM,eAAe,CAAC;AACvB,OAAO,cAAc,MAAM,0BAA0B,CAAC;AAEtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAEjE;;GAEG;AACH;;;;;GAKG;AAMH,MAAM,OAAO,OAAO;EALpB;IAQU,YAAO,GAAG,gBAAgB,QAAQ,EAAE,EAAE,CAAC;IAIvC,kBAAa,GAAY,KAAK,CAAC;IAE9B,cAAS,GAAG,IAAI,CAAC;IAM1B;;;OAGG;IACK,UAAK,GAAW,EAAE,CAAC;IAE3B;;OAEG;IACqC,SAAI,GAAY,KAAK,CAAC;IAE9D;;OAEG;IACK,aAAQ,GAAY,KAAK,CAAC;IAElC;;OAEG;IACK,iBAAY,GAAW,EAAE,CAAC;IA0B1B,cAAS,GAAG,CAAC,EAAiB,EAAE,EAAE;MACxC,QAAQ,EAAE,CAAC,GAAG,EAAE;QACd,KAAK,OAAO,CAAC;QACb,KAAK,GAAG;UACN,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;UACvB,MAAM;OACT;IACH,CAAC,CAAC;IAEM,gBAAW,GAAG,GAAG,EAAE;MACzB,IAAI,IAAI,CAAC,aAAa;QAAE,OAAO;MAC/B,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB,CAAC,CAAC;GAkIH;EApJC,WAAW;IACT,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC1B,IAAI,IAAI,CAAC,IAAI;MAAE,IAAI,CAAC,IAAI,EAAE,CAAC;;MACtB,IAAI,CAAC,IAAI,EAAE,CAAC;EACnB,CAAC;EAgBO,IAAI;IACV,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAChC,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,IAAI,CACvD,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,CACnC,CAAC;IACF,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;EACtC,CAAC;EAEO,IAAI;IACV,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACvB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE;MAC5D,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC7B,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,YAAY,GAAG,IAAI,CAAC;EACrE,CAAC;EAEO,MAAM;IACZ,IACE,CAAC,IAAI,CAAC,IAAI;MACV,CAAC,IAAI,CAAC,WAAW;MACjB,CAAC,IAAI,CAAC,SAAS;MACf,IAAI,CAAC,aAAa;MAElB,OAAO;IACT,QAAQ,CAAC,GAAG,EAAE;MACZ,IAAI,IAAI,CAAC,WAAW,CAAC,YAAY,GAAG,CAAC,EAAE;QACrC,SAAS,CAAC,GAAG,EAAE;UACb,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,YAAY,GAAG,IAAI,CAAC;QACrE,CAAC,CAAC,CAAC;OACJ;IACH,CAAC,CAAC,CAAC;EACL,CAAC;EAEO,QAAQ;IACd,IAAI,IAAI,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,WAAW;MAAE,OAAO;IAEzC,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IAC/D,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;EAC/B,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACnE,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;IAC/D,UAAU,CAAC,GAAG,EAAE;MACd,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IACzB,CAAC,EAAE,GAAG,CAAC,CAAC;EACV,CAAC;EAED,gBAAgB;IACd,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,6BAA6B;MAC7B,UAAU,CAAC,GAAG,EAAE;QACd,IAAI,CAAC,IAAI,EAAE,CAAC;MACd,CAAC,EAAE,CAAC,CAAC,CAAC;KACP;IACD,IAAI,CAAC,QAAQ,EAAE,CAAC;EAClB,CAAC;EAED,iBAAiB;IACf,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACzB,MAAM,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IACjE,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,CAAC;IAC3E,IAAI,CAAC,QAAQ,EAAE,CAAC;EAClB,CAAC;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,EAAE;MAAE,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;IAClC,IAAI,IAAI,CAAC,EAAE;MAAE,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;EACpC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,oBAAO,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC;MAC9C,WACE,KAAK,EAAE;UACL,IAAI,EAAE,IAAI,CAAC,IAAI;UACf,MAAM,EAAE,CAAC,IAAI,CAAC,SAAS;SACxB;QAED,cACE,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,WAAW,EAAE,IAAI,CAAC,WAAW,mBACd,IAAI,CAAC,OAAO,mBACZ,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC3C,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;UAE9C,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnB,YACE,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE;cACL,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,YAAY,MAAM,CAAC,CAAC,CAAC,EAAE;aAC9D;YAED,YAAM,IAAI,EAAC,YAAY,GAAG,CACrB,CACR,CAAC,CAAC,CAAC,CACF,EAAE,CACH;UACD,WAAK,KAAK,EAAC,OAAO,IACf,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAM,IAAI,EAAC,OAAO,GAAG,CAC5C;UACL,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CACjB,YACE,KAAK,EAAC,gBAAgB,EACtB,KAAK,EAAE;cACL,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,YAAY,MAAM,CAAC,CAAC,CAAC,EAAE;aAC9D;YAED,YAAM,IAAI,EAAC,UAAU,GAAG,CACnB,CACR,CAAC,CAAC,CAAC,CACF,EAAE,CACH,CACM;QACT,WACE,KAAK,EAAC,SAAS,EACf,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC,EACpC,QAAQ,EAAC,IAAI,EACb,EAAE,EAAE,IAAI,CAAC,OAAO;UAEhB,WAAK,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC,EAAE,KAAK,EAAC,eAAe;YAChE,eAAQ,CACJ,CACF,CACF,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF;AAED,IAAI,QAAQ,GAAG,CAAC,CAAC","sourcesContent":["import {\n Component,\n Event,\n EventEmitter,\n Prop,\n h,\n Element,\n Watch,\n Host,\n State,\n writeTask,\n readTask,\n} from '@stencil/core';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { Color } from '../../interface';\nimport { createColorClasses } from '../../utils/theme';\nimport { testLegacyStyle, displayTransition } from '../../utils';\n\n/*\n A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.\n /\n/\n @slot - content that will be hidden / revealed\n * @slot icon-start - used for icons at the start of the handle\n * @slot label - can be used when you wish to insert complex label markup\n * @slot icon-end - used for icons at the end of the handle\n /\n@Component({\n tag: 'nano-details',\n styleUrl: 'details.scss',\n shadow: true,\n})\nexport class Details {\n private hasStartSlot: boolean;\n private hasEndSlot: boolean;\n private slideId = `nano-details-${slideIds++}`;\n private mo?: MutationObserver;\n private ro?: ResizeObserver;\n private contentArea: HTMLDivElement;\n private stateChanging: boolean = false;\n\n @State() isLoading = true;\n\n @Element() private el: HTMLNanoDetailsElement;\n\n private contentEl: HTMLElement;\n\n /\n Button / handle text to be used if no complex markup required.\n * Otherwise use label slot.\n /\n @Prop() label: string = '';\n\n /\n Should item be open on load\n /\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /\n Have no handle - you will need to control the hiding / showing of content with script\n /\n @Prop() noHandle: boolean = false;\n\n /\n Icon slot rotation amount (degrees) on open\n /\n @Prop() iconRotation: number = 90;\n\n /\n Color to use from your application's color palette.\n /\n @Prop() color?: Color;\n\n /\n Emitted when the component opens.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n /\n @Event() nanoOpened: EventEmitter;\n\n /\n Emitted when the component closes.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n */\n @Event() nanoClosed: EventEmitter;\n\n @Watch('open')\n toggleClick() {\n this.stateChanging = true;\n if (this.open) this.show();\n else this.hide();\n }\n\n private onKeyDown = (ev: KeyboardEvent) => {\n switch (ev.key) {\n case 'Enter':\n case ' ':\n this.open = !this.open;\n break;\n }\n };\n\n private onMouseDown = () => {\n if (this.stateChanging) return;\n this.open = !this.open;\n };\n\n private hide() {\n this.nanoClosed.emit(this.open);\n displayTransition(this.contentEl, 'is-shown', false).then(\n () => (this.stateChanging = false)\n );\n this.contentEl.style.height = '0px';\n }\n\n private show() {\n this.nanoOpened.emit();\n displayTransition(this.contentEl, 'is-shown', true).then(() => {\n this.stateChanging = false;\n });\n this.contentEl.style.height = this.contentArea.scrollHeight + 'px';\n }\n\n private resize() {\n if (\n !this.open \|\|\n !this.contentArea \|\|\n !this.contentEl \|\|\n this.stateChanging\n )\n return;\n readTask(() => {\n if (this.contentArea.scrollHeight > 0) {\n writeTask(() => {\n this.contentEl.style.height = this.contentArea.scrollHeight + 'px';\n });\n }\n });\n }\n\n private attachRO() {\n if (this.ro \|\| !this.contentArea) return;\n\n const ro = (this.ro = new ResizeObserver(() => this.resize()));\n ro.observe(this.contentArea);\n }\n\n componentWillLoad() {\n this.hasStartSlot = !!this.el.querySelector('[slot=\"icon-start\"]');\n this.hasEndSlot = !!this.el.querySelector('[slot=\"icon-end\"]');\n setTimeout(() => {\n this.isLoading = false;\n }, 100);\n }\n\n componentDidLoad() {\n if (this.open) {\n // disable animation on start\n setTimeout(() => {\n this.show();\n }, 0);\n }\n this.attachRO();\n }\n\n connectedCallback() {\n testLegacyStyle(this.el);\n const mo = (this.mo = new MutationObserver(() => this.resize()));\n mo.observe(this.el, { childList: true, subtree: true, attributes: false });\n this.attachRO();\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n if (this.ro) this.ro.disconnect();\n }\n\n render() {\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <div\n class={{\n open: this.open,\n loaded: !this.isLoading,\n }}\n >\n <button\n onKeyDown={this.onKeyDown}\n onMouseDown={this.onMouseDown}\n aria-controls={this.slideId}\n aria-expanded={this.open ? 'true' : 'false'}\n style={{ display: this.noHandle ? 'none' : '' }}\n >\n {this.hasStartSlot ? (\n <span\n class=\"icon icon--start\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-start\" />\n </span>\n ) : (\n ''\n )}\n <div class=\"label\">\n {this.label ? this.label : <slot name=\"label\" />}\n </div>\n {this.hasEndSlot ? (\n <span\n class=\"icon icon--end\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-end\" />\n </span>\n ) : (\n ''\n )}\n </button>\n <div\n class=\"content\"\n ref={(div) => (this.contentEl = div)}\n tabindex=\"-1\"\n id={this.slideId}\n >\n <div ref={(div) => (this.contentArea = div)} class=\"content__area\">\n <slot />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\nlet slideIds = 0;\n"]}
1	+ {"version":3,"file":"details.js","sourceRoot":"","sources":["../../../src/components/details/details.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Event,\n EventEmitter,\n Prop,\n h,\n Element,\n Watch,\n Host,\n State,\n writeTask,\n readTask,\n} from '@stencil/core';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { Color } from '../../interface';\nimport { createColorClasses } from '../../utils/theme';\nimport { displayTransition } from '../../utils';\n\n/*\n A simple element used to hide or reveal more content with slide effect. Can be used independently or nested within a [accordion](story/components-accordion--accordion) element to add 'one item open at a time' support.\n /\n/\n @slot - content that will be hidden / revealed\n * @slot icon-start - used for icons at the start of the handle\n * @slot label - can be used when you wish to insert complex label markup\n * @slot icon-end - used for icons at the end of the handle\n /\n@Component({\n tag: 'nano-details',\n styleUrl: 'details.scss',\n shadow: true,\n})\nexport class Details {\n private hasStartSlot: boolean;\n private hasEndSlot: boolean;\n private slideId = `nano-details-${slideIds++}`;\n private mo?: MutationObserver;\n private ro?: ResizeObserver;\n private contentArea: HTMLDivElement;\n private stateChanging: boolean = false;\n\n @State() isLoading = true;\n\n @Element() private el: HTMLNanoDetailsElement;\n\n private contentEl: HTMLElement;\n\n /\n Button / handle text to be used if no complex markup required.\n * Otherwise use label slot.\n /\n @Prop() label: string = '';\n\n /\n Should item be open on load\n /\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /\n Have no handle - you will need to control the hiding / showing of content with script\n /\n @Prop() noHandle: boolean = false;\n\n /\n Icon slot rotation amount (degrees) on open\n /\n @Prop() iconRotation: number = 90;\n\n /\n Color to use from your application's color palette.\n /\n @Prop() color?: Color;\n\n /\n Emitted when the component opens.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n /\n @Event() nanoOpened: EventEmitter;\n\n /\n Emitted when the component closes.\n * Note: when wrapped in an accordion this event will not propogate. Use nanoToggle events instead.\n */\n @Event() nanoClosed: EventEmitter;\n\n @Watch('open')\n toggleClick() {\n this.stateChanging = true;\n if (this.open) this.show();\n else this.hide();\n }\n\n private onKeyDown = (ev: KeyboardEvent) => {\n switch (ev.key) {\n case 'Enter':\n case ' ':\n this.open = !this.open;\n break;\n }\n };\n\n private onMouseDown = () => {\n if (this.stateChanging) return;\n this.open = !this.open;\n };\n\n private hide() {\n this.nanoClosed.emit(this.open);\n displayTransition(this.contentEl, 'is-shown', false).then(\n () => (this.stateChanging = false)\n );\n this.contentEl.style.height = '0px';\n }\n\n private show() {\n this.nanoOpened.emit();\n displayTransition(this.contentEl, 'is-shown', true).then(() => {\n this.stateChanging = false;\n });\n this.contentEl.style.height = this.contentArea.scrollHeight + 'px';\n }\n\n private resize() {\n if (\n !this.open \|\|\n !this.contentArea \|\|\n !this.contentEl \|\|\n this.stateChanging\n )\n return;\n readTask(() => {\n if (this.contentArea.scrollHeight > 0) {\n writeTask(() => {\n this.contentEl.style.height = this.contentArea.scrollHeight + 'px';\n });\n }\n });\n }\n\n private attachRO() {\n if (this.ro \|\| !this.contentArea) return;\n\n const ro = (this.ro = new ResizeObserver(() => this.resize()));\n ro.observe(this.contentArea);\n }\n\n componentWillLoad() {\n this.hasStartSlot = !!this.el.querySelector('[slot=\"icon-start\"]');\n this.hasEndSlot = !!this.el.querySelector('[slot=\"icon-end\"]');\n setTimeout(() => {\n this.isLoading = false;\n }, 100);\n }\n\n componentDidLoad() {\n if (this.open) {\n // disable animation on start\n setTimeout(() => {\n this.show();\n }, 0);\n }\n this.attachRO();\n }\n\n connectedCallback() {\n const mo = (this.mo = new MutationObserver(() => this.resize()));\n mo.observe(this.el, { childList: true, subtree: true, attributes: false });\n this.attachRO();\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n if (this.ro) this.ro.disconnect();\n }\n\n render() {\n return (\n <Host class={{ ...createColorClasses(this.color) }}>\n <div\n class={{\n open: this.open,\n loaded: !this.isLoading,\n }}\n >\n <button\n onKeyDown={this.onKeyDown}\n onMouseDown={this.onMouseDown}\n aria-controls={this.slideId}\n aria-expanded={this.open ? 'true' : 'false'}\n style={{ display: this.noHandle ? 'none' : '' }}\n >\n {this.hasStartSlot ? (\n <span\n class=\"icon icon--start\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-start\" />\n </span>\n ) : (\n ''\n )}\n <div class=\"label\">\n {this.label ? this.label : <slot name=\"label\" />}\n </div>\n {this.hasEndSlot ? (\n <span\n class=\"icon icon--end\"\n style={{\n transform: this.open ? `rotate(${this.iconRotation}deg)` : '',\n }}\n >\n <slot name=\"icon-end\" />\n </span>\n ) : (\n ''\n )}\n </button>\n <div\n class=\"content\"\n ref={(div) => (this.contentEl = div)}\n tabindex=\"-1\"\n id={this.slideId}\n >\n <div ref={(div) => (this.contentArea = div)} class=\"content__area\">\n <slot />\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n\nlet slideIds = 0;\n"]}

package/dist/collection/components/dialog/dialog.css CHANGED Viewed

@@ -7,6 +7,9 @@
 *::after {
   box-sizing: border-box;
 }
+[hidden] {
+  display: none !important;
+}
 /**
  * @prop --width: The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens.
  * @prop --border-radius: defaults to var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));
@@ -23,7 +26,7 @@
   --content-background: #fafafa;
   --footer-content: #e4e6e8;
   --scrim-color: var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));
-  --box-shadow: var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.3));
+  --box-shadow: var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));
   --close-button-color: #b5aea7;
   --width: 60rem;
   --tint-color: #00607b;

package/dist/collection/components/dialog/dialog.helpers.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dialog.helpers.js","sourceRoot":"","sources":["../../../src/components/dialog/dialog.helpers.ts"],"names":[],"mappings":"AAMA;;;;;;GAMG;AACH,MAAM,UAAU,gBAAgB,CAC9B,IAAY,EACZ,UAAqE,EAAE,EACvE,~~aAAsC~~;~~EAEtC~~,MAAM,IAAI,mBACR,aAAa,EAAE,KAAK,EACpB,KAAK,EAAE,QAAQ,IACZ,aAAa,CACjB,CAAC;EACF,MAAM,MAAM,GAA0B,MAAM,CAAC,MAAM,CACjD,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,kCAEhC,IAAI,KACP,IAAI,EAAE,KAAK,EACX,SAAS,EAAE;QACT,IAAI;QAEJ,OAAO,CAAC,MAAM;MACZ,CAAC,CAAC,OAAO;SACJ,GAAG,CACF,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CACT,qBAAqB,CAAC,mBAAmB,GAAG,CAAC,OAAO,mBAAmB,GAAG,CAAC,OAAO,WAAW,CAChG;SACA,IAAI,CAAC,EAAE,CAAC;MACb,CAAC,CAAC,EACN,EAAE,IAEL,CAAC;EAEF,IAAI,OAAO,CAAC,MAAM,EAAE;IAClB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC,CAAC,GAAG,CAC9D,CAAC,GAAgB,EAAE,EAAE;MACnB,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAC3B,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,CAAC,QAAQ,EAAE,CAC7C,CAAC;MACF,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;QAChC,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;OACjD;IACH,CAAC,CACF,CAAC;GACH;EAED,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;EAClC,OAAO,MAAM,CAAC;AAChB,CAAC","sourcesContent":["interface ImperativeDialogOptions {\n noUserDismiss: boolean;\n noHeader?: boolean;\n noFooter?: boolean;\n label: string;\n}\n/*\n `nano-dialog` helper to create dialog modals imperatively.\n * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param dialogOptions - { noUserDismiss: boolean, noHeader?: boolean, noFooter?: boolean, label: string }\n * @returns `Promise<void>`\n */\nexport function nanoCreateDialog(\n body: string,\n buttons: { classes: string; content: string; handler: () => {} }[] = [],\n dialogOptions: ImperativeDialogOptions\n) {\n const opts: ImperativeDialogOptions = {\n noUserDismiss: false,\n label: 'Dialog',\n ...dialogOptions,\n };\n const dialog: HTMLNanoDialogElement = Object.assign(\n document.createElement('nano-dialog'),\n {\n ...opts,\n open: false,\n innerHTML: `\n ${body}\n ${\n buttons.length\n ? buttons\n .map(\n (btn, i) =>\n `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n )\n .join('')\n : ''\n }`,\n }\n );\n\n if (buttons.length) {\n Array.from(dialog.querySelectorAll('button[slot=\"footer\"]')).map(\n (btn: HTMLElement) => {\n const foundBtn = buttons.find(\n (_fb, i) => btn.dataset.btn === i.toString()\n );\n if (foundBtn && foundBtn.handler) {\n btn.addEventListener('click', foundBtn.handler);\n }\n }\n );\n }\n\n document.body.appendChild(dialog);\n return dialog;\n}\n"]}
1	+ {"version":3,"file":"dialog.helpers.js","sourceRoot":"","sources":["../../../src/components/dialog/dialog.helpers.ts"],"names":[],"mappings":"AAMA;;;;;;GAMG;AACH,MAAM,UAAU,gBAAgB,CAC9B,IAAY,EACZ,UAAqE,EAAE,EACvE,aAAuC;EAEvC,MAAM,IAAI,mBACR,aAAa,EAAE,KAAK,EACpB,KAAK,EAAE,QAAQ,IACZ,aAAa,CACjB,CAAC;EACF,MAAM,MAAM,GAA0B,MAAM,CAAC,MAAM,CACjD,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,kCAEhC,IAAI,KACP,IAAI,EAAE,KAAK,EACX,SAAS,EAAE;QACT,IAAI;QAEJ,OAAO,CAAC,MAAM;MACZ,CAAC,CAAC,OAAO;SACJ,GAAG,CACF,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CACT,qBAAqB,CAAC,mBAAmB,GAAG,CAAC,OAAO,mBAAmB,GAAG,CAAC,OAAO,WAAW,CAChG;SACA,IAAI,CAAC,EAAE,CAAC;MACb,CAAC,CAAC,EACN,EAAE,IAEL,CAAC;EAEF,IAAI,OAAO,CAAC,MAAM,EAAE;IAClB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC,CAAC,GAAG,CAC9D,CAAC,GAAgB,EAAE,EAAE;MACnB,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAC3B,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,CAAC,QAAQ,EAAE,CAC7C,CAAC;MACF,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;QAChC,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;OACjD;IACH,CAAC,CACF,CAAC;GACH;EAED,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;EAClC,OAAO,MAAM,CAAC;AAChB,CAAC","sourcesContent":["interface ImperativeDialogOptions {\n noUserDismiss: boolean;\n noHeader?: boolean;\n noFooter?: boolean;\n label: string;\n}\n/*\n `nano-dialog` helper to create dialog modals imperatively.\n * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param dialogOptions - { noUserDismiss: boolean, noHeader?: boolean, noFooter?: boolean, label: string }\n * @returns `Promise<void>`\n */\nexport function nanoCreateDialog(\n body: string,\n buttons: { classes: string; content: string; handler: () => {} }[] = [],\n dialogOptions?: ImperativeDialogOptions\n) {\n const opts: ImperativeDialogOptions = {\n noUserDismiss: false,\n label: 'Dialog',\n ...dialogOptions,\n };\n const dialog: HTMLNanoDialogElement = Object.assign(\n document.createElement('nano-dialog'),\n {\n ...opts,\n open: false,\n innerHTML: `\n ${body}\n ${\n buttons.length\n ? buttons\n .map(\n (btn, i) =>\n `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n )\n .join('')\n : ''\n }`,\n }\n );\n\n if (buttons.length) {\n Array.from(dialog.querySelectorAll('button[slot=\"footer\"]')).map(\n (btn: HTMLElement) => {\n const foundBtn = buttons.find(\n (_fb, i) => btn.dataset.btn === i.toString()\n );\n if (foundBtn && foundBtn.handler) {\n btn.addEventListener('click', foundBtn.handler);\n }\n }\n );\n }\n\n document.body.appendChild(dialog);\n return dialog;\n}\n"]}

package/dist/collection/components/dialog/dialog.js CHANGED Viewed

@@ -336,7 +336,7 @@ export class Dialog {
         "references": {
           "StorageMethods": {
             "location": "import",
-            "path": "/builds/YGFYbT4i/0/Digital/nano-components/packages/components/src/utils/store/component-store.ts"
+            "path": "/builds/CtjnL93R/0/Digital/nano-components/packages/components/src/utils/store/component-store.ts"
           }
         }
       },

package/dist/collection/components/drawer/drawer.css CHANGED Viewed

@@ -7,6 +7,9 @@
 *::after {
   box-sizing: border-box;
 }
+[hidden] {
+  display: none !important;
+}
 :host {
   /**
   * @prop --size: The preferred size of the drawer; width or height depending on placement. Note that the drawer will shrink to accommodate smaller screens. Defaults to 25rem