@scaleflex/ui-tw 0.0.1

package/core/check-box-group/check-box-group.styles.d.ts

@@ -0,0 +1,19 @@
+import type { CheckBoxSizeType } from '../check-box/check-box.props';
+import { LabelPositionType } from './check-box-group.props';
+declare const Styled: {
+    CheckBoxGroup: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+        ref?: ((instance: HTMLLabelElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLLabelElement> | null | undefined;
+    }>, never>, {
+        disabled?: boolean;
+    }>> & string;
+    Label: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+        ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+    }>, never>, {
+        $labelPosition: LabelPositionType | undefined;
+        disabled: boolean;
+        size: CheckBoxSizeType;
+    } & {
+        theme: import("styled-components").DefaultTheme;
+    }>> & string;
+};
+export default Styled;

package/core/check-box-group/check-box-group.styles.js

@@ -0,0 +1,33 @@
+import styled, { css } from 'styled-components';
+import { applyDisplayNames, generateClassNames } from '../../utils/functions';
+import { Color as PColor } from '../../utils/types/palette';
+import StyledCheckbox from '../check-box/check-box.styles';
+import { Size } from '../check-box/types';
+import { sizeCheckboxGroupMixin } from './check-box-group.mixin';
+var baseClassName = 'CheckBoxGroup';
+var Label = /*#__PURE__*/styled.span.attrs({
+  className: generateClassNames(baseClassName, 'Label')
+}).withConfig({
+  componentId: "sc-h0nj0z-0"
+})(function (_ref) {
+  var theme = _ref.theme,
+    _ref$$labelPosition = _ref.$labelPosition,
+    $labelPosition = _ref$$labelPosition === void 0 ? 'after' : _ref$$labelPosition,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? Size.Sm : _ref$size,
+    disabled = _ref.disabled;
+  return css(["display:inline-block;align-items:center;", " ", ":4px;color:", ";cursor:", ";white-space:nowrap;text-overflow:ellipsis;overflow:hidden;"], sizeCheckboxGroupMixin[size], "margin-".concat($labelPosition === 'after' ? 'left' : 'right'), theme.palette[PColor.TextPrimary], disabled ? 'default' : 'pointer');
+});
+var CheckBoxGroup = /*#__PURE__*/styled.label.attrs({
+  className: generateClassNames(baseClassName, 'root')
+}).withConfig({
+  componentId: "sc-h0nj0z-1"
+})(function (_ref2) {
+  var disabled = _ref2.disabled;
+  return css(["position:relative;display:inline-flex;column-gap:4px;align-items:center;max-width:100%;cursor:", ";&:hover{", "{", "}}"], disabled ? 'default' : 'pointer', StyledCheckbox.UnCheckedIcon, !disabled && css(["display:flex;"]));
+});
+var Styled = applyDisplayNames({
+  CheckBoxGroup: CheckBoxGroup,
+  Label: Label
+});
+export default Styled;

package/core/check-box-group/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './check-box-group.component';
+export type { CheckBoxGroupProps } from './check-box-group.props';

package/core/check-box-group/index.js

@@ -0,0 +1 @@
+export { default } from './check-box-group.component';

package/core/check-box-group/types/index.d.ts

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

package/core/check-box-group/types/index.js

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

package/core/check-box-group/types/label-position.d.ts

@@ -0,0 +1,4 @@
+export declare const LabelPosition: {
+    readonly Before: "before";
+    readonly After: "after";
+};

package/core/check-box-group/types/label-position.js

@@ -0,0 +1,4 @@
+export var LabelPosition = {
+  Before: 'before',
+  After: 'after'
+};

package/core/cross-button/cross-button.component.d.ts

@@ -0,0 +1,3 @@
+import type { CrossButtonProps } from './cross-button.props';
+declare const CrossButton: ({ size, ref, className, ...rest }: CrossButtonProps) => JSX.Element;
+export default CrossButton;

package/core/cross-button/cross-button.component.js

