@cube-dev/ui-kit 0.0.0-canary-0f23ce0 → 0.0.0-canary-3efbd13

package/cjs/components/status/Spin/Cube.js

@@ -1,113 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Cube = void 0;
-const react_1 = require("react");
-const styled_components_1 = __importDefault(require("styled-components"));
-const fillByPosition = {
-    top: '#7a77ff',
-    right: '#727290',
-    bottom: '#ff6492',
-};
-exports.Cube = (0, react_1.memo)(styled_components_1.default.div.attrs(({ position }) => ({
-    role: 'presentation',
-    style: {
-        '--cube-spin-animation-name': `cube-spin-${position}`,
-        '--cube-spin-fill': fillByPosition[position],
-    },
-})) `
-  --cube-spin-cube-border-width: calc(4 / 100 * var(--cube-spin-size));
-  --cube-spin-cube-border-compensation: calc(
-    -1 * (var(--cube-spin-cube-border-width))
-  );
-  --cube-spin-cube-size: calc(
-    (100% - 2 * var(--cube-spin-cube-border-width)) / 2
-  );
-
-  box-sizing: content-box;
-  position: absolute;
-  top: var(--cube-spin-cube-border-compensation);
-  left: var(--cube-spin-cube-border-compensation);
-  width: var(--cube-spin-cube-size);
-  height: var(--cube-spin-cube-size);
-  border: var(--cube-spin-cube-border-width) solid transparent;
-  overflow: hidden;
-  contain: size layout style paint;
-
-  animation-name: var(--cube-spin-animation-name);
-  animation-duration: 0.5s;
-  animation-iteration-count: infinite;
-  animation-timing-function: cubic-bezier(0.53, 0.11, 0.32, 0.84);
-
-  @media (prefers-reduced-motion) {
-    animation-play-state: paused;
-  }
-
-  &::before {
-    --cube-spin-cube-round-radius: calc((4 / 100) * var(--cube-spin-size));
-
-    content: '';
-    display: block;
-    width: 100%;
-    height: 100%;
-    border-radius: var(--cube-spin-cube-round-radius);
-
-    background-color: var(--cube-spin-fill);
-  }
-
-  @keyframes cube-spin-top {
-    0% {
-      transform: translate(0%, 0%);
-    }
-    33.3% {
-      transform: translate(100%, 0%);
-    }
-    66.6% {
-      transform: translate(100%, 0%);
-    }
-    100% {
-      transform: translate(100%, 0%);
-    }
-  }
-
-  @keyframes cube-spin-right {
-    0% {
-      transform: translate(100%, 100%);
-    }
-    33.3% {
-      transform: translate(100%, 100%);
-    }
-    66.6% {
-      transform: translate(100%, 100%);
-    }
-    100% {
-      transform: translate(0%, 100%);
-    }
-  }
-
-  @keyframes cube-spin-bottom {
-    0% {
-      transform: translate(0%, 100%);
-    }
-    33.3% {
-      transform: translate(0%, 100%);
-    }
-    66.6% {
-      transform: translate(0%, 0%);
-    }
-    100% {
-      transform: translate(0%, 0%);
-    }
-  }
-`);
-
-        

package/cjs/components/status/Spin/InternalSpinner.js

@@ -1,27 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InternalSpinner = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Cube_1 = require("./Cube");
-const SpinsContainer_1 = require("./SpinsContainer");
-const tasty_1 = require("../../../tasty");
-const SpinsBox = (0, tasty_1.tasty)({ styles: { position: 'relative', width: '100%' } });
-exports.InternalSpinner = (0, react_1.memo)(function InternalSpinner(props) {
-    const { size } = props;
-    return ((0, jsx_runtime_1.jsx)(SpinsContainer_1.SpinsContainer, { ownSize: CUBE_SIZE_MAP[size], children: (0, jsx_runtime_1.jsxs)(SpinsBox, { children: [(0, jsx_runtime_1.jsx)(Cube_1.Cube, { position: "top" }, void 0), (0, jsx_runtime_1.jsx)(Cube_1.Cube, { position: "right" }, void 0), (0, jsx_runtime_1.jsx)(Cube_1.Cube, { position: "bottom" }, void 0)] }, void 0) }, void 0));
-});
-const CUBE_SIZE_MAP = {
-    small: 3,
-    default: 4,
-    large: 6,
-};
-
-        

