@activecollab/components 1.0.120 → 1.0.123

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 (92) hide show
  1. package/dist/cjs/components/Autocomplete/Styles.js +4 -2
  2. package/dist/cjs/components/Autocomplete/Styles.js.map +1 -1
  3. package/dist/cjs/components/ComboBox/ComboBox.js +28 -30
  4. package/dist/cjs/components/ComboBox/ComboBox.js.map +1 -1
  5. package/dist/cjs/components/ComboBox/Styles.js +16 -37
  6. package/dist/cjs/components/ComboBox/Styles.js.map +1 -1
  7. package/dist/cjs/components/Input/Input.js +28 -8
  8. package/dist/cjs/components/Input/Input.js.map +1 -1
  9. package/dist/cjs/components/Input/InputAdornment.js +57 -0
  10. package/dist/cjs/components/Input/InputAdornment.js.map +1 -0
  11. package/dist/cjs/components/Input/Styles.js +40 -18
  12. package/dist/cjs/components/Input/Styles.js.map +1 -1
  13. package/dist/cjs/components/Input/index.js +13 -0
  14. package/dist/cjs/components/Input/index.js.map +1 -1
  15. package/dist/cjs/components/Input/types.js +6 -0
  16. package/dist/cjs/components/Input/types.js.map +1 -0
  17. package/dist/cjs/components/ProgressBar/ProgressBar.js +32 -3
  18. package/dist/cjs/components/ProgressBar/ProgressBar.js.map +1 -1
  19. package/dist/cjs/components/ProgressBar/Styles.js +6 -2
  20. package/dist/cjs/components/ProgressBar/Styles.js.map +1 -1
  21. package/dist/cjs/components/Select/Select.js +1 -1
  22. package/dist/cjs/components/Select/Select.js.map +1 -1
  23. package/dist/cjs/components/Select/Styles.js +1 -1
  24. package/dist/cjs/components/Select/Styles.js.map +1 -1
  25. package/dist/cjs/components/SelectTrigger/SelectTrigger.js +53 -0
  26. package/dist/cjs/components/SelectTrigger/SelectTrigger.js.map +1 -0
  27. package/dist/cjs/components/SelectTrigger/Styles.js +55 -0
  28. package/dist/cjs/components/SelectTrigger/Styles.js.map +1 -0
  29. package/dist/cjs/components/SelectTrigger/index.js +19 -0
  30. package/dist/cjs/components/SelectTrigger/index.js.map +1 -0
  31. package/dist/esm/components/Autocomplete/Styles.d.ts.map +1 -1
  32. package/dist/esm/components/Autocomplete/Styles.js +3 -2
  33. package/dist/esm/components/Autocomplete/Styles.js.map +1 -1
  34. package/dist/esm/components/ComboBox/ComboBox.d.ts +1 -1
  35. package/dist/esm/components/ComboBox/ComboBox.d.ts.map +1 -1
  36. package/dist/esm/components/ComboBox/ComboBox.js +28 -31
  37. package/dist/esm/components/ComboBox/ComboBox.js.map +1 -1
  38. package/dist/esm/components/ComboBox/Styles.d.ts +4 -10
  39. package/dist/esm/components/ComboBox/Styles.d.ts.map +1 -1
  40. package/dist/esm/components/ComboBox/Styles.js +13 -27
  41. package/dist/esm/components/ComboBox/Styles.js.map +1 -1
  42. package/dist/esm/components/Input/Input.d.ts +6 -3
  43. package/dist/esm/components/Input/Input.d.ts.map +1 -1
  44. package/dist/esm/components/Input/Input.js +28 -10
  45. package/dist/esm/components/Input/Input.js.map +1 -1
  46. package/dist/esm/components/Input/InputAdornment.d.ts +12 -0
  47. package/dist/esm/components/Input/InputAdornment.d.ts.map +1 -0
  48. package/dist/esm/components/Input/InputAdornment.js +32 -0
  49. package/dist/esm/components/Input/InputAdornment.js.map +1 -0
  50. package/dist/esm/components/Input/Styles.d.ts +12 -5
  51. package/dist/esm/components/Input/Styles.d.ts.map +1 -1
  52. package/dist/esm/components/Input/Styles.js +36 -17
  53. package/dist/esm/components/Input/Styles.js.map +1 -1
  54. package/dist/esm/components/Input/index.d.ts +1 -0
  55. package/dist/esm/components/Input/index.d.ts.map +1 -1
  56. package/dist/esm/components/Input/index.js +1 -0
  57. package/dist/esm/components/Input/index.js.map +1 -1
  58. package/dist/esm/components/Input/types.d.ts +2 -0
  59. package/dist/esm/components/Input/types.d.ts.map +1 -0
  60. package/dist/esm/components/Input/types.js +2 -0
  61. package/dist/esm/components/Input/types.js.map +1 -0
  62. package/dist/esm/components/ProgressBar/ProgressBar.d.ts +2 -0
  63. package/dist/esm/components/ProgressBar/ProgressBar.d.ts.map +1 -1
  64. package/dist/esm/components/ProgressBar/ProgressBar.js +32 -3
  65. package/dist/esm/components/ProgressBar/ProgressBar.js.map +1 -1
  66. package/dist/esm/components/ProgressBar/Styles.d.ts +2 -0
  67. package/dist/esm/components/ProgressBar/Styles.d.ts.map +1 -1
  68. package/dist/esm/components/ProgressBar/Styles.js +6 -2
  69. package/dist/esm/components/ProgressBar/Styles.js.map +1 -1
  70. package/dist/esm/components/Select/Select.js +1 -1
  71. package/dist/esm/components/Select/Select.js.map +1 -1
  72. package/dist/esm/components/Select/Styles.d.ts +1 -1
  73. package/dist/esm/components/Select/Styles.d.ts.map +1 -1
  74. package/dist/esm/components/Select/Styles.js +1 -1
  75. package/dist/esm/components/Select/Styles.js.map +1 -1
  76. package/dist/esm/components/SelectTrigger/SelectTrigger.d.ts +8 -0
  77. package/dist/esm/components/SelectTrigger/SelectTrigger.d.ts.map +1 -0
  78. package/dist/esm/components/SelectTrigger/SelectTrigger.js +31 -0
  79. package/dist/esm/components/SelectTrigger/SelectTrigger.js.map +1 -0
  80. package/dist/esm/components/SelectTrigger/Styles.d.ts +8 -0
  81. package/dist/esm/components/SelectTrigger/Styles.d.ts.map +1 -0
  82. package/dist/esm/components/SelectTrigger/Styles.js +37 -0
  83. package/dist/esm/components/SelectTrigger/Styles.js.map +1 -0
  84. package/dist/esm/components/SelectTrigger/index.d.ts +2 -0
  85. package/dist/esm/components/SelectTrigger/index.d.ts.map +1 -0
  86. package/dist/esm/components/SelectTrigger/index.js +2 -0
  87. package/dist/esm/components/SelectTrigger/index.js.map +1 -0
  88. package/dist/index.js +248 -166
  89. package/dist/index.js.map +1 -1
  90. package/dist/index.min.js +1 -1
  91. package/dist/index.min.js.map +1 -1
  92. package/package.json +1 -1
@@ -1,18 +1,12 @@
1
1
  /// <reference types="react" />
