@wavelengthusaf/components 2.8.0 → 2.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +9 -0
  2. package/dist/cjs/index.cjs +324 -28
  3. package/dist/cjs/index.cjs.map +1 -1
  4. package/dist/cjs/index.d.cts +49 -3
  5. package/dist/esm/index.d.ts +49 -3
  6. package/dist/esm/index.js +503 -207
  7. package/dist/esm/index.js.map +1 -1
  8. package/package.json +1 -1
package/README.md CHANGED
@@ -14,6 +14,15 @@ npm install @wavelengthusaf/components
14
14
 
15
15
  ## Release Notes
16
16
 
17
+ ### 2.9.0
18
+ - 4/25/2025
19
+ - New Alert Component
20
+ - Added tests for new components (Alert Component)
21
+
22
+ ### 2.8.1
23
+ - 4/18/2024
24
+ - Created test for the Wavelength Comment Display
25
+
17
26
  ### 2.7.3
18
27
 
19
28
  - 4/8/2025
package/dist/cjs/index.cjs CHANGED
@@ -206,7 +206,7 @@ var require_react_is_development = __commonJS({
206
206
  var ContextProvider = REACT_PROVIDER_TYPE;
207
207
  var Element = REACT_ELEMENT_TYPE;
208
208
  var ForwardRef2 = REACT_FORWARD_REF_TYPE;
209
- var Fragment13 = REACT_FRAGMENT_TYPE;
209
+ var Fragment14 = REACT_FRAGMENT_TYPE;
210
210
  var Lazy = REACT_LAZY_TYPE;
211
211
  var Memo2 = REACT_MEMO_TYPE;
212
212
  var Portal = REACT_PORTAL_TYPE;
@@ -265,7 +265,7 @@ var require_react_is_development = __commonJS({
265
265
  exports.ContextProvider = ContextProvider;
266
266
  exports.Element = Element;
267
267
  exports.ForwardRef = ForwardRef2;
268
- exports.Fragment = Fragment13;
268
+ exports.Fragment = Fragment14;
269
269
  exports.Lazy = Lazy;
270
270
  exports.Memo = Memo2;
271
271
  exports.Portal = Portal;
@@ -3318,6 +3318,7 @@ function WavelengthStyledButton({ type = "default", styles, children, disabled =
3318
3318
  children
3319
3319
  ] });
3320
3320
  }
3321
+ var WavelengthStyledButton_default = WavelengthStyledButton;
3321
3322
 
3322
3323
  // src/components/containers/WavelengthBox/WavelengthBox.tsx
3323
3324
  var _Grid = require('@mui/material/Grid'); var _Grid2 = _interopRequireDefault(_Grid);
@@ -4624,7 +4625,8 @@ function WavelengthDragAndDrop({
4624
4625
  fontSize = "12px",
4625
4626
  allowedFileMIME,
4626
4627
  allowedFileExtensions,
4627
- backgroundColor: backgroundColor2 = "transparent"
4628
+ backgroundColor: backgroundColor2 = "transparent",
4629
+ dataTestId
4628
4630
  }) {
4629
4631
  const handleFileChange = (event) => {
4630
4632
  const selectedFiles = event.target.files;
@@ -4650,6 +4652,7 @@ function WavelengthDragAndDrop({
4650
4652
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4651
4653
  "div",
4652
4654
  {
4655
+ "data-testid": dataTestId,
4653
4656
  style: {
4654
4657
  backgroundColor: backgroundColor2,
4655
4658
  border: border2 ? border2 : "1px dashed rgba(14, 178, 178, 1)",
@@ -4681,7 +4684,7 @@ function WavelengthDragAndDrop({
4681
4684
  var _Box = require('@mui/material/Box'); var _Box2 = _interopRequireDefault(_Box);
4682
4685
  var _LinearProgress = require('@mui/material/LinearProgress'); var _LinearProgress2 = _interopRequireDefault(_LinearProgress);
4683
4686
 
4684
- function WavelengthProgressBar({ width: width2 = "425px", height: height2 = "12px", backgroundColor: backgroundColor2, borderRadius: borderRadius2 = "24px", progressColor, value, name, textColor = "inherit" }) {
4687
+ function WavelengthProgressBar({ dataTestId, width: width2 = "425px", height: height2 = "12px", backgroundColor: backgroundColor2, borderRadius: borderRadius2 = "24px", progressColor, value, name, textColor = "inherit" }) {
4685
4688
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
4686
4689
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "row", width: width2, justifyContent: "space-between", color: textColor }, children: [
4687
4690
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", children: name }),
@@ -4696,7 +4699,7 @@ function WavelengthProgressBar({ width: width2 = "425px", height: height2 = "12p
4696
4699
  "%"
4697
4700
  ] })
4698
4701
  ] }),
4699
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { width: width2, height: "12px", borderRadius: "24px" }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4702
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { "data-testid": dataTestId, sx: { width: width2, height: "12px", borderRadius: "24px" }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4700
4703
  _LinearProgress2.default,
4701
4704
  {
4702
4705
  variant: "determinate",
@@ -4725,6 +4728,7 @@ function WavelengthCommentDisplay(props) {
4725
4728
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
4726
4729
  "div",
4727
4730
  {
4731
+ "data-testid": props.dataTestId,
4728
4732
  style: {
4729
4733
  display: "flex",
4730
4734
  flexDirection: "column",
@@ -4743,9 +4747,9 @@ function WavelengthCommentDisplay(props) {
4743
4747
  !selected && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4744
4748
  _material.IconButton,
4745
4749
  {
4746
- onClick: () => {
4750
+ onClick: (e) => {
4747
4751
  setSelected(!selected);
4748
- props.onClick;
4752
+ _optionalChain([props, 'access', _7 => _7.onClick, 'optionalCall', _8 => _8(e)]);
4749
4753
  },
4750
4754
  style: { padding: "0px" },
4751
4755
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CheckCircleOutline2.default, { fontSize: "small" })
@@ -4754,9 +4758,9 @@ function WavelengthCommentDisplay(props) {
4754
4758
  selected && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4755
4759
  _material.IconButton,
4756
4760
  {
4757
- onClick: () => {
4761
+ onClick: (e) => {
4758
4762
  setSelected(!selected);
4759
- props.onClick;
4763
+ _optionalChain([props, 'access', _9 => _9.onClick, 'optionalCall', _10 => _10(e)]);
4760
4764
  },
4761
4765
  style: { padding: "0px" },
4762
4766
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CheckCircle2.default, { fontSize: "small", sx: { color: props.iconSelectedColor || "rgba(209, 106, 47, 1)" } })
@@ -4764,12 +4768,301 @@ function WavelengthCommentDisplay(props) {
4764
4768
  )
4765
4769
  ] }),
4766
4770
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { style: { fontSize: "12px", fontWeight: 400, opacity: 0.6 }, children: props.date }),
4767
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontSize: "14px", fontWeight: 400 }, children: props.comments })
4771
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontSize: "14px", fontWeight: 400, marginTop: "8px" }, children: props.comments })
4768
4772
  ]
4769
4773
  }
4770
4774
  );
4771
4775
  }
4772
4776
 
4777
+ // src/components/PageComponents/WavelengthPermissionAlert.tsx
4778
+
4779
+ function WavelengthPermissionAlert({
4780
+ dataTestId,
4781
+ height: height2 = "112px",
4782
+ width: width2 = "314px",
4783
+ backgroundColor: backgroundColor2 = "white",
4784
+ permission,
4785
+ applicationName,
4786
+ requestorName,
4787
+ dateOfRequest,
4788
+ onDismiss,
4789
+ unit = "No Unit"
4790
+ }) {
4791
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
4792
+ "div",
4793
+ {
4794
+ "data-testid": dataTestId,
4795
+ style: {
4796
+ width: width2,
4797
+ height: height2,
4798
+ backgroundColor: backgroundColor2,
4799
+ border: "1px solid #5F5F5F",
4800
+ borderRadius: "12px",
4801
+ display: "flex",
4802
+ flexDirection: "column",
4803
+ padding: "8px 12px",
4804
+ gap: "8px",
4805
+ fontSize: "14px",
4806
+ fontWeight: 400,
4807
+ boxSizing: "border-box",
4808
+ fontFamily: "roboto"
4809
+ },
4810
+ children: [
4811
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontSize: "20px", fontWeight: 400 }, children: permission }),
4812
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { letterSpacing: "-6%" }, children: [
4813
+ "Application: ",
4814
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { style: { fontWeight: 600, marginLeft: "4px" }, children: applicationName })
4815
+ ] }),
4816
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { letterSpacing: "-6%" }, children: [
4817
+ "Requestor:",
4818
+ " ",
4819
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { style: { fontWeight: 600, marginLeft: "4px" }, children: [
4820
+ requestorName,
4821
+ ", ",
4822
+ "" + unit
4823
+ ] })
4824
+ ] }),
4825
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "row", justifyContent: "space-between" }, children: [
4826
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { letterSpacing: "-6%" }, children: [
4827
+ "Date of Request: ",
4828
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { style: { fontWeight: 600, marginLeft: "4px" }, children: dateOfRequest })
4829
+ ] }),
4830
+ " ",
4831
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "a", { href: "", style: { color: "black", fontWeight: 600 }, onClick: onDismiss, children: "Dismiss" }),
4832
+ " "
4833
+ ] })
4834
+ ]
4835
+ }
4836
+ ) });
4837
+ }
4838
+
4839
+ // src/components/PageComponents/WavelengthAccessAlert.tsx
4840
+ var _Check = require('@mui/icons-material/Check'); var _Check2 = _interopRequireDefault(_Check);
4841
+ var _NotInterested = require('@mui/icons-material/NotInterested'); var _NotInterested2 = _interopRequireDefault(_NotInterested);
4842
+
4843
+ function WavelengthAccessAlert({
4844
+ height: height2 = "100px",
4845
+ dataTestId,
4846
+ width: width2 = "244px",
4847
+ time = "2m ago",
4848
+ access = "Access Request",
4849
+ appNickname = "App Nickname",
4850
+ appLogo = "wings",
4851
+ appAdmin = "app.admin.1",
4852
+ requestorName = "joes.user.1"
4853
+ }) {
4854
+ if (access === "Access Request") {
4855
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
4856
+ "div",
4857
+ {
4858
+ "data-testid": dataTestId,
4859
+ style: {
4860
+ width: width2,
4861
+ height: height2,
4862
+ border: "1px solid rgba(0, 0, 0, 0.6)",
4863
+ borderRadius: "6px",
4864
+ position: "relative",
4865
+ padding: "8px 10px 2px 10px",
4866
+ display: "grid",
4867
+ gridTemplateColumns: "1fr 3fr 2fr",
4868
+ gridTemplateRows: "1fr 1fr 1fr",
4869
+ boxSizing: "border-box"
4870
+ },
4871
+ children: [
4872
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontSize: "8px", fontWeight: 400, position: "absolute", top: "5px", right: "12px" }, children: time }),
4873
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontWeight: 700, fontSize: "12px", color: "rgba(248, 136, 5, 1)", marginTop: "5px", marginLeft: "5px", gridArea: "1/2/1/3" }, children: access }),
4874
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { gridArea: "2/1/3/2" }, children: [
4875
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AppLogo_default, { name: appLogo, width: 22 }),
4876
+ " "
4877
+ ] }),
4878
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "column", gridArea: "2/2/3/4", fontSize: "10px", gap: "4px", marginLeft: "5px" }, children: [
4879
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { htmlFor: "", children: [
4880
+ "Requestor: ",
4881
+ requestorName
4882
+ ] }),
4883
+ " ",
4884
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", children: appNickname })
4885
+ ] }),
4886
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4887
+ WavelengthStyledButton_default,
4888
+ {
4889
+ type: "default",
4890
+ styles: { backgroundColor: "rgba(143, 143, 143, 1)", marginTop: "5px", borderRadius: "5px", height: "22px", width: "44px", gridArea: "3/4/3/4", color: "white" },
4891
+ children: "clear"
4892
+ }
4893
+ )
4894
+ ]
4895
+ }
4896
+ );
4897
+ } else if (access === "Access Granted") {
4898
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
4899
+ "div",
4900
+ {
4901
+ "data-testid": dataTestId,
4902
+ style: {
4903
+ width: width2,
4904
+ height: height2,
4905
+ border: "1px solid rgba(0, 0, 0, 0.6)",
4906
+ borderRadius: "6px",
4907
+ position: "relative",
4908
+ padding: "8px 10px 2px 10px",
4909
+ display: "grid",
4910
+ gridTemplateColumns: "1fr 3fr 2fr",
4911
+ gridTemplateRows: "1fr 1fr 1fr",
4912
+ boxSizing: "border-box"
4913
+ },
4914
+ children: [
4915
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontSize: "8px", fontWeight: 400, position: "absolute", top: "5px", right: "12px" }, children: time }),
4916
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { fontWeight: 700, fontSize: "12px", marginTop: "5px", marginLeft: "5px", gridArea: "1/2/1/4", display: "flex", alignItems: "center" }, children: [
4917
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Check2.default, { fontSize: "small", sx: { color: "rgba(36, 226, 32, 1)", width: "16px" } }),
4918
+ access
4919
+ ] }),
4920
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { gridArea: "2/1/3/2" }, children: [
4921
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AppLogo_default, { name: appLogo, width: 22 }),
4922
+ " "
4923
+ ] }),
4924
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "column", gridArea: "2/2/3/4", fontSize: "10px", marginLeft: "5px" }, children: [
4925
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontWeight: 700, fontSize: "10px" }, children: appNickname }),
4926
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", style: { marginTop: "5px" }, children: appAdmin }),
4927
+ " ",
4928
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", children: "Added you as a user" })
4929
+ ] }),
4930
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, WavelengthStyledButton_default, { type: "default", styles: { backgroundColor: "rgba(143, 143, 143, 1)", borderRadius: "5px", height: "22px", width: "44px", gridArea: "3/4/3/4", color: "white" }, children: "clear" })
4931
+ ]
4932
+ }
4933
+ );
4934
+ } else {
4935
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
4936
+ "div",
4937
+ {
4938
+ "data-testid": dataTestId,
4939
+ style: {
4940
+ width: width2,
4941
+ height: height2,
4942
+ border: "1px solid rgba(0, 0, 0, 0.6)",
4943
+ borderRadius: "6px",
4944
+ position: "relative",
4945
+ padding: "8px 10px 2px 10px",
4946
+ display: "grid",
4947
+ gridTemplateColumns: "1fr 3fr 2fr",
4948
+ gridTemplateRows: "1fr 1fr 1fr",
4949
+ boxSizing: "border-box"
4950
+ },
4951
+ children: [
4952
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontSize: "8px", fontWeight: 400, position: "absolute", top: "5px", right: "12px" }, children: time }),
4953
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { fontWeight: 700, fontSize: "12px", marginTop: "5px", marginLeft: "5px", gridArea: "1/2/1/4", display: "flex", alignItems: "center" }, children: [
4954
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _NotInterested2.default, { fontSize: "small", sx: { color: "rgba(234, 30, 30, 1)", width: "16px" } }),
4955
+ access
4956
+ ] }),
4957
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { gridArea: "2/1/3/2" }, children: [
4958
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AppLogo_default, { name: appLogo, width: 22 }),
4959
+ " "
4960
+ ] }),
4961
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "column", gridArea: "2/2/3/4", fontSize: "10px", marginLeft: "5px" }, children: [
4962
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: { fontWeight: 700, fontSize: "10px" }, children: appNickname }),
4963
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", style: { marginTop: "5px" }, children: appAdmin }),
4964
+ " ",
4965
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", children: "Denied your request" })
4966
+ ] }),
4967
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, WavelengthStyledButton_default, { type: "default", styles: { backgroundColor: "rgba(143, 143, 143, 1)", borderRadius: "5px", height: "22px", width: "44px", gridArea: "3/4/3/4", color: "white" }, children: "clear" })
4968
+ ]
4969
+ }
4970
+ );
4971
+ }
4972
+ }
4973
+
4974
+ // src/components/PageComponents/WavelengthAlert.tsx
4975
+ var _Close = require('@mui/icons-material/Close'); var _Close2 = _interopRequireDefault(_Close);
4976
+
4977
+ var _Notifications = require('@mui/icons-material/Notifications'); var _Notifications2 = _interopRequireDefault(_Notifications);
4978
+
4979
+ function WavelengthAlert({
4980
+ viewed,
4981
+ width: width2 = "320px",
4982
+ height: height2 = "96px",
4983
+ backgroundColor: backgroundColor2 = "rgba(229, 246, 253, 1)",
4984
+ alertHeader = "Access Requested",
4985
+ alertDescription = "Keenan Ray has requested to be added as a User to your App",
4986
+ datatestid,
4987
+ id,
4988
+ onClose
4989
+ }) {
4990
+ if (!viewed) {
4991
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
4992
+ "div",
4993
+ {
4994
+ role: "alert",
4995
+ id,
4996
+ "data-testid": datatestid,
4997
+ style: {
4998
+ width: width2,
4999
+ height: height2,
5000
+ backgroundColor: backgroundColor2,
5001
+ fontFamily: "Roboto, sans-serif",
5002
+ border: "1px solid rgba(2, 136, 209, 1)",
5003
+ borderRadius: "4px",
5004
+ display: "flex",
5005
+ flexDirection: "row",
5006
+ boxSizing: "border-box",
5007
+ alignItems: "flex-start",
5008
+ padding: "12px 16px 10px 16px"
5009
+ },
5010
+ children: [
5011
+ " ",
5012
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Notifications2.default, { sx: { width: "24px", padding: "0px", color: "rgba(2, 136, 209, 1)" } }),
5013
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "column", gap: "4px", width: "250px", marginLeft: "12px" }, children: [
5014
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", style: { fontSize: "1rem", lineHeight: "150%", letterSpacing: "0.15px", fontWeight: 500 }, children: alertHeader }),
5015
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
5016
+ "div",
5017
+ {
5018
+ style: { fontSize: ".875rem", fontWeight: 400, lineHeight: "143%", display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical", overflow: "hidden", textOverflow: "ellipsis" },
5019
+ children: alertDescription
5020
+ }
5021
+ )
5022
+ ] }),
5023
+ onClose && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.IconButton, { sx: { padding: "0px", width: "20px" }, onClick: onClose, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, {}) })
5024
+ ]
5025
+ }
5026
+ );
5027
+ } else {
5028
+ return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
5029
+ "div",
5030
+ {
5031
+ role: "alert",
5032
+ id,
5033
+ "data-testid": datatestid,
5034
+ style: {
5035
+ width: width2,
5036
+ height: height2,
5037
+ backgroundColor: backgroundColor2 = "#DFDCDC",
5038
+ fontFamily: "Roboto, sans-serif",
5039
+ border: "1px solid #A0A2A3",
5040
+ borderRadius: "4px",
5041
+ display: "flex",
5042
+ flexDirection: "row",
5043
+ boxSizing: "border-box",
5044
+ alignItems: "flex-start",
5045
+ padding: "12px 16px 10px 16px"
5046
+ },
5047
+ children: [
5048
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Notifications2.default, { sx: { width: "24px", padding: "0px", color: "#A0A2A3" } }),
5049
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "column", gap: "4px", width: "250px", marginLeft: "12px" }, children: [
5050
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", { htmlFor: "", style: { fontSize: "1rem", lineHeight: "150%", letterSpacing: "0.15px", fontWeight: 500 }, children: alertHeader }),
5051
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
5052
+ "div",
5053
+ {
5054
+ style: { fontSize: ".875rem", fontWeight: 400, lineHeight: "143%", display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical", overflow: "hidden", textOverflow: "ellipsis" },
5055
+ children: alertDescription
5056
+ }
5057
+ )
5058
+ ] }),
5059
+ onClose && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.IconButton, { sx: { padding: "0px", width: "20px" }, onClick: onClose, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, {}) })
5060
+ ]
5061
+ }
5062
+ );
5063
+ }
5064
+ }
5065
+
4773
5066
  // src/components/footers/WavelengthFooter/WavelengthFooter.tsx