@@ -0,0 +1,35 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["size", "ref", "className"];
+import CrossOutline from '@scaleflex/icons-tw/cross-outline';
+import { cn } from '@scaleflex/ui-tw/utils/functions/shadcn-utils';
+import React from 'react';
+import { Size } from './types';
+var getIconSize = function getIconSize(sizeName) {
+  switch (sizeName) {
+    case Size.Lg:
+      return 16;
+    case Size.Xs:
+      return 10;
+    case Size.Sm:
+    default:
+      return 12;
+  }
+};
+var CrossButton = function CrossButton(_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? Size.Lg : _ref$size,
+    ref = _ref.ref,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var crossButtonClasses = cn('flex box-content justify-center items-center cursor-pointer rounded-sm text-icons-secondary', 'hover:text-icons-primary hover:bg-background-hover', 'active:text-icons-primary-hover active:bg-background-active', size === Size.Lg ? 'p-3' : '', size === Size.Md ? 'p-2' : '', size === Size.Sm ? 'p-1.5' : '', size === Size.Xs ? 'p-1' : '', className);
+  return /*#__PURE__*/React.createElement("button", _extends({
+    className: crossButtonClasses,
+    type: "button"
+  }, rest, {
+    ref: ref
+  }), /*#__PURE__*/React.createElement(CrossOutline, {
+    size: getIconSize(size)
+  }));
+};
+export default CrossButton;

package/core/cross-button/cross-button.props.d.ts

@@ -0,0 +1,8 @@
+import type { Values } from '../../utils/types';
+import { Size } from './types';
+export type CrossButtonSizeType = Values<typeof Size>;
+export interface CrossButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
+    className?: string;
+    size?: CrossButtonSizeType;
+    ref?: React.Ref<HTMLButtonElement>;
+}

package/core/cross-button/cross-button.props.js

@@ -0,0 +1 @@
+export {};

package/core/cross-button/cross-button.styles.d.ts

@@ -0,0 +1,9 @@
+import type { CrossButtonProps } from './cross-button.props';
+declare const Styled: {
+    CrossButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+    }>, never>, CrossButtonProps & {
+        theme: import("styled-components").DefaultTheme;
+    }>> & string;
+};
+export default Styled;

package/core/cross-button/cross-button.styles.js

@@ -0,0 +1,21 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import styled, { css } from 'styled-components';
+import { applyDisplayNames, generateClassNames } from '../../utils/functions';
+import { Color as PaletteColor } from '../../utils/types/palette';
+import { Size } from './types';
+var baseClassName = 'CrossButton';
+var crossButtonPaddingMixin = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, Size.Xs, css(["padding:5px;height:20px;"])), Size.Sm, css(["padding:6px;height:24px;"])), Size.Md, css(["padding:9px;"])), Size.Lg, css(["padding:12px;"]));
+var CrossButton = /*#__PURE__*/styled.button.attrs({
+  className: generateClassNames(baseClassName, 'root')
+}).withConfig({
+  componentId: "sc-1etvzpc-0"
+})(function (_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? Size.Lg : _ref$size,
+    theme = _ref.theme;
+  return css(["display:flex;justify-content:center;align-items:center;cursor:pointer;border-radius:4px;", " color:", ";background:transparent;border:none;transition:all 100ms ease-out;&:hover{color:", ";background:", ";}&:active{color:", ";background:", ";}"], crossButtonPaddingMixin[size], theme.palette[PaletteColor.IconsSecondary], theme.palette[PaletteColor.IconsPrimary], theme.palette[PaletteColor.BackgroundHover], theme.palette[PaletteColor.IconsPrimaryHover], theme.palette[PaletteColor.BackgroundActive]);
+});
+var Styled = applyDisplayNames({
+  CrossButton: CrossButton
+});
+export default Styled;

package/core/cross-button/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './cross-button.component';
+export type { CrossButtonProps } from './cross-button.props';

package/core/cross-button/index.js

@@ -0,0 +1 @@
+export { default } from './cross-button.component';

package/core/cross-button/types/index.d.ts

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

package/core/cross-button/types/index.js

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

