@dktunited-techoff/techoff-suite-ui 1.5.5 → 1.5.7

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.
@@ -2,6 +2,7 @@
2
2
  display: flex;
3
3
  align-items: center;
4
4
  cursor: pointer;
5
+ margin-left: -3px;
5
6
  }
6
7
  /* ########## */
7
8
  /* DISABLED */
@@ -1,11 +1,13 @@
1
1
  .ts-input {
2
+ width: 100%;
3
+ }
4
+ .ts-input-container {
2
5
  position: relative;
3
6
  width: 100%;
4
7
  }
5
- input {
8
+ .ts-input-container input {
6
9
  width: 100%;
7
10
  height: 32px;
8
- padding: 0 10px;
9
11
  border: 1px solid #949494;
10
12
  font-weight: 600;
11
13
  }
@@ -18,6 +20,9 @@ input:disabled {
18
20
  input:focus {
19
21
  border: 1.5px solid #3643ba;
20
22
  }
23
+ .ts-input--padding-0 input {
24
+ padding: 0 10px;
25
+ }
21
26
  .ts-input--padding-1 input {
22
27
  padding: 0 30px 0 10px;
23
28
  }
@@ -4,10 +4,11 @@ import './TsInput.css';
4
4
  export const TsInput = ({ icon, label, value, onChange, ...props }) => {
5
5
  // #########
6
6
  // Rendering
7
- return (React.createElement("div", { className: `ts-input ${icon ? 'ts-input--padding-1' : ''}` },
7
+ return (React.createElement("div", { className: `ts-input ${icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}` },
8
8
  label && React.createElement("div", { className: "ts-input-label" }, label),
9
- React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), ...props }),
10
- icon && (React.createElement("div", { className: "ts-input-icon" },
11
- React.createElement(TsIcon, { name: icon, size: "16" })))));
9
+ React.createElement("div", { className: "ts-input-container" },
10
+ React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), ...props }),
11
+ icon && (React.createElement("div", { className: "ts-input-icon" },
12
+ React.createElement(TsIcon, { name: icon, size: "16" }))))));
12
13
  };
13
14
  //# sourceMappingURL=TsInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,OAAO,eAAe,CAAC;AAEvB,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAClF,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAE,YAAY,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAAE;QAC5D,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,+BAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAM,KAAK,GAAI;QACtF,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;YAC5B,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,OAAO,eAAe,CAAC;AAEvB,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAClF,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAE,YAAY,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE;QAC/E,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,6BAAK,SAAS,EAAC,oBAAoB;YACjC,+BAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAM,KAAK,GAAI;YACtF,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;gBAC5B,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -7,14 +7,16 @@ export const TsInput = ({ icon, label, value, onChange, ...props }: TsInputProps
7
7
  // #########
8
8
  // Rendering
9
9
  return (
10
- <div className={`ts-input ${icon ? 'ts-input--padding-1' : ''}`}>
10
+ <div className={`ts-input ${icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}`}>
11
11
  {label && <div className="ts-input-label">{label}</div>}
12
- <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
13
- {icon && (
14
- <div className="ts-input-icon">
15
- <TsIcon name={icon} size="16" />
16
- </div>
17
- )}
12
+ <div className="ts-input-container">
13
+ <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
14
+ {icon && (
15
+ <div className="ts-input-icon">
16
+ <TsIcon name={icon} size="16" />
17
+ </div>
18
+ )}
19
+ </div>
18
20
  </div>
19
21
  );
20
22
  };
@@ -2,6 +2,7 @@
2
2
  display: flex;
3
3
  align-items: center;
4
4
  cursor: pointer;
5
+ margin-left: -3px;
5
6
  }
6
7
  /* ########## */
7
8
  /* DISABLED */
@@ -1,11 +1,13 @@
1
1
  .ts-input {
2
+ width: 100%;
3
+ }
4
+ .ts-input-container {
2
5
  position: relative;
3
6
  width: 100%;
4
7
  }
5
- input {
8
+ .ts-input-container input {
6
9
  width: 100%;
7
10
  height: 32px;
8
- padding: 0 10px;
9
11
  border: 1px solid #949494;
10
12
  font-weight: 600;
11
13
  }
@@ -18,6 +20,9 @@ input:disabled {
18
20
  input:focus {
19
21
  border: 1.5px solid #3643ba;
20
22
  }
23
+ .ts-input--padding-0 input {
24
+ padding: 0 10px;
25
+ }
21
26
  .ts-input--padding-1 input {
22
27
  padding: 0 30px 0 10px;
23
28
  }
@@ -7,11 +7,12 @@ require("./TsInput.css");
7
7
  const TsInput = ({ icon, label, value, onChange, ...props }) => {
8
8
  // #########
9
9
  // Rendering
10
- return (React.createElement("div", { className: `ts-input ${icon ? 'ts-input--padding-1' : ''}` },
10
+ return (React.createElement("div", { className: `ts-input ${icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}` },
11
11
  label && React.createElement("div", { className: "ts-input-label" }, label),
12
- React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), ...props }),
13
- icon && (React.createElement("div", { className: "ts-input-icon" },
14
- React.createElement(TsIcon_1.TsIcon, { name: icon, size: "16" })))));
12
+ React.createElement("div", { className: "ts-input-container" },
13
+ React.createElement("input", { type: "text", value: value, onChange: e => onChange(e.target.value), ...props }),
14
+ icon && (React.createElement("div", { className: "ts-input-icon" },
15
+ React.createElement(TsIcon_1.TsIcon, { name: icon, size: "16" }))))));
15
16
  };