package/cjs/components/status/Spin/SpinsContainer.js

@@ -1,57 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SpinsContainer = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-exports.SpinsContainer = styled_components_1.default.div.attrs(({ ownSize }) => ({
-    role: 'presentation',
-    style: { '--cube-spin-size': `${ownSize * 8}px` },
-})) `
-  box-sizing: border-box;
-  position: relative;
-  display: inline-flex;
-  place-content: center;
-  padding: calc(10 / 100 * var(--cube-spin-size));
-  width: var(--cube-spin-size);
-  height: var(--cube-spin-size);
-  opacity: 0.8;
-  contain: size layout style paint;
-
-  animation: cube-spin-rotate 2s infinite steps(4);
-
-  @keyframes cube-spin-rotate {
-    0% {
-      transform: rotate(0deg);
-    }
-    100% {
-      transform: rotate(360deg);
-    }
-  }
-
-  @media (prefers-reduced-motion) {
-    animation: cube-spin-reduced-motion 2s infinite ease-in-out;
-
-    @keyframes cube-spin-reduced-motion {
-      0% {
-        opacity: 0.4;
-      }
-      50% {
-        opacity: 0.8;
-      }
-      100% {
-        opacity: 0.4;
-      }
-    }
-  }
-`;
-
-        

package/cjs/components/status/Spin/index.js

@@ -1,22 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Spin"), exports);
-
-        

package/cjs/components/status/Spin/types.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-
-        

package/cjs/components/status/index.js

@@ -1,23 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./Spin"), exports);
-__exportStar(require("./LoadingAnimation"), exports);
-
-        

package/es/components/status/LoadingAnimation/index.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-export { LoadingAnimation } from './LoadingAnimation';
-
-        

package/es/components/status/Spin/Cube.js

@@ -1,107 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-import { memo } from 'react';
-import styled from 'styled-components';
-const fillByPosition = {
-    top: '#7a77ff',
-    right: '#727290',
-    bottom: '#ff6492',
-};
-export const Cube = memo(styled.div.attrs(({ position }) => ({
-    role: 'presentation',
-    style: {
-        '--cube-spin-animation-name': `cube-spin-${position}`,
-        '--cube-spin-fill': fillByPosition[position],
-    },
-})) `
-  --cube-spin-cube-border-width: calc(4 / 100 * var(--cube-spin-size));
-  --cube-spin-cube-border-compensation: calc(
-    -1 * (var(--cube-spin-cube-border-width))
-  );
-  --cube-spin-cube-size: calc(
-    (100% - 2 * var(--cube-spin-cube-border-width)) / 2
-  );
-
-  box-sizing: content-box;
-  position: absolute;
-  top: var(--cube-spin-cube-border-compensation);
-  left: var(--cube-spin-cube-border-compensation);
-  width: var(--cube-spin-cube-size);
-  height: var(--cube-spin-cube-size);
-  border: var(--cube-spin-cube-border-width) solid transparent;
-  overflow: hidden;
-  contain: size layout style paint;
-
-  animation-name: var(--cube-spin-animation-name);
-  animation-duration: 0.5s;
-  animation-iteration-count: infinite;
-  animation-timing-function: cubic-bezier(0.53, 0.11, 0.32, 0.84);
-
-  @media (prefers-reduced-motion) {
-    animation-play-state: paused;
-  }
-
-  &::before {
-    --cube-spin-cube-round-radius: calc((4 / 100) * var(--cube-spin-size));
-
-    content: '';
-    display: block;
-    width: 100%;
-    height: 100%;
-    border-radius: var(--cube-spin-cube-round-radius);
-
-    background-color: var(--cube-spin-fill);
-  }
-
-  @keyframes cube-spin-top {
-    0% {
-      transform: translate(0%, 0%);
-    }
-    33.3% {
-      transform: translate(100%, 0%);
-    }
-    66.6% {
-      transform: translate(100%, 0%);
-    }
-    100% {
-      transform: translate(100%, 0%);
-    }
-  }
-
-  @keyframes cube-spin-right {
-    0% {
-      transform: translate(100%, 100%);
-    }
-    33.3% {
-      transform: translate(100%, 100%);
-    }
-    66.6% {
-      transform: translate(100%, 100%);
-    }
-    100% {
-      transform: translate(0%, 100%);
-    }
-  }
-
-  @keyframes cube-spin-bottom {
-    0% {
-      transform: translate(0%, 100%);
-    }
-    33.3% {
-      transform: translate(0%, 100%);
-    }
-    66.6% {
-      transform: translate(0%, 0%);
-    }
-    100% {
-      transform: translate(0%, 0%);
-    }
-  }
-`);
-
-        