4774
5067
 
4775
5068
 
@@ -4943,18 +5236,18 @@ var WavelengthTitleBar = class extends HTMLElement {
4943
5236
  attributeChangedCallback(name, oldValue, newValue) {
4944
5237
  if (oldValue !== newValue) {
4945
5238
  if (name === "title-text") {
4946
- const titleElement = _optionalChain([this, 'access', _7 => _7.shadowRoot, 'optionalAccess', _8 => _8.querySelector, 'call', _9 => _9(".title")]);
5239
+ const titleElement = _optionalChain([this, 'access', _11 => _11.shadowRoot, 'optionalAccess', _12 => _12.querySelector, 'call', _13 => _13(".title")]);
4947
5240
  if (titleElement) {
4948
5241
  titleElement.textContent = newValue;
4949
5242
  }
4950
5243
  } else if (name === "subtitle-text") {
4951
- const subtitleElement = _optionalChain([this, 'access', _10 => _10.shadowRoot, 'optionalAccess', _11 => _11.querySelector, 'call', _12 => _12(".subtitle")]);
5244
+ const subtitleElement = _optionalChain([this, 'access', _14 => _14.shadowRoot, 'optionalAccess', _15 => _15.querySelector, 'call', _16 => _16(".subtitle")]);
4952
5245
  if (subtitleElement) {
4953
5246
  subtitleElement.textContent = newValue;
4954
5247
  }
4955
5248
  } else if (name === "text-color") {
4956
- const titleElement = _optionalChain([this, 'access', _13 => _13.shadowRoot, 'optionalAccess', _14 => _14.querySelector, 'call', _15 => _15(".title")]);
4957
- const subtitleElement = _optionalChain([this, 'access', _16 => _16.shadowRoot, 'optionalAccess', _17 => _17.querySelector, 'call', _18 => _18(".subtitle")]);
5249
+ const titleElement = _optionalChain([this, 'access', _17 => _17.shadowRoot, 'optionalAccess', _18 => _18.querySelector, 'call', _19 => _19(".title")]);
5250
+ const subtitleElement = _optionalChain([this, 'access', _20 => _20.shadowRoot, 'optionalAccess', _21 => _21.querySelector, 'call', _22 => _22(".subtitle")]);
4958
5251
  if (titleElement) {
4959
5252
  titleElement.style.color = newValue;
4960
5253
  }
@@ -4962,7 +5255,7 @@ var WavelengthTitleBar = class extends HTMLElement {
4962
5255
  subtitleElement.style.color = newValue;
4963
5256
  }
4964
5257
  } else if (name === "has-shadow") {
4965
- const titleElement = _optionalChain([this, 'access', _19 => _19.shadowRoot, 'optionalAccess', _20 => _20.querySelector, 'call', _21 => _21(".title")]);
5258
+ const titleElement = _optionalChain([this, 'access', _23 => _23.shadowRoot, 'optionalAccess', _24 => _24.querySelector, 'call', _25 => _25(".title")]);
4966
5259
  if (titleElement) {
4967
5260
  titleElement.style.textShadow = newValue !== "false" ? "none" : "0.313rem 0.313rem 0.375rem #FFFFFF";
4968
5261
  }
@@ -5193,8 +5486,8 @@ function WavelengthConfirmationModal(props) {
5193
5486
  overflow: "scroll"
5194
5487
  },
5195
5488
  children: [
5196
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { style: { margin: "0px", fontSize: "28px", fontWeight: 500, padding: "0px", marginBottom: "16px", fontFamily: props.fontFamily }, children: _optionalChain([props, 'access', _22 => _22.textObj, 'optionalAccess', _23 => _23.title]) }),
5197
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { style: { margin: "0px", fontSize: "16px", lineHeight: "19.2px", fontFamily: props.fontFamily, fontWeight: 400, height: "60px" }, children: _optionalChain([props, 'access', _24 => _24.textObj, 'optionalAccess', _25 => _25.dialog]) }),
5489
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { style: { margin: "0px", fontSize: "28px", fontWeight: 500, padding: "0px", marginBottom: "16px", fontFamily: props.fontFamily }, children: _optionalChain([props, 'access', _26 => _26.textObj, 'optionalAccess', _27 => _27.title]) }),
5490
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { style: { margin: "0px", fontSize: "16px", lineHeight: "19.2px", fontFamily: props.fontFamily, fontWeight: 400, height: "60px" }, children: _optionalChain([props, 'access', _28 => _28.textObj, 'optionalAccess', _29 => _29.dialog]) }),
5198
5491
  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", flexDirection: "row", justifyContent: "flex-end", marginTop: "40px", gap: "8px" }, children: [
5199
5492
  props.cancelButton,
5200
5493
  props.submitButton
@@ -5206,7 +5499,7 @@ function WavelengthConfirmationModal(props) {
5206
5499
 
5207
5500
  // src/components/modals/WavelengthContentModal.tsx
5208
5501
 
5209
- var _Close = require('@mui/icons-material/Close'); var _Close2 = _interopRequireDefault(_Close);
5502
+
5210
5503
 
5211
5504
  function WavelengthContentModal(props) {
5212
5505
  const { show, setShow, handleContentModalOnConfirmProp } = props;
@@ -5215,11 +5508,11 @@ function WavelengthContentModal(props) {
5215
5508
  };
5216
5509
  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Dialog, { "data-testid": "testId-WavelengthContentModal", open: show, onClose: handleClose, "aria-labelledby": "alert-dialog-title", "aria-describedby": "alert-dialog-description", children: [
5217
5510
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogTitle, { alignContent: `center`, id: "alert-dialog-title", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { display: "flex", alignItems: "center", children: [
5218
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { flexGrow: 1, children: _optionalChain([props, 'access', _26 => _26.textObj, 'optionalAccess', _27 => _27.title]) }),
5511
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { flexGrow: 1, children: _optionalChain([props, 'access', _30 => _30.textObj, 'optionalAccess', _31 => _31.title]) }),
5219
5512
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.IconButton, { onClick: handleClose, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, {}) }) })
5220
5513
  ] }) }),