16
17
  exports.TsInput = TsInput;
17
18
  //# sourceMappingURL=TsInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,gDAA6C;AAE7C,yBAAuB;AAEhB,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAClF,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAE,YAAY,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAAE;QAC5D,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,+BAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAM,KAAK,GAAI;QACtF,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;YAC5B,oBAAC,eAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AAdW,QAAA,OAAO,WAclB"}
1
+ {"version":3,"file":"TsInput.js","sourceRoot":"","sources":["../../../../src/components/TsInput/TsInput/TsInput.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,gDAA6C;AAE7C,yBAAuB;AAEhB,MAAM,OAAO,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAClF,YAAY;IACZ,YAAY;IACZ,OAAO,CACL,6BAAK,SAAS,EAAE,YAAY,IAAI,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,EAAE;QAC/E,KAAK,IAAI,6BAAK,SAAS,EAAC,gBAAgB,IAAE,KAAK,CAAO;QACvD,6BAAK,SAAS,EAAC,oBAAoB;YACjC,+BAAO,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAM,KAAK,GAAI;YACtF,IAAI,IAAI,CACP,6BAAK,SAAS,EAAC,eAAe;gBAC5B,oBAAC,eAAM,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,IAAI,GAAG,CAC5B,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAhBW,QAAA,OAAO,WAgBlB"}
@@ -7,14 +7,16 @@ export const TsInput = ({ icon, label, value, onChange, ...props }: TsInputProps
7
7
  // #########
8
8
  // Rendering
9
9
  return (
10
- <div className={`ts-input ${icon ? 'ts-input--padding-1' : ''}`}>
10
+ <div className={`ts-input ${icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}`}>
11
11
  {label && <div className="ts-input-label">{label}</div>}
12
- <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
13
- {icon && (
14
- <div className="ts-input-icon">
15
- <TsIcon name={icon} size="16" />
16
- </div>
17
- )}
12
+ <div className="ts-input-container">
13
+ <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
14
+ {icon && (
15
+ <div className="ts-input-icon">
16
+ <TsIcon name={icon} size="16" />
17
+ </div>
18
+ )}
19
+ </div>
18
20
  </div>
19
21
  );
20
22
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dktunited-techoff/techoff-suite-ui",
3
- "version": "1.5.5",
3
+ "version": "1.5.7",
4
4
  "main": "lib/index.js",
5
5
  "types": "./lib",
6
6
  "module": "esm/index.js",
@@ -2,6 +2,7 @@
2
2
  display: flex;
3
3
  align-items: center;
4
4
  cursor: pointer;
5
+ margin-left: -3px;
5
6
  }
6
7
  /* ########## */
7
8
  /* DISABLED */
@@ -1,11 +1,13 @@
1
1
  .ts-input {
2
+ width: 100%;
3
+ }
4
+ .ts-input-container {
2
5
  position: relative;
3
6
  width: 100%;
4
7
  }
5
- input {
8
+ .ts-input-container input {
6
9
  width: 100%;
7
10
  height: 32px;
8
- padding: 0 10px;
9
11
  border: 1px solid #949494;
10
12
  font-weight: 600;
11
13
  }
@@ -18,6 +20,9 @@ input:disabled {
18
20
  input:focus {
19
21
  border: 1.5px solid #3643ba;
20
22
  }
23
+ .ts-input--padding-0 input {
24
+ padding: 0 10px;
25
+ }
21
26
  .ts-input--padding-1 input {
22
27
  padding: 0 30px 0 10px;
23
28
  }
@@ -7,14 +7,16 @@ export const TsInput = ({ icon, label, value, onChange, ...props }: TsInputProps
7
7
  // #########
8
8
  // Rendering
9
9
  return (
10
- <div className={`ts-input ${icon ? 'ts-input--padding-1' : ''}`}>
10
+ <div className={`ts-input ${icon ? 'ts-input--padding-1' : 'ts-input--padding-0'}`}>
11
11
  {label && <div className="ts-input-label">{label}</div>}
12
- <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
13
- {icon && (
14
- <div className="ts-input-icon">
15
- <TsIcon name={icon} size="16" />
16
- </div>
17
- )}
12
+ <div className="ts-input-container">
13
+ <input type="text" value={value} onChange={e => onChange(e.target.value)} {...props} />
14
+ {icon && (
15
+ <div className="ts-input-icon">
16
+ <TsIcon name={icon} size="16" />
17
+ </div>
18
+ )}
19
+ </div>
18
20
  </div>
19
21
  );
20
22
  };