2
- interface StyledComboBoxProps {
3
- $open?: boolean;
4
- $loading?: boolean;
5
- $size?: string;
6
- }
7
- export declare const StyledComboBox: import("styled-components").StyledComponent<"div", any, StyledComboBoxProps, never>;
8
- export declare const StyledComboBoxControls: import("styled-components").StyledComponent<"div", any, {}, never>;
9
- export declare const StyledComboBoxCloseSmallIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("react").SVGProps<SVGSVGElement>, "string" | "style" | "clipPath" | "filter" | "mask" | "path" | "key" | "name" | "type" | "className" | "id" | "lang" | "tabIndex" | "role" | "color" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tw" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "height" | "max" | "media" | "method" | "min" | "target" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "href" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
2
+ export declare const StyledComboBoxInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Input").InputProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, keyof import("../Input").InputProps> & import("react").RefAttributes<HTMLDivElement>>, any, {
3
+ $loading?: boolean | undefined;
4
+ }, never>;
10
5
  export declare const StyledComboBoxCollapseExpandSingleIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("react").SVGProps<SVGSVGElement>, "string" | "style" | "clipPath" | "filter" | "mask" | "path" | "key" | "name" | "type" | "className" | "id" | "lang" | "tabIndex" | "role" | "color" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tw" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "height" | "max" | "media" | "method" | "min" | "target" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "href" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & import("react").RefAttributes<SVGSVGElement>>, any, {
11
6
  $open?: boolean | undefined;
12
7
  }, never>;
13
- export declare const StyledComboBoxInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Input/Input").InputProps & Omit<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, keyof import("../Input/Input").InputProps> & import("react").RefAttributes<HTMLInputElement>>, any, {}, never>;
8
+ export declare const StyledComboBoxCloseSmallIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("react").SVGProps<SVGSVGElement>, "string" | "style" | "clipPath" | "filter" | "mask" | "path" | "key" | "name" | "type" | "className" | "id" | "lang" | "tabIndex" | "role" | "color" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tw" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "height" | "max" | "media" | "method" | "min" | "target" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "href" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
14
9
  export declare const StyledComboBoxList: import("styled-components").StyledComponent<"div", any, {
15
10
  $width?: number | undefined;
16
11
  }, never>;
17
- export {};
18
12
  //# sourceMappingURL=Styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/Styles.ts"],"names":[],"mappings":";AAOA,UAAU,mBAAmB;IAC3B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,cAAc,qFAW1B,CAAC;AAIF,eAAO,MAAM,sBAAsB,oEAQlC,CAAC;AASF,eAAO,MAAM,4BAA4B,wqPAWxC,CAAC;AAIF,eAAO,MAAM,sCAAsC;;SAalD,CAAC;AAKF,eAAO,MAAM,mBAAmB,waAS/B,CAAC;AAIF,eAAO,MAAM,kBAAkB;;SAQ9B,CAAC"}