5221
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogContent, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { align: "center", children: _optionalChain([props, 'access', _28 => _28.textObj, 'optionalAccess', _29 => _29.dialog]) }) }),
5222
- /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogActions, { style: { justifyContent: `center` }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Button, { "data-testid": "testId-WavelengthContentModalConfirmButton", onClick: handleContentModalOnConfirmProp, color: "primary", variant: "contained", autoFocus: true, children: _optionalChain([props, 'access', _30 => _30.textObj, 'optionalAccess', _31 => _31.purpose]) }) })
5514
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogContent, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { align: "center", children: _optionalChain([props, 'access', _32 => _32.textObj, 'optionalAccess', _33 => _33.dialog]) }) }),
5515
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogActions, { style: { justifyContent: `center` }, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Button, { "data-testid": "testId-WavelengthContentModalConfirmButton", onClick: handleContentModalOnConfirmProp, color: "primary", variant: "contained", autoFocus: true, children: _optionalChain([props, 'access', _34 => _34.textObj, 'optionalAccess', _35 => _35.purpose]) }) })
5223
5516
  ] });
5224
5517
  }
5225
5518
 
@@ -5368,7 +5661,7 @@ function WavelengthDropdown({
5368
5661
  buttonSx,
5369
5662
  width: width2 = "190px",
5370
5663
  buttonText,
5371
- menuSx = { backgroundColor: "#FCFAF8", borderColor: "blue", width: "190px", boxShadow: "none" },
5664
+ menuSx = { backgroundColor: "#FCFAF8", borderColor: "blue", width: width2, boxShadow: "none" },
5372
5665
  palette: palette2
5373
5666
  }) {
5374
5667
  const [anchorEl, setAnchorEl] = React.default.useState(null);
@@ -5433,7 +5726,7 @@ function WavelengthDropdown({
5433
5726
  borderBottomRightRadius: "8px",
5434
5727
  borderTopRightRadius: "0px",
5435
5728
  borderTopLeftRadius: "0px",
5436
- boxShadow: _optionalChain([menuSx, 'optionalAccess', _32 => _32.boxShadow]),
5729
+ boxShadow: _optionalChain([menuSx, 'optionalAccess', _36 => _36.boxShadow]),
5437
5730
  width: myMenusx.width,
5438
5731
  backgroundColor: `${myMenusx.backgroundColor}`
5439
5732
  },
@@ -6188,7 +6481,7 @@ function WavelengthTextField(props) {
6188
6481
  label: props.label,
6189
6482
  onChange: (e) => {
6190
6483
  handleChange(e);
6191
- _optionalChain([props, 'access', _33 => _33.onChange, 'optionalCall', _34 => _34(e)]);
6484
+ _optionalChain([props, 'access', _37 => _37.onChange, 'optionalCall', _38 => _38(e)]);
6192
6485
  },
6193
6486
  error: hasError,
6194
6487
  helperText: hasError ? props.errorMessage : "",
@@ -6237,7 +6530,7 @@ function WavelengthTextField(props) {
6237
6530
  error: hasError,
6238
6531
  onChange: (e) => {
6239
6532
  handleChange(e);
6240
- _optionalChain([props, 'access', _35 => _35.onChange, 'optionalCall', _36 => _36(e)]);
6533
+ _optionalChain([props, 'access', _39 => _39.onChange, 'optionalCall', _40 => _40(e)]);
6241
6534
  }
6242
6535
  }
6243
6536
  ),
@@ -6426,7 +6719,7 @@ var WavelengthDataTable = ({ data, columns, itemsPerPage, totalPages }) => {
6426
6719
  const [noRowsOpen, setNoRowsOpen] = _react.useState.call(void 0, false);
6427
6720
  const [isModalOpen, setIsModalOpen] = _react.useState.call(void 0, false);
6428
6721
  const [searchItem, setSearchItem] = _react.useState.call(void 0, "");
6429
- const [selectedValue, setSelectedValue] = _react.useState.call(void 0, _optionalChain([columns, 'access', _37 => _37[0], 'optionalAccess', _38 => _38.key]) || "");
6722
+ const [selectedValue, setSelectedValue] = _react.useState.call(void 0, _optionalChain([columns, 'access', _41 => _41[0], 'optionalAccess', _42 => _42.key]) || "");
6430
6723
  const [currentPage, setCurrentPage] = _react.useState.call(void 0, 1);
6431
6724
  const [isOpen, setIsOpen] = _react.useState.call(void 0, false);
6432
6725
  const [editingMenuKey, setEditingMenuKey] = _react.useState.call(void 0, null);
@@ -6580,7 +6873,7 @@ var WavelengthDataTable = ({ data, columns, itemsPerPage, totalPages }) => {
6580
6873
  ] }, index)
6581
6874
  ] }, `headCell-${index}`);
