udp-stencil-component-library 1.0.2 → 1.0.3

package/dist/collection/components/test-component/inputs-example/inputs-example.js.map

@@ -1 +1 @@
-{"version":3,"file":"inputs-example.js","sourceRoot":"","sources":["../../../../src/components/test-component/inputs-example/inputs-example.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEpD;;;;;;;;GAQG;AAMH,MAAM,OAAO,aAAa;IAL1B;QAQE,kCAAkC;QACzB,wBAAmB,GAAW,EAAE,CAAC;QACjC,2BAAsB,GAAW,EAAE,CAAC;QACpC,4BAAuB,GAAW,EAAE,CAAC;QACrC,4BAAuB,GAAY,KAAK,CAAC;QACzC,0BAAqB,GAAY,KAAK,CAAC;QACvC,wBAAmB,GAAW,EAAE,CAAC;QACjC,wBAAmB,GAAW,EAAE,CAAC;QACjC,4BAAuB,GAAW,EAAE,CAAC;QACrC,4BAAuB,GAAW,EAAE,CAAC;QACrC,wBAAmB,GAAW,EAAE,CAAC;QAE1C,wBAAwB;QACf,eAAU,GAAQ,EAAE,CAAC;QAE9B,sCAAsC;QAC9B,oBAAe,GAAG;YACxB,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE;YACvC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE;YACvC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE;YACvC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE;SACxC,CAAC;QAEF,2CAA2C;QAC3C,iEAAiE;QACjE,6CAA6C;QAC7C,KAAK;QACG,kCAA6B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC7D,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC,MAAM,CAAC;QAC7C,CAAC,CAAC;QAEM,mCAA8B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC9D,IAAI,CAAC,uBAAuB,GAAG,KAAK,CAAC,MAAM,KAAK,MAAM,CAAC;QACzD,CAAC,CAAC;QACM,iCAA4B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC5D,IAAI,CAAC,qBAAqB,GAAG,KAAK,CAAC,MAAM,KAAK,MAAM,CAAC;QACvD,CAAC,CAAC;QACM,+BAA0B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1D,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;YAClB,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAC;QAC1C,CAAC,CAAC;QACM,+BAA0B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1D,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAC;QAC1C,CAAC,CAAC;QACM,mCAA8B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC9D,IAAI,CAAC,uBAAuB,GAAG,KAAK,CAAC,MAAM,CAAC;QAC9C,CAAC,CAAC;QACM,mCAA8B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC9D,IAAI,CAAC,uBAAuB,GAAG,KAAK,CAAC,MAAM,CAAC;QAC9C,CAAC,CAAC;QACM,+BAA0B,GAAG,CAAC,KAAkB,EAAE,EAAE;YAC1D,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;QACtD,CAAC,CAAC;QAEF,sBAAsB;QACd,qBAAgB,GAAG,CAAC,MAAW,EAAE,EAAE;YACzC,OAAO,CAAC,GAAG,CAAC,6BAA6B,EAAE,MAAM,CAAC,CAAC;YACnD,KAAK,CAAC,2CAA2C,CAAC,CAAC;QACrD,CAAC,CAAC;QAEM,qBAAgB,GAAG,CAAC,MAAW,EAAE,EAAE;YACzC,IAAI,CAAC,UAAU,qBAAQ,MAAM,CAAE,CAAC;QAClC,CAAC,CAAC;QAEM,iBAAY,GAAG,CAAC,MAAW,EAAE,EAAE;YACrC,MAAM,MAAM,GAAQ,EAAE,CAAC;YAEvB,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC;gBAC1B,MAAM,CAAC,aAAa,GAAG,wBAAwB,CAAC;YAClD,CAAC;YAED,IAAI,CAAC,MAAM,CAAC,gBAAgB,IAAI,UAAU,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,CAAC,EAAE,CAAC;gBACxE,MAAM,CAAC,gBAAgB,GAAG,2BAA2B,CAAC;YACxD,CAAC;YAED,IAAI,CAAC,MAAM,CAAC,YAAY,EAAE,CAAC;gBACzB,MAAM,CAAC,YAAY,GAAG,yBAAyB,CAAC;YAClD,CAAC;YAED,IAAI,CAAC,MAAM,CAAC,YAAY,EAAE,CAAC;gBACzB,MAAM,CAAC,YAAY,GAAG,2BAA2B,CAAC;YACpD,CAAC;YAED,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;gBACrB,MAAM,CAAC,QAAQ,GAAG,sBAAsB,CAAC;YAC3C,CAAC;YAED,IAAI,CAAC,MAAM,CAAC,YAAY,EAAE,CAAC;gBACzB,MAAM,CAAC,YAAY,GAAG,yBAAyB,CAAC;YAClD,CAAC;YAED,OAAO,MAAM,CAAC;QAChB,CAAC,CAAC;KAiYH;IA/XC,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,gBAAgB;YACzB,yFAAkC;YAGlC,gEAAS,KAAK,EAAC,iBAAiB;gBAC9B,qFAA8B;gBAC9B,oIAA4E;gBAE5E,4DAAK,KAAK,EAAC,YAAY;oBACrB,4DAAK,KAAK,EAAC,eAAe;wBACxB,0EAAmB;wBACnB,mEACE,KAAK,EAAC,uBAAuB,EAC7B,WAAW,EAAC,eAAe,EAC3B,KAAK,EAAE,IAAI,CAAC,mBAAmB,GAC/B;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAS,IAAI,CAAC,mBAAmB,CAAK,CAC1D;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,6EAAsB;wBACtB,sEACE,KAAK,EAAC,0BAA0B,EAChC,WAAW,EAAC,iBAAiB,EAC7B,KAAK,EAAE,IAAI,CAAC,sBAAsB,EAClC,GAAG,EAAC,GAAG,EACP,GAAG,EAAC,KAAK,EACT,IAAI,EAAC,GAAG,EACR,QAAQ,EAAE,IAAI,CAAC,6BAA6B,GAC5C;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAS,IAAI,CAAC,sBAAsB,CAAK,CAC7D;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,yEAAkB;wBAClB,kEACE,KAAK,EAAC,sBAAsB,EAC5B,WAAW,EAAC,sBAAsB,EAClC,KAAK,EAAE,IAAI,CAAC,uBAAuB,EACnC,OAAO,EAAE,CAAC,EACV,OAAO,EAAE,CAAC,GACV;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAS,IAAI,CAAC,uBAAuB,CAAK,CAC9D;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,wEAAiB;wBACjB,kEACE,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,IAAI,CAAC,uBAAuB,EACrC,QAAQ,EAAE,IAAI,CAAC,8BAA8B,GAC7C;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAW,IAAI,CAAC,uBAAuB,CAAC,QAAQ,EAAE,CAAK,CAC3E;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,sEAAe;wBACf,uEACE,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,IAAI,CAAC,qBAAqB,EACnC,QAAQ,EAAE,IAAI,CAAC,4BAA4B,GAC3C;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAW,IAAI,CAAC,qBAAqB,CAAC,QAAQ,EAAE,CAAK,CACzE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,6EAAsB;wBACtB,0EACE,KAAK,EAAC,iBAAiB,EACvB,KAAK,EAAE,IAAI,CAAC,mBAAmB,EAC/B,QAAQ,EAAE,IAAI,CAAC,0BAA0B,GACzC;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAQ,IAAI,CAAC,mBAAmB,CAAK,CACzD;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,iFAA0B;wBAC1B,8EACE,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAE,IAAI,CAAC,uBAAuB,EACnC,QAAQ,EAAE,IAAI,CAAC,8BAA8B,GAC7C;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAY,IAAI,CAAC,uBAAuB,CAAK,CACjE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,6EAAsB;wBACtB,0EACE,KAAK,EAAC,iBAAiB,EACvB,KAAK,EAAE,IAAI,CAAC,mBAAmB,EAC/B,QAAQ,EAAE,IAAI,CAAC,0BAA0B,GACzC;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAQ,IAAI,CAAC,mBAAmB,CAAK,CACzD;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,4EAAqB;wBACrB,qEACE,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,KAAK,EAAE,IAAI,CAAC,uBAAuB,EACnC,QAAQ,EAAE,IAAI,CAAC,8BAA8B,GAC7C;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAY,IAAI,CAAC,uBAAuB,CAAK,CACjE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,2EAAoB;wBACpB,oEACE,KAAK,EAAC,wBAAwB,EAC9B,aAAa,EAAE,IAAI,EACnB,QAAQ,EAAE,IAAI,CAAC,0BAA0B,GACzC;wBACF,0DAAG,KAAK,EAAC,eAAe;;4BAAS,IAAI,CAAC,mBAAmB,CAAC,MAAM;wCAAc,CAC1E,CACF,CACE;YAGV,gEAAS,KAAK,EAAC,iBAAiB;gBAC9B,uFAAgC;gBAChC,qHAA6D;gBAE7D,4DAAK,KAAK,EAAC,YAAY;oBACrB,4DAAK,KAAK,EAAC,eAAe;wBACxB,0EAAmB;wBACnB,mEACE,KAAK,EAAC,yBAAyB,EAC/B,WAAW,EAAC,eAAe,EAC3B,YAAY,EAAC,oBAAoB,EACjC,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,GACpE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,6EAAsB;wBACtB,sEACE,KAAK,EAAC,4BAA4B,EAClC,WAAW,EAAC,iBAAiB,EAC7B,YAAY,EAAC,IAAI,EACjB,GAAG,EAAC,GAAG,EACP,GAAG,EAAC,KAAK,EACT,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC,CAAC,MAAM,CAAC,GACtE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,yEAAkB;wBAClB,kEACE,KAAK,EAAC,wBAAwB,EAC9B,WAAW,EAAC,sBAAsB,EAClC,YAAY,EAAC,0BAA0B,EACvC,OAAO,EAAE,CAAC,EACV,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,CAAC,CAAC,MAAM,CAAC,GACzE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,wEAAiB;wBACjB,kEACE,KAAK,EAAC,uBAAuB,EAC7B,YAAY,EAAC,MAAM,EACnB,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,CAAC,CAAC,MAAM,CAAC,GACxE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,sEAAe;wBACf,uEACE,KAAK,EAAC,qBAAqB,EAC3B,YAAY,EAAC,OAAO,EACpB,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC,CAAC,MAAM,CAAC,GACtE,CACE;oBAGN,4DAAK,KAAK,EAAC,eAAe;wBACxB,6EAAsB;wBACtB,0EACE,KAAK,EAAC,mBAAmB,EACzB,YAAY,EAAC,YAAY,EACzB,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,GACpE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,6EAAsB;wBACtB,0EACE,KAAK,EAAC,mBAAmB,EACzB,YAAY,EAAC,OAAO,EACpB,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,GACpE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,iFAA0B;wBAC1B,8EACE,KAAK,EAAC,uBAAuB,EAC7B,YAAY,EAAC,kBAAkB,EAC/B,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,CAAC,CAAC,MAAM,CAAC,GACxE,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,4EAAqB;wBACrB,qEACE,KAAK,EAAC,uBAAuB,EAC7B,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,YAAY,EAAC,SAAS,EACtB,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,CAAC,CAAC,MAAM,CAAC,GACxE,CACE,CACF,CACE;YAGV,gEAAS,KAAK,EAAC,iBAAiB;gBAC9B,uFAAgC;gBAChC,6JAAqG;gBAErG,qEACE,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,EACvC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,aAAa,EAAE;wBACb,aAAa,EAAE,mBAAmB;wBAClC,gBAAgB,EAAE,IAAI;wBACtB,YAAY,EAAE,0BAA0B;wBACxC,YAAY,EAAE,OAAO;wBACrB,UAAU,EAAE,MAAM;wBAClB,QAAQ,EAAE,YAAY;wBACtB,QAAQ,EAAE,OAAO;wBACjB,YAAY,EAAE,SAAS;qBACxB;oBAED,4DAAK,KAAK,EAAC,WAAW;wBACpB,sEAAe,IAAI,EAAC,eAAe;4BACjC,mEACE,KAAK,EAAC,iBAAiB,EACvB,WAAW,EAAC,eAAe,EAC3B,QAAQ,EAAE,IAAI,GACd,CACY;wBAEhB,sEAAe,IAAI,EAAC,kBAAkB;4BACpC,sEACE,KAAK,EAAC,oBAAoB,EAC1B,WAAW,EAAC,iBAAiB,EAC7B,GAAG,EAAC,GAAG,EACP,GAAG,EAAC,KAAK,EACT,QAAQ,EAAE,IAAI,GACd,CACY;wBAEhB,sEAAe,IAAI,EAAC,cAAc;4BAChC,kEACE,KAAK,EAAC,gBAAgB,EACtB,WAAW,EAAC,sBAAsB,EAClC,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,CAAC,GACV,CACY;wBAEhB,sEAAe,IAAI,EAAC,cAAc;4BAChC,kEACE,KAAK,EAAC,6BAA6B,EACnC,QAAQ,EAAE,IAAI,GACd,CACY;wBAEhB,sEAAe,IAAI,EAAC,YAAY;4BAC9B,uEACE,KAAK,EAAC,sBAAsB,GAC5B,CACY;wBAEhB,sEAAe,IAAI,EAAC,UAAU;4BAC5B,0EACE,KAAK,EAAC,WAAW,EACjB,QAAQ,EAAE,IAAI,GACd,CACY;wBAEhB,sEAAe,IAAI,EAAC,UAAU;4BAC5B,0EACE,KAAK,EAAC,WAAW,GACjB,CACY;wBAEhB,sEAAe,IAAI,EAAC,cAAc;4BAChC,qEACE,KAAK,EAAC,eAAe,EACrB,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,QAAQ,EAAE,IAAI,GACd,CACY;wBAEhB,sEAAe,IAAI,EAAC,WAAW;4BAC7B,oEACE,KAAK,EAAC,kBAAkB,EACxB,aAAa,EAAE,IAAI,GACnB,CACY,CACZ;oBAEN,4DAAK,KAAK,EAAC,cAAc;wBACvB,+DAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,eAAe,kBAAqB,CAC5D,CACO;gBAEf,4DAAK,KAAK,EAAC,aAAa;oBACtB,oFAA6B;oBAC7B,8DAAM,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,CAAO,CACjD,CACE;YAGV,gEAAS,KAAK,EAAC,iBAAiB;gBAC9B,mFAA4B;gBAC5B,qHAA6D;gBAE7D,4DAAK,KAAK,EAAC,YAAY;oBACrB,4DAAK,KAAK,EAAC,eAAe;wBACxB,yFAAkC;wBAClC,qEACE,KAAK,EAAC,uBAAuB,EAC7B,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,WAAW,EAAE,IAAI,EACjB,YAAY,EAAC,iBAAiB,EAC9B,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,uBAAuB,EAAE,CAAC,CAAC,MAAM,CAAC,GAC5E,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,kFAA2B;wBAC3B,qEACE,KAAK,EAAC,gBAAgB,EACtB,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,KAAK,EAAE,IAAI,EACX,YAAY,EAAC,SAAS,EACtB,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,yBAAyB,EAAE,CAAC,CAAC,MAAM,CAAC,GAC9E,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,kGAA2C;wBAC3C,oEACE,KAAK,EAAC,mBAAmB,EACzB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,EAC/C,aAAa,EAAE,KAAK,EACpB,iBAAiB,EAAC,iBAAiB,EACnC,QAAQ,EAAE,CAAC,CAAc,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,uBAAuB,EAAE,CAAC,CAAC,MAAM,CAAC,GAC5E,CACE;oBAEN,4DAAK,KAAK,EAAC,eAAe;wBACxB,mFAA4B;wBAC5B,4DAAK,KAAK,EAAC,mBAAmB;4BAC5B,mEACE,KAAK,EAAC,qBAAqB,EAC3B,KAAK,EAAC,kBAAkB,EACxB,QAAQ,EAAE,IAAI,GACd;4BACF,kEACE,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,IAAI,EACb,QAAQ,EAAE,IAAI,GACd;4BACF,qEACE,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,IAAI,GACd,CACE,CACF,CACF,CACE,CACN,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, State, h } from '@stencil/core';\n\n/**\n * A comprehensive example component showcasing all input components in different patterns:\n * 1. Controlled components - where the parent manages the state\n * 2. Uncontrolled components - where the component manages its own state\n * 3. Form-wrapped components - using stencil-form and stencil-field for validation\n *\n * This component demonstrates proper usage patterns and integration approaches\n * for all available input components including UDP selector.\n */\n@Component({\n  tag: 'inputs-example',\n  styleUrl: 'inputs-example.css',\n  shadow: true,\n})\nexport class InputsExample {\n\n\n  // State for controlled components\n  @State() controlledTextValue: string = '';\n  @State() controlledNumericValue: string = '';\n  @State() controlledTextAreaValue: string = '';\n  @State() controlledCheckboxValue: boolean = false;\n  @State() controlledToggleValue: boolean = false;\n  @State() controlledDateValue: string = '';\n  @State() controlledTimeValue: string = '';\n  @State() controlledDateTimeValue: string = '';\n  @State() controlledSelectorValue: string = '';\n  @State() controlledFileValue: File[] = [];\n\n  // State for form values\n  @State() formValues: any = {};\n\n  // Sample data for selector components\n  private selectorOptions = [\n    { value: 'option1', label: 'Option 1' },\n    { value: 'option2', label: 'Option 2' },\n    { value: 'option3', label: 'Option 3' },\n    { value: 'option4', label: 'Option 4' },\n  ];\n\n  // Event handlers for controlled components\n  // private handleControlledTextChange = (event: CustomEvent) => {\n  //   this.controlledTextValue = event.detail;\n  // };\n  private handleControlledNumericChange = (event: CustomEvent) => {\n    this.controlledNumericValue = event.detail;\n  };\n\n  private handleControlledCheckboxChange = (event: CustomEvent) => {\n    this.controlledCheckboxValue = event.detail === 'true';\n  };\n  private handleControlledToggleChange = (event: CustomEvent) => {\n    this.controlledToggleValue = event.detail === 'true';\n  };\n  private handleControlledDateChange = (event: CustomEvent) => {\n    console.log(event)\n    this.controlledDateValue = event.detail;\n  };\n  private handleControlledTimeChange = (event: CustomEvent) => {\n    this.controlledTimeValue = event.detail;\n  };\n  private handleControlledDateTimeChange = (event: CustomEvent) => {\n    this.controlledDateTimeValue = event.detail;\n  };\n  private handleControlledSelectorChange = (event: CustomEvent) => {\n    this.controlledSelectorValue = event.detail;\n  };\n  private handleControlledFileChange = (event: CustomEvent) => {\n    this.controlledFileValue = event.detail.files || [];\n  };\n\n  // Form event handlers\n  private handleFormSubmit = (values: any) => {\n    console.log('Form submitted with values:', values);\n    alert('Form submitted! Check console for values.');\n  };\n\n  private handleFormChange = (values: any) => {\n    this.formValues = { ...values };\n  };\n\n  private validateForm = (values: any) => {\n    const errors: any = {};\n\n    if (!values.formTextField) {\n      errors.formTextField = 'This field is required';\n    }\n\n    if (!values.formNumericField || parseFloat(values.formNumericField) < 0) {\n      errors.formNumericField = 'Must be a positive number';\n    }\n\n    if (!values.formTextArea) {\n      errors.formTextArea = 'Description is required';\n    }\n\n    if (!values.formCheckbox) {\n      errors.formCheckbox = 'You must accept the terms';\n    }\n\n    if (!values.formDate) {\n      errors.formDate = 'Please select a date';\n    }\n\n    if (!values.formSelector) {\n      errors.formSelector = 'Please make a selection';\n    }\n\n    return errors;\n  };\n\n  render() {\n    return (\n      <div class=\"inputs-example\">\n        <h1>Input Components Examples</h1>\n\n        {/* Controlled Components Section */}\n        <section class=\"example-section\">\n          <h2>Controlled Components</h2>\n          <p>Parent component manages state and passes values to child components.</p>\n\n          <div class=\"input-grid\">\n            <div class=\"input-example\">\n              <h3>Text Field</h3>\n              <text-field\n                label=\"Controlled Text Input\"\n                placeholder=\"Enter text...\"\n                value={this.controlledTextValue}\n              />\n              <p class=\"value-display\">Value: {this.controlledTextValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Numeric Field</h3>\n              <numeric-field\n                label=\"Controlled Numeric Input\"\n                placeholder=\"Enter number...\"\n                value={this.controlledNumericValue}\n                min=\"0\"\n                max=\"100\"\n                step=\"1\"\n                onChange={this.handleControlledNumericChange}\n              />\n              <p class=\"value-display\">Value: {this.controlledNumericValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Text Area</h3>\n              <text-area\n                label=\"Controlled Text Area\"\n                placeholder=\"Enter description...\"\n                value={this.controlledTextAreaValue}\n                minRows={3}\n                maxRows={6}\n              />\n              <p class=\"value-display\">Value: {this.controlledTextAreaValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Checkbox</h3>\n              <check-box\n                label=\"Controlled Checkbox\"\n                checked={this.controlledCheckboxValue}\n                onChange={this.handleControlledCheckboxChange}\n              />\n              <p class=\"value-display\">Checked: {this.controlledCheckboxValue.toString()}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Toggle</h3>\n              <stencil-toggle\n                label=\"Controlled Toggle\"\n                checked={this.controlledToggleValue}\n                onChange={this.handleControlledToggleChange}\n              />\n              <p class=\"value-display\">Toggled: {this.controlledToggleValue.toString()}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Date Selector</h3>\n              <udp-date-selector\n                label=\"Controlled Date\"\n                value={this.controlledDateValue}\n                onChange={this.handleControlledDateChange}\n              />\n              <p class=\"value-display\">Date: {this.controlledDateValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>DateTime Selector</h3>\n              <udp-datetime-selector\n                label=\"Controlled DateTime\"\n                value={this.controlledDateTimeValue}\n                onChange={this.handleControlledDateTimeChange}\n              />\n              <p class=\"value-display\">DateTime: {this.controlledDateTimeValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Time Selector</h3>\n              <udp-time-selector\n                label=\"Controlled Time\"\n                value={this.controlledTimeValue}\n                onChange={this.handleControlledTimeChange}\n              />\n              <p class=\"value-display\">Time: {this.controlledTimeValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>UDP Selector</h3>\n              <udp-selector\n                label=\"Controlled Selector\"\n                options={this.selectorOptions}\n                value={this.controlledSelectorValue}\n                onChange={this.handleControlledSelectorChange}\n              />\n              <p class=\"value-display\">Selected: {this.controlledSelectorValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>File Upload</h3>\n              <file-upload\n                label=\"Controlled File Upload\"\n                allowMultiple={true}\n                onChange={this.handleControlledFileChange}\n              />\n              <p class=\"value-display\">Files: {this.controlledFileValue.length} selected</p>\n            </div>\n          </div>\n        </section>\n\n        {/* Uncontrolled Components Section */}\n        <section class=\"example-section\">\n          <h2>Uncontrolled Components</h2>\n          <p>Components manage their own state with initial values.</p>\n\n          <div class=\"input-grid\">\n            <div class=\"input-example\">\n              <h3>Text Field</h3>\n              <text-field\n                label=\"Uncontrolled Text Input\"\n                placeholder=\"Enter text...\"\n                initialValue=\"Initial text value\"\n                onChange={(e: CustomEvent) => console.log('Text changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Numeric Field</h3>\n              <numeric-field\n                label=\"Uncontrolled Numeric Input\"\n                placeholder=\"Enter number...\"\n                initialValue=\"42\"\n                min=\"0\"\n                max=\"100\"\n                onChange={(e: CustomEvent) => console.log('Number changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Text Area</h3>\n              <text-area\n                label=\"Uncontrolled Text Area\"\n                placeholder=\"Enter description...\"\n                initialValue=\"Initial description text\"\n                minRows={3}\n                onChange={(e: CustomEvent) => console.log('Text area changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Checkbox</h3>\n              <check-box\n                label=\"Uncontrolled Checkbox\"\n                initialValue=\"true\"\n                onChange={(e: CustomEvent) => console.log('Checkbox changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Toggle</h3>\n              <stencil-toggle\n                label=\"Uncontrolled Toggle\"\n                initialValue=\"false\"\n                onChange={(e: CustomEvent) => console.log('Toggle changed:', e.detail)}\n              />\n            </div>\n\n\n            <div class=\"input-example\">\n              <h3>Date Selector</h3>\n              <udp-date-selector\n                label=\"Uncontrolled Date\"\n                initialValue=\"2024-01-15\"\n                onChange={(e: CustomEvent) => console.log('Date changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Time Selector</h3>\n              <udp-time-selector\n                label=\"Uncontrolled Time\"\n                initialValue=\"14:30\"\n                onChange={(e: CustomEvent) => console.log('Time changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>DateTime Selector</h3>\n              <udp-datetime-selector\n                label=\"Uncontrolled DateTime\"\n                initialValue=\"2024-01-15T14:30\"\n                onChange={(e: CustomEvent) => console.log('DateTime changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>UDP Selector</h3>\n              <udp-selector\n                label=\"Uncontrolled Selector\"\n                options={this.selectorOptions}\n                initialValue=\"option2\"\n                onChange={(e: CustomEvent) => console.log('Selector changed:', e.detail)}\n              />\n            </div>\n          </div>\n        </section>\n\n        {/* Form-wrapped Components Section */}\n        <section class=\"example-section\">\n          <h2>Form-wrapped Components</h2>\n          <p>Components integrated with stencil-form and stencil-field for validation and state management.</p>\n\n          <stencil-form\n            handleSubmit={this.handleFormSubmit}\n            handleFormChange={this.handleFormChange}\n            validate={this.validateForm}\n            initialValues={{\n              formTextField: 'Initial form text',\n              formNumericField: '25',\n              formTextArea: 'Initial form description',\n              formCheckbox: 'false',\n              formToggle: 'true',\n              formDate: '2024-02-01',\n              formTime: '09:00',\n              formSelector: 'option1'\n            }}\n          >\n            <div class=\"form-grid\">\n              <stencil-field name=\"formTextField\">\n                <text-field\n                  label=\"Form Text Field\"\n                  placeholder=\"Enter text...\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formNumericField\">\n                <numeric-field\n                  label=\"Form Numeric Field\"\n                  placeholder=\"Enter number...\"\n                  min=\"0\"\n                  max=\"100\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formTextArea\">\n                <text-area\n                  label=\"Form Text Area\"\n                  placeholder=\"Enter description...\"\n                  required={true}\n                  minRows={3}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formCheckbox\">\n                <check-box\n                  label=\"Accept Terms and Conditions\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formToggle\">\n                <stencil-toggle\n                  label=\"Enable Notifications\"\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formDate\">\n                <udp-date-selector\n                  label=\"Form Date\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formTime\">\n                <udp-time-selector\n                  label=\"Form Time\"\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formSelector\">\n                <udp-selector\n                  label=\"Form Selector\"\n                  options={this.selectorOptions}\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formFiles\">\n                <file-upload\n                  label=\"Form File Upload\"\n                  allowMultiple={true}\n                />\n              </stencil-field>\n            </div>\n\n            <div class=\"form-actions\">\n              <button type=\"submit\" class=\"submit-button\">Submit Form</button>\n            </div>\n          </stencil-form>\n\n          <div class=\"form-values\">\n            <h3>Current Form Values:</h3>\n            <pre>{JSON.stringify(this.formValues, null, 2)}</pre>\n          </div>\n        </section>\n\n        {/* Additional Examples Section */}\n        <section class=\"example-section\">\n          <h2>Additional Examples</h2>\n          <p>More complex configurations and specialized use cases.</p>\n\n          <div class=\"input-grid\">\n            <div class=\"input-example\">\n              <h3>Multi-Select UDP Selector</h3>\n              <udp-selector\n                label=\"Multi-Select Selector\"\n                options={this.selectorOptions}\n                multiSelect={true}\n                initialValue=\"option1,option3\"\n                onChange={(e: CustomEvent) => console.log('Multi-select changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Large UDP Selector</h3>\n              <udp-selector\n                label=\"Large Selector\"\n                options={this.selectorOptions}\n                large={true}\n                initialValue=\"option2\"\n                onChange={(e: CustomEvent) => console.log('Large selector changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>File Upload with Type Restrictions</h3>\n              <file-upload\n                label=\"Image Upload Only\"\n                allowedFileTypes={['jpg', 'jpeg', 'png', 'gif']}\n                allowMultiple={false}\n                browseFileMessage=\"Select an Image\"\n                onChange={(e: CustomEvent) => console.log('Image upload changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Disabled Components</h3>\n              <div class=\"disabled-examples\">\n                <text-field\n                  label=\"Disabled Text Field\"\n                  value=\"Cannot edit this\"\n                  disabled={true}\n                />\n                <check-box\n                  label=\"Disabled Checkbox\"\n                  checked={true}\n                  disabled={true}\n                />\n                <udp-selector\n                  label=\"Disabled Selector\"\n                  options={this.selectorOptions}\n                  value=\"option1\"\n                  disabled={true}\n                />\n              </div>\n            </div>\n          </div>\n        </section>\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"inputs-example.js","sourceRoot":"","sources":["../../../../src/components/test-component/inputs-example/inputs-example.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, h } from '@stencil/core';\n\n/**\n * A comprehensive example component showcasing all input components in different patterns:\n * 1. Controlled components - where the parent manages the state\n * 2. Uncontrolled components - where the component manages its own state\n * 3. Form-wrapped components - using stencil-form and stencil-field for validation\n *\n * This component demonstrates proper usage patterns and integration approaches\n * for all available input components including UDP selector.\n */\n@Component({\n  tag: 'inputs-example',\n  styleUrl: 'inputs-example.css',\n  shadow: true,\n})\nexport class InputsExample {\n\n\n  // State for controlled components\n  @State() controlledTextValue: string = '';\n  @State() controlledNumericValue: string = '';\n  @State() controlledTextAreaValue: string = '';\n  @State() controlledCheckboxValue: boolean = false;\n  @State() controlledToggleValue: boolean = false;\n  @State() controlledDateValue: string = '';\n  @State() controlledTimeValue: string = '';\n  @State() controlledDateTimeValue: string = '';\n  @State() controlledSelectorValue: string = '';\n  @State() controlledFileValue: File[] = [];\n\n  // State for form values\n  @State() formValues: any = {};\n\n  // Sample data for selector components\n  private selectorOptions = [\n    { value: 'option1', label: 'Option 1' },\n    { value: 'option2', label: 'Option 2' },\n    { value: 'option3', label: 'Option 3' },\n    { value: 'option4', label: 'Option 4' },\n  ];\n\n  // Event handlers for controlled components\n  // private handleControlledTextChange = (event: CustomEvent) => {\n  //   this.controlledTextValue = event.detail;\n  // };\n  private handleControlledNumericChange = (event: CustomEvent) => {\n    this.controlledNumericValue = event.detail;\n  };\n\n  private handleControlledCheckboxChange = (event: CustomEvent) => {\n    this.controlledCheckboxValue = event.detail === 'true';\n  };\n  private handleControlledToggleChange = (event: CustomEvent) => {\n    this.controlledToggleValue = event.detail === 'true';\n  };\n  private handleControlledDateChange = (event: CustomEvent) => {\n    console.log(event)\n    this.controlledDateValue = event.detail;\n  };\n  private handleControlledTimeChange = (event: CustomEvent) => {\n    this.controlledTimeValue = event.detail;\n  };\n  private handleControlledDateTimeChange = (event: CustomEvent) => {\n    this.controlledDateTimeValue = event.detail;\n  };\n  private handleControlledSelectorChange = (event: CustomEvent) => {\n    this.controlledSelectorValue = event.detail;\n  };\n  private handleControlledFileChange = (event: CustomEvent) => {\n    this.controlledFileValue = event.detail.files || [];\n  };\n\n  // Form event handlers\n  private handleFormSubmit = (values: any) => {\n    console.log('Form submitted with values:', values);\n    alert('Form submitted! Check console for values.');\n  };\n\n  private handleFormChange = (values: any) => {\n    this.formValues = { ...values };\n  };\n\n  private validateForm = (values: any) => {\n    const errors: any = {};\n\n    if (!values.formTextField) {\n      errors.formTextField = 'This field is required';\n    }\n\n    if (!values.formNumericField || parseFloat(values.formNumericField) < 0) {\n      errors.formNumericField = 'Must be a positive number';\n    }\n\n    if (!values.formTextArea) {\n      errors.formTextArea = 'Description is required';\n    }\n\n    if (!values.formCheckbox) {\n      errors.formCheckbox = 'You must accept the terms';\n    }\n\n    if (!values.formDate) {\n      errors.formDate = 'Please select a date';\n    }\n\n    if (!values.formSelector) {\n      errors.formSelector = 'Please make a selection';\n    }\n\n    return errors;\n  };\n\n  render() {\n    return (\n      <div class=\"inputs-example\">\n        <h1>Input Components Examples</h1>\n\n        {/* Controlled Components Section */}\n        <section class=\"example-section\">\n          <h2>Controlled Components</h2>\n          <p>Parent component manages state and passes values to child components.</p>\n\n          <div class=\"input-grid\">\n            <div class=\"input-example\">\n              <h3>Text Field</h3>\n              <text-field\n                label=\"Controlled Text Input\"\n                placeholder=\"Enter text...\"\n                value={this.controlledTextValue}\n              />\n              <p class=\"value-display\">Value: {this.controlledTextValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Numeric Field</h3>\n              <numeric-field\n                label=\"Controlled Numeric Input\"\n                placeholder=\"Enter number...\"\n                value={this.controlledNumericValue}\n                min=\"0\"\n                max=\"100\"\n                step=\"1\"\n                onChange={this.handleControlledNumericChange}\n              />\n              <p class=\"value-display\">Value: {this.controlledNumericValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Text Area</h3>\n              <text-area\n                label=\"Controlled Text Area\"\n                placeholder=\"Enter description...\"\n                value={this.controlledTextAreaValue}\n                minRows={3}\n                maxRows={6}\n              />\n              <p class=\"value-display\">Value: {this.controlledTextAreaValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Checkbox</h3>\n              <check-box\n                label=\"Controlled Checkbox\"\n                checked={this.controlledCheckboxValue}\n                onChange={this.handleControlledCheckboxChange}\n              />\n              <p class=\"value-display\">Checked: {this.controlledCheckboxValue.toString()}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Toggle</h3>\n              <stencil-toggle\n                label=\"Controlled Toggle\"\n                checked={this.controlledToggleValue}\n                onChange={this.handleControlledToggleChange}\n              />\n              <p class=\"value-display\">Toggled: {this.controlledToggleValue.toString()}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Date Selector</h3>\n              <udp-date-selector\n                label=\"Controlled Date\"\n                value={this.controlledDateValue}\n                onChange={this.handleControlledDateChange}\n              />\n              <p class=\"value-display\">Date: {this.controlledDateValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>DateTime Selector</h3>\n              <udp-datetime-selector\n                label=\"Controlled DateTime\"\n                value={this.controlledDateTimeValue}\n                onChange={this.handleControlledDateTimeChange}\n              />\n              <p class=\"value-display\">DateTime: {this.controlledDateTimeValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Time Selector</h3>\n              <udp-time-selector\n                label=\"Controlled Time\"\n                value={this.controlledTimeValue}\n                onChange={this.handleControlledTimeChange}\n              />\n              <p class=\"value-display\">Time: {this.controlledTimeValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>UDP Selector</h3>\n              <udp-selector\n                label=\"Controlled Selector\"\n                options={this.selectorOptions}\n                value={this.controlledSelectorValue}\n                onChange={this.handleControlledSelectorChange}\n              />\n              <p class=\"value-display\">Selected: {this.controlledSelectorValue}</p>\n            </div>\n\n            <div class=\"input-example\">\n              <h3>File Upload</h3>\n              <file-upload\n                label=\"Controlled File Upload\"\n                allowMultiple={true}\n                onChange={this.handleControlledFileChange}\n              />\n              <p class=\"value-display\">Files: {this.controlledFileValue.length} selected</p>\n            </div>\n          </div>\n        </section>\n\n        {/* Uncontrolled Components Section */}\n        <section class=\"example-section\">\n          <h2>Uncontrolled Components</h2>\n          <p>Components manage their own state with initial values.</p>\n\n          <div class=\"input-grid\">\n            <div class=\"input-example\">\n              <h3>Text Field</h3>\n              <text-field\n                label=\"Uncontrolled Text Input\"\n                placeholder=\"Enter text...\"\n                initialValue=\"Initial text value\"\n                onChange={(e: CustomEvent) => console.log('Text changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Numeric Field</h3>\n              <numeric-field\n                label=\"Uncontrolled Numeric Input\"\n                placeholder=\"Enter number...\"\n                initialValue=\"42\"\n                min=\"0\"\n                max=\"100\"\n                onChange={(e: CustomEvent) => console.log('Number changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Text Area</h3>\n              <text-area\n                label=\"Uncontrolled Text Area\"\n                placeholder=\"Enter description...\"\n                initialValue=\"Initial description text\"\n                minRows={3}\n                onChange={(e: CustomEvent) => console.log('Text area changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Checkbox</h3>\n              <check-box\n                label=\"Uncontrolled Checkbox\"\n                initialValue=\"true\"\n                onChange={(e: CustomEvent) => console.log('Checkbox changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Toggle</h3>\n              <stencil-toggle\n                label=\"Uncontrolled Toggle\"\n                initialValue=\"false\"\n                onChange={(e: CustomEvent) => console.log('Toggle changed:', e.detail)}\n              />\n            </div>\n\n\n            <div class=\"input-example\">\n              <h3>Date Selector</h3>\n              <udp-date-selector\n                label=\"Uncontrolled Date\"\n                initialValue=\"2024-01-15\"\n                onChange={(e: CustomEvent) => console.log('Date changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Time Selector</h3>\n              <udp-time-selector\n                label=\"Uncontrolled Time\"\n                initialValue=\"14:30\"\n                onChange={(e: CustomEvent) => console.log('Time changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>DateTime Selector</h3>\n              <udp-datetime-selector\n                label=\"Uncontrolled DateTime\"\n                initialValue=\"2024-01-15T14:30\"\n                onChange={(e: CustomEvent) => console.log('DateTime changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>UDP Selector</h3>\n              <udp-selector\n                label=\"Uncontrolled Selector\"\n                options={this.selectorOptions}\n                initialValue=\"option2\"\n                onChange={(e: CustomEvent) => console.log('Selector changed:', e.detail)}\n              />\n            </div>\n          </div>\n        </section>\n\n        {/* Form-wrapped Components Section */}\n        <section class=\"example-section\">\n          <h2>Form-wrapped Components</h2>\n          <p>Components integrated with stencil-form and stencil-field for validation and state management.</p>\n\n          <stencil-form\n            handleSubmit={this.handleFormSubmit}\n            handleChange={this.handleFormChange}\n            handleValidate={this.validateForm}\n            initialValues={{\n              formTextField: 'Initial form text',\n              formNumericField: '25',\n              formTextArea: 'Initial form description',\n              formCheckbox: 'false',\n              formToggle: 'true',\n              formDate: '2024-02-01',\n              formTime: '09:00',\n              formSelector: 'option1'\n            }}\n          >\n            <div class=\"form-grid\">\n              <stencil-field name=\"formTextField\">\n                <text-field\n                  label=\"Form Text Field\"\n                  placeholder=\"Enter text...\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formNumericField\">\n                <numeric-field\n                  label=\"Form Numeric Field\"\n                  placeholder=\"Enter number...\"\n                  min=\"0\"\n                  max=\"100\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formTextArea\">\n                <text-area\n                  label=\"Form Text Area\"\n                  placeholder=\"Enter description...\"\n                  required={true}\n                  minRows={3}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formCheckbox\">\n                <check-box\n                  label=\"Accept Terms and Conditions\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formToggle\">\n                <stencil-toggle\n                  label=\"Enable Notifications\"\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formDate\">\n                <udp-date-selector\n                  label=\"Form Date\"\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formTime\">\n                <udp-time-selector\n                  label=\"Form Time\"\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formSelector\">\n                <udp-selector\n                  label=\"Form Selector\"\n                  options={this.selectorOptions}\n                  required={true}\n                />\n              </stencil-field>\n\n              <stencil-field name=\"formFiles\">\n                <file-upload\n                  label=\"Form File Upload\"\n                  allowMultiple={true}\n                />\n              </stencil-field>\n            </div>\n\n            <div class=\"form-actions\">\n              <button type=\"submit\" class=\"submit-button\">Submit Form</button>\n            </div>\n          </stencil-form>\n\n          <div class=\"form-values\">\n            <h3>Current Form Values:</h3>\n            <pre>{JSON.stringify(this.formValues, null, 2)}</pre>\n          </div>\n        </section>\n\n        {/* Additional Examples Section */}\n        <section class=\"example-section\">\n          <h2>Additional Examples</h2>\n          <p>More complex configurations and specialized use cases.</p>\n\n          <div class=\"input-grid\">\n            <div class=\"input-example\">\n              <h3>Multi-Select UDP Selector</h3>\n              <udp-selector\n                label=\"Multi-Select Selector\"\n                options={this.selectorOptions}\n                multiSelect={true}\n                initialValue=\"option1,option3\"\n                onChange={(e: CustomEvent) => console.log('Multi-select changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Large UDP Selector</h3>\n              <udp-selector\n                label=\"Large Selector\"\n                options={this.selectorOptions}\n                large={true}\n                initialValue=\"option2\"\n                onChange={(e: CustomEvent) => console.log('Large selector changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>File Upload with Type Restrictions</h3>\n              <file-upload\n                label=\"Image Upload Only\"\n                allowedFileTypes={['jpg', 'jpeg', 'png', 'gif']}\n                allowMultiple={false}\n                browseFileMessage=\"Select an Image\"\n                onChange={(e: CustomEvent) => console.log('Image upload changed:', e.detail)}\n              />\n            </div>\n\n            <div class=\"input-example\">\n              <h3>Disabled Components</h3>\n              <div class=\"disabled-examples\">\n                <text-field\n                  label=\"Disabled Text Field\"\n                  value=\"Cannot edit this\"\n                  disabled={true}\n                />\n                <check-box\n                  label=\"Disabled Checkbox\"\n                  checked={true}\n                  disabled={true}\n                />\n                <udp-selector\n                  label=\"Disabled Selector\"\n                  options={this.selectorOptions}\n                  value=\"option1\"\n                  disabled={true}\n                />\n              </div>\n            </div>\n          </div>\n        </section>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/page-renderer/page-renderer.js

@@ -7,7 +7,7 @@ export class PageRenderer {
         return (h("div", { style: { border: '1px solid #ff6a00', padding: '10px', margin: '10px 0', borderRadius: '5px', color: '#ff6a00', backgroundColor: '#fff3e0' } }, h("unity-typography", null, "Content currently unavailable ( ", h("span", { style: { fontWeight: '700' } }, componentName), " ). We're working to make this available to you soon!")));
     }
     render() {
-        return (h("div", { key: '0b497395d2ff7326d1d179abd6f1ba72bd6a023d' }, this.pageData.map((data) => {
+        return (h("div", { key: '8a495c1dcac93c28709401955326fd25f1494b8f' }, this.pageData.map((data) => {
             // Prepare properties from metaData, ensuring any existing keys that
             // match your direct props are overridden.
             const gridProps = Object.assign(Object.assign({}, data.properties), {

package/dist/collection/theme/color-preview/color-preview.js

@@ -10,7 +10,7 @@ export class ColorPreview {
         return (h("div", { class: "color-section" }, h("unity-typography", { variant: "h4" }, title), h("div", { class: "color-grid" }, this.renderColorBox(`--${prefix}-color-main`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-dark`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-light`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-hint`, `--${prefix}-contrast-text`))));
     }
     render() {
-        return (h("div", { key: '83bab5677e9b012f2613171f56186601dcb22c35', class: "container" }, h("unity-typography", { key: '9424979242fe907b591c432694d3f68dec1381d5', variant: "h2" }, "Unity Theme"), h("div", { key: '4de81a0b8c54535ec6b3f02b4e9d362b6ba45ffa', class: "theme-section" }, h("div", { key: '341855b6c10a9b09a52b1af2ce2fe3edc404aa0b', class: "unity-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: 'd9b1a40c61de06c24e372bf1340cc1dd4f6ef59c', variant: "h2" }, "SAP Theme"), h("div", { key: 'c024712b32c9e2c5c4ee6a148d28a3bce13f84ef', class: "theme-section" }, h("div", { key: 'd7687db962dd8247b6293cf736dcdb799f001f69', class: "sap-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '989c69896f739de688cb4346711f34f0487cb52c', variant: "h2" }, "Status Colors"), h("div", { key: '11dc72013d03a0dbf1f82cf7ad5cfe4bb00f2cda', class: "status-section" }, this.renderStatusSection('Success', 'success'), this.renderStatusSection('Error', 'error'), this.renderStatusSection('Warning', 'warning'), this.renderStatusSection('Info', 'info'), this.renderStatusSection('Note', 'note'))));
+        return (h("div", { key: '114ba9219a120170f05d9c1dc5f7d08a818060ef', class: "container" }, h("unity-typography", { key: '713b830c1f01e5b99d7be799c78cc189b70a4209', variant: "h2" }, "Unity Theme"), h("div", { key: '3f4e7a89b6735e36581c68feea7c5c2c63b2dee5', class: "theme-section" }, h("div", { key: 'dd46dcc278fe16a6534bee50c77e3e6311c0cf85', class: "unity-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '54da088bb54a15dbea836a09c4117b95d8fec524', variant: "h2" }, "SAP Theme"), h("div", { key: '3f03a167a92e8eb644789061dedc09159333e069', class: "theme-section" }, h("div", { key: '6a75d30242bbe55b8d5e0cea471506e7aad9e1fd', class: "sap-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '6076e181d5423f46158b52eb25afb628bdd06263', variant: "h2" }, "Status Colors"), h("div", { key: '6d8fa252eb3cf6704482fab45502a320f3fe5305', class: "status-section" }, this.renderStatusSection('Success', 'success'), this.renderStatusSection('Error', 'error'), this.renderStatusSection('Warning', 'warning'), this.renderStatusSection('Info', 'info'), this.renderStatusSection('Note', 'note'))));
     }
     static get is() { return "color-preview"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/udp-utilities/layout/udp-dynamic-container-with-menu/chip-section/chip-section.js

@@ -94,13 +94,13 @@ export class ChipSection {
     }
     render() {
         console.log("Rendering ChipSection", this.visibleFilterChips);
-        return (h("div", { key: 'ad42e917c0fbb5ca5878971669d84f64fe0b585a', class: "wrapper", id: "chipSectionContainer" }, h("div", { key: '06aeefd4db12a0e2f61eb5f5d64eff97b71450b2', class: "chipHolder" }, h("div", { key: '92d5a3f0a8c240f27b49c1133f3cac2a7343194b', id: "viewChipsContainer" }, this.viewChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('view', index), text: chip.label, class: "viewChip" })))), h("udp-dynamic-container-with-menu", { key: 'c223859c2c07c53c23e9ab83ac46e23aee192d9a', id: "filterChipsContainer", menuItems: this.menuItems }, this.selectedFilterChip && (h("stencil-chip", { key: 'cee9d8c65a842669f39a2148ec818be21b507362', onOnDelete: this.handleFilterChipUntoggle, text: this.selectedFilterChip.label, class: "viewChip" })), console.log('filtering here...', this.filterChips), this.filterChips.map((chip) => {
+        return (h("div", { key: '56e74f5ff766d682f371cd24c076e479c3c62648', class: "wrapper", id: "chipSectionContainer" }, h("div", { key: '5464b27ee60211e02f319b482591b5c66c0c1a9a', class: "chipHolder" }, h("div", { key: '6b9fc9b083172d0010b52bda18526ac16e86f79b', id: "viewChipsContainer" }, this.viewChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('view', index), text: chip.label, class: "viewChip" })))), h("udp-dynamic-container-with-menu", { key: '06e6c0a3cc60eb5c2b88fe0cd667645c7c607c07', id: "filterChipsContainer", menuItems: this.menuItems }, this.selectedFilterChip && (h("stencil-chip", { key: '1f62609a91e160fd2ac7c1e1534f054dbcddc3c3', onOnDelete: this.handleFilterChipUntoggle, text: this.selectedFilterChip.label, class: "viewChip" })), console.log('filtering here...', this.filterChips), this.filterChips.map((chip) => {
             if (this.selectedFilterChip && chip.id === this.selectedFilterChip.id) {
                 console.log('returning null...');
                 return null;
             }
             return (h("stencil-chip", { text: `${chip.label} ${chip.value}`, class: "filterChip", onClick: () => this.handleFilterChipToggle(chip) }));
-        })), h("div", { key: '9a77cf8be75e21ed35400cdf27a1b4080a9418f4', id: "additionalFilterChipsContainer" }, this.additionalFilterChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('additionalFilter', index), text: chip.label, class: "additionalFilterChip" })))), !this.hideKpiSection && (h("div", { key: 'e09e58dfc70ea5422466617e7d9ad8c26650708d', class: "KPI", id: "kpiContainer" }, this.kpiValues.slice(0, this.maxKPIsDisplayed).map((kpi) => (h("div", { class: "kpiItem" }, h("span", { class: "kpiLabel" }, this.abbreviateLabel(kpi.label) || kpi.label), h("span", { class: "kpiValue" }, this.abbrNum(kpi.value, 1))))))))));
+        })), h("div", { key: '048a57f36da97edc7e903144493547d0f6aff757', id: "additionalFilterChipsContainer" }, this.additionalFilterChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('additionalFilter', index), text: chip.label, class: "additionalFilterChip" })))), !this.hideKpiSection && (h("div", { key: '66311251bea7ff6e6a9ac66ffe0bc2096202c357', class: "KPI", id: "kpiContainer" }, this.kpiValues.slice(0, this.maxKPIsDisplayed).map((kpi) => (h("div", { class: "kpiItem" }, h("span", { class: "kpiLabel" }, this.abbreviateLabel(kpi.label) || kpi.label), h("span", { class: "kpiValue" }, this.abbrNum(kpi.value, 1))))))))));
     }
     static get is() { return "chip-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/udp-utilities/layout/udp-dynamic-container-with-menu/udp-dynamic-container-with-menu.js

@@ -114,7 +114,7 @@ export class DynamicContainerWithMenu {
         this.udpChipClicked.emit(chipText);
     }
     render() {
-        return (h("div", { key: '716b186bf773d0f1d53330d6b8db1cf896ef5857', class: "container" }, h("div", { key: '73300ab56f622d8368fc2485d3faf5c0ca1b083f', class: "chips" }, console.log('Received data for chips via executeQwith', this.visibleChildren), this.visibleChildren && this.visibleChildren.map((child, index) => (h("stencil-chip", { color: "secondary", key: index, text: child.description, "show-delete": "false", externalToggleString: this.externalToggle })))), h("div", { key: '75272f2c03e85073266504e1910fc303eb3cb9f8', class: "overflow" }, h("udp-pop-over", { key: '4a14ca56c6e2c6e78ff1b545d8fb24c1ca5af5c9', isOpen: this.popoverOpen, anchorElement: document.getElementById('anchorElement') }, h("div", { key: 'a1f6c93c9e025f09e6bfc9df0eebfc6e5e366759', class: "menu" }, this.menuChildren && this.menuChildren.map((child, index) => (h("stencil-chip", { key: index, text: child.label, "show-delete": "false" }, " "))))))));
+        return (h("div", { key: '71558adeae7a5346bb4e7a790ac33b9457ec146b', class: "container" }, h("div", { key: '91800e874a4fafacfbb0d1d5ba1a4449dff1b060', class: "chips" }, console.log('Received data for chips via executeQwith', this.visibleChildren), this.visibleChildren && this.visibleChildren.map((child, index) => (h("stencil-chip", { color: "secondary", key: index, text: child.description, "show-delete": "false", externalToggleString: this.externalToggle })))), h("div", { key: '5a2c2038fefae74528e5e5fbe8f3fcdabfd61943', class: "overflow" }, h("udp-pop-over", { key: '3b3a65b65eeec241117bfc65fedd5d7a425c8338', isOpen: this.popoverOpen, anchorElement: document.getElementById('anchorElement') }, h("div", { key: '1bb563def60809fbccd41e12d57376e6544883c2', class: "menu" }, this.menuChildren && this.menuChildren.map((child, index) => (h("stencil-chip", { key: index, text: child.label, "show-delete": "false" }, " "))))))));
     }
     static get is() { return "udp-dynamic-container-with-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/components/add-map-feature-popup.js

@@ -1,4 +1,4 @@
-import { A as AddMapFeaturePopUp, d as defineCustomElement$1 } from './p-y6ddPVSK.js';
+import { A as AddMapFeaturePopUp, d as defineCustomElement$1 } from './p-BO3Kzy6x.js';
 
 const AddMapFeaturePopup = AddMapFeaturePopUp;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/advanced-search-grouped.js

@@ -1,4 +1,4 @@
-import { A as AdvancedSearchGrouped$1, d as defineCustomElement$1 } from './p-CLvAjrtw.js';
+import { A as AdvancedSearchGrouped$1, d as defineCustomElement$1 } from './p-Qxi-zxd0.js';
 
 const AdvancedSearchGrouped = AdvancedSearchGrouped$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/advanced-search.js

@@ -1,4 +1,4 @@
-import { A as AdvancedSearch$1, d as defineCustomElement$1 } from './p-bLKTEsIH.js';
+import { A as AdvancedSearch$1, d as defineCustomElement$1 } from './p-CsMmUkoQ.js';
 
 const AdvancedSearch = AdvancedSearch$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ag-grid-base.js

@@ -1,4 +1,4 @@
-import { A as AgGridBase$1, d as defineCustomElement$1 } from './p-Akx0UDMW.js';
+import { A as AgGridBase$1, d as defineCustomElement$1 } from './p-BwPAbBUr.js';
 
 const AgGridBase = AgGridBase$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ag-table.js

@@ -1,4 +1,4 @@
-import { A as AgTable$1, d as defineCustomElement$1 } from './p-CfZR5rek.js';
+import { A as AgTable$1, d as defineCustomElement$1 } from './p-0F2I6Qvn.js';
 
 const AgTable = AgTable$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ambient-demo-container.js

@@ -1,4 +1,4 @@
-import { A as AmbientDemoContainer$1, d as defineCustomElement$1 } from './p-XoXMxeuq.js';
+import { A as AmbientDemoContainer$1, d as defineCustomElement$1 } from './p-Dwnxv7WO.js';
 
 const AmbientDemoContainer = AmbientDemoContainer$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/ambient-template-grid.js

@@ -1,4 +1,4 @@
-import { A as AmbientTemplateGrid$1, d as defineCustomElement$1 } from './p-BEtm34A3.js';
+import { A as AmbientTemplateGrid$1, d as defineCustomElement$1 } from './p-ncemY4Wx.js';
 
 const AmbientTemplateGrid = AmbientTemplateGrid$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/api-method-grid.js

@@ -2,9 +2,9 @@ import { p as proxyCustomElement, H, c as createEvent, h } from './p-DPon6DDX.js
 import { F as FilterOperators } from './p-BjOva8-6.js';
 import { e as executeQueryAdHoc } from './p-BNGPBq7P.js';
 import { C as ConfigService } from './p-Cn7PuhQz.js';
-import { d as defineCustomElement$4 } from './p-Akx0UDMW.js';
-import { d as defineCustomElement$3 } from './p-ByM88ZWk.js';
-import { d as defineCustomElement$2 } from './p-BOW03S7b.js';
+import { d as defineCustomElement$4 } from './p-BwPAbBUr.js';
+import { d as defineCustomElement$3 } from './p-jpt3zFdi.js';
+import { d as defineCustomElement$2 } from './p-XP8tp0pm.js';
 
 const apiMethodDataSource = (apiMethodId, customSearchObject) => {
     return {
@@ -92,7 +92,7 @@ const ApiMethodGrid$1 = /*@__PURE__*/ proxyCustomElement(class ApiMethodGrid ext
         }
     }
     render() {
-        return h("server-side-grid", { key: '7d19af0c06a331d1f170435da59029d7ab25ffab', onServerSideGridReady: e => this.handleApiMethodGridReady(e), dataSource: this.dataSource, columnDefs: this.columnDefs });
+        return h("server-side-grid", { key: '3177ae549fb1beae42d6e97725b288d7cfeed306', onServerSideGridReady: e => this.handleApiMethodGridReady(e), dataSource: this.dataSource, columnDefs: this.columnDefs });
     }
     static get watchers() { return {
         "apiMethodId": ["updateDataSource"],

package/dist/components/app-bar.js

@@ -1,4 +1,4 @@
-import { A as AppBar$1, d as defineCustomElement$1 } from './p-DehJN46u.js';
+import { A as AppBar$1, d as defineCustomElement$1 } from './p-BLWvjl_b.js';
 
 const AppBar = AppBar$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/chart-container.js

@@ -1,4 +1,4 @@
-import { C as ChartContainer$1, d as defineCustomElement$1 } from './p-BEwTqpWE.js';
+import { C as ChartContainer$1, d as defineCustomElement$1 } from './p-CxOYMG-r.js';
 
 const ChartContainer = ChartContainer$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/check-box-group.js

@@ -1,4 +1,4 @@
-import { C as CheckboxGroup, d as defineCustomElement$1 } from './p-BU706xtx.js';
+import { C as CheckboxGroup, d as defineCustomElement$1 } from './p-hWgAmNsF.js';
 
 const CheckBoxGroup = CheckboxGroup;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/check-box.js

@@ -1,4 +1,4 @@
-import { C as Checkbox, d as defineCustomElement$1 } from './p-Thx6k3Xp.js';
+import { C as Checkbox, d as defineCustomElement$1 } from './p-WLd9SWLl.js';
 
 const CheckBox = Checkbox;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/chip-section.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h } from './p-DPon6DDX.js';
 import { d as defineCustomElement$5 } from './p-B0DDn0I9.js';
-import { d as defineCustomElement$4 } from './p-D-JeGky8.js';
+import { d as defineCustomElement$4 } from './p-BB2sALAW.js';
 import { d as defineCustomElement$3 } from './p-CpGuVcRn.js';
 import { d as defineCustomElement$2 } from './p-DkppmXNM.js';
 
@@ -104,13 +104,13 @@ const ChipSection$1 = /*@__PURE__*/ proxyCustomElement(class ChipSection extends
     }
     render() {
         console.log("Rendering ChipSection", this.visibleFilterChips);
-        return (h("div", { key: 'ad42e917c0fbb5ca5878971669d84f64fe0b585a', class: "wrapper", id: "chipSectionContainer" }, h("div", { key: '06aeefd4db12a0e2f61eb5f5d64eff97b71450b2', class: "chipHolder" }, h("div", { key: '92d5a3f0a8c240f27b49c1133f3cac2a7343194b', id: "viewChipsContainer" }, this.viewChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('view', index), text: chip.label, class: "viewChip" })))), h("udp-dynamic-container-with-menu", { key: 'c223859c2c07c53c23e9ab83ac46e23aee192d9a', id: "filterChipsContainer", menuItems: this.menuItems }, this.selectedFilterChip && (h("stencil-chip", { key: 'cee9d8c65a842669f39a2148ec818be21b507362', onOnDelete: this.handleFilterChipUntoggle, text: this.selectedFilterChip.label, class: "viewChip" })), console.log('filtering here...', this.filterChips), this.filterChips.map((chip) => {
+        return (h("div", { key: '56e74f5ff766d682f371cd24c076e479c3c62648', class: "wrapper", id: "chipSectionContainer" }, h("div", { key: '5464b27ee60211e02f319b482591b5c66c0c1a9a', class: "chipHolder" }, h("div", { key: '6b9fc9b083172d0010b52bda18526ac16e86f79b', id: "viewChipsContainer" }, this.viewChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('view', index), text: chip.label, class: "viewChip" })))), h("udp-dynamic-container-with-menu", { key: '06e6c0a3cc60eb5c2b88fe0cd667645c7c607c07', id: "filterChipsContainer", menuItems: this.menuItems }, this.selectedFilterChip && (h("stencil-chip", { key: '1f62609a91e160fd2ac7c1e1534f054dbcddc3c3', onOnDelete: this.handleFilterChipUntoggle, text: this.selectedFilterChip.label, class: "viewChip" })), console.log('filtering here...', this.filterChips), this.filterChips.map((chip) => {
             if (this.selectedFilterChip && chip.id === this.selectedFilterChip.id) {
                 console.log('returning null...');
                 return null;
             }
             return (h("stencil-chip", { text: `${chip.label} ${chip.value}`, class: "filterChip", onClick: () => this.handleFilterChipToggle(chip) }));
-        })), h("div", { key: '9a77cf8be75e21ed35400cdf27a1b4080a9418f4', id: "additionalFilterChipsContainer" }, this.additionalFilterChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('additionalFilter', index), text: chip.label, class: "additionalFilterChip" })))), !this.hideKpiSection && (h("div", { key: 'e09e58dfc70ea5422466617e7d9ad8c26650708d', class: "KPI", id: "kpiContainer" }, this.kpiValues.slice(0, this.maxKPIsDisplayed).map((kpi) => (h("div", { class: "kpiItem" }, h("span", { class: "kpiLabel" }, this.abbreviateLabel(kpi.label) || kpi.label), h("span", { class: "kpiValue" }, this.abbrNum(kpi.value, 1))))))))));
+        })), h("div", { key: '048a57f36da97edc7e903144493547d0f6aff757', id: "additionalFilterChipsContainer" }, this.additionalFilterChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('additionalFilter', index), text: chip.label, class: "additionalFilterChip" })))), !this.hideKpiSection && (h("div", { key: '66311251bea7ff6e6a9ac66ffe0bc2096202c357', class: "KPI", id: "kpiContainer" }, this.kpiValues.slice(0, this.maxKPIsDisplayed).map((kpi) => (h("div", { class: "kpiItem" }, h("span", { class: "kpiLabel" }, this.abbreviateLabel(kpi.label) || kpi.label), h("span", { class: "kpiValue" }, this.abbrNum(kpi.value, 1))))))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/client-side-grid.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-DPon6DDX.js';
-import { d as defineCustomElement$3 } from './p-Akx0UDMW.js';
-import { d as defineCustomElement$2 } from './p-ByM88ZWk.js';
+import { d as defineCustomElement$3 } from './p-BwPAbBUr.js';
+import { d as defineCustomElement$2 } from './p-jpt3zFdi.js';
 
 const ClientSideGrid$1 = /*@__PURE__*/ proxyCustomElement(class ClientSideGrid extends H {
     constructor() {
@@ -31,7 +31,7 @@ const ClientSideGrid$1 = /*@__PURE__*/ proxyCustomElement(class ClientSideGrid e
         this.gridReady.emit(this.gridApi);
     }
     render() {
-        return h("ag-grid-base", { key: '56d22b21406bf2bab332291c97c1062d7ae21d62', gridConfig: this.clientConfig, headerConfig: this.headerConfig, onGridReady: e => this.handleGridReady(e) });
+        return h("ag-grid-base", { key: 'd3e3fd50702ca15925cc540a1cc182c4049b3338', gridConfig: this.clientConfig, headerConfig: this.headerConfig, onGridReady: e => this.handleGridReady(e) });
     }
     static get watchers() { return {
         "rowData": ["updateRowData"],

package/dist/components/color-preview.js

@@ -18,7 +18,7 @@ const ColorPreview$1 = /*@__PURE__*/ proxyCustomElement(class ColorPreview exten
         return (h("div", { class: "color-section" }, h("unity-typography", { variant: "h4" }, title), h("div", { class: "color-grid" }, this.renderColorBox(`--${prefix}-color-main`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-dark`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-light`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-hint`, `--${prefix}-contrast-text`))));
     }
     render() {
-        return (h("div", { key: '83bab5677e9b012f2613171f56186601dcb22c35', class: "container" }, h("unity-typography", { key: '9424979242fe907b591c432694d3f68dec1381d5', variant: "h2" }, "Unity Theme"), h("div", { key: '4de81a0b8c54535ec6b3f02b4e9d362b6ba45ffa', class: "theme-section" }, h("div", { key: '341855b6c10a9b09a52b1af2ce2fe3edc404aa0b', class: "unity-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: 'd9b1a40c61de06c24e372bf1340cc1dd4f6ef59c', variant: "h2" }, "SAP Theme"), h("div", { key: 'c024712b32c9e2c5c4ee6a148d28a3bce13f84ef', class: "theme-section" }, h("div", { key: 'd7687db962dd8247b6293cf736dcdb799f001f69', class: "sap-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '989c69896f739de688cb4346711f34f0487cb52c', variant: "h2" }, "Status Colors"), h("div", { key: '11dc72013d03a0dbf1f82cf7ad5cfe4bb00f2cda', class: "status-section" }, this.renderStatusSection('Success', 'success'), this.renderStatusSection('Error', 'error'), this.renderStatusSection('Warning', 'warning'), this.renderStatusSection('Info', 'info'), this.renderStatusSection('Note', 'note'))));
+        return (h("div", { key: '114ba9219a120170f05d9c1dc5f7d08a818060ef', class: "container" }, h("unity-typography", { key: '713b830c1f01e5b99d7be799c78cc189b70a4209', variant: "h2" }, "Unity Theme"), h("div", { key: '3f4e7a89b6735e36581c68feea7c5c2c63b2dee5', class: "theme-section" }, h("div", { key: 'dd46dcc278fe16a6534bee50c77e3e6311c0cf85', class: "unity-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '54da088bb54a15dbea836a09c4117b95d8fec524', variant: "h2" }, "SAP Theme"), h("div", { key: '3f03a167a92e8eb644789061dedc09159333e069', class: "theme-section" }, h("div", { key: '6a75d30242bbe55b8d5e0cea471506e7aad9e1fd', class: "sap-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '6076e181d5423f46158b52eb25afb628bdd06263', variant: "h2" }, "Status Colors"), h("div", { key: '6d8fa252eb3cf6704482fab45502a320f3fe5305', class: "status-section" }, this.renderStatusSection('Success', 'success'), this.renderStatusSection('Error', 'error'), this.renderStatusSection('Warning', 'warning'), this.renderStatusSection('Info', 'info'), this.renderStatusSection('Note', 'note'))));
     }
     static get style() { return colorPreviewCss; }
 }, [2, "color-preview"]);

package/dist/components/date-time-renderer.js

@@ -1,4 +1,4 @@
-import { D as DateTimeRenderer$1, d as defineCustomElement$1 } from './p-ChdtzL8Z.js';
+import { D as DateTimeRenderer$1, d as defineCustomElement$1 } from './p-Dpvhge5H.js';
 
 const DateTimeRenderer = DateTimeRenderer$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/edit-view-form-dialog.js

@@ -1,4 +1,4 @@
-import { E as EditViewFormDialog$1, d as defineCustomElement$1 } from './p-DqYsDDHy.js';
+import { E as EditViewFormDialog$1, d as defineCustomElement$1 } from './p-jdqTpLxN.js';
 
 const EditViewFormDialog = EditViewFormDialog$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/feature-details-card.js

@@ -1,4 +1,4 @@
-import { F as FeatureDetailsCard$1, d as defineCustomElement$1 } from './p-DueJnVH4.js';
+import { F as FeatureDetailsCard$1, d as defineCustomElement$1 } from './p-DyC6jVV8.js';
 
 const FeatureDetailsCard = FeatureDetailsCard$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/feature-details-popup.js

@@ -1,4 +1,4 @@
-import { F as FeatureDetailsPopUp, d as defineCustomElement$1 } from './p-BWI0GtPn.js';
+import { F as FeatureDetailsPopUp, d as defineCustomElement$1 } from './p-CpQin4NC.js';
 
 const FeatureDetailsPopup = FeatureDetailsPopUp;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/file-upload-renderer.js

@@ -1,4 +1,4 @@
-import { F as FileUploadRenderer$1, d as defineCustomElement$1 } from './p-CTn3c76I.js';
+import { F as FileUploadRenderer$1, d as defineCustomElement$1 } from './p-1uly65Sv.js';
 
 const FileUploadRenderer = FileUploadRenderer$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/file-upload.js

@@ -1,4 +1,4 @@
-import { F as FileUpload$1, d as defineCustomElement$1 } from './p-B3-pcvgV.js';
+import { F as FileUpload$1, d as defineCustomElement$1 } from './p-Cdz5sX_v.js';
 
 const FileUpload = FileUpload$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/grid-header.js

@@ -1,4 +1,4 @@
-import { G as GridHeader$1, d as defineCustomElement$1 } from './p-ByM88ZWk.js';
+import { G as GridHeader$1, d as defineCustomElement$1 } from './p-jpt3zFdi.js';
 
 const GridHeader = GridHeader$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/grid-primary-bar.js

@@ -1,4 +1,4 @@
-import { G as GridPrimaryBar$1, d as defineCustomElement$1 } from './p-ClToknIK.js';
+import { G as GridPrimaryBar$1, d as defineCustomElement$1 } from './p-BbOHuqrJ.js';
 
 const GridPrimaryBar = GridPrimaryBar$1;
 const defineCustomElement = defineCustomElement$1;