@ncds/ui-admin 0.0.22 → 0.0.24

package/dist/esm/src/components/notification/Notification.js

@@ -0,0 +1,59 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import classNames from 'classnames';
+import { FloatingNotification } from './FloatingNotification';
+import { FullWidthNotification } from './FullWidthNotification';
+export var Notification = /*#__PURE__*/forwardRef(function (_a, ref) {
+  var _b = _a.type,
+    type = _b === void 0 ? 'floating' : _b,
+    title = _a.title,
+    supportingText = _a.supportingText,
+    _c = _a.variant,
+    variant = _c === void 0 ? 'neutral' : _c,
+    onClose = _a.onClose,
+    className = _a.className,
+    actions = _a.actions,
+    rest = __rest(_a, ["type", "title", "supportingText", "variant", "onClose", "className", "actions"]);
+  var actionsContent = actions && actions.length > 0 ? _jsx(_Fragment, {
+    children: actions.map(function (action, index) {
+      return _jsx("button", __assign({
+        onClick: action.onClick,
+        className: classNames('ncua-notification__action-button', "ncua-notification__action-button--".concat(action.hierarchy || 'link-gray'))
+      }, {
+        children: action.label
+      }), index);
+    })
+  }) : null;
+  var sharedProps = __assign({
+    title: title,
+    supportingText: supportingText,
+    variant: variant,
+    onClose: onClose,
+    className: className,
+    actions: actionsContent
+  }, rest);
+  return type === 'floating' ? _jsx(FloatingNotification, __assign({}, sharedProps, {
+    ref: ref
+  })) : _jsx(FullWidthNotification, __assign({}, sharedProps, {
+    ref: ref
+  }));
+});
+Notification.displayName = 'Notification';

package/dist/esm/src/components/notification/index.js

@@ -0,0 +1,3 @@
+export * from './Notification';
+export * from './FloatingNotification';
+export * from './FullWidthNotification';

package/dist/esm/src/components/pagination/NavButton.js