package/core/cross-button/types/size.d.ts

@@ -0,0 +1,6 @@
+export declare const Size: {
+    readonly Xs: "xs";
+    readonly Sm: "sm";
+    readonly Md: "md";
+    readonly Lg: "lg";
+};

package/core/cross-button/types/size.js

@@ -0,0 +1,6 @@
+export var Size = {
+  Xs: 'xs',
+  Sm: 'sm',
+  Md: 'md',
+  Lg: 'lg'
+};

package/core/dot/dot.component.d.ts

@@ -0,0 +1,3 @@
+import type { DotProps } from './dot.props';
+declare const Dot: ({ active, ref, ...rest }: DotProps) => JSX.Element;
+export default Dot;

package/core/dot/dot.component.js

@@ -0,0 +1,17 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["active", "ref"];
+import { cn } from '@scaleflex/ui-tw/utils/functions/shadcn-utils';
+import React from 'react';
+var Dot = function Dot(_ref) {
+  var _ref$active = _ref.active,
+    active = _ref$active === void 0 ? false : _ref$active,
+    ref = _ref.ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var dotWraperClasses = cn('relative inline-flex items-center justify-center w-1.5 h-1.5 rounded-full border-1 border-solid border-transparent transition-colors duration-100 ease-out bg-borders-primary-stateless', "".concat(active ? 'bg-accent-primary' : ''));
+  return /*#__PURE__*/React.createElement("span", _extends({
+    className: dotWraperClasses,
+    ref: ref
+  }, rest));
+};
+export default Dot;

package/core/dot/dot.props.d.ts

@@ -0,0 +1,4 @@
+export interface DotProps extends React.HTMLAttributes<HTMLSpanElement> {
+    active?: boolean;
+    ref?: React.Ref<HTMLSpanElement>;
+}

package/core/dot/dot.props.js

@@ -0,0 +1 @@
+export {};

package/core/dot/dot.styles.d.ts

@@ -0,0 +1,18 @@
+declare const Styled: {
+    Dot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+        ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+    }>, never>, {
+        $active: boolean;
+    } & {
+        theme: import("styled-components").DefaultTheme;
+    }>> & string;
+    Icon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+        ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+    }>, never>, {
+        $visible: boolean;
+        $on?: boolean;
+    } & {
+        theme: import("styled-components").DefaultTheme;
+    }>> & string;
+};
+export default Styled;

package/core/dot/dot.styles.js

@@ -0,0 +1,32 @@
+import styled, { css } from 'styled-components';
+import { applyDisplayNames, generateClassNames } from '../../utils/functions';
+import { Color as PColor } from '../../utils/types/palette';
+var baseClassName = 'Dot';
+var transitionDuration = 100;
+var Icon = /*#__PURE__*/styled.span.attrs({
+  className: generateClassNames(baseClassName, 'Icon')
+}).withConfig({
+  componentId: "sc-q9gkc6-0"
+})(function (_ref) {
+  var _ref$$visible = _ref.$visible,
+    $visible = _ref$$visible === void 0 ? false : _ref$$visible,
+    _ref$$on = _ref.$on,
+    $on = _ref$$on === void 0 ? false : _ref$$on,
+    palette = _ref.theme.palette;
+  return css(["position:absolute;top:0;left:0;display:inline-flex;align-items:center;justify-content:center;transition:opacity ", "ms ease-out;opacity:", ";color:", ";"], transitionDuration, $visible ? 1 : 0, palette[$on ? PColor.AccentPrimary : PColor.BordersStrong]);
+});
+var Dot = /*#__PURE__*/styled.span.attrs({
+  className: generateClassNames(baseClassName, 'root')
+}).withConfig({
+  componentId: "sc-q9gkc6-1"
+})(function (_ref2) {
+  var _ref2$$active = _ref2.$active,
+    $active = _ref2$$active === void 0 ? false : _ref2$$active,
+    theme = _ref2.theme;
+  return css(["position:relative;display:inline-flex;align-items:center;justify-content:center;width:6px;height:6px;transition:background-color ", "ms ease-out;border:1px solid transparent;border-radius:50%;", ";"], transitionDuration, $active && "background-color: ".concat(theme.palette[PColor.AccentPrimary]));
+});
+var Styled = applyDisplayNames({
+  Dot: Dot,
+  Icon: Icon
+});
+export default Styled;

package/core/dot/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './dot.component';
+export type { DotProps } from './dot.props';

package/core/dot/index.js

@@ -0,0 +1 @@
+export { default } from './dot.component';

package/core/dots-navigation/dots-navigation.component.d.ts

@@ -0,0 +1,3 @@
+import type { DotsNavigationProps } from './dots-navigation.props';
+declare const DotsNavigation: ({ activeItem, size, ref, ...rest }: DotsNavigationProps) => JSX.Element;
+export default DotsNavigation;

package/core/dots-navigation/dots-navigation.component.js

@@ -0,0 +1,24 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["activeItem", "size", "ref"];
+import React from 'react';
+import Dot from '../dot';
+var DotsNavigation = function DotsNavigation(_ref) {
+  var _ref$activeItem = _ref.activeItem,
+    activeItem = _ref$activeItem === void 0 ? 0 : _ref$activeItem,
+    size = _ref.size,
+    ref = _ref.ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var finalDots = [];
+  for (var i = 0; i < size; i++) {
+    finalDots.push(/*#__PURE__*/React.createElement(Dot, {
+      key: i,
+      active: activeItem > -1 && i <= activeItem
+    }));
+  }
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "flex gap-3",
+    ref: ref
+  }, rest), finalDots);
+};
+export default DotsNavigation;

package/core/dots-navigation/dots-navigation.props.d.ts

@@ -0,0 +1,5 @@
+export interface DotsNavigationProps extends React.HTMLAttributes<HTMLDivElement> {
+    activeItem?: number;
+    size: number;
+    ref?: React.Ref<HTMLDivElement>;
+}

package/core/dots-navigation/dots-navigation.props.js

@@ -0,0 +1 @@
+export {};

package/core/dots-navigation/dots-navigation.styles.d.ts

@@ -0,0 +1,6 @@
+declare const Styled: {
+    DotsNavigation: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+    }>, never>, never>> & string;
+};
+export default Styled;

package/core/dots-navigation/dots-navigation.styles.js

@@ -0,0 +1,15 @@
+import styled, { css } from 'styled-components';
+import { applyDisplayNames, generateClassNames } from '../../utils/functions';
+import DotStyled from '../dot/dot.styles';
+var baseClassName = 'DotsNavigation';
+var DotsNavigation = /*#__PURE__*/styled.div.attrs({
+  className: generateClassNames(baseClassName, 'root')
+}).withConfig({
+  componentId: "sc-1onrpl-0"
+})(function () {
+  return css(["", "{margin-left:12px;&:first-child{margin-left:0;}}"], DotStyled.Dot);
+});
+var Styled = applyDisplayNames({
+  DotsNavigation: DotsNavigation
+});
+export default Styled;

package/core/dots-navigation/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './dots-navigation.component';
+export type { DotsNavigationProps } from './dots-navigation.props';

package/core/dots-navigation/index.js

@@ -0,0 +1 @@
+export { default } from './dots-navigation.component';

package/core/input/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './input.component';
+export type { InputProps } from './input.props';

package/core/input/index.js

@@ -0,0 +1 @@
+export { default } from './input.component';

package/core/input/input.component.d.ts

@@ -0,0 +1,3 @@
+import type { InputProps } from './input.props';
+declare const Input: ({ inputType, children, iconStart, iconEnd, iconChange, inputActions, clearIcon, iconClickStart, iconClickEnd, clearIconClick, size, className, style, fullWidth, readOnly, disabled, hideCopyIcon, focusOnMount, focusOnClick, isEllipsis, copyTextMessage, copySuccessIcon, error, renderTags, showPlaceholder, InputProps: InputPropsData, ref, ...rest }: InputProps) => JSX.Element;
+export default Input;