componenteshospitais 3.1.2 → 3.1.3

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 (6) hide show
  1. package/dist/cjs/index.js +3 -3
  2. package/dist/esm/index.js +3 -3
  3. package/dist/types/components/SelectField.d.ts +1 -0
  4. package/package.json +1 -1
  5. package/src/components/SelectField.tsx +4 -2
  6. package/src/stories/SelectField.stories.tsx +8 -0
package/dist/cjs/index.js CHANGED
@@ -334,7 +334,7 @@ var getArrowColorByEmpresa = function (empresa) {
334
334
  }
335
335
  };
336
336
  var SelectField = function (_a) {
337
- var id = _a.id, name = _a.name, options = _a.options, value = _a.value, onChange = _a.onChange, label = _a.label, optionDefault = _a.optionDefault, largura = _a.largura, disabled = _a.disabled, multiple = _a.multiple, required = _a.required, corFundo = _a.corFundo, corLabel = _a.corLabel, empresa = _a.empresa, borderRadius = _a.borderRadius, border = _a.border, size = _a.size;
337
+ var id = _a.id, name = _a.name, options = _a.options, value = _a.value, onChange = _a.onChange, label = _a.label, optionDefault = _a.optionDefault, largura = _a.largura, disabled = _a.disabled, multiple = _a.multiple, required = _a.required, corFundo = _a.corFundo, corLabel = _a.corLabel, empresa = _a.empresa, borderRadius = _a.borderRadius, border = _a.border, size = _a.size, arrow = _a.arrow;
338
338
  var handleSelectChange = function (e) {
339
339
  if (multiple) {
340
340
  var selectedOptions = Array.from(e.target.selectedOptions, function (option) { return option.value; });
@@ -346,12 +346,12 @@ var SelectField = function (_a) {
346
346
  };
347
347
  var arrowColor = getArrowColorByEmpresa(empresa);
348
348
  var arrowSvg = encodeURIComponent("\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"".concat(arrowColor, "\">\n <path fill-rule=\"evenodd\" d=\"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z\" clip-rule=\"evenodd\"/>\n </svg>\n "));
349
- return (React.createElement("div", { className: styles$2["empresa".concat(empresa)] },
349
+ return (React.createElement("div", { className: styles$2["empresa".concat(empresa)], style: { width: '100%' } },
350
350
  label && React.createElement("label", { htmlFor: id, style: { color: corLabel ? corLabel : '' } }, label),
351
351
  React.createElement("select", { id: id, name: name, className: styles$2.selectPadrao, value: value, size: size, onChange: handleSelectChange, style: {
352
352
  width: largura ? "".concat(largura) : '',
353
353
  backgroundColor: corFundo ? corFundo : '',
354
- backgroundImage: "url(\"data:image/svg+xml,".concat(arrowSvg, "\")"),
354
+ backgroundImage: arrow ? "url(\"data:image/svg+xml,".concat(arrowSvg, "\")") : '',
355
355
  backgroundPosition: 'right 0.75rem center',
356
356
  backgroundSize: '1rem',
357
357
  paddingRight: '2.5rem',
package/dist/esm/index.js CHANGED
@@ -332,7 +332,7 @@ var getArrowColorByEmpresa = function (empresa) {
332
332
  }
333
333
  };
334
334
  var SelectField = function (_a) {
335
- var id = _a.id, name = _a.name, options = _a.options, value = _a.value, onChange = _a.onChange, label = _a.label, optionDefault = _a.optionDefault, largura = _a.largura, disabled = _a.disabled, multiple = _a.multiple, required = _a.required, corFundo = _a.corFundo, corLabel = _a.corLabel, empresa = _a.empresa, borderRadius = _a.borderRadius, border = _a.border, size = _a.size;
335
+ var id = _a.id, name = _a.name, options = _a.options, value = _a.value, onChange = _a.onChange, label = _a.label, optionDefault = _a.optionDefault, largura = _a.largura, disabled = _a.disabled, multiple = _a.multiple, required = _a.required, corFundo = _a.corFundo, corLabel = _a.corLabel, empresa = _a.empresa, borderRadius = _a.borderRadius, border = _a.border, size = _a.size, arrow = _a.arrow;
336
336
  var handleSelectChange = function (e) {
337
337
  if (multiple) {
338
338
  var selectedOptions = Array.from(e.target.selectedOptions, function (option) { return option.value; });
@@ -344,12 +344,12 @@ var SelectField = function (_a) {
344
344
  };
345
345
  var arrowColor = getArrowColorByEmpresa(empresa);
346
346
  var arrowSvg = encodeURIComponent("\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"".concat(arrowColor, "\">\n <path fill-rule=\"evenodd\" d=\"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z\" clip-rule=\"evenodd\"/>\n </svg>\n "));
347
- return (React.createElement("div", { className: styles$2["empresa".concat(empresa)] },
347
+ return (React.createElement("div", { className: styles$2["empresa".concat(empresa)], style: { width: '100%' } },
348
348
  label && React.createElement("label", { htmlFor: id, style: { color: corLabel ? corLabel : '' } }, label),
349
349
  React.createElement("select", { id: id, name: name, className: styles$2.selectPadrao, value: value, size: size, onChange: handleSelectChange, style: {
350
350
  width: largura ? "".concat(largura) : '',
351
351
  backgroundColor: corFundo ? corFundo : '',
352
- backgroundImage: "url(\"data:image/svg+xml,".concat(arrowSvg, "\")"),
352
+ backgroundImage: arrow ? "url(\"data:image/svg+xml,".concat(arrowSvg, "\")") : '',
353
353
  backgroundPosition: 'right 0.75rem center',
354
354
  backgroundSize: '1rem',
355
355
  paddingRight: '2.5rem',
package/dist/types/components/SelectField.d.ts CHANGED
@@ -21,6 +21,7 @@ export interface SelectComponentProps {
21
21
  borderRadius?: string;
22
22
  border?: string;
23
23
  size?: number;
24
+ arrow?: boolean;
24
25
  }
25
26
  declare const SelectField: React.FC<SelectComponentProps>;
26
27
  export default SelectField;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "componenteshospitais",
3
- "version": "3.1.2",
3
+ "version": "3.1.3",
4
4
  "main": "dist/cjs/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/types/index.d.ts",
package/src/components/SelectField.tsx CHANGED
@@ -24,6 +24,7 @@ export interface SelectComponentProps {
24
24
  borderRadius?: string;
25
25
  border?: string;
26
26
  size?: number;
27
+ arrow?: boolean;
27
28
  }
28
29
 
29
30
  // Função para mapear empresa com a cor da seta
@@ -56,6 +57,7 @@ const SelectField: React.FC<SelectComponentProps> = ({
56
57
  borderRadius,
57
58
  border,
58
59
  size,
60
+ arrow,
59
61
  }) => {
60
62
 
61
63
  const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
@@ -76,7 +78,7 @@ const SelectField: React.FC<SelectComponentProps> = ({
76
78
  `);
77
79
 
78
80
  return (
79
- <div className={styles[`empresa${empresa}`]}>
81
+ <div className={styles[`empresa${empresa}`]} style={{width: '100%'}}>
80
82
  {label && <label htmlFor={id} style={{ color: corLabel ? corLabel : '' }}>{label}</label>}
81
83
  <select
82
84
  id={id}
@@ -88,7 +90,7 @@ const SelectField: React.FC<SelectComponentProps> = ({
88
90
  style={{
89
91
  width: largura ? `${largura}` : '',
90
92
  backgroundColor: corFundo ? corFundo : '',
91
- backgroundImage: `url("data:image/svg+xml,${arrowSvg}")`,
93
+ backgroundImage: arrow ? `url("data:image/svg+xml,${arrowSvg}")` : '',
92
94
  backgroundPosition: 'right 0.75rem center',
93
95
  backgroundSize: '1rem',
94
96
  paddingRight: '2.5rem',
package/src/stories/SelectField.stories.tsx CHANGED
@@ -73,6 +73,14 @@ const meta: Meta<SelectComponentProps> = {
73
73
  control: 'text',
74
74
  description: 'Borda do campo de seleção',
75
75
  },
76
+ size: {
77
+ control: 'text',
78
+ description: 'Borda do campo de seleção',
79
+ },
80
+ arrow: {
81
+ control: { type: 'boolean' },
82
+ description: 'Mostrar seta ou não',
83
+ }
76
84
  },
77
85
  };
78
86