@@ -43,7 +43,7 @@ var NAV_BUTTON_CONFIG = {
 export var NavButton = function (_a) {
   var type = _a.type,
     as = _a.as,
-    isPC = _a.isPC,
+    breakPoint = _a.breakPoint,
     noPrev = _a.noPrev,
     noNext = _a.noNext,
     href = _a.href,
@@ -54,6 +54,7 @@ export var NavButton = function (_a) {
   var isFirstOrPrev = type === 'first' || type === 'prev';
   var isNextOrLast = type === 'next' || type === 'last';
   var disabled = isFirstOrPrev ? noPrev : isNextOrLast ? noNext : false;
+  var isPC = breakPoint === 'pc';
   // key를 제외한 공통 props
   var buttonProps = {
     label: config.label,
@@ -62,15 +63,16 @@ export var NavButton = function (_a) {
     leadingIcon: {
       type: 'icon',
       icon: config.getIcon(isPC),
-      color: disabled ? 'gray200' : 'gray700'
+      color: disabled ? 'gray200' : 'gray700',
+      size: isPC ? 16 : 20
     },
     hierarchy: 'secondary-gray',
-    size: 'xs',
+    size: isPC ? 'xs' : 'sm',
     disabled: disabled,
     onClick: onClick
   };
   // key 값 별도 계산
-  var buttonKey = isNavigationButton ? "".concat(isPC ? 'pc' : 'mobile', "-").concat(type) : undefined;
+  var buttonKey = isNavigationButton ? "".concat(breakPoint, "-").concat(type) : undefined;
   if (as === 'a') {
     return _jsx(Button, __assign({
       as: "a",

package/dist/esm/src/components/pagination/Pagination.js

@@ -20,7 +20,6 @@ import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-run
 import classNames from 'classnames';
 import { isFunction, range, uniqueId } from 'lodash-es';
 import { useEffect, useState } from 'react';
-import { MINIMUM_PC_SIZE } from '../../constant';
 import { NavButton } from './NavButton';
 // 네비게이션 버튼 설정
 export var Pagination = function (_a) {
@@ -42,9 +41,6 @@ export var Pagination = function (_a) {
   var _g = useState(1),
     start = _g[0],
     setStart = _g[1];
-  var _h = useState(globalThis.innerWidth > MINIMUM_PC_SIZE),
-    isPC = _h[0],
-    setIsPC = _h[1];
   var noPrev = start === 1;
   var noNext = start + pageCount - 1 >= totalPage;
   var showJumpPageButton = totalPage > pageCount;
@@ -72,17 +68,6 @@ export var Pagination = function (_a) {
       setStart(lastGroupStart);
     }
   }, [currentPage]);
-  useEffect(function () {
-    var mql = globalThis.matchMedia("(min-width: ".concat(MINIMUM_PC_SIZE, "px)"));
-    setIsPC(mql.matches);
-    var handleResize = function (e) {
-      setIsPC(e.matches);
-    };
-    mql.addEventListener('change', handleResize);
-    return function () {
-      return mql.removeEventListener('change', handleResize);
-    };
-  }, []);
   return _jsx(_Fragment, {
     children: _jsxs("div", __assign({
       className: classNames('ncua-pagination', "ncua-pagination--".concat(breakPoint), className)
@@ -91,7 +76,7 @@ export var Pagination = function (_a) {
         children: [NavButton({
           type: 'first',
           as: as,
-          isPC: isPC,
+          breakPoint: breakPoint,
           noPrev: noPrev,
           noNext: noNext,
           href: restProps.href || '',
@@ -102,7 +87,7 @@ export var Pagination = function (_a) {
         }), NavButton({
           type: 'prev',
           as: as,
-          isPC: isPC,
+          breakPoint: breakPoint,
           noPrev: noPrev,
           noNext: noNext,
           href: restProps.href || '',
@@ -142,7 +127,7 @@ export var Pagination = function (_a) {
         children: [NavButton({
           type: 'next',
           as: as,
-          isPC: isPC,
+          breakPoint: breakPoint,
           noPrev: noPrev,
           noNext: noNext,
           href: restProps.href || '',
@@ -153,7 +138,7 @@ export var Pagination = function (_a) {
         }), NavButton({
           type: 'last',
           as: as,
-          isPC: isPC,
+          breakPoint: breakPoint,
           noPrev: noPrev,
           noNext: noNext,
           href: restProps.href || '',

package/dist/esm/src/components/progress-bar/ProgressBar.js

@@ -0,0 +1,50 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export var ProgressBar = function (_a) {
+  var label = _a.label,
+    value = _a.value;
+  var limitedValue = Math.min(Math.max(0, value), 100);
+  var displayValue = "".concat(limitedValue.toFixed(0), "%");
+  var progressValueStyle = label === 'top-float' || label === 'bottom-float' ? {
+    '--progress-value': "".concat(limitedValue, "%")
+  } : undefined;
+  var renderLabel = function (labelType) {
+    return _jsx("span", __assign({
+      className: "ncua-progress-bar__label ncua-progress-bar__label-".concat(labelType)
+    }, {
+      children: displayValue
+    }));
+  };
+  var isFloatingLabel = label === 'top-float' || label === 'bottom-float';
+  return _jsxs("div", __assign({
+    className: "ncua-progress-bar ncua-progress-bar-".concat(label),
+    style: progressValueStyle
+  }, {
+    children: [isFloatingLabel && renderLabel(label), _jsxs("div", __assign({
+      className: "ncua-progress-bar__content"
+    }, {
+      children: [_jsx("div", __assign({
+        className: "ncua-progress-bar__bar"
+      }, {
+        children: _jsx("div", {
+          className: "ncua-progress-bar__fill",
+          style: {
+            width: "".concat(limitedValue, "%")
+          },
+          "aria-valuenow": limitedValue,
+          "aria-valuemin": 0,
+          "aria-valuemax": 100
+        })
+      })), label === 'right' && renderLabel('right')]
+    })), label === 'bottom' && renderLabel('bottom')]
+  }));
+};

package/dist/esm/src/components/progress-bar/index.js

@@ -0,0 +1 @@
+export * from './ProgressBar';

package/dist/esm/src/components/progress-circle/ProgressCircle.js

@@ -0,0 +1,114 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export var ProgressCircle = function (_a) {
+  var size = _a.size,
+    label = _a.label,
+    value = _a.value,
+    _b = _a.theme,
+    theme = _b === void 0 ? 'circle' : _b;
+  var limitedValue = Math.min(Math.max(0, value), 100);
+  if (theme === 'circle') {
+    return _jsxs("div", __assign({
+      className: "ncua-progress-circle ncua-progress-circle-".concat(size, " ncua-progress-circle-").concat(theme)
+    }, {
+      children: [_jsxs("div", __assign({
+        className: "ncua-progress-circle__content"
+      }, {
+        children: [_jsxs("svg", __assign({
+          className: "ncua-progress-circle__svg",
+          viewBox: "0 0 100 100"
+        }, {
+          children: [_jsx("circle", {
+            className: "ncua-progress-circle__background",
+            cx: "50",
+            cy: "50",
+            r: "45",
+            strokeWidth: "10",
+            fill: "none"
+          }), _jsx("circle", {
+            className: "ncua-progress-circle__progress",
+            cx: "50",
+            cy: "50",
+            r: "45",
+            strokeWidth: "10",
+            fill: "none",
+            strokeDasharray: "var(--circle-circumference)",
+            strokeDashoffset: "calc(var(--circle-circumference) * (1 - ".concat(limitedValue, " / 100))"),
+            transform: "rotate(-90 50 50)",
+            strokeLinecap: "round"
+          })]
+        })), _jsxs("div", __assign({
+          className: "ncua-progress-circle__label-container"
+        }, {
+          children: [size !== 'xxs' && label && _jsx("div", __assign({
+            className: "ncua-progress-circle__label-text"
+          }, {
+            children: label
+          })), _jsx("div", __assign({
+            className: "ncua-progress-circle__label"
+          }, {
+            children: "".concat(limitedValue, "%")
+          }))]
+        }))]
+      })), size === 'xxs' && label && _jsx("div", __assign({
+        className: "ncua-progress-circle__outside-label"
+      }, {
+        children: label
+      }))]
+    }));
+  } else {
+    return _jsxs("div", __assign({
+      className: "ncua-progress-circle ncua-progress-circle-".concat(size, " ncua-progress-circle-").concat(theme)
+    }, {
+      children: [_jsxs("div", __assign({
+        className: "ncua-progress-circle__content"
+      }, {
+        children: [_jsxs("svg", __assign({
+          className: "ncua-progress-circle__svg",
+          viewBox: "0 0 100 50"
+        }, {
+          children: [_jsx("path", {
+            className: "ncua-progress-circle__background",
+            d: "M 5 50 A 45 45 0 0 1 95 50",
+            strokeWidth: "10",
+            fill: "none",
+            strokeLinecap: "round"
+          }), _jsx("path", {
+            className: "ncua-progress-circle__progress",
+            d: "M 5 50 A 45 45 0 0 1 95 50",
+            strokeWidth: "10",
+            fill: "none",
+            strokeDasharray: "var(--half-circle-circumference)",
+            strokeDashoffset: "calc(var(--half-circle-circumference) * (1 - ".concat(limitedValue, " / 100))"),
+            strokeLinecap: "round"
+          })]
+        })), _jsxs("div", __assign({
+          className: "ncua-progress-circle__label-container"
+        }, {
+          children: [size !== 'xxs' && label && _jsx("div", __assign({
+            className: "ncua-progress-circle__label-text"
+          }, {
+            children: label
+          })), _jsx("div", __assign({
+            className: "ncua-progress-circle__label"
+          }, {
+            children: "".concat(limitedValue, "%")
+          }))]
+        }))]
+      })), size === 'xxs' && label && _jsx("div", __assign({
+        className: "ncua-progress-circle__outside-label"
+      }, {
+        children: label
+      }))]
+    }));
+  }
+};

package/dist/esm/src/components/progress-circle/index.js

@@ -0,0 +1 @@
+export * from './ProgressCircle';

package/dist/esm/src/components/slider/Slider.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
+import { Slider as NcuaSlider } from '../../../assets/scripts/slider';
+export var Slider = function (_a) {
+  var _b = _a.min,
+    min = _b === void 0 ? 0 : _b,
+    _c = _a.max,
+    max = _c === void 0 ? 100 : _c,
+    _d = _a.step,
+    step = _d === void 0 ? 1 : _d,
+    _e = _a.value,
+    value = _e === void 0 ? 0 : _e,
+    onChange = _a.onChange,
+    labelPosition = _a.labelPosition,
+    _f = _a.disabled,
+    disabled = _f === void 0 ? false : _f,
+    className = _a.className;
+  var containerRef = useRef(null);
+  var sliderInstanceRef = useRef(null);
+  useEffect(function () {
+    if (!containerRef.current) return;
+    sliderInstanceRef.current = new NcuaSlider(containerRef.current, {
+      min: min,
+      max: max,
+      step: step,
+      value: value,
+      onChange: onChange,
+      labelPosition: labelPosition,
+      disabled: disabled
+    });
+    return function () {
+      if (sliderInstanceRef.current) {
+        sliderInstanceRef.current.destroy();
+        sliderInstanceRef.current = null;
+      }
+    };
+  }, [typeof value, onChange, min, max, step, labelPosition]);
+  useEffect(function () {
+    if (sliderInstanceRef.current) {
+      sliderInstanceRef.current.setValue(value);
+    }
+  }, [sliderInstanceRef, value]);
+  useEffect(function () {
+    if (sliderInstanceRef.current) {
+      if (disabled) {
+        sliderInstanceRef.current.disable();
+      } else {
+        sliderInstanceRef.current.enable();
+      }
+    }
+  }, [disabled]);
+  return _jsx("div", {
+    ref: containerRef,
+    className: "ncua-slider ".concat(className || '')
+  });
+};
+export default Slider;

package/dist/esm/src/components/slider/index.js

@@ -0,0 +1 @@
+export * from './Slider';

package/dist/esm/src/components/tab/HorizontalTab.js

@@ -0,0 +1,69 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { uniqueId } from 'lodash';
+import 'swiper/css';
+import { Swiper, SwiperSlide } from 'swiper/react';
+import { TabButton } from './TabButton';
+export var HorizontalTab = function (_a) {
+  var _b = _a.type,
+    type = _b === void 0 ? 'button-primary' : _b,
+    size = _a.size,
+    activeTab = _a.activeTab,
+    onClick = _a.onClick,
+    _c = _a.fullWidth,
+    fullWidth = _c === void 0 ? false : _c,
+    _d = _a.menus,
+    menus = _d === void 0 ? [] : _d;
+  var getTabGap = function (type) {
+    var _a;
+    var gap = {
+      underline: 16
+    };
+    return (_a = gap[type]) !== null && _a !== void 0 ? _a : 8;
+  };
+  if (!menus.length) return _jsx(_Fragment, {});
+  return _jsx("div", __assign({
+    className: classNames('ncua-horizontal-tab', "ncua-horizontal-tab--".concat(type), {
+      'ncua-horizontal-tab--fullWidth': fullWidth
+    })
+  }, {
+    children: _jsx(Swiper, __assign({
+      slidesPerView: "auto",
+      spaceBetween: getTabGap(type)
+    }, {
+      children: menus.map(function (menu) {
+        var isActive = menu.href ? menu.href.includes(activeTab) : menu.id === activeTab;
+        var commonProps = {
+          id: menu.id,
+          label: menu.label,
+          badgeInfo: menu.badgeInfo,
+          isActive: isActive,
+          tabButtonType: type,
+          size: size,
+          onClick: function () {
+            var _a;
+            return onClick === null || onClick === void 0 ? void 0 : onClick((_a = menu.id) !== null && _a !== void 0 ? _a : '');
+          }
+        };
+        return _jsx(SwiperSlide, __assign({
+          className: "ncua-horizontal-tab__item"
+        }, {
+          children: menu.href ? _jsx(TabButton, __assign({}, commonProps, {
+            href: menu.href,
+            target: menu.target
+          })) : _jsx(TabButton, __assign({}, commonProps))
+        }), uniqueId('horizontal-tab'));
+      })
+    }))
+  }));
+};

package/dist/esm/src/components/tab/TabButton.js

@@ -0,0 +1,68 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { Badge } from '../badge/Badge';
+export var TabButton = function (_a) {
+  var label = _a.label,
+    _b = _a.size,
+    size = _b === void 0 ? 'md' : _b,
+    tabButtonType = _a.tabButtonType,
+    type = _a.type,
+    _c = _a.isActive,
+    isActive = _c === void 0 ? false : _c,
+    badgeInfo = _a.badgeInfo,
+    className = _a.className,
+    children = _a.children,
+    props = __rest(_a, ["label", "size", "tabButtonType", "type", "isActive", "badgeInfo", "className", "children"]);
+  var tabType = tabButtonType || type;
+  var componentClassName = classNames('ncua-tab-button', "ncua-tab-button--".concat(size), "ncua-tab-button--".concat(tabType || 'button-primary'), {
+    'is-active': isActive
+  }, className);
+  if ('href' in props && props.href) {
+    var _d = props,
+      href = _d.href,
+      _e = _d.target,
+      target = _e === void 0 ? '_self' : _e,
+      onClick_1 = _d.onClick,
+      anchorProps = __rest(_d, ["href", "target", "onClick"]);
+    return _jsxs("a", __assign({
+      className: componentClassName,
+      href: href,
+      target: target,
+      onClick: onClick_1
+    }, anchorProps, {
+      children: [label, badgeInfo && _jsx(Badge, __assign({}, badgeInfo, {
+        size: "sm"
+      })), children]
+    }));
+  }
+  var _f = props,
+    onClick = _f.onClick,
+    buttonProps = __rest(_f, ["onClick"]);
+  return _jsxs("button", __assign({
+    type: "button",
+    className: componentClassName,
+    onClick: onClick
+  }, buttonProps, {
+    children: [label, badgeInfo && _jsx(Badge, __assign({}, badgeInfo, {
+      size: "xs"
+    })), children]
+  }));
+};

package/dist/esm/src/components/tab/VerticalTab.js

@@ -0,0 +1,67 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import classNames from 'classnames';
+import { Fragment } from 'react';
+import { Select } from '../select/Select';
+import { TabButton } from './TabButton';
+export var VerticalTab = function (_a) {
+  var _b = _a.type,
+    type = _b === void 0 ? 'button-primary' : _b,
+    _c = _a.breakPoint,
+    breakPoint = _c === void 0 ? 'pc' : _c,
+    activeTab = _a.activeTab,
+    menus = _a.menus,
+    onClick = _a.onClick;
+  var handleSelectChange = function (e) {
+    onClick === null || onClick === void 0 ? void 0 : onClick(e.target.value);
+  };
+  var optionItems = (menus === null || menus === void 0 ? void 0 : menus.map(function (menu) {
+    return {
+      id: menu.id || '',
+      label: menu.label || ''
+    };
+  })) || [];
+  return _jsx("div", __assign({
+    className: classNames('ncua-vertical-tab', "ncua-vertical-tab--".concat(type))
+  }, {
+    children: breakPoint === 'mobile' ? _jsx("div", __assign({
+      className: "ncua-vertical-tab__select"
+    }, {
+      children: _jsx(Select, {
+        value: activeTab,
+        onChange: handleSelectChange,
+        optionItems: optionItems,
+        size: "md"
+      })
+    })) : menus === null || menus === void 0 ? void 0 : menus.map(function (menu) {
+      var isActive = menu.href ? menu.href.includes(activeTab) : menu.id === activeTab;
+      var commonProps = {
+        id: menu.id,
+        label: menu.label,
+        badgeInfo: menu.badgeInfo,
+        isActive: isActive,
+        tabButtonType: type,
+        size: 'sm',
+        onClick: function () {
+          var _a;
+          return onClick === null || onClick === void 0 ? void 0 : onClick((_a = menu.id) !== null && _a !== void 0 ? _a : '');
+        }
+      };
+      return _jsx(Fragment, {
+        children: menu.href ? _jsx(TabButton, __assign({}, commonProps, {
+          href: menu.href,
+          target: menu.target
+        })) : _jsx(TabButton, __assign({}, commonProps))
+      }, menu.id);
+    })
+  }));
+};

package/dist/esm/src/components/tab/index.js

@@ -0,0 +1,3 @@
+export * from './HorizontalTab';
+export * from './TabButton';
+export * from './VerticalTab';

package/dist/types/assets/scripts/index.d.ts

@@ -1,2 +1,3 @@
 export * from './test';
+export * from './slider';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/assets/scripts/slider.d.ts

@@ -0,0 +1,42 @@
+export interface SliderOptions {
+    min: number;
+    max: number;
+    step: number;
+    value: number | [number, number];
+    onChange?: (value: number | [number, number]) => void;
+    labelPosition?: 'bottom' | 'top-floating';
+    disabled?: boolean;
+}
+export declare class Slider {
+    private element;
+    private options;
+    private activeHandle;
+    private isDragging;
+    private value;
+    private handleElements;
+    private progressElement;
+    private trackElement;
+    constructor(element: HTMLElement, options: SliderOptions);
+    private init;
+    private createHandle;
+    private updateHandlePositions;
+    private updateHandleClasses;
+    private updateAriaAttributes;
+    private getPositionFromValue;
+    private getValueFromPosition;
+    private handleInteractionStart;
+    private handleMouseDown;
+    private handleTouchStart;
+    private handleMouseMove;
+    private handleTouchMove;
+    private handleMouseUp;
+    private handleTouchEnd;
+    private updateValueFromClientX;
+    private notifyChange;
+    setValue(value: number | [number, number]): void;
+    getValue(): number | [number, number];
+    disable(): void;
+    enable(): void;
+    destroy(): void;
+}
+//# sourceMappingURL=slider.d.ts.map