@pega/cosmos-react-core 10.0.0-build.2.3 → 10.0.0-build.2.4
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.
- package/lib/components/FieldGroup/FieldGroup.d.ts.map +1 -1
- package/lib/components/FieldGroup/FieldGroup.js +0 -15
- package/lib/components/FieldGroup/FieldGroup.js.map +1 -1
- package/lib/components/FormControl/FormControl.d.ts.map +1 -1
- package/lib/components/FormControl/FormControl.js +1 -10
- package/lib/components/FormControl/FormControl.js.map +1 -1
- package/lib/components/Preview/Preview.types.d.ts +1 -0
- package/lib/components/Preview/Preview.types.d.ts.map +1 -1
- package/lib/components/Preview/Preview.types.js.map +1 -1
- package/lib/theme/themeDefinition.json +2 -2
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAW7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA+B,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAK1F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAM7D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,mEAAmE;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC,GAAG,CACE;IACE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,gDAAgD;IAChD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wCAAwC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,4DAA4D;IAC5D,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF,gDAAgD;IAChD,OAAO,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAChC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,GACD;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CACJ,CAAC;AA4CJ,eAAO,MAAM,oBAAoB,+NAAgB,CAAC;AAElD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAAiB,CAAC;AAEtD,eAAO,MAAM,sBAAsB,6QA+BlC,CAAC;AAIF,eAAO,MAAM,gBAAgB,+
|
|
1
|
+
{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAW7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA+B,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAK1F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAM7D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,mEAAmE;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC,GAAG,CACE;IACE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,gDAAgD;IAChD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wCAAwC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,4DAA4D;IAC5D,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF,gDAAgD;IAChD,OAAO,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAChC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,GACD;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CACJ,CAAC;AA4CJ,eAAO,MAAM,oBAAoB,+NAAgB,CAAC;AAElD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAAiB,CAAC;AAEtD,eAAO,MAAM,sBAAsB,6QA+BlC,CAAC;AAIF,eAAO,MAAM,gBAAgB,+OAkB5B,CAAC;AAIF,eAAO,MAAM,oBAAoB;aAAyB,OAAO;YAkB/D,CAAC;AAiCH,eAAO,MAAM,iBAAiB;;;;iDAI7B,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CA8F/D,CAAC;AAEH,eAAe,UAAU,CAAC"}
|
|
@@ -72,21 +72,6 @@ export const StyledFieldGroup = styled.fieldset(({ theme: { base: { 'font-size':
|
|
|
72
72
|
font-size: ${fontSizes[text.h3['font-size']]};
|
|
73
73
|
font-weight: ${text.h3['font-weight']};
|
|
74
74
|
}
|
|
75
|
-
|
|
76
|
-
& & ${StyledFieldGroupName} {
|
|
77
|
-
font-size: ${fontSizes[text.h4['font-size']]};
|
|
78
|
-
font-weight: ${text.h4['font-weight']};
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
& & & ${StyledFieldGroupName} {
|
|
82
|
-
font-size: ${fontSizes[text.h5['font-size']]};
|
|
83
|
-
font-weight: ${text.h5['font-weight']};
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
& & & & ${StyledFieldGroupName} {
|
|
87
|
-
font-size: ${fontSizes[text.h6['font-size']]};
|
|
88
|
-
font-weight: ${text.h6['font-weight']};
|
|
89
|
-
}
|
|
90
75
|
`;
|
|
91
76
|
});
|
|
92
77
|
StyledFieldGroup.defaultProps = defaultThemeProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldGroup.js","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,EAAE,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACzD,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,OAAO,KAAK,cAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE5D,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAG/C,YAAY,CAAC,cAAc,CAAC,CAAC;AAC7B,YAAY,CAAC,aAAa,CAAC,CAAC;AA6D5B,SAAS;AACT,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EACzC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,SAAS,EAAE,EACpB,EACF,EAAE,EAAE;IACH,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B,OAAO,GAAG,CAAA;MACN,UAAU;8BACc,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,MAAM,CAAC,IAAI;;8BAExC,UAAU;;;+BAGT,UAAU;0BACf,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;;GAEpC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAClC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE,CAAC,GAAG,CAAA;aACE,OAAO,CAAC,MAAM;GACxB,CACF,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,IAAI,CAAA,EAAE,CAAC;AAElD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAE5C,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AAEtD,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAGpF,CAAC,EACC,SAAS,EACT,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,SAAS,EACT,UAAU,EAAE,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,EACvE,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;QAGN,CAAC,SAAS;QACZ,GAAG,CAAA;uCAC8B,OAAO;OACvC;qCAC8B,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,MAAM,CAAC,IAAI;;UAEnE,kBAAkB;sBACN,YAAY;;;wBAGV,aAAa;;;KAGhC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,QAAQ,CAC7C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,EACxD,UAAU,EAAE,EAAE,IAAI,EAAE,EACrB,EACF,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,iBAAiB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;;;UAGJ,oBAAoB;qBACT,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAa,CAAC;uBACzC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;;;YAGjC,oBAAoB;qBACX,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAa,CAAC;uBACzC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;;;cAG/B,oBAAoB;qBACb,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAa,CAAC;uBACzC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;;;gBAG7B,oBAAoB;qBACf,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAa,CAAC;uBACzC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;;KAExC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAuB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE;IACzF,MAAM,EACJ,IAAI,EAAE,EACJ,OAAO,EAAE,EAAE,aAAa,EAAE,WAAW,EAAE,EACvC,OAAO,EACP,eAAe,EAAE,gBAAgB,EAClC,EACD,UAAU,EAAE,EACV,cAAc,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,EAChD,EACF,GAAG,KAAK,CAAC;IACV,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEzB,OAAO,GAAG,CAAA;eACG,OAAO;0BACI,gBAAgB;cAC5B,WAAW,UAAU,WAAW;GAC3C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,aAAa;AACb,MAAM,gBAAgB,GAAG,CAAC,EACxB,IAAI,EACJ,eAAe,EACf,QAAQ,EACR,SAAS,EACT,OAAO,EACP,cAAc,EACQ,EAAE,EAAE;IAC1B,OAAO,CACL,KAAC,sBAAsB,IAAC,SAAS,EAAE,SAAS,YAC1C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,aACrE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,iBAAiB,aACvE,QAAQ,EACR,cAAc,IAAI,CACjB,KAAC,cAAc,IACb,OAAO,EAAE,cAAc,CAAC,OAAO,EAC/B,eAAe,EAAE,eAAe,IAAI,IAAI,YAEvC,cAAc,CAAC,OAAO,GACR,CAClB,IACI,EACN,OAAO,IAAI,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,eAAe,EAAE,eAAe,GAAI,IACpE,GACgB,CAC1B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;CAI5C,CAAC;AAEF,MAAM,UAAU,GAAqD,UAAU,CAAC,SAAS,UAAU,CACjG,EACE,QAAQ,EACR,WAAW,EACX,MAAM,EACN,IAAI,EACJ,eAAe,EACf,cAAc,EACd,OAAO,EACP,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,OAAO,EACP,MAAM,EACN,GAAG,SAAS,EACqB,EACnC,GAA2B;IAE3B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,MAAM,eAAe,GAAG,CACtB,MAAC,uBAAuB,IAAC,SAAS,EAAE,EAAE,IAAI,EAAE,gBAAgB,EAAE,GAAG,EAAE,CAAC,EAAE,aACnE,MAAM,IAAI,KAAC,MAAM,OAAK,MAAM,GAAI,EAChC,WAAW,IAAI,CACd,KAAC,iBAAiB,IAAC,EAAE,EAAE,GAAG,GAAG,cAAc,EAAE,WAAW,EAAC,GAAG,EAAC,OAAO,EAAE,WAAW,GAAI,CACtF,EACD,wBAAM,QAAQ,GAAO,IACG,CAC3B,CAAC;IAEF,OAAO,CACL,KAAC,oBAAoB,IAAC,MAAM,EAAE,OAAO,KAAK,YAAY,YACpD,MAAC,gBAAgB,kBACH,eAAe,IAAI,IAAI,sBACjB,WAAW,CAAC,CAAC,CAAC,GAAG,GAAG,cAAc,CAAC,CAAC,CAAC,SAAS,EAChE,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,KACzB,SAAS,EACb,GAAG,EAAE,GAAG,aAEP,IAAI,IAAI,CACP,KAAC,gBAAgB,IACf,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,eAAe,EAAE,eAAe,YAE/B,OAAO,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CAChC,KAAC,kBAAkB,IACjB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,EAAE,EAAE,CAAC;wBACxB,CAAC,mBACc,CAAC,SAAS,gBACb,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,eAAe,EAAE;4BACzD,eAAe,IAAI,IAAI;yBACxB,CAAC,YAEF,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,EAC/D,WAAW,EAAC,MAAM,aAElB,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,EAC1B,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,KAAC,eAAe,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC,CAAC,CAAC,IAAI,EACjE,UAAU,CAAC,CAAC,CAAC,CACZ,KAAC,IAAI,IAAC,OAAO,EAAE,UAAU,YAAG,IAAI,GAAQ,CACzC,CAAC,CAAC,CAAC,CACF,KAAC,oBAAoB,cAAE,IAAI,GAAwB,CACpD,IACI,GACY,CACtB,CAAC,CAAC,CAAC,CACF,8BACG,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,KAAC,eAAe,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC,CAAC,CAAC,IAAI,EACjE,UAAU,CAAC,CAAC,CAAC,CACZ,KAAC,IAAI,IAAC,OAAO,EAAE,UAAU,YAAG,IAAI,GAAQ,CACzC,CAAC,CAAC,CAAC,CACF,KAAC,oBAAoB,cAAE,IAAI,GAAwB,CACpD,IACA,CACJ,GACgB,CACpB,EAEA,OAAO,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,CAChC,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,YAAG,eAAe,GAAkB,CACzE,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,IACgB,GACE,CACxB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, Ref, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Text from '../Text';\nimport Button from '../Button';\nimport ExpandCollapse from '../ExpandCollapse';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport HTML from '../HTML';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport Banner from '../Banner';\nimport type { BannerProps } from '../Banner';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport Actions from '../Actions';\nimport type { ActionsProps } from '../Actions';\nimport { defaultThemeProp } from '../../theme';\nimport type { BaseProps, ForwardRefForwardPropsComponent, HeadingTag } from '../../types';\nimport { useDirection, useI18n, useUID } from '../../hooks';\nimport { calculateFontSize, omitProps } from '../../styles';\nimport type { FontSize } from '../../styles';\nimport AdditionalInfo from '../AdditionalInfo';\nimport type { AdditionalInfoProps } from '../AdditionalInfo';\n\nregisterIcon(caretRightIcon);\nregisterIcon(warnSolidIcon);\n\n// Types\nexport type FieldGroupProps = BaseProps & {\n /** The content of the Field Group. */\n children: ReactNode;\n /** A description of the field group to be displayed above the controls. */\n description?: string;\n /** A banner to be displayed above the controls. */\n banner?: BannerProps;\n /** The display and markup variant to apply to the group. */\n variant?: 'form-group';\n /** Indicates validation status for error display in the header. */\n status?: 'error';\n /** A reference to the wrapping element. */\n ref?: Ref<HTMLFieldSetElement>;\n} & (\n | {\n /** The name associated with the Field Group. */\n name: string;\n /** Provides a contextual label for the name. */\n contextualLabel?: string;\n /** Select the heading tag for header */\n headingTag?: HeadingTag;\n /** Provides additional info relevant to the field group. */\n additionalInfo?: {\n heading?: AdditionalInfoProps['heading'];\n content: AdditionalInfoProps['children'];\n };\n /** An array of actions to add to the header. */\n actions?: ActionsProps['items'];\n /**\n * Controls the collapsed state of the field group.\n * Passing undefined will render the field group as non-collapsible.\n * @default false\n */\n collapsed?: boolean;\n /**\n * Called when user clicks the toggle button.\n */\n onToggleCollapsed?: () => void;\n }\n | {\n name?: undefined;\n contextualLabel?: never;\n headingTag?: never;\n additionalInfo?: never;\n actions?: never;\n collapsed?: never;\n onToggleCollapsed?: never;\n }\n );\n\ninterface FieldGroupLegendProps extends Pick<FieldGroupProps, 'collapsed'> {\n name: NonNullable<FieldGroupProps['name']>;\n actions?: ActionsProps['items'];\n children?: ReactNode;\n additionalInfo?: FieldGroupProps['additionalInfo'];\n contextualLabel?: FieldGroupProps['contextualLabel'];\n}\n\n// Styles\nconst StyledExpandButton = styled(Button)(({\n theme: {\n base: { animation }\n }\n}) => {\n const { rtl } = useDirection();\n return css`\n ${StyledIcon} {\n transition: transform ${animation.speed} ${animation.timing.ease};\n }\n &[aria-expanded='true'] ${StyledIcon}:first-child {\n transform: rotate(90deg);\n }\n &[aria-expanded='false'] ${StyledIcon}:first-child {\n transform: rotate(${rtl ? 180 : 0}deg);\n }\n `;\n});\n\nStyledExpandButton.defaultProps = defaultThemeProp;\n\nconst StyledErrorIcon = styled(Icon)(\n ({\n theme: {\n base: { palette }\n }\n }) => css`\n color: ${palette.urgent};\n `\n);\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nexport const StyledFieldGroupName = styled.span``;\n\nexport const StyledFieldHeader = styled(Flex)`\n word-break: break-word;\n`;\n\nexport const StyledFieldGroupContent = styled(Grid)``;\n\nexport const StyledFieldGroupLegend = styled.legend.withConfig(omitProps('collapsed'))<\n Pick<FieldGroupProps, 'collapsed'>\n>(\n ({\n collapsed,\n theme: {\n base: {\n spacing,\n animation,\n 'hit-area': { 'mouse-min': hitAreaMouse, 'finger-min': hitAreaFinger }\n }\n }\n }) => {\n return css`\n width: 100%;\n margin-bottom: 0;\n ${!collapsed &&\n css`\n margin-block-end: calc(1.5 * ${spacing});\n `}\n transition: margin-block-end ${animation.speed} ${animation.timing.ease};\n\n > ${StyledExpandButton} {\n min-height: ${hitAreaMouse};\n\n @media (pointer: 'coarse') {\n min-height: ${hitAreaFinger};\n }\n }\n `;\n }\n);\n\nStyledFieldGroupLegend.defaultProps = defaultThemeProp;\n\nexport const StyledFieldGroup = styled.fieldset(\n ({\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale },\n components: { text }\n }\n }) => {\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n border: none;\n\n & ${StyledFieldGroupName} {\n font-size: ${fontSizes[text.h3['font-size'] as FontSize]};\n font-weight: ${text.h3['font-weight']};\n }\n\n & & ${StyledFieldGroupName} {\n font-size: ${fontSizes[text.h4['font-size'] as FontSize]};\n font-weight: ${text.h4['font-weight']};\n }\n\n & & & ${StyledFieldGroupName} {\n font-size: ${fontSizes[text.h5['font-size'] as FontSize]};\n font-weight: ${text.h5['font-weight']};\n }\n\n & & & & ${StyledFieldGroupName} {\n font-size: ${fontSizes[text.h6['font-size'] as FontSize]};\n font-weight: ${text.h6['font-weight']};\n }\n `;\n }\n);\n\nStyledFieldGroup.defaultProps = defaultThemeProp;\n\nexport const StyledGroupContainer = styled.div<{ border?: boolean }>(({ theme, border }) => {\n const {\n base: {\n palette: { 'border-line': borderColor },\n spacing,\n 'border-radius': baseBorderRadius\n },\n components: {\n 'form-control': { 'border-width': borderWidth }\n }\n } = theme;\n if (!border) return null;\n\n return css`\n padding: ${spacing};\n border-radius: calc(${baseBorderRadius} / 2);\n border: ${borderWidth} solid ${borderColor};\n `;\n});\n\nStyledGroupContainer.defaultProps = defaultThemeProp;\n\n// Components\nconst FieldGroupLegend = ({\n name,\n contextualLabel,\n children,\n collapsed,\n actions,\n additionalInfo\n}: FieldGroupLegendProps) => {\n return (\n <StyledFieldGroupLegend collapsed={collapsed}>\n <Flex container={{ alignItems: 'center', justify: 'between', gap: 0.5 }}>\n <Flex container={{ alignItems: 'center', gap: 0.5 }} as={StyledFieldHeader}>\n {children}\n {additionalInfo && (\n <AdditionalInfo\n heading={additionalInfo.heading}\n contextualLabel={contextualLabel || name}\n >\n {additionalInfo.content}\n </AdditionalInfo>\n )}\n </Flex>\n {actions && <Actions items={actions} contextualLabel={contextualLabel} />}\n </Flex>\n </StyledFieldGroupLegend>\n );\n};\n\nexport const StyledDescription = styled(HTML)`\n /* Prevent instruction text from contributing to modal width calculation */\n width: 0;\n min-width: 100%;\n`;\n\nconst FieldGroup: ForwardRefForwardPropsComponent<FieldGroupProps> = forwardRef(function FieldGroup(\n {\n children,\n description,\n banner,\n name,\n contextualLabel,\n additionalInfo,\n actions,\n collapsed,\n headingTag,\n onToggleCollapsed,\n variant,\n status,\n ...restProps\n }: PropsWithoutRef<FieldGroupProps>,\n ref: FieldGroupProps['ref']\n) {\n const t = useI18n();\n const uid = useUID();\n\n const descAndChildren = (\n <StyledFieldGroupContent container={{ cols: 'minmax(0, 1fr)', gap: 2 }}>\n {banner && <Banner {...banner} />}\n {description && (\n <StyledDescription id={`${uid}-description`} forwardedAs='p' content={description} />\n )}\n <div>{children}</div>\n </StyledFieldGroupContent>\n );\n\n return (\n <StyledGroupContainer border={variant === 'form-group'}>\n <StyledFieldGroup\n aria-label={contextualLabel || name}\n aria-describedby={description ? `${uid}-description` : undefined}\n as={name ? 'fieldset' : 'div'}\n {...restProps}\n ref={ref}\n >\n {name && (\n <FieldGroupLegend\n collapsed={collapsed}\n actions={actions}\n additionalInfo={additionalInfo}\n name={name}\n contextualLabel={contextualLabel}\n >\n {typeof collapsed === 'boolean' ? (\n <StyledExpandButton\n type='button'\n variant='text'\n onClick={() => {\n onToggleCollapsed?.();\n }}\n aria-expanded={!collapsed}\n aria-label={t(collapsed ? 'expand_noun' : 'collapse_noun', [\n contextualLabel || name\n ])}\n >\n <Flex\n container={{ direction: 'row', alignItems: 'center', gap: 0.5 }}\n forwardedAs='span'\n >\n <Icon name='caret-right' />\n {status === 'error' ? <StyledErrorIcon name='warn-solid' /> : null}\n {headingTag ? (\n <Text variant={headingTag}>{name}</Text>\n ) : (\n <StyledFieldGroupName>{name}</StyledFieldGroupName>\n )}\n </Flex>\n </StyledExpandButton>\n ) : (\n <>\n {status === 'error' ? <StyledErrorIcon name='warn-solid' /> : null}\n {headingTag ? (\n <Text variant={headingTag}>{name}</Text>\n ) : (\n <StyledFieldGroupName>{name}</StyledFieldGroupName>\n )}\n </>\n )}\n </FieldGroupLegend>\n )}\n\n {typeof collapsed === 'boolean' ? (\n <ExpandCollapse collapsed={collapsed}>{descAndChildren}</ExpandCollapse>\n ) : (\n descAndChildren\n )}\n </StyledFieldGroup>\n </StyledGroupContainer>\n );\n});\n\nexport default FieldGroup;\n"]}
|
|
1
|
+
{"version":3,"file":"FieldGroup.js","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, Ref, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Text from '../Text';\nimport Button from '../Button';\nimport ExpandCollapse from '../ExpandCollapse';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport HTML from '../HTML';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport Banner from '../Banner';\nimport type { BannerProps } from '../Banner';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport * as warnSolidIcon from '../Icon/icons/warn-solid.icon';\nimport Actions from '../Actions';\nimport type { ActionsProps } from '../Actions';\nimport { defaultThemeProp } from '../../theme';\nimport type { BaseProps, ForwardRefForwardPropsComponent, HeadingTag } from '../../types';\nimport { useDirection, useI18n, useUID } from '../../hooks';\nimport { calculateFontSize, omitProps } from '../../styles';\nimport type { FontSize } from '../../styles';\nimport AdditionalInfo from '../AdditionalInfo';\nimport type { AdditionalInfoProps } from '../AdditionalInfo';\n\nregisterIcon(caretRightIcon);\nregisterIcon(warnSolidIcon);\n\n// Types\nexport type FieldGroupProps = BaseProps & {\n /** The content of the Field Group. */\n children: ReactNode;\n /** A description of the field group to be displayed above the controls. */\n description?: string;\n /** A banner to be displayed above the controls. */\n banner?: BannerProps;\n /** The display and markup variant to apply to the group. */\n variant?: 'form-group';\n /** Indicates validation status for error display in the header. */\n status?: 'error';\n /** A reference to the wrapping element. */\n ref?: Ref<HTMLFieldSetElement>;\n} & (\n | {\n /** The name associated with the Field Group. */\n name: string;\n /** Provides a contextual label for the name. */\n contextualLabel?: string;\n /** Select the heading tag for header */\n headingTag?: HeadingTag;\n /** Provides additional info relevant to the field group. */\n additionalInfo?: {\n heading?: AdditionalInfoProps['heading'];\n content: AdditionalInfoProps['children'];\n };\n /** An array of actions to add to the header. */\n actions?: ActionsProps['items'];\n /**\n * Controls the collapsed state of the field group.\n * Passing undefined will render the field group as non-collapsible.\n * @default false\n */\n collapsed?: boolean;\n /**\n * Called when user clicks the toggle button.\n */\n onToggleCollapsed?: () => void;\n }\n | {\n name?: undefined;\n contextualLabel?: never;\n headingTag?: never;\n additionalInfo?: never;\n actions?: never;\n collapsed?: never;\n onToggleCollapsed?: never;\n }\n );\n\ninterface FieldGroupLegendProps extends Pick<FieldGroupProps, 'collapsed'> {\n name: NonNullable<FieldGroupProps['name']>;\n actions?: ActionsProps['items'];\n children?: ReactNode;\n additionalInfo?: FieldGroupProps['additionalInfo'];\n contextualLabel?: FieldGroupProps['contextualLabel'];\n}\n\n// Styles\nconst StyledExpandButton = styled(Button)(({\n theme: {\n base: { animation }\n }\n}) => {\n const { rtl } = useDirection();\n return css`\n ${StyledIcon} {\n transition: transform ${animation.speed} ${animation.timing.ease};\n }\n &[aria-expanded='true'] ${StyledIcon}:first-child {\n transform: rotate(90deg);\n }\n &[aria-expanded='false'] ${StyledIcon}:first-child {\n transform: rotate(${rtl ? 180 : 0}deg);\n }\n `;\n});\n\nStyledExpandButton.defaultProps = defaultThemeProp;\n\nconst StyledErrorIcon = styled(Icon)(\n ({\n theme: {\n base: { palette }\n }\n }) => css`\n color: ${palette.urgent};\n `\n);\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nexport const StyledFieldGroupName = styled.span``;\n\nexport const StyledFieldHeader = styled(Flex)`\n word-break: break-word;\n`;\n\nexport const StyledFieldGroupContent = styled(Grid)``;\n\nexport const StyledFieldGroupLegend = styled.legend.withConfig(omitProps('collapsed'))<\n Pick<FieldGroupProps, 'collapsed'>\n>(\n ({\n collapsed,\n theme: {\n base: {\n spacing,\n animation,\n 'hit-area': { 'mouse-min': hitAreaMouse, 'finger-min': hitAreaFinger }\n }\n }\n }) => {\n return css`\n width: 100%;\n margin-bottom: 0;\n ${!collapsed &&\n css`\n margin-block-end: calc(1.5 * ${spacing});\n `}\n transition: margin-block-end ${animation.speed} ${animation.timing.ease};\n\n > ${StyledExpandButton} {\n min-height: ${hitAreaMouse};\n\n @media (pointer: 'coarse') {\n min-height: ${hitAreaFinger};\n }\n }\n `;\n }\n);\n\nStyledFieldGroupLegend.defaultProps = defaultThemeProp;\n\nexport const StyledFieldGroup = styled.fieldset(\n ({\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale },\n components: { text }\n }\n }) => {\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n border: none;\n\n & ${StyledFieldGroupName} {\n font-size: ${fontSizes[text.h3['font-size'] as FontSize]};\n font-weight: ${text.h3['font-weight']};\n }\n `;\n }\n);\n\nStyledFieldGroup.defaultProps = defaultThemeProp;\n\nexport const StyledGroupContainer = styled.div<{ border?: boolean }>(({ theme, border }) => {\n const {\n base: {\n palette: { 'border-line': borderColor },\n spacing,\n 'border-radius': baseBorderRadius\n },\n components: {\n 'form-control': { 'border-width': borderWidth }\n }\n } = theme;\n if (!border) return null;\n\n return css`\n padding: ${spacing};\n border-radius: calc(${baseBorderRadius} / 2);\n border: ${borderWidth} solid ${borderColor};\n `;\n});\n\nStyledGroupContainer.defaultProps = defaultThemeProp;\n\n// Components\nconst FieldGroupLegend = ({\n name,\n contextualLabel,\n children,\n collapsed,\n actions,\n additionalInfo\n}: FieldGroupLegendProps) => {\n return (\n <StyledFieldGroupLegend collapsed={collapsed}>\n <Flex container={{ alignItems: 'center', justify: 'between', gap: 0.5 }}>\n <Flex container={{ alignItems: 'center', gap: 0.5 }} as={StyledFieldHeader}>\n {children}\n {additionalInfo && (\n <AdditionalInfo\n heading={additionalInfo.heading}\n contextualLabel={contextualLabel || name}\n >\n {additionalInfo.content}\n </AdditionalInfo>\n )}\n </Flex>\n {actions && <Actions items={actions} contextualLabel={contextualLabel} />}\n </Flex>\n </StyledFieldGroupLegend>\n );\n};\n\nexport const StyledDescription = styled(HTML)`\n /* Prevent instruction text from contributing to modal width calculation */\n width: 0;\n min-width: 100%;\n`;\n\nconst FieldGroup: ForwardRefForwardPropsComponent<FieldGroupProps> = forwardRef(function FieldGroup(\n {\n children,\n description,\n banner,\n name,\n contextualLabel,\n additionalInfo,\n actions,\n collapsed,\n headingTag,\n onToggleCollapsed,\n variant,\n status,\n ...restProps\n }: PropsWithoutRef<FieldGroupProps>,\n ref: FieldGroupProps['ref']\n) {\n const t = useI18n();\n const uid = useUID();\n\n const descAndChildren = (\n <StyledFieldGroupContent container={{ cols: 'minmax(0, 1fr)', gap: 2 }}>\n {banner && <Banner {...banner} />}\n {description && (\n <StyledDescription id={`${uid}-description`} forwardedAs='p' content={description} />\n )}\n <div>{children}</div>\n </StyledFieldGroupContent>\n );\n\n return (\n <StyledGroupContainer border={variant === 'form-group'}>\n <StyledFieldGroup\n aria-label={contextualLabel || name}\n aria-describedby={description ? `${uid}-description` : undefined}\n as={name ? 'fieldset' : 'div'}\n {...restProps}\n ref={ref}\n >\n {name && (\n <FieldGroupLegend\n collapsed={collapsed}\n actions={actions}\n additionalInfo={additionalInfo}\n name={name}\n contextualLabel={contextualLabel}\n >\n {typeof collapsed === 'boolean' ? (\n <StyledExpandButton\n type='button'\n variant='text'\n onClick={() => {\n onToggleCollapsed?.();\n }}\n aria-expanded={!collapsed}\n aria-label={t(collapsed ? 'expand_noun' : 'collapse_noun', [\n contextualLabel || name\n ])}\n >\n <Flex\n container={{ direction: 'row', alignItems: 'center', gap: 0.5 }}\n forwardedAs='span'\n >\n <Icon name='caret-right' />\n {status === 'error' ? <StyledErrorIcon name='warn-solid' /> : null}\n {headingTag ? (\n <Text variant={headingTag}>{name}</Text>\n ) : (\n <StyledFieldGroupName>{name}</StyledFieldGroupName>\n )}\n </Flex>\n </StyledExpandButton>\n ) : (\n <>\n {status === 'error' ? <StyledErrorIcon name='warn-solid' /> : null}\n {headingTag ? (\n <Text variant={headingTag}>{name}</Text>\n ) : (\n <StyledFieldGroupName>{name}</StyledFieldGroupName>\n )}\n </>\n )}\n </FieldGroupLegend>\n )}\n\n {typeof collapsed === 'boolean' ? (\n <ExpandCollapse collapsed={collapsed}>{descAndChildren}</ExpandCollapse>\n ) : (\n descAndChildren\n )}\n </StyledFieldGroup>\n </StyledGroupContainer>\n );\n});\n\nexport default FieldGroup;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControl.d.ts","sourceRoot":"","sources":["../../../src/components/FormControl/FormControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIhF,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAqB,MAAM,aAAa,CAAC;AAG9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,oDAAoD;IACpD,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACrD,2DAA2D;IAC3D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uCAAuC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6GAA6G;IAC7G,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sEAAsE;IACtE,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACnD;AAID,MAAM,WAAW,WAAW;IAC1B,4DAA4D;IAC5D,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,iBAAiB;oBACqB,OAAO;
|
|
1
|
+
{"version":3,"file":"FormControl.d.ts","sourceRoot":"","sources":["../../../src/components/FormControl/FormControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIhF,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAqB,MAAM,aAAa,CAAC;AAG9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,oDAAoD;IACpD,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IACrD,2DAA2D;IAC3D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uCAAuC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6GAA6G;IAC7G,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sEAAsE;IACtE,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qFAAqF;IACrF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACnD;AAID,MAAM,WAAW,WAAW;IAC1B,4DAA4D;IAC5D,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,iBAAiB;oBACqB,OAAO;YAyGxD,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAInE,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -11,7 +11,6 @@ export const StyledFormControl = styled.div(({ theme, status, hasSuggestion }) =
|
|
|
11
11
|
const backgroundColor = hasSuggestion && status
|
|
12
12
|
? mix(0.1, formField[status]['status-color'], palette['primary-background'])
|
|
13
13
|
: background;
|
|
14
|
-
const inline = formField.layout === 'inline';
|
|
15
14
|
return css `
|
|
16
15
|
color: ${foreground};
|
|
17
16
|
background-color: ${backgroundColor};
|
|
@@ -23,16 +22,8 @@ export const StyledFormControl = styled.div(({ theme, status, hasSuggestion }) =
|
|
|
23
22
|
transition-duration: ${speed};
|
|
24
23
|
transition-timing-function: ${timing.ease};
|
|
25
24
|
|
|
26
|
-
${inline &&
|
|
27
|
-
css `
|
|
28
|
-
flex-grow: 1;
|
|
29
|
-
flex-shrink: 1;
|
|
30
|
-
flex-basis: 0;
|
|
31
|
-
align-self: flex-start;
|
|
32
|
-
`}
|
|
33
|
-
|
|
34
25
|
&,
|
|
35
|
-
|
|
26
|
+
& > select {
|
|
36
27
|
outline: none;
|
|
37
28
|
}
|
|
38
29
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControl.js","sourceRoot":"","sources":["../../../src/components/FormControl/FormControl.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAGrC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAqDzE,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAEzC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE,EAAE;IACrC,MAAM,EACJ,IAAI,EAAE,EACJ,eAAe,EAAE,UAAU,EAC3B,WAAW,EAAE,YAAY,EACzB,YAAY,EAAE,aAAa,EAC3B,SAAS,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAC5B,OAAO,EACR,EACD,UAAU,EAAE,EACV,YAAY,EAAE,SAAS,EACvB,cAAc,EAAE,EACd,kBAAkB,EAAE,UAAU,EAC9B,kBAAkB,EAAE,UAAU,EAC9B,cAAc,EAAE,GAAG,EACnB,eAAe,EAAE,MAAM,EACvB,cAAc,EAAE,WAAW,EAC3B,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,EAC9C,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACpE,WAAW,EAAE,EACX,cAAc,EAAE,mBAAmB,EACnC,kBAAkB,EAAE,uBAAuB,EAC5C,EACD,YAAY,EAAE,EACZ,cAAc,EAAE,mBAAmB,EACnC,kBAAkB,EAAE,uBAAuB,EAC5C,EACF,EACF,EACF,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,iBAAiB,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;IAChE,MAAM,WAAW,GAAG,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,sBAAsB,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC9F,MAAM,eAAe,GACnB,aAAa,IAAI,MAAM;QACrB,CAAC,CAAC,GAAG,CAAC,GAAG,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;QAC5E,CAAC,CAAC,UAAU,CAAC;IAEjB,
|
|
1
|
+
{"version":3,"file":"FormControl.js","sourceRoot":"","sources":["../../../src/components/FormControl/FormControl.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix, rgba } from 'polished';\n\nimport type { BaseProps, ForwardProps, PropsWithDefaults } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize, getReadableStatusColor } from '../../styles';\nimport type { AdditionalInfoProps } from '../AdditionalInfo';\n\nexport interface FormControlProps extends BaseProps {\n /**\n * Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n */\n id?: string;\n /** Set visual state based on a validation state. */\n status?: 'success' | 'warning' | 'error' | 'pending';\n /** Pass a string or a fragment with an Icon and string. */\n label?: ReactNode;\n /** Visually hides the label region. */\n labelHidden?: boolean;\n /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n info?: ReactNode;\n /** Indicate if the field is required. The browser defaults to false. */\n required?: boolean;\n /** Placeholder text. The browser defaults to an empty string. */\n placeholder?: string;\n /** Button when clicked will show additional information on a field */\n additionalInfo?: {\n heading?: AdditionalInfoProps['heading'];\n content: AdditionalInfoProps['children'];\n };\n /**\n * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n * value + onChange is the recommended method per React team.\n */\n value?: string;\n /**\n * If you wish to use an [uncontrolled input](https://reactjs.org/docs/uncontrolled-components.html),\n * pass a defaultValue prop and a ref to access the input's native value prop or by other DOM ref means.\n */\n defaultValue?: string;\n /** Disable the control. The browser defaults to false. */\n disabled?: boolean;\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: boolean;\n /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n name?: string;\n /** Callback fired when AI suggestion is accepted/rejected */\n onResolveSuggestion?: (accepted: boolean) => void;\n}\n\ntype FormControlPropsWithDefaults = PropsWithDefaults<FormControlProps>;\n\nexport interface HandleValue {\n /** Used to clear component inputs with imperative handle */\n clear: () => void;\n}\n\nexport const StyledFormControl = styled.div<\n FormControlPropsWithDefaults & { hasSuggestion?: boolean }\n>(({ theme, status, hasSuggestion }) => {\n const {\n base: {\n 'border-radius': baseRadius,\n 'font-size': baseFontSize,\n 'font-scale': baseFontScale,\n animation: { speed, timing },\n palette\n },\n components: {\n 'form-field': formField,\n 'form-control': {\n 'foreground-color': foreground,\n 'background-color': background,\n 'border-color': brd,\n 'border-radius': radius,\n 'border-width': borderWidth,\n ':hover': { 'border-color': hoverBorderColor },\n ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow },\n ':disabled': {\n 'border-color': disabledBorderColor,\n 'background-color': disabledBackgroundColor\n },\n ':read-only': {\n 'border-color': readOnlyBorderColor,\n 'background-color': readOnlyBackgroundColor\n }\n }\n }\n } = theme;\n\n const fontSize = calculateFontSize(baseFontSize, baseFontScale);\n const borderColor = status && formField[status] ? getReadableStatusColor(theme, status) : brd;\n const backgroundColor =\n hasSuggestion && status\n ? mix(0.1, formField[status]['status-color'], palette['primary-background'])\n : background;\n\n return css`\n color: ${foreground};\n background-color: ${backgroundColor};\n border-radius: calc(${baseRadius} * ${radius});\n border-color: ${borderColor};\n border-width: ${borderWidth};\n border-style: solid;\n transition-property: color, background-color, border-color;\n transition-duration: ${speed};\n transition-timing-function: ${timing.ease};\n\n &,\n & > select {\n outline: none;\n }\n\n &:disabled,\n &[disabled] {\n background-color: ${disabledBackgroundColor};\n border-color: ${disabledBorderColor};\n cursor: not-allowed;\n }\n\n &:focus-visible:not([disabled]) {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n ${hasSuggestion &&\n css`\n background-color: ${background};\n `}\n }\n\n &:focus-within:not([disabled]) {\n ${hasSuggestion &&\n css`\n background-color: ${background};\n `}\n }\n\n &:hover:not([readonly]):not([disabled]):not(:focus, :focus-within) {\n ${!status &&\n css`\n border-color: ${hoverBorderColor};\n `}\n ${hasSuggestion &&\n css`\n background-color: ${background};\n box-shadow: 0 0 0 0.125rem ${rgba(borderColor, 0.2)};\n `}\n }\n\n ${hasSuggestion &&\n css`\n border-end-end-radius: 0;\n `}\n\n &[readonly] {\n background-color: ${readOnlyBackgroundColor};\n border-color: ${readOnlyBorderColor};\n }\n\n @media (pointer: coarse) {\n /* stylelint-disable-next-line unit-allowed-list */\n font-size: max(${fontSize.s}, 16px);\n }\n `;\n});\n\nStyledFormControl.defaultProps = defaultThemeProp;\n\nconst FormControl: FunctionComponent<FormControlProps & ForwardProps> = forwardRef(\n function FormControl(props: PropsWithoutRef<FormControlProps>, ref: Ref<HTMLDivElement>) {\n return <StyledFormControl ref={ref} {...props} />;\n }\n);\n\nexport default FormControl;\n"]}
|
|
@@ -12,6 +12,7 @@ export interface PreviewPanelProps extends PreviewProps {
|
|
|
12
12
|
open: DrawerProps['open'];
|
|
13
13
|
}
|
|
14
14
|
export interface PreviewOptions {
|
|
15
|
+
/** Leaving this as a stub as we may want to add more options in the future */
|
|
15
16
|
previewProps: PreviewProps;
|
|
16
17
|
}
|
|
17
18
|
export interface PreviewManagerProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Preview.types.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,OAAO,EACP,QAAQ,EACR,gBAAgB,EAChB,SAAS,EACT,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,cAAc,CACvC,KAAK,EACL;IACE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wFAAwF;IACxF,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,GACC,IAAI,CAAC,WAAW,EAAE,cAAc,GAAG,aAAa,GAAG,eAAe,GAAG,cAAc,CAAC,GACpF,MAAM,GACN,UAAU,GACV,SAAS,CAAC;AAEZ,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,cAAc;
|
|
1
|
+
{"version":3,"file":"Preview.types.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,OAAO,EACP,QAAQ,EACR,gBAAgB,EAChB,SAAS,EACT,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,cAAc,CACvC,KAAK,EACL;IACE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wFAAwF;IACxF,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,GACC,IAAI,CAAC,WAAW,EAAE,cAAc,GAAG,aAAa,GAAG,eAAe,GAAG,cAAc,CAAC,GACpF,MAAM,GACN,UAAU,GACV,SAAS,CAAC;AAEZ,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,cAAc;IAC7B,8EAA8E;IAC9E,YAAY,EAAE,YAAY,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IACvD,aAAa,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC9E,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAoB,SAAQ,OAAO,CAAC,cAAc,CAAC;IAClE,WAAW,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACzD;AAED,MAAM,WAAW,0BAA0B;IACzC;;;OAGG;IACH,aAAa,EAAE,CAAC,CAAC,SAAS,MAAM,EAC9B,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,EAC3B,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EACrB,OAAO,CAAC,EAAE,cAAc,KACrB,cAAc,CAAC,CAAC,CAAC,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC7C,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CACrD;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,CAAC,CAAC;IACT,OAAO,EAAE,cAAc,CAAC;IACxB,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Preview.types.js","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n ComponentType,\n Context,\n Dispatch,\n MutableRefObject,\n ReactNode,\n SetStateAction\n} from 'react';\n\nimport type { AsProp, BaseProps, DeferInfer, TestIdProp, WithAttributes } from '../../types';\nimport type { DrawerProps } from '../Drawer';\n\nexport type PreviewProps = WithAttributes<\n 'div',\n {\n children?: ReactNode;\n /** If true, the Preview Panel will render in a progress state. */\n progress?: boolean;\n /** Accessible label for the preview container. Will be constructed as 'Preview of X' */\n previewLabel?: string;\n }\n> &\n Pick<DrawerProps, 'onBeforeOpen' | 'onAfterOpen' | 'onBeforeClose' | 'onAfterClose'> &\n AsProp &\n TestIdProp &\n BaseProps;\n\nexport interface PreviewPanelProps extends PreviewProps {\n open: DrawerProps['open'];\n}\n\nexport interface PreviewOptions {\n
|
|
1
|
+
{"version":3,"file":"Preview.types.js","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n ComponentType,\n Context,\n Dispatch,\n MutableRefObject,\n ReactNode,\n SetStateAction\n} from 'react';\n\nimport type { AsProp, BaseProps, DeferInfer, TestIdProp, WithAttributes } from '../../types';\nimport type { DrawerProps } from '../Drawer';\n\nexport type PreviewProps = WithAttributes<\n 'div',\n {\n children?: ReactNode;\n /** If true, the Preview Panel will render in a progress state. */\n progress?: boolean;\n /** Accessible label for the preview container. Will be constructed as 'Preview of X' */\n previewLabel?: string;\n }\n> &\n Pick<DrawerProps, 'onBeforeOpen' | 'onAfterOpen' | 'onBeforeClose' | 'onAfterClose'> &\n AsProp &\n TestIdProp &\n BaseProps;\n\nexport interface PreviewPanelProps extends PreviewProps {\n open: DrawerProps['open'];\n}\n\nexport interface PreviewOptions {\n /** Leaving this as a stub as we may want to add more options in the future */\n previewProps: PreviewProps;\n}\n\nexport interface PreviewManagerProps {\n children: ReactNode;\n}\n\nexport interface PreviewMethods<P extends object = object> {\n updatePreview: (props: Partial<P>, options?: Partial<PreviewOptions>) => void;\n unmountPreview: () => void;\n}\n\nexport interface PreviewContextValue extends Partial<PreviewMethods> {\n initialized: boolean;\n previewTriggerRef: MutableRefObject<HTMLElement | null>;\n}\n\nexport interface PreviewManagerContextValue {\n /**\n * The function that will create the Preview. This function accepts the component to render\n * within Preview, props for that component, and options for the preview instance.\n */\n createPreview: <P extends object>(\n component: ComponentType<P>,\n props?: DeferInfer<P>,\n options?: PreviewOptions\n ) => PreviewMethods<P>;\n PreviewContext: Context<PreviewContextValue>;\n initialized: boolean;\n previewActive: boolean;\n setPreviewActive: Dispatch<SetStateAction<boolean>>;\n}\n\nexport interface PreviewObject<P extends object = object> {\n id: string;\n props: P;\n methods: PreviewMethods;\n Component: ComponentType<P>;\n options?: PreviewOptions;\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "10.0.0-build.2.
|
|
3
|
+
"version": "10.0.0-build.2.4",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|