1
+ {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/Styles.ts"],"names":[],"mappings":";AAIA,eAAO,MAAM,mBAAmB;;SAU/B,CAAC;AASF,eAAO,MAAM,sCAAsC;;SAYlD,CAAC;AAKF,eAAO,MAAM,4BAA4B,wqPAWxC,CAAC;AAIF,eAAO,MAAM,kBAAkB;;SAQ9B,CAAC"}
@@ -1,43 +1,29 @@
1
1
  import styled, { css } from "styled-components";
2
2
  import { CollapseExpandSingleIcon, CloseSmallIcon } from "../Icons/collection";
3
- import { Input } from "../Input/Input";
4
- import { BoxSizingStyle } from "../BoxSizingStyle";
5
- import { FontStyle } from "../FontStyle";
6
- export var StyledComboBox = styled.div.withConfig({
7
- displayName: "Styles__StyledComboBox",
3
+ import { Input } from "../Input";
4
+ export var StyledComboBoxInput = styled(Input).withConfig({
5
+ displayName: "Styles__StyledComboBoxInput",
8
6
  componentId: "sc-5qvkpb-0"
9
- })(["position:relative;cursor:text;", " ", " ", ""], FontStyle, BoxSizingStyle, function (props) {
7
+ })(["overflow:hidden;text-overflow:ellipsis;width:100%;", ""], function (props) {
10
8
  return props.$loading && css(["cursor:progress;"]);
11
9
  });
12
- StyledComboBox.displayName = "StyledComboBox";
13
- export var StyledComboBoxControls = styled.div.withConfig({
14
- displayName: "Styles__StyledComboBoxControls",
15
- componentId: "sc-5qvkpb-1"
16
- })(["position:absolute;top:0;right:0;height:100%;display:flex;align-items:center;justify-content:center;"]);
17
- StyledComboBoxControls.displayName = "StyledComboBoxControls";
10
+ StyledComboBoxInput.displayName = "StyledComboBoxInput";
18
11
  var StyledIconDefaults = css(["flex-shrink:0;cursor:pointer;"]);
19
- export var StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon).withConfig({
20
- displayName: "Styles__StyledComboBoxCloseSmallIcon",
21
- componentId: "sc-5qvkpb-2"
22
- })(["", " opacity:0;transition-property:all;transition-duration:0.2s;transition-delay:0.5s;", ":hover &{opacity:1;transition-delay:0s;}"], StyledIconDefaults, StyledComboBox);
23
- StyledComboBoxCloseSmallIcon.displayName = "StyledComboBoxCloseSmallIcon";
24
12
  export var StyledComboBoxCollapseExpandSingleIcon = styled(CollapseExpandSingleIcon).withConfig({
25
13
  displayName: "Styles__StyledComboBoxCollapseExpandSingleIcon",
26
- componentId: "sc-5qvkpb-3"
27
- })(["", " margin:0 4px 0 0;color:var(--color-theme-600);transform:rotate(180deg);", ""], StyledIconDefaults, function (props) {
14
+ componentId: "sc-5qvkpb-1"
15
+ })(["", " color:var(--color-theme-600);transform:rotate(180deg);", ""], StyledIconDefaults, function (props) {
28
16
  return props.$open && css(["transform:rotate(0deg);"]);
29
17
  });
30
18
  StyledComboBoxCollapseExpandSingleIcon.displayName = "StyledComboBoxCollapseExpandSingleIcon";
31
- export var StyledComboBoxInput = styled(Input).withConfig({
32
- displayName: "Styles__StyledComboBoxInput",
33
- componentId: "sc-5qvkpb-4"
34
- })(["overflow:hidden;text-overflow:ellipsis;width:100%;padding-right:80px;", ":hover &{", "}"], StyledComboBox, {
35
- "borderColor": "var(--color-primary)"
36
- });
37
- StyledComboBoxInput.displayName = "StyledComboBoxInput";
19
+ export var StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon).withConfig({
20
+ displayName: "Styles__StyledComboBoxCloseSmallIcon",
21
+ componentId: "sc-5qvkpb-2"
22
+ })(["", " opacity:0;transition-property:all;transition-duration:0.2s;transition-delay:0.5s;", ":hover &{opacity:1;transition-delay:0s;}"], StyledIconDefaults, StyledComboBoxInput);
23
+ StyledComboBoxCloseSmallIcon.displayName = "StyledComboBoxCloseSmallIcon";
38
24
  export var StyledComboBoxList = styled.div.withConfig({
39
25
  displayName: "Styles__StyledComboBoxList",
40
- componentId: "sc-5qvkpb-5"
26
+ componentId: "sc-5qvkpb-3"
41
27
  })(["min-width:260px;background-color:var(--page-paper-main);border-radius:8px;border:1px solid var(--border-primary);box-shadow:var(--shadow-tertiary);margin:8px 0;width:", ";"], function (props) {
42
28
  return props.$width + "px";
43
29
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/ComboBox/Styles.ts"],"names":["styled","css","CollapseExpandSingleIcon","CloseSmallIcon","Input","BoxSizingStyle","FontStyle","StyledComboBox","div","props","$loading","displayName","StyledComboBoxControls","StyledIconDefaults","StyledComboBoxCloseSmallIcon","StyledComboBoxCollapseExpandSingleIcon","$open","StyledComboBoxInput","StyledComboBoxList","$width"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AACA,SAASC,wBAAT,EAAmCC,cAAnC,QAAyD,qBAAzD;AACA,SAASC,KAAT,QAAsB,gBAAtB;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AASA,OAAO,IAAMC,cAAc,GAAGP,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,qDAGvBF,SAHuB,EAIvBD,cAJuB,EAMvB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAT,GADA,sBADA;AAAA,CANuB,CAApB;AAaPM,cAAc,CAACI,WAAf,GAA6B,gBAA7B;AAEA,OAAO,IAAMC,sBAAsB,GAAGZ,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,2GAA5B;AAUPI,sBAAsB,CAACD,WAAvB,GAAqC,wBAArC;AAEA,IAAME,kBAAkB,GAAGZ,GAAH,mCAAxB;AAKA,OAAO,IAAMa,4BAA4B,GAAGd,MAAM,CAACG,cAAD,CAAT;AAAA;AAAA;AAAA,2IACrCU,kBADqC,EAOrCN,cAPqC,CAAlC;AAaPO,4BAA4B,CAACH,WAA7B,GAA2C,8BAA3C;AAEA,OAAO,IAAMI,sCAAsC,GAAGf,MAAM,CAC1DE,wBAD0D,CAAT;AAAA;AAAA;AAAA,yFAG/CW,kBAH+C,EAQ/C,UAACJ,KAAD;AAAA,SACAA,KAAK,CAACO,KAAN,IACAf,GADA,6BADA;AAAA,CAR+C,CAA5C;AAePc,sCAAsC,CAACJ,WAAvC,GACE,wCADF;AAGA,OAAO,IAAMM,mBAAmB,GAAGjB,MAAM,CAACI,KAAD,CAAT;AAAA;AAAA;AAAA,gGAM5BG,cAN4B,EAOxB;AAAA;AAAA,CAPwB,CAAzB;AAWPU,mBAAmB,CAACN,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMO,kBAAkB,GAAGlB,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,oLAOpB,UAACC,KAAD;AAAA,SAAcA,KAAK,CAACU,MAApB;AAAA,CAPoB,CAAxB;AAUPD,kBAAkB,CAACP,WAAnB,GAAiC,oBAAjC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { CollapseExpandSingleIcon, CloseSmallIcon } from \"../Icons/collection\";\nimport { Input } from \"../Input/Input\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport tw from \"twin.macro\";\n\ninterface StyledComboBoxProps {\n $open?: boolean;\n $loading?: boolean;\n $size?: string;\n}\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n position: relative;\n cursor: text;\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${(props) =>\n props.$loading &&\n css`\n cursor: progress;\n `}\n`;\n\nStyledComboBox.displayName = \"StyledComboBox\";\n\nexport const StyledComboBoxControls = styled.div`\n position: absolute;\n top: 0;\n right: 0;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nStyledComboBoxControls.displayName = \"StyledComboBoxControls\";\n\nconst StyledIconDefaults = css`\n flex-shrink: 0;\n cursor: pointer;\n`;\n\nexport const StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon)`\n ${StyledIconDefaults}\n opacity: 0;\n transition-property: all;\n transition-duration: 0.2s;\n transition-delay: 0.5s;\n\n ${StyledComboBox}:hover & {\n opacity: 1;\n transition-delay: 0s;\n }\n`;\n\nStyledComboBoxCloseSmallIcon.displayName = \"StyledComboBoxCloseSmallIcon\";\n\nexport const StyledComboBoxCollapseExpandSingleIcon = styled(\n CollapseExpandSingleIcon\n)<{ $open?: boolean }>`\n ${StyledIconDefaults}\n margin: 0 4px 0 0;\n color: var(--color-theme-600);\n transform: rotate(180deg);\n\n ${(props) =>\n props.$open &&\n css`\n transform: rotate(0deg);\n `}\n`;\n\nStyledComboBoxCollapseExpandSingleIcon.displayName =\n \"StyledComboBoxCollapseExpandSingleIcon\";\n\nexport const StyledComboBoxInput = styled(Input)`\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n padding-right: 80px;\n\n ${StyledComboBox}:hover & {\n ${tw`tw-border-primary`}\n }\n`;\n\nStyledComboBoxInput.displayName = \"StyledComboBoxInput\";\n\nexport const StyledComboBoxList = styled.div<{ $width?: number }>`\n min-width: 260px;\n background-color: var(--page-paper-main);\n border-radius: 8px;\n border: 1px solid var(--border-primary);\n box-shadow: var(--shadow-tertiary);\n margin: 8px 0;\n width: ${(props) => `${props.$width}px`};\n`;\n\nStyledComboBoxList.displayName = \"StyledComboBoxList\";\n"],"file":"Styles.js"}
1
+ {"version":3,"sources":["../../../../src/components/ComboBox/Styles.ts"],"names":["styled","css","CollapseExpandSingleIcon","CloseSmallIcon","Input","StyledComboBoxInput","props","$loading","displayName","StyledIconDefaults","StyledComboBoxCollapseExpandSingleIcon","$open","StyledComboBoxCloseSmallIcon","StyledComboBoxList","div","$width"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AACA,SAASC,wBAAT,EAAmCC,cAAnC,QAAyD,qBAAzD;AACA,SAASC,KAAT,QAAsB,UAAtB;AAEA,OAAO,IAAMC,mBAAmB,GAAGL,MAAM,CAACI,KAAD,CAAT;AAAA;AAAA;AAAA,+DAK5B,UAACE,KAAD;AAAA,SACAA,KAAK,CAACC,QAAN,IACAN,GADA,sBADA;AAAA,CAL4B,CAAzB;AAYPI,mBAAmB,CAACG,WAApB,GAAkC,qBAAlC;AAEA,IAAMC,kBAAkB,GAAGR,GAAH,mCAAxB;AAKA,OAAO,IAAMS,sCAAsC,GAAGV,MAAM,CAC1DE,wBAD0D,CAAT;AAAA;AAAA;AAAA,wEAG/CO,kBAH+C,EAO/C,UAACH,KAAD;AAAA,SACAA,KAAK,CAACK,KAAN,IACAV,GADA,6BADA;AAAA,CAP+C,CAA5C;AAcPS,sCAAsC,CAACF,WAAvC,GACE,wCADF;AAGA,OAAO,IAAMI,4BAA4B,GAAGZ,MAAM,CAACG,cAAD,CAAT;AAAA;AAAA;AAAA,2IACrCM,kBADqC,EAOrCJ,mBAPqC,CAAlC;AAaPO,4BAA4B,CAACJ,WAA7B,GAA2C,8BAA3C;AAEA,OAAO,IAAMK,kBAAkB,GAAGb,MAAM,CAACc,GAAV;AAAA;AAAA;AAAA,oLAOpB,UAACR,KAAD;AAAA,SAAcA,KAAK,CAACS,MAApB;AAAA,CAPoB,CAAxB;AAUPF,kBAAkB,CAACL,WAAnB,GAAiC,oBAAjC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { CollapseExpandSingleIcon, CloseSmallIcon } from \"../Icons/collection\";\nimport { Input } from \"../Input\";\n\nexport const StyledComboBoxInput = styled(Input)<{ $loading?: boolean }>`\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n\n ${(props) =>\n props.$loading &&\n css`\n cursor: progress;\n `}\n`;\n\nStyledComboBoxInput.displayName = \"StyledComboBoxInput\";\n\nconst StyledIconDefaults = css`\n flex-shrink: 0;\n cursor: pointer;\n`;\n\nexport const StyledComboBoxCollapseExpandSingleIcon = styled(\n CollapseExpandSingleIcon\n)<{ $open?: boolean }>`\n ${StyledIconDefaults}\n color: var(--color-theme-600);\n transform: rotate(180deg);\n\n ${(props) =>\n props.$open &&\n css`\n transform: rotate(0deg);\n `}\n`;\n\nStyledComboBoxCollapseExpandSingleIcon.displayName =\n \"StyledComboBoxCollapseExpandSingleIcon\";\n\nexport const StyledComboBoxCloseSmallIcon = styled(CloseSmallIcon)`\n ${StyledIconDefaults}\n opacity: 0;\n transition-property: all;\n transition-duration: 0.2s;\n transition-delay: 0.5s;\n\n ${StyledComboBoxInput}:hover & {\n opacity: 1;\n transition-delay: 0s;\n }\n`;\n\nStyledComboBoxCloseSmallIcon.displayName = \"StyledComboBoxCloseSmallIcon\";\n\nexport const StyledComboBoxList = styled.div<{ $width?: number }>`\n min-width: 260px;\n background-color: var(--page-paper-main);\n border-radius: 8px;\n border: 1px solid var(--border-primary);\n box-shadow: var(--shadow-tertiary);\n margin: 8px 0;\n width: ${(props) => `${props.$width}px`};\n`;\n\nStyledComboBoxList.displayName = \"StyledComboBoxList\";\n"],"file":"Styles.js"}
@@ -1,8 +1,11 @@
1
- import React from "react";
2
- export declare type InputSize = "small" | "regular" | "big";
1
+ import React, { ReactNode, Ref } from "react";
2
+ import { InputSize } from "./types";
3
3
  export interface InputProps {
4
4
  size?: InputSize;
5
5
  invalid?: boolean;
6
+ startAdornment?: ReactNode;
7
+ endAdornment?: ReactNode;
8
+ inputRef?: Ref<HTMLInputElement>;
6
9
  }
7
- export declare const Input: React.ForwardRefExoticComponent<InputProps & Omit<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, keyof InputProps> & React.RefAttributes<HTMLInputElement>>;
10
+ export declare const Input: React.ForwardRefExoticComponent<InputProps & Omit<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, keyof InputProps> & React.RefAttributes<HTMLDivElement>>;
8
11
  //# sourceMappingURL=Input.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,oBAAY,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,KAAK,CAAC;AACpD,MAAM,WAAW,UAAU;IAEzB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,KAAK,uQA2BjB,CAAC"}
1
+ {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,EAAuB,MAAM,OAAO,CAAC;AAInE,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,MAAM,WAAW,UAAU;IAEzB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAClC;AAED,eAAO,MAAM,KAAK,qQAgDjB,CAAC"}
@@ -1,12 +1,14 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
- var _excluded = ["className", "type", "disabled", "size", "invalid"];
4
- import React, { forwardRef } from "react";
3
+ var _excluded = ["className", "style", "type", "disabled", "size", "invalid", "startAdornment", "endAdornment", "inputRef"];
4
+ import React, { useCallback, useRef } from "react";
5
5
  import classnames from "classnames";
6
- import { StyledInput } from "./Styles";
7
- export var Input = /*#__PURE__*/forwardRef(function (_ref, ref) {
6
+ import { StyledInput, StyledInputWrapper } from "./Styles";
7
+ import useForkRef from "../../utils/useForkRef";
8
+ export var Input = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
8
9
  var _ref$className = _ref.className,
9
10
  className = _ref$className === void 0 ? "" : _ref$className,
11
+ style = _ref.style,
10
12
  _ref$type = _ref.type,
11
13
  type = _ref$type === void 0 ? "text" : _ref$type,
12
14
  _ref$disabled = _ref.disabled,
@@ -15,16 +17,32 @@ export var Input = /*#__PURE__*/forwardRef(function (_ref, ref) {
15
17
  size = _ref$size === void 0 ? "regular" : _ref$size,
16
18
  _ref$invalid = _ref.invalid,
17
19
  invalid = _ref$invalid === void 0 ? false : _ref$invalid,
20
+ startAdornment = _ref.startAdornment,
21
+ endAdornment = _ref.endAdornment,
22
+ inputRef = _ref.inputRef,
18
23
  rest = _objectWithoutPropertiesLoose(_ref, _excluded);
19
24
 
20
- return /*#__PURE__*/React.createElement(StyledInput, _extends({
21
- ref: ref,
22
- type: type,
23
- disabled: disabled,
25
+ var intInputRef = useRef(null);
26
+ var handleRef = useForkRef(inputRef, intInputRef);
27
+ var handleWrapperClick = useCallback(function () {
28
+ var _intInputRef$current;
29
+
30
+ (_intInputRef$current = intInputRef.current) == null ? void 0 : _intInputRef$current.focus();
31
+ }, []);
32
+ return /*#__PURE__*/React.createElement(StyledInputWrapper, {
33
+ $size: size,
34
+ $invalid: invalid,
35
+ $disabled: disabled,
24
36
  className: classnames("c-input", className),
37
+ style: style,
38
+ onClick: handleWrapperClick,
39
+ ref: ref
40
+ }, startAdornment, /*#__PURE__*/React.createElement(StyledInput, _extends({
41
+ ref: handleRef,
42
+ type: type,
25
43
  $size: size,
26
- $invalid: invalid
27
- }, rest));
44
+ disabled: disabled
45
+ }, rest)), endAdornment);
28
46
  });
29
47
  Input.displayName = "Input";
30
48
  //# sourceMappingURL=Input.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Input/Input.tsx"],"names":["React","forwardRef","classnames","StyledInput","Input","ref","className","type","disabled","size","invalid","rest","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,WAAT,QAA4B,UAA5B;AASA,OAAO,IAAMC,KAAK,gBAAGH,UAAU,CAI7B,gBASEI,GATF,EAUK;AAAA,4BARDC,SAQC;AAAA,MARDA,SAQC,+BARW,EAQX;AAAA,uBAPDC,IAOC;AAAA,MAPDA,IAOC,0BAPM,MAON;AAAA,2BANDC,QAMC;AAAA,MANDA,QAMC,8BANU,KAMV;AAAA,uBALDC,IAKC;AAAA,MALDA,IAKC,0BALM,SAKN;AAAA,0BAJDC,OAIC;AAAA,MAJDA,OAIC,6BAJS,KAIT;AAAA,MAHEC,IAGF;;AACH,sBACE,oBAAC,WAAD;AACE,IAAA,GAAG,EAAEN,GADP;AAEE,IAAA,IAAI,EAAEE,IAFR;AAGE,IAAA,QAAQ,EAAEC,QAHZ;AAIE,IAAA,SAAS,EAAEN,UAAU,CAAC,SAAD,EAAYI,SAAZ,CAJvB;AAKE,IAAA,KAAK,EAAEG,IALT;AAME,IAAA,QAAQ,EAAEC;AANZ,KAOMC,IAPN,EADF;AAWD,CA1B4B,CAAxB;AA6BPP,KAAK,CAACQ,WAAN,GAAoB,OAApB","sourcesContent":["import React, { forwardRef } from \"react\";\nimport classnames from \"classnames\";\nimport { StyledInput } from \"./Styles\";\n\nexport type InputSize = \"small\" | \"regular\" | \"big\";\nexport interface InputProps {\n /** Velicina inputa koja definse font-size i border radius */\n size?: InputSize;\n invalid?: boolean;\n}\n\nexport const Input = forwardRef<\n HTMLInputElement,\n InputProps & Omit<React.ComponentPropsWithoutRef<\"input\">, keyof InputProps>\n>(\n (\n {\n className = \"\",\n type = \"text\",\n disabled = false,\n size = \"regular\",\n invalid = false,\n ...rest\n },\n ref\n ) => {\n return (\n <StyledInput\n ref={ref}\n type={type}\n disabled={disabled}\n className={classnames(\"c-input\", className)}\n $size={size}\n $invalid={invalid}\n {...rest}\n />\n );\n }\n);\n\nInput.displayName = \"Input\";\n"],"file":"Input.js"}
1
+ {"version":3,"sources":["../../../../src/components/Input/Input.tsx"],"names":["React","useCallback","useRef","classnames","StyledInput","StyledInputWrapper","useForkRef","Input","forwardRef","ref","className","style","type","disabled","size","invalid","startAdornment","endAdornment","inputRef","rest","intInputRef","handleRef","handleWrapperClick","current","focus","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgCC,WAAhC,EAA6CC,MAA7C,QAA2D,OAA3D;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,WAAT,EAAsBC,kBAAtB,QAAgD,UAAhD;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AAWA,OAAO,IAAMC,KAAK,gBAAGP,KAAK,CAACQ,UAAN,CAInB,gBAaEC,GAbF,EAcK;AAAA,4BAZDC,SAYC;AAAA,MAZDA,SAYC,+BAZW,EAYX;AAAA,MAXDC,KAWC,QAXDA,KAWC;AAAA,uBAVDC,IAUC;AAAA,MAVDA,IAUC,0BAVM,MAUN;AAAA,2BATDC,QASC;AAAA,MATDA,QASC,8BATU,KASV;AAAA,uBARDC,IAQC;AAAA,MARDA,IAQC,0BARM,SAQN;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,KAOT;AAAA,MANDC,cAMC,QANDA,cAMC;AAAA,MALDC,YAKC,QALDA,YAKC;AAAA,MAJDC,QAIC,QAJDA,QAIC;AAAA,MAHEC,IAGF;;AACH,MAAMC,WAAW,GAAGlB,MAAM,CAAmB,IAAnB,CAA1B;AACA,MAAMmB,SAAS,GAAGf,UAAU,CAACY,QAAD,EAAWE,WAAX,CAA5B;AAEA,MAAME,kBAAkB,GAAGrB,WAAW,CAAC,YAAM;AAAA;;AAC3C,4BAAAmB,WAAW,CAACG,OAAZ,0CAAqBC,KAArB;AACD,GAFqC,EAEnC,EAFmC,CAAtC;AAIA,sBACE,oBAAC,kBAAD;AACE,IAAA,KAAK,EAAEV,IADT;AAEE,IAAA,QAAQ,EAAEC,OAFZ;AAGE,IAAA,SAAS,EAAEF,QAHb;AAIE,IAAA,SAAS,EAAEV,UAAU,CAAC,SAAD,EAAYO,SAAZ,CAJvB;AAKE,IAAA,KAAK,EAAEC,KALT;AAME,IAAA,OAAO,EAAEW,kBANX;AAOE,IAAA,GAAG,EAAEb;AAPP,KASGO,cATH,eAUE,oBAAC,WAAD;AACE,IAAA,GAAG,EAAEK,SADP;AAEE,IAAA,IAAI,EAAET,IAFR;AAGE,IAAA,KAAK,EAAEE,IAHT;AAIE,IAAA,QAAQ,EAAED;AAJZ,KAKMM,IALN,EAVF,EAiBGF,YAjBH,CADF;AAqBD,CA/CkB,CAAd;AAkDPV,KAAK,CAACkB,WAAN,GAAoB,OAApB","sourcesContent":["import React, { ReactNode, Ref, useCallback, useRef } from \"react\";\nimport classnames from \"classnames\";\nimport { StyledInput, StyledInputWrapper } from \"./Styles\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { InputSize } from \"./types\";\nexport interface InputProps {\n /** Velicina inputa koja definse font-size i border radius */\n size?: InputSize;\n invalid?: boolean;\n startAdornment?: ReactNode;\n endAdornment?: ReactNode;\n inputRef?: Ref<HTMLInputElement>;\n}\n\nexport const Input = React.forwardRef<\n HTMLDivElement,\n InputProps & Omit<React.ComponentPropsWithoutRef<\"input\">, keyof InputProps>\n>(\n (\n {\n className = \"\",\n style,\n type = \"text\",\n disabled = false,\n size = \"regular\",\n invalid = false,\n startAdornment,\n endAdornment,\n inputRef,\n ...rest\n },\n ref\n ) => {\n const intInputRef = useRef<HTMLInputElement>(null);\n const handleRef = useForkRef(inputRef, intInputRef);\n\n const handleWrapperClick = useCallback(() => {\n intInputRef.current?.focus();\n }, []);\n\n return (\n <StyledInputWrapper\n $size={size}\n $invalid={invalid}\n $disabled={disabled}\n className={classnames(\"c-input\", className)}\n style={style}\n onClick={handleWrapperClick}\n ref={ref}\n >\n {startAdornment}\n <StyledInput\n ref={handleRef}\n type={type}\n $size={size}\n disabled={disabled}\n {...rest}\n />\n {endAdornment}\n </StyledInputWrapper>\n );\n }\n);\n\nInput.displayName = \"Input\";\n"],"file":"Input.js"}
@@ -0,0 +1,12 @@
1
+ import React from "react";
2
+ import { PolymorphicComponentPropsWithRef } from "../../utils/types";
3
+ interface BaseInputAdornmentProps {
4
+ disablePointerEvents?: boolean;
5
+ }
6
+ export declare type InputAdornmentProps<C extends React.ElementType> = PolymorphicComponentPropsWithRef<C, BaseInputAdornmentProps>;
7
+ export declare type InputAdornmentComponent = <C extends React.ElementType = "div">(props: InputAdornmentProps<C>) => React.ReactElement | null;
8
+ export declare const InputAdornment: InputAdornmentComponent & {
9
+ displayName?: string;
10
+ };
11
+ export {};
12
+ //# sourceMappingURL=InputAdornment.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InputAdornment.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/InputAdornment.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EACL,gCAAgC,EAEjC,MAAM,mBAAmB,CAAC;AAE3B,UAAU,uBAAuB;IAC/B,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAaD,oBAAY,mBAAmB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IACzD,gCAAgC,CAAC,CAAC,EAAE,uBAAuB,CAAC,CAAC;AAE/D,oBAAY,uBAAuB,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EACxE,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,KAC1B,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,eAAO,MAAM,cAAc,EAAE,uBAAuB,GAAG;IACrD,WAAW,CAAC,EAAE,MAAM,CAAC;CAkBtB,CAAC"}
@@ -0,0 +1,32 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
+ var _excluded = ["children", "as", "disablePointerEvents"];
4
+ import React from "react";
5
+ import styled, { css } from "styled-components";
6
+ var InputAdornmentBase = styled.div.withConfig({
7
+ displayName: "InputAdornment__InputAdornmentBase",
8
+ componentId: "sc-1xfjx1z-0"
9
+ })(["", " ", " ", ""], {
10
+ "display": "flex"
11
+ }, {
12
+ "alignItems": "center"
13
+ }, function (props) {
14
+ return props.$disablePointerEvents && css(["", ""], {
15
+ "pointerEvents": "none"
16
+ });
17
+ });
18
+ export var InputAdornment = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
19
+ var children = _ref.children,
20
+ as = _ref.as,
21
+ disablePointerEvents = _ref.disablePointerEvents,
22
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded);
23
+
24
+ var Component = as || "div";
25
+ return /*#__PURE__*/React.createElement(InputAdornmentBase, _extends({}, rest, {
26
+ as: Component,
27
+ $disablePointerEvents: disablePointerEvents,
28
+ ref: ref
29
+ }), children);
30
+ });
31
+ InputAdornment.displayName = "InputAdornment";
32
+ //# sourceMappingURL=InputAdornment.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/components/Input/InputAdornment.tsx"],"names":["React","styled","css","InputAdornmentBase","div","props","$disablePointerEvents","InputAdornment","forwardRef","ref","children","as","disablePointerEvents","rest","Component","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAWA,IAAMC,kBAAkB,GAAGF,MAAM,CAACG,GAAV;AAAA;AAAA;AAAA,uBAClB;AAAA;AAAA,CADkB,EAElB;AAAA;AAAA,CAFkB,EAIpB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,qBAAN,IACAJ,GADA,WAEM;AAAA;AAAA,GAFN,CADA;AAAA,CAJoB,CAAxB;AAkBA,OAAO,IAAMK,cAEZ,gBAAGP,KAAK,CAACQ,UAAN,CACF,gBAEEC,GAFF,EAGK;AAAA,MAFDC,QAEC,QAFDA,QAEC;AAAA,MAFSC,EAET,QAFSA,EAET;AAAA,MAFaC,oBAEb,QAFaA,oBAEb;AAAA,MAFsCC,IAEtC;;AACH,MAAMC,SAAS,GAAGH,EAAE,IAAI,KAAxB;AACA,sBACE,oBAAC,kBAAD,eACME,IADN;AAEE,IAAA,EAAE,EAAEC,SAFN;AAGE,IAAA,qBAAqB,EAAEF,oBAHzB;AAIE,IAAA,GAAG,EAAEH;AAJP,MAMGC,QANH,CADF;AAUD,CAhBC,CAFG;AAqBPH,cAAc,CAACQ,WAAf,GAA6B,gBAA7B","sourcesContent":["import React from \"react\";\nimport styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport {\n PolymorphicComponentPropsWithRef,\n PolymorphicRef,\n} from \"../../utils/types\";\n\ninterface BaseInputAdornmentProps {\n disablePointerEvents?: boolean;\n}\n\nconst InputAdornmentBase = styled.div<{ $disablePointerEvents?: boolean }>`\n ${tw`tw-flex`}\n ${tw`tw-items-center`}\n\n ${(props) =>\n props.$disablePointerEvents &&\n css`\n ${tw`tw-pointer-events-none`}\n `}\n`;\n\nexport type InputAdornmentProps<C extends React.ElementType> =\n PolymorphicComponentPropsWithRef<C, BaseInputAdornmentProps>;\n\nexport type InputAdornmentComponent = <C extends React.ElementType = \"div\">(\n props: InputAdornmentProps<C>\n) => React.ReactElement | null;\n\nexport const InputAdornment: InputAdornmentComponent & {\n displayName?: string;\n} = React.forwardRef(\n <C extends React.ElementType = \"div\">(\n { children, as, disablePointerEvents, ...rest }: InputAdornmentProps<C>,\n ref: PolymorphicRef<C>\n ) => {\n const Component = as || \"div\";\n return (\n <InputAdornmentBase\n {...rest}\n as={Component}\n $disablePointerEvents={disablePointerEvents}\n ref={ref}\n >\n {children}\n </InputAdornmentBase>\n );\n }\n);\n\nInputAdornment.displayName = \"InputAdornment\";\n"],"file":"InputAdornment.js"}
@@ -1,6 +1,13 @@
1
- import { InputSize } from "./Input";
2
- export declare const StyledInput: import("styled-components").StyledComponent<"input", any, {
3
- $size?: InputSize | undefined;
4
- $invalid?: boolean | undefined;
5
- }, never>;
1
+ import { InputSize } from "./types";
2
+ interface StyledInputWrapperProps {
3
+ $size?: InputSize;
4
+ $invalid?: boolean;
5
+ $disabled?: boolean;
6
+ }
7
+ export declare const StyledInputWrapper: import("styled-components").StyledComponent<"div", any, StyledInputWrapperProps, never>;
8
+ interface StyledInputProps {
9
+ $size?: InputSize;
10
+ }
11
+ export declare const StyledInput: import("styled-components").StyledComponent<"input", any, StyledInputProps, never>;
12
+ export {};
6
13
  //# sourceMappingURL=Styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAIpC,eAAO,MAAM,WAAW;;;SAgEvB,CAAC"}
1
+ {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/Styles.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,UAAU,uBAAuB;IAC/B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,yFAoD9B,CAAC;AAIF,UAAU,gBAAgB;IACxB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,eAAO,MAAM,WAAW,oFA8BvB,CAAC"}
@@ -1,41 +1,60 @@
1
1
  import styled, { css } from "styled-components";
2
2
  import { BoxSizingStyle } from "../BoxSizingStyle";
3
3
  import { FontStyle } from "../FontStyle";
4
- export var StyledInput = styled.input.withConfig({
5
- displayName: "Styles__StyledInput",
4
+ export var StyledInputWrapper = styled.div.withConfig({
5
+ displayName: "Styles__StyledInputWrapper",
6
6
  componentId: "sc-ce8kcp-0"
7
- })(["", " ", " ", " ", " ", " border-width:1px;border-style:solid;", " border-radius:8px;padding:4px 8px 6px 8px;height:32px;background-color:var(--input-background-color);transition:all 0.3s ease;width:360px;outline:none;", " ", " ", " ", " ", " ", " &::placeholder{", "}", ""], {
8
- "fontSize": "0.875rem"
7
+ })(["", " ", " ", " border-width:1px;border-style:solid;", " border-radius:8px;padding:4px;height:32px;background-color:var(--input-background-color);transition:all 0.3s ease;width:360px;", " ", " ", " ", " ", " ", " ", ""], {
8
+ "cursor": "text"
9
9
  }, {
10
- "color": "var(--color-theme-900)"
10
+ "display": "flex"
11
11
  }, {
12
- "lineHeight": "1.375"
13
- }, {
14
- "letterSpacing": "0.02em"
15
- }, {
16
- "fontWeight": "400"
12
+ "alignItems": "center"
17
13
  }, {
18
14
  "borderColor": "var(--color-theme-500)"
19
15
  }, FontStyle, BoxSizingStyle, function (props) {
20
16
  return props.$size === "small" && css(["border-radius:6px;height:24px;"]);
21
17
  }, function (props) {
22
- return props.$size === "big" && css(["", " height:40px;"], {
23
- "fontSize": "1rem"
24
- });
18
+ return props.$size === "big" && css(["height:40px;"]);
25
19
  }, function (props) {
26
- return props.disabled && css(["", ""], {
20
+ return props.$disabled && css(["", ""], {
27
21
  "cursor": "not-allowed",
28
22
  "opacity": "0.5"
29
23
  });
30
24
  }, function (props) {
31
- return !props.disabled && !props.$invalid && css(["&:active,&:focus,&:hover{", "}"], {
25
+ return !props.$disabled && !props.$invalid && css(["&:focus-within,&:hover{", "}"], {
32
26
  "borderColor": "var(--color-primary)"
33
27
  });
28
+ }, function (props) {
29
+ return !props.$disabled && props.$invalid && css(["", ""], {
30
+ "borderColor": "var(--red-alert)"
31
+ });
32
+ });
33
+ StyledInputWrapper.displayName = "StyledInputWrapper";
34
+ export var StyledInput = styled.input.withConfig({
35
+ displayName: "Styles__StyledInput",
36
+ componentId: "sc-ce8kcp-1"
37
+ })(["", " ", " ", " ", " ", " ", " padding:0px;margin:0 4px;background-color:var(--input-background-color);border:none;outline:none;&::placeholder{", "}", " ", ""], {
38
+ "fontSize": "0.875rem"
39
+ }, {
40
+ "color": "var(--color-theme-900)"
41
+ }, {
42
+ "lineHeight": "1.375"
43
+ }, {
44
+ "letterSpacing": "0.02em"
45
+ }, {
46
+ "fontWeight": "400"
47
+ }, {
48
+ "width": "100%"
34
49
  }, {
35
50
  "color": "var(--color-theme-transparent-500)"
36
51
  }, function (props) {
37
- return !props.disabled && props.$invalid && css(["", ""], {
38
- "borderColor": "var(--red-alert)"
52
+ return props.$size === "big" && css(["", ""], {
53
+ "fontSize": "1rem"
54
+ });
55
+ }, function (props) {
56
+ return props.disabled && css(["", ""], {
57
+ "cursor": "not-allowed"
39
58
  });
40
59
  });
41
60
  StyledInput.displayName = "StyledInput";
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Input/Styles.ts"],"names":["styled","css","BoxSizingStyle","FontStyle","StyledInput","input","props","$size","disabled","$invalid","displayName"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAGA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAEA,OAAO,IAAMC,WAAW,GAAGJ,MAAM,CAACK,KAAV;AAAA;AAAA;AAAA,wRAIlB;AAAA;AAAA,CAJkB,EAKlB;AAAA;AAAA,CALkB,EAMlB;AAAA;AAAA,CANkB,EAOlB;AAAA;AAAA,CAPkB,EAQlB;AAAA;AAAA,CARkB,EAWlB;AAAA;AAAA,CAXkB,EAoBpBF,SApBoB,EAqBpBD,cArBoB,EAuBpB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,OAAhB,IACAN,GADA,oCADA;AAAA,CAvBoB,EA8BpB,UAACK,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,KAAhB,IACAN,GADA,wBAEM;AAAA;AAAA,GAFN,CADA;AAAA,CA9BoB,EAqCpB,UAACK,KAAD;AAAA,SACAA,KAAK,CAACE,QAAN,IACAP,GADA,WAEM;AAAA;AAAA;AAAA,GAFN,CADA;AAAA,CArCoB,EA2CpB,UAACK,KAAD;AAAA,SACA,CAACA,KAAK,CAACE,QAAP,IACA,CAACF,KAAK,CAACG,QADP,IAEAR,GAFA,qCAMQ;AAAA;AAAA,GANR,CADA;AAAA,CA3CoB,EAuDhB;AAAA;AAAA,CAvDgB,EA0DpB,UAACK,KAAD;AAAA,SACA,CAACA,KAAK,CAACE,QAAP,IACAF,KAAK,CAACG,QADN,IAEAR,GAFA,WAGM;AAAA;AAAA,GAHN,CADA;AAAA,CA1DoB,CAAjB;AAkEPG,WAAW,CAACM,WAAZ,GAA0B,aAA1B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { InputSize } from \"./Input\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledInput = styled.input<{\n $size?: InputSize;\n $invalid?: boolean;\n}>`\n ${tw`tw-text-body-2`}\n ${tw`tw-text-theme-900`}\n ${tw`tw-leading-regular`}\n ${tw`tw-tracking-regular`}\n ${tw`tw-font-regular`}\n border-width: 1px;\n border-style: solid;\n ${tw`tw-border-theme-500`}\n border-radius: 8px;\n padding: 4px 8px 6px 8px;\n height: 32px;\n background-color: var(--input-background-color);\n transition: all 0.3s ease;\n width: 360px;\n outline: none;\n\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${(props) =>\n props.$size === \"small\" &&\n css`\n border-radius: 6px;\n height: 24px;\n `}\n\n ${(props) =>\n props.$size === \"big\" &&\n css`\n ${tw`tw-text-body-1`}\n height: 40px;\n `}\n\n ${(props) =>\n props.disabled &&\n css`\n ${tw`tw-cursor-not-allowed tw-opacity-50`}\n `}\n\n ${(props) =>\n !props.disabled &&\n !props.$invalid &&\n css`\n &:active,\n &:focus,\n &:hover {\n ${tw`tw-border-primary`}\n }\n `}\n\n &::placeholder {\n ${tw`tw-text-theme-transparent-500`}\n }\n\n ${(props) =>\n !props.disabled &&\n props.$invalid &&\n css`\n ${tw`tw-border-alert`}\n `}\n`;\n\nStyledInput.displayName = \"StyledInput\";\n"],"file":"Styles.js"}
1
+ {"version":3,"sources":["../../../../src/components/Input/Styles.ts"],"names":["styled","css","BoxSizingStyle","FontStyle","StyledInputWrapper","div","props","$size","$disabled","$invalid","displayName","StyledInput","input","disabled"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAGA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAOA,OAAO,IAAMC,kBAAkB,GAAGJ,MAAM,CAACK,GAAV;AAAA;AAAA;AAAA,iOACzB;AAAA;AAAA,CADyB,EAEzB;AAAA;AAAA,CAFyB,EAGzB;AAAA;AAAA,CAHyB,EAMzB;AAAA;AAAA,CANyB,EAc3BF,SAd2B,EAe3BD,cAf2B,EAiB3B,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,OAAhB,IACAN,GADA,oCADA;AAAA,CAjB2B,EAwB3B,UAACK,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,KAAhB,IACAN,GADA,kBADA;AAAA,CAxB2B,EA8B3B,UAACK,KAAD;AAAA,SACAA,KAAK,CAACE,SAAN,IACAP,GADA,WAEM;AAAA;AAAA;AAAA,GAFN,CADA;AAAA,CA9B2B,EAoC3B,UAACK,KAAD;AAAA,SACA,CAACA,KAAK,CAACE,SAAP,IACA,CAACF,KAAK,CAACG,QADP,IAEAR,GAFA,mCAKQ;AAAA;AAAA,GALR,CADA;AAAA,CApC2B,EA8C3B,UAACK,KAAD;AAAA,SACA,CAACA,KAAK,CAACE,SAAP,IACAF,KAAK,CAACG,QADN,IAEAR,GAFA,WAGM;AAAA;AAAA,GAHN,CADA;AAAA,CA9C2B,CAAxB;AAsDPG,kBAAkB,CAACM,WAAnB,GAAiC,oBAAjC;AAMA,OAAO,IAAMC,WAAW,GAAGX,MAAM,CAACY,KAAV;AAAA;AAAA;AAAA,qKAClB;AAAA;AAAA,CADkB,EAElB;AAAA;AAAA,CAFkB,EAGlB;AAAA;AAAA,CAHkB,EAIlB;AAAA;AAAA,CAJkB,EAKlB;AAAA;AAAA,CALkB,EAMlB;AAAA;AAAA,CANkB,EAgBhB;AAAA;AAAA,CAhBgB,EAmBpB,UAACN,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,KAAhB,IACAN,GADA,WAEM;AAAA;AAAA,GAFN,CADA;AAAA,CAnBoB,EAyBpB,UAACK,KAAD;AAAA,SACAA,KAAK,CAACO,QAAN,IACAZ,GADA,WAEM;AAAA;AAAA,GAFN,CADA;AAAA,CAzBoB,CAAjB;AAgCPU,WAAW,CAACD,WAAZ,GAA0B,aAA1B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { InputSize } from \"./types\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\ninterface StyledInputWrapperProps {\n $size?: InputSize;\n $invalid?: boolean;\n $disabled?: boolean;\n}\n\nexport const StyledInputWrapper = styled.div<StyledInputWrapperProps>`\n ${tw`tw-cursor-text`}\n ${tw`tw-flex`}\n ${tw`tw-items-center`}\n border-width: 1px;\n border-style: solid;\n ${tw`tw-border-theme-500`}\n border-radius: 8px;\n padding: 4px;\n height: 32px;\n background-color: var(--input-background-color);\n transition: all 0.3s ease;\n width: 360px;\n\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${(props) =>\n props.$size === \"small\" &&\n css`\n border-radius: 6px;\n height: 24px;\n `}\n\n ${(props) =>\n props.$size === \"big\" &&\n css`\n height: 40px;\n `}\n\n ${(props) =>\n props.$disabled &&\n css`\n ${tw`tw-cursor-not-allowed tw-opacity-50`}\n `}\n\n ${(props) =>\n !props.$disabled &&\n !props.$invalid &&\n css`\n &:focus-within,\n &:hover {\n ${tw`tw-border-primary`}\n }\n `}\n\n ${(props) =>\n !props.$disabled &&\n props.$invalid &&\n css`\n ${tw`tw-border-alert`}\n `}\n`;\n\nStyledInputWrapper.displayName = \"StyledInputWrapper\";\n\ninterface StyledInputProps {\n $size?: InputSize;\n}\n\nexport const StyledInput = styled.input<StyledInputProps>`\n ${tw`tw-text-body-2`}\n ${tw`tw-text-theme-900`}\n ${tw`tw-leading-regular`}\n ${tw`tw-tracking-regular`}\n ${tw`tw-font-regular`}\n ${tw`tw-w-full`}\n\n padding: 0px;\n margin: 0 4px;\n\n background-color: var(--input-background-color);\n border: none;\n outline: none;\n\n &::placeholder {\n ${tw`tw-text-theme-transparent-500`}\n }\n\n ${(props) =>\n props.$size === \"big\" &&\n css`\n ${tw`tw-text-body-1`}\n `}\n\n ${(props) =>\n props.disabled &&\n css`\n ${tw`tw-cursor-not-allowed`}\n `}\n`;\n\nStyledInput.displayName = \"StyledInput\";\n"],"file":"Styles.js"}
@@ -1,2 +1,3 @@
1
1
  export * from "./Input";
2
+ export * from "./InputAdornment";
2
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC"}
@@ -1,2 +1,3 @@
1
1
  export * from "./Input";
2
+ export * from "./InputAdornment";
2
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd","sourcesContent":["export * from \"./Input\";\n"],"file":"index.js"}
1
+ {"version":3,"sources":["../../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd;AACA,cAAc,kBAAd","sourcesContent":["export * from \"./Input\";\nexport * from \"./InputAdornment\";\n"],"file":"index.js"}
@@ -0,0 +1,2 @@
1
+ export declare type InputSize = "small" | "regular" | "big";
2
+ //# sourceMappingURL=types.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/types.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,KAAK,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"types.js"}
@@ -3,6 +3,8 @@ export interface IProgressBarProps {
3
3
  progress: number;
4
4
  backgroundColor?: string;
5
5
  progressColor?: string;
6
+ stroke?: number;
7
+ width?: number;
6
8
  }
7
9
  export declare const ProgressBar: FC<IProgressBarProps>;
8
10
  //# sourceMappingURL=ProgressBar.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAW,MAAM,OAAO,CAAC;AAG3C,MAAM,WAAW,iBAAiB;IAEhC,QAAQ,EAAE,MAAM,CAAC;IAEjB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,CAyB7C,CAAC"}
1
+ {"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAW,MAAM,OAAO,CAAC;AAG3C,MAAM,WAAW,iBAAiB;IAEhC,QAAQ,EAAE,MAAM,CAAC;IAEjB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,CAwD7C,CAAC"}
@@ -1,9 +1,14 @@
1
1
  import React, { useMemo } from "react";
2
2
  import { StyledProgressBar, StyledProgressBarProgress } from "./Styles";
3
3
  export var ProgressBar = function ProgressBar(_ref) {
4
- var progress = _ref.progress,
4
+ var _ref$progress = _ref.progress,
5
+ progress = _ref$progress === void 0 ? 0 : _ref$progress,
5
6
  backgroundColor = _ref.backgroundColor,
6
- progressColor = _ref.progressColor;
7
+ progressColor = _ref.progressColor,
8
+ _ref$stroke = _ref.stroke,
9
+ stroke = _ref$stroke === void 0 ? 3 : _ref$stroke,
10
+ _ref$width = _ref.width,
11
+ width = _ref$width === void 0 ? 100 : _ref$width;
7
12
  var progressNumber = useMemo(function () {
8
13
  var width = progress;
9
14
 
@@ -17,14 +22,38 @@ export var ProgressBar = function ProgressBar(_ref) {
17
22
 
18
23
  return width;
19
24
  }, [progress]);
25
+ var widthPercent = useMemo(function () {
26
+ var width_percent = width;
27
+
28
+ if (width > 100) {
29
+ width_percent = 100;
30
+ }
31
+
32
+ if (width <= 0) {
33
+ width_percent = 100;
34
+ }
35
+
36
+ return width_percent;
37
+ }, [width]);
38
+ var height = useMemo(function () {
39
+ var stroke_min = stroke;
40
+
41
+ if (stroke <= 0) {
42
+ stroke_min = 3;
43
+ }
44
+
45
+ return stroke_min;
46
+ }, [stroke]);
20
47
  return /*#__PURE__*/React.createElement(StyledProgressBar, {
21
48
  className: "c-progress-bar",
22
- $color: backgroundColor
49
+ $color: backgroundColor,
50
+ $width: widthPercent
23
51
  }, /*#__PURE__*/React.createElement(StyledProgressBarProgress, {
24
52
  className: "c-progress-bar__progress",
25
53
  style: {
26
54
  width: progressNumber + "%"
27
55
  },
56
+ $height: height,
28
57
  $color: progressColor
29
58
  }));
30
59
  };