6582
6875
  });
6583
- const rows = !_optionalChain([currentPageData, 'optionalAccess', _39 => _39.length]) || noRowsOpen ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { title: "NoDataRows", colSpan: columns.length, children: "No data" }) }) : _optionalChain([currentPageData, 'optionalAccess', _40 => _40.map, 'call', _41 => _41((item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", { children: columns.map((column, index2) => {
6876
+ const rows = !_optionalChain([currentPageData, 'optionalAccess', _43 => _43.length]) || noRowsOpen ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "td", { title: "NoDataRows", colSpan: columns.length, children: "No data" }) }) : _optionalChain([currentPageData, 'optionalAccess', _44 => _44.map, 'call', _45 => _45((item) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tr", { children: columns.map((column, index2) => {
6584
6877
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledTd, { children: editingId === item.id && editedColumnKey === column.key ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
6585
6878
  StyledInput,
6586
6879
  {
@@ -6656,7 +6949,10 @@ var WavelengthDataTable = ({ data, columns, itemsPerPage, totalPages }) => {
6656
6949
 
6657
6950
 
6658
6951
 
6659
- exports.AppLogo = AppLogo; exports.ButtonIcon = ButtonIcon; exports.ButtonMenu = ButtonMenu; exports.DefaultCarousel = DefaultCarousel; exports.DefaultIcon = DefaultIcon; exports.DefaultPagination = DefaultPagination; exports.ManyPlanesComponent = ManyPlanesComponent; exports.NotAvailablePage = NotAvailablePage; exports.SearchTextField = SearchTextField; exports.SliderCardCarousel = SliderCardCarousel; exports.TestSnackbar = TestSnackbar; exports.WavelengthAppTheme = WavelengthAppTheme; exports.WavelengthAutocomplete = WavelengthAutocomplete; exports.WavelengthBanner = WavelengthBanner2; exports.WavelengthBox = WavelengthBox; exports.WavelengthButton = WavelengthButton; exports.WavelengthCommentDisplay = WavelengthCommentDisplay; exports.WavelengthConfirmationModal = WavelengthConfirmationModal; exports.WavelengthContentModal = WavelengthContentModal; exports.WavelengthContentPlaceholder = WavelengthContentPlaceholder; exports.WavelengthDataTable = WavelengthDataTable; exports.WavelengthDragAndDrop = WavelengthDragAndDrop; exports.WavelengthDropdown = WavelengthDropdown; exports.WavelengthDropdownButton = WavelengthDropdownButton; exports.WavelengthExampleComponent = WavelengthExampleComponent; exports.WavelengthFileDownloader = WavelengthFileDownloader; exports.WavelengthFooter = WavelengthFooter; exports.WavelengthPlaneTrail = WavelengthPlaneTrail; exports.WavelengthPopUpMenu = WavelengthPopUpMenu; exports.WavelengthProgressBar = WavelengthProgressBar; exports.WavelengthSearch = WavelengthSearch; exports.WavelengthSideBar = WavelengthSideBar; exports.WavelengthSlider = WavelengthSlider; exports.WavelengthSnackbar = WavelengthSnackbar; exports.WavelengthSpinningLogo = WavelengthSpinningLogo; exports.WavelengthSpinningOuterCircle = WavelengthSpinningOuterCircle; exports.WavelengthStandardSnackbar = WavelengthStandardSnackbar; exports.WavelengthStyledButton = WavelengthStyledButton; exports.WavelengthTextField = WavelengthTextField; exports.WavelengthTitleBar = WavelengthTitleBar2; exports.add = add; exports.ascendingRange = ascendingRange; exports.concat = concat; exports.findBestStringMatch = findBestStringMatch; exports.range = range; exports.useOutsideClick = useOutsideClick; exports.useThemeContext = useThemeContext;
6952
+
6953
+
6954
+
6955
+ exports.AppLogo = AppLogo; exports.ButtonIcon = ButtonIcon; exports.ButtonMenu = ButtonMenu; exports.DefaultCarousel = DefaultCarousel; exports.DefaultIcon = DefaultIcon; exports.DefaultPagination = DefaultPagination; exports.ManyPlanesComponent = ManyPlanesComponent; exports.NotAvailablePage = NotAvailablePage; exports.SearchTextField = SearchTextField; exports.SliderCardCarousel = SliderCardCarousel; exports.TestSnackbar = TestSnackbar; exports.WavelengthAccessAlert = WavelengthAccessAlert; exports.WavelengthAlert = WavelengthAlert; exports.WavelengthAppTheme = WavelengthAppTheme; exports.WavelengthAutocomplete = WavelengthAutocomplete; exports.WavelengthBanner = WavelengthBanner2; exports.WavelengthBox = WavelengthBox; exports.WavelengthButton = WavelengthButton; exports.WavelengthCommentDisplay = WavelengthCommentDisplay; exports.WavelengthConfirmationModal = WavelengthConfirmationModal; exports.WavelengthContentModal = WavelengthContentModal; exports.WavelengthContentPlaceholder = WavelengthContentPlaceholder; exports.WavelengthDataTable = WavelengthDataTable; exports.WavelengthDragAndDrop = WavelengthDragAndDrop; exports.WavelengthDropdown = WavelengthDropdown; exports.WavelengthDropdownButton = WavelengthDropdownButton; exports.WavelengthExampleComponent = WavelengthExampleComponent; exports.WavelengthFileDownloader = WavelengthFileDownloader; exports.WavelengthFooter = WavelengthFooter; exports.WavelengthPermissionAlert = WavelengthPermissionAlert; exports.WavelengthPlaneTrail = WavelengthPlaneTrail; exports.WavelengthPopUpMenu = WavelengthPopUpMenu; exports.WavelengthProgressBar = WavelengthProgressBar; exports.WavelengthSearch = WavelengthSearch; exports.WavelengthSideBar = WavelengthSideBar; exports.WavelengthSlider = WavelengthSlider; exports.WavelengthSnackbar = WavelengthSnackbar; exports.WavelengthSpinningLogo = WavelengthSpinningLogo; exports.WavelengthSpinningOuterCircle = WavelengthSpinningOuterCircle; exports.WavelengthStandardSnackbar = WavelengthStandardSnackbar; exports.WavelengthStyledButton = WavelengthStyledButton; exports.WavelengthTextField = WavelengthTextField; exports.WavelengthTitleBar = WavelengthTitleBar2; exports.add = add; exports.ascendingRange = ascendingRange; exports.concat = concat; exports.findBestStringMatch = findBestStringMatch; exports.range = range; exports.useOutsideClick = useOutsideClick; exports.useThemeContext = useThemeContext;
6660
6956
  /*! Bundled license information:
6661
6957
 
6662
6958
  react-is/cjs/react-is.production.min.js: