@teambit/design.ui.time.duration 0.0.0-4b70afb0583128596ed0666f6ffe46ad441c5df7

package/dist/duration.d.ts

@@ -0,0 +1,5 @@
+import React, { HTMLAttributes } from 'react';
+export type DurationUiProps = {
+    time?: number;
+} & HTMLAttributes<HTMLDivElement>;
+export declare function DurationUi({ time, className, ...rest }: DurationUiProps): React.JSX.Element;

package/dist/duration.js

@@ -0,0 +1,34 @@
+"use strict";
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DurationUi = DurationUi;
+const react_1 = __importDefault(require("react"));
+const classnames_1 = __importDefault(require("classnames"));
+const base_ui_time_duration_1 = require("@teambit/base-ui.time.duration");
+const base_ui_elements_icon_1 = require("@teambit/base-ui.elements.icon");
+const design_ui_styles_ellipsis_1 = require("@teambit/design.ui.styles.ellipsis");
+const duration_module_scss_1 = __importDefault(require("./duration.module.scss"));
+function DurationUi(_a) {
+    var { time, className } = _a, rest = __rest(_a, ["time", "className"]);
+    if (!time)
+        return null;
+    return (react_1.default.createElement("div", Object.assign({}, rest, { className: (0, classnames_1.default)(duration_module_scss_1.default.duration, design_ui_styles_ellipsis_1.ellipsis, className) }),
+        react_1.default.createElement(base_ui_elements_icon_1.BaseIcon, { of: "bitcon-Ripple-duration" }),
+        react_1.default.createElement("span", null, "Duration:"),
+        "\u00A0",
+        react_1.default.createElement(base_ui_time_duration_1.Duration, { time: time })));
+}
+//# sourceMappingURL=duration.js.map

package/dist/duration.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"duration.js","sourceRoot":"","sources":["../duration.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAWA,gCASC;AApBD,kDAA8C;AAC9C,4DAAoC;AACpC,0EAA0D;AAC1D,0EAA0D;AAC1D,kFAA8D;AAC9D,kFAA4C;AAM5C,SAAgB,UAAU,CAAC,EAA6C;QAA7C,EAAE,IAAI,EAAE,SAAS,OAA4B,EAAvB,IAAI,cAA1B,qBAA4B,CAAF;IACnD,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IACvB,OAAO,CACL,uDAAS,IAAI,IAAE,SAAS,EAAE,IAAA,oBAAU,EAAC,8BAAM,CAAC,QAAQ,EAAE,oCAAQ,EAAE,SAAS,CAAC;QACxE,8BAAC,gCAAQ,IAAC,EAAE,EAAC,wBAAwB,GAAG;QACxC,wDAAsB;;QACtB,8BAAC,gCAAQ,IAAC,IAAI,EAAE,IAAI,GAAI,CACpB,CACP,CAAC;AACJ,CAAC"}

package/dist/duration.module.scss

@@ -0,0 +1,10 @@
+.duration {
+  display: flex;
+  align-items: center;
+  color: var(--bit-text-color-light, #6c707c);
+  font-size: 13px;
+  > span:first-child {
+    margin-right: 8px;
+    font-size: 16px;
+  }
+}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export { DurationUi } from './duration';
+export type { DurationUiProps } from './duration';

package/dist/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DurationUi = void 0;
+var duration_1 = require("./duration");
+Object.defineProperty(exports, "DurationUi", { enumerable: true, get: function () { return duration_1.DurationUi; } });
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":";;;AAAA,uCAAwC;AAA/B,sGAAA,UAAU,OAAA"}

package/dist/preview-1769610018586.js

@@ -0,0 +1,7 @@
+;
+;
+
+export const compositions = [];
+export const overview = [];
+
+export const compositions_metadata = {"compositions":[]};

package/duration.module.scss

@@ -0,0 +1,10 @@
+.duration {
+  display: flex;
+  align-items: center;
+  color: var(--bit-text-color-light, #6c707c);
+  font-size: 13px;
+  > span:first-child {
+    margin-right: 8px;
+    font-size: 16px;
+  }
+}

package/duration.tsx

@@ -0,0 +1,21 @@
+import React, { HTMLAttributes } from 'react';
+import classNames from 'classnames';
+import { Duration } from '@teambit/base-ui.time.duration';
+import { BaseIcon } from '@teambit/base-ui.elements.icon';
+import { ellipsis } from '@teambit/design.ui.styles.ellipsis';
+import styles from './duration.module.scss';
+
+export type DurationUiProps = {
+  time?: number;
+} & HTMLAttributes<HTMLDivElement>;
+
+export function DurationUi({ time, className, ...rest }: DurationUiProps) {
+  if (!time) return null;
+  return (
+    <div {...rest} className={classNames(styles.duration, ellipsis, className)}>
+      <BaseIcon of="bitcon-Ripple-duration" />
+      <span>Duration:</span>&nbsp;
+      <Duration time={time} />
+    </div>
+  );
+}

package/index.ts

@@ -0,0 +1,2 @@
+export { DurationUi } from './duration';
+export type { DurationUiProps } from './duration';

package/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@teambit/design.ui.time.duration",
+  "version": "0.0.0-4b70afb0583128596ed0666f6ffe46ad441c5df7",
+  "homepage": "https://bit.cloud/teambit/design/ui/time/duration",
+  "main": "dist/index.js",
+  "componentId": {
+    "scope": "teambit.design",
+    "name": "ui/time/duration",
+    "version": "4b70afb0583128596ed0666f6ffe46ad441c5df7"
+  },
+  "dependencies": {
+    "classnames": "2.3.1",
+    "core-js": "^3.0.0",
+    "@teambit/base-ui.elements.icon": "1.0.0",
+    "@teambit/base-ui.time.duration": "0.1.0",
+    "@teambit/design.ui.styles.ellipsis": "0.0.344"
+  },
+  "devDependencies": {
+    "@types/react": "^17.0.8",
+    "@types/node": "12.20.4",
+    "@types/react-dom": "^17.0.5",
+    "@types/jest": "^26.0.0",
+    "@babel/runtime": "7.20.0",
+    "@types/testing-library__jest-dom": "5.9.5",
+    "@teambit/design.envs.react": "2.0.10"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0 || ^17.0.0"
+  },
+  "license": "SEE LICENSE IN UNLICENSED",
+  "optionalDependencies": {},
+  "peerDependenciesMeta": {},
+  "private": false
+}

package/types/asset.d.ts

@@ -0,0 +1,29 @@
+declare module '*.png' {
+  const value: any;
+  export = value;
+}
+declare module '*.svg' {
+  import type { FunctionComponent, SVGProps } from 'react';
+
+  export const ReactComponent: FunctionComponent<SVGProps<SVGSVGElement> & { title?: string }>;
+  const src: string;
+  export default src;
+}
+
+// @TODO Gilad
+declare module '*.jpg' {
+  const value: any;
+  export = value;
+}
+declare module '*.jpeg' {
+  const value: any;
+  export = value;
+}
+declare module '*.gif' {
+  const value: any;
+  export = value;
+}
+declare module '*.bmp' {
+  const value: any;
+  export = value;
+}

package/types/style.d.ts

@@ -0,0 +1,42 @@
+declare module '*.module.css' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+declare module '*.module.scss' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+declare module '*.module.sass' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.module.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.css' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.sass' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.scss' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.mdx' {
+  const component: any;
+  export default component;
+}