package/es/components/status/Spin/InternalSpinner.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo } from 'react';
-import { Cube } from './Cube';
-import { SpinsContainer } from './SpinsContainer';
-import { tasty } from '../../../tasty';
-const SpinsBox = tasty({ styles: { position: 'relative', width: '100%' } });
-export const InternalSpinner = memo(function InternalSpinner(props) {
-    const { size } = props;
-    return (_jsx(SpinsContainer, { ownSize: CUBE_SIZE_MAP[size], children: _jsxs(SpinsBox, { children: [_jsx(Cube, { position: "top" }, void 0), _jsx(Cube, { position: "right" }, void 0), _jsx(Cube, { position: "bottom" }, void 0)] }, void 0) }, void 0));
-});
-const CUBE_SIZE_MAP = {
-    small: 3,
-    default: 4,
-    large: 6,
-};
-
-        

package/es/components/status/Spin/SpinsContainer.js

@@ -1,51 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-import styled from 'styled-components';
-export const SpinsContainer = styled.div.attrs(({ ownSize }) => ({
-    role: 'presentation',
-    style: { '--cube-spin-size': `${ownSize * 8}px` },
-})) `
-  box-sizing: border-box;
-  position: relative;
-  display: inline-flex;
-  place-content: center;
-  padding: calc(10 / 100 * var(--cube-spin-size));
-  width: var(--cube-spin-size);
-  height: var(--cube-spin-size);
-  opacity: 0.8;
-  contain: size layout style paint;
-
-  animation: cube-spin-rotate 2s infinite steps(4);
-
-  @keyframes cube-spin-rotate {
-    0% {
-      transform: rotate(0deg);
-    }
-    100% {
-      transform: rotate(360deg);
-    }
-  }
-
-  @media (prefers-reduced-motion) {
-    animation: cube-spin-reduced-motion 2s infinite ease-in-out;
-
-    @keyframes cube-spin-reduced-motion {
-      0% {
-        opacity: 0.4;
-      }
-      50% {
-        opacity: 0.8;
-      }
-      100% {
-        opacity: 0.4;
-      }
-    }
-  }
-`;
-
-        

package/es/components/status/Spin/index.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-export * from './Spin';
-
-        

package/es/components/status/Spin/types.js

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-export {};
-
-        

package/es/components/status/index.js

@@ -1,11 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-0f23ce0
- * Released under the MIT license.
- */
-
-export * from './Spin';
-export * from './LoadingAnimation';
-
-        

package/types/components/status/LoadingAnimation/index.d.ts

@@ -1,2 +0,0 @@
-export { LoadingAnimation } from './LoadingAnimation';
-export type { CubeLoadingAnimationProps } from './LoadingAnimation';

package/types/components/status/Spin/Cube.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const Cube: import("react").MemoExoticComponent<any>;

package/types/components/status/Spin/InternalSpinner.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import { InternalSpinnerProps } from './types';
-export declare const InternalSpinner: import("react").NamedExoticComponent<InternalSpinnerProps>;

package/types/components/status/Spin/SpinsContainer.d.ts

@@ -1 +0,0 @@
-export declare const SpinsContainer: any;

package/types/components/status/Spin/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Spin';
-export type { CubeSpinProps } from './types';

package/types/components/status/Spin/types.d.ts

@@ -1,23 +0,0 @@
-import { ReactNode } from 'react';
-import { Styles } from '../../../tasty';
-export declare type SpinSize = 'small' | 'default' | 'large';
-export declare type CubeSpinProps = {
-    /**
-     * Size of the spin.
-     * @default 'default'
-     */
-    size?: SpinSize;
-    /**
-     * Keep spinning while the flag is true, otherwise render it's children.
-     * @default true
-     */
-    spinning?: boolean;
-    children?: ReactNode;
-    styles?: Styles;
-};
-export declare type SpinCubeProps = {
-    position: 'top' | 'right' | 'bottom';
-};
-export declare type InternalSpinnerProps = {
-    size: SpinSize;
-};

package/types/components/status/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Spin';
-export * from './LoadingAnimation';