@elicecontents/content-ui 1.0.3 → 1.0.4

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 (65) hide show
  1. package/cjs/components/Modal/Modal.d.ts +9 -0
  2. package/cjs/components/Modal/Modal.js +58 -0
  3. package/cjs/components/Modal/index.d.ts +2 -0
  4. package/cjs/components/Modal/index.js +7 -0
  5. package/cjs/components/answer-feedback/Correct.js +2 -2
  6. package/cjs/components/answer-feedback/Incorrect.js +2 -2
  7. package/cjs/components/chat/Chat.d.ts +4 -2
  8. package/cjs/components/chat/Chat.js +61 -52
  9. package/cjs/components/index.d.ts +1 -0
  10. package/cjs/components/index.js +2 -0
  11. package/cjs/components/layout/Footer/LayoutFooterPaging.js +23 -24
  12. package/cjs/components/layout/Footer/LayoutFooterSubmit.d.ts +7 -2
  13. package/cjs/components/layout/Footer/LayoutFooterSubmit.js +11 -3
  14. package/cjs/components/layout/Footer/index.d.ts +1 -0
  15. package/cjs/components/layout/Layout.d.ts +3 -2
  16. package/cjs/components/layout/Layout.js +50 -54
  17. package/cjs/components/layout/layout-pagination/LayoutPagination.js +4 -4
  18. package/cjs/components/pagination-button/PaginationButton.d.ts +1 -0
  19. package/cjs/components/pagination-button/PaginationButton.js +35 -14
  20. package/cjs/components/question/Question.js +7 -7
  21. package/cjs/components/tokenColorTemporary.js +2 -2
  22. package/cjs/icons/ReadyRecord.d.ts +6 -0
  23. package/cjs/icons/ReadyRecord.js +33 -0
  24. package/cjs/icons/RecordPause.d.ts +3 -0
  25. package/cjs/icons/RecordPause.js +30 -0
  26. package/cjs/icons/RecordPlay.d.ts +3 -0
  27. package/cjs/icons/RecordPlay.js +28 -0
  28. package/cjs/icons/Recording.d.ts +5 -0
  29. package/cjs/icons/Recording.js +37 -0
  30. package/cjs/icons/index.d.ts +4 -0
  31. package/cjs/icons/index.js +8 -0
  32. package/cjs/index.js +10 -0
  33. package/es/components/Modal/Modal.d.ts +9 -0
  34. package/es/components/Modal/Modal.js +50 -0
  35. package/es/components/Modal/index.d.ts +2 -0
  36. package/es/components/Modal/index.js +1 -0
  37. package/es/components/answer-feedback/Correct.js +2 -2
  38. package/es/components/answer-feedback/Incorrect.js +2 -2
  39. package/es/components/chat/Chat.d.ts +4 -2
  40. package/es/components/chat/Chat.js +61 -52
  41. package/es/components/index.d.ts +1 -0
  42. package/es/components/index.js +1 -0
  43. package/es/components/layout/Footer/LayoutFooterPaging.js +24 -25
  44. package/es/components/layout/Footer/LayoutFooterSubmit.d.ts +7 -2
  45. package/es/components/layout/Footer/LayoutFooterSubmit.js +11 -3
  46. package/es/components/layout/Footer/index.d.ts +1 -0
  47. package/es/components/layout/Layout.d.ts +3 -2
  48. package/es/components/layout/Layout.js +50 -54
  49. package/es/components/layout/layout-pagination/LayoutPagination.js +4 -4
  50. package/es/components/pagination-button/PaginationButton.d.ts +1 -0
  51. package/es/components/pagination-button/PaginationButton.js +35 -14
  52. package/es/components/question/Question.js +8 -8
  53. package/es/components/tokenColorTemporary.js +2 -2
  54. package/es/icons/ReadyRecord.d.ts +6 -0
  55. package/es/icons/ReadyRecord.js +29 -0
  56. package/es/icons/RecordPause.d.ts +3 -0
  57. package/es/icons/RecordPause.js +26 -0
  58. package/es/icons/RecordPlay.d.ts +3 -0
  59. package/es/icons/RecordPlay.js +24 -0
  60. package/es/icons/Recording.d.ts +5 -0
  61. package/es/icons/Recording.js +33 -0
  62. package/es/icons/index.d.ts +4 -0
  63. package/es/icons/index.js +4 -0
  64. package/es/index.js +5 -0
  65. package/package.json +1 -1
@@ -1,6 +1,7 @@
1
1
  // This is using token colors of blue-purple theme of Elice UI Content
2
2
  // https://www.figma.com/design/dtsncp7RSV7wMqPf3jiCvf/Design-System?node-id=51-10973&node-type=SECTION&t=gCjy5t3c42ojVpyW-0
3
3
  // TODO: apply theme;
4
+ var primaryColor = '#5D6BB3';
4
5
  var secondaryColor = '#0A379B';
5
6
  var main200Color = '#BEC4E1';
6
7
  var main300Color = '#9EA6D1';
@@ -14,7 +15,6 @@ var textPrimaryColor = '#1E1E1E';
14
15
  var textSecondaryColor = '#363643';
15
16
  var textTeriaryColor = '#525265';
16
17
  var textQuaternaryColor = '#9FA0B1';
17
- var point3Color = '#8F68F6';
18
18
  var KeyElementaryBg = '#9BCAFF';
19
19
 
20
- export { KeyElementaryBg, gray100Color, gray200Color, gray300Color, gray400Color, gray50Color, main200Color, main300Color, main400Color, point3Color, secondaryColor, textPrimaryColor, textQuaternaryColor, textSecondaryColor, textTeriaryColor };
20
+ export { KeyElementaryBg, gray100Color, gray200Color, gray300Color, gray400Color, gray50Color, main200Color, main300Color, main400Color, primaryColor, secondaryColor, textPrimaryColor, textQuaternaryColor, textSecondaryColor, textTeriaryColor };
@@ -0,0 +1,6 @@
1
+ import { IconProps } from "./_types";
2
+ declare const ReadyRecord: ({ size, outerColor, innerColor, ...other }: IconProps & {
3
+ outerColor?: string | undefined;
4
+ innerColor?: string | undefined;
5
+ }) => import("react/jsx-runtime").JSX.Element;
6
+ export default ReadyRecord;
@@ -0,0 +1,29 @@
1
+ import { __rest } from 'tslib';
2
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
+
4
+ var ReadyRecord = function ReadyRecord(_a) {
5
+ var _a$size = _a.size,
6
+ size = _a$size === void 0 ? 21 : _a$size,
7
+ _a$outerColor = _a.outerColor,
8
+ outerColor = _a$outerColor === void 0 ? "#FFF1F1" : _a$outerColor,
9
+ _a$innerColor = _a.innerColor,
10
+ innerColor = _a$innerColor === void 0 ? "white" : _a$innerColor,
11
+ other = __rest(_a, ["size", "outerColor", "innerColor"]);
12
+ return jsxs("svg", Object.assign({
13
+ width: size,
14
+ height: size,
15
+ viewBox: "0 0 21 21",
16
+ fill: "none",
17
+ xmlns: "http://www.w3.org/2000/svg"
18
+ }, other, {
19
+ children: [jsx("path", {
20
+ d: "M10.5 1.75C8.17936 1.75 5.95376 2.67187 4.31282 4.31282C2.67187 5.95376 1.75 8.17936 1.75 10.5C1.75 12.8206 2.67187 15.0462 4.31282 16.6872C5.95376 18.3281 8.17936 19.25 10.5 19.25C12.8206 19.25 15.0462 18.3281 16.6872 16.6872C18.3281 15.0462 19.25 12.8206 19.25 10.5C19.25 8.17936 18.3281 5.95376 16.6872 4.31282C15.0462 2.67187 12.8206 1.75 10.5 1.75ZM10.5 18C6.365 18 3 14.635 3 10.5C3 6.365 6.365 3 10.5 3C14.635 3 18 6.365 18 10.5C18 14.635 14.635 18 10.5 18Z",
21
+ fill: outerColor
22
+ }), jsx("path", {
23
+ d: "M10.5 15.5C13.2614 15.5 15.5 13.2614 15.5 10.5C15.5 7.73858 13.2614 5.5 10.5 5.5C7.73858 5.5 5.5 7.73858 5.5 10.5C5.5 13.2614 7.73858 15.5 10.5 15.5Z",
24
+ fill: innerColor
25
+ })]
26
+ }));
27
+ };
28
+
29
+ export { ReadyRecord as default };
@@ -0,0 +1,3 @@
1
+ import { IconProps } from "./_types";
2
+ declare const RecordPause: ({ size, color, ...other }: IconProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default RecordPause;
@@ -0,0 +1,26 @@
1
+ import { __rest } from 'tslib';
2
+ import { jsx } from 'react/jsx-runtime';
3
+
4
+ var RecordPause = function RecordPause(_a) {
5
+ var _a$size = _a.size,
6
+ size = _a$size === void 0 ? 29 : _a$size,
7
+ _a$color = _a.color,
8
+ color = _a$color === void 0 ? "white" : _a$color,
9
+ other = __rest(_a, ["size", "color"]);
10
+ return jsx("svg", Object.assign({
11
+ width: size,
12
+ height: size * (28 / 29),
13
+ viewBox: "0 0 29 28",
14
+ fill: "none",
15
+ xmlns: "http://www.w3.org/2000/svg"
16
+ }, other, {
17
+ children: jsx("path", {
18
+ fillRule: "evenodd",
19
+ clipRule: "evenodd",
20
+ d: "M20 4.83333H9C6.97496 4.83333 5.33333 6.47496 5.33333 8.5V19.5C5.33333 21.525 6.97496 23.1667 9 23.1667H20C22.025 23.1667 23.6667 21.525 23.6667 19.5V8.5C23.6667 6.47496 22.025 4.83333 20 4.83333ZM9 3C5.96243 3 3.5 5.46243 3.5 8.5V19.5C3.5 22.5376 5.96243 25 9 25H20C23.0376 25 25.5 22.5376 25.5 19.5V8.5C25.5 5.46243 23.0376 3 20 3H9Z",
21
+ fill: color
22
+ })
23
+ }));
24
+ };
25
+
26
+ export { RecordPause as default };
@@ -0,0 +1,3 @@
1
+ import { IconProps } from "./_types";
2
+ declare const RecordPlay: ({ size, color, ...other }: IconProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default RecordPlay;
@@ -0,0 +1,24 @@
1
+ import { __rest } from 'tslib';
2
+ import { jsx } from 'react/jsx-runtime';
3
+
4
+ var RecordPlay = function RecordPlay(_a) {
5
+ var _a$size = _a.size,
6
+ size = _a$size === void 0 ? 28 : _a$size,
7
+ _a$color = _a.color,
8
+ color = _a$color === void 0 ? "white" : _a$color,
9
+ other = __rest(_a, ["size", "color"]);
10
+ return jsx("svg", Object.assign({
11
+ width: size,
12
+ height: size,
13
+ viewBox: "0 0 28 28",
14
+ fill: "none",
15
+ xmlns: "http://www.w3.org/2000/svg"
16
+ }, other, {
17
+ children: jsx("path", {
18
+ d: "M23.1161 16.0649C23.5038 15.8516 23.8228 15.5325 24.0361 15.1448C24.6571 14.0157 24.2452 12.5969 23.1161 11.9759L6.95781 3.08882C6.61331 2.89934 6.22651 2.79999 5.83333 2.79999C4.54467 2.79999 3.5 3.84466 3.5 5.13332V22.9074C3.5 23.3006 3.59935 23.6874 3.78883 24.0319C4.40986 25.161 5.82866 25.5729 6.95781 24.9519L23.1161 16.0649ZM5.54167 4.63165L22.5963 14.0133L5.54167 23.3942V4.63165Z",
19
+ fill: color
20
+ })
21
+ }));
22
+ };
23
+
24
+ export { RecordPlay as default };
@@ -0,0 +1,5 @@
1
+ import { IconProps } from "./_types";
2
+ declare const Recording: ({ size, color, squareColor, ...other }: IconProps & {
3
+ squareColor?: string | undefined;
4
+ }) => import("react/jsx-runtime").JSX.Element;
5
+ export default Recording;
@@ -0,0 +1,33 @@
1
+ import { __rest } from 'tslib';
2
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
+
4
+ var Recording = function Recording(_a) {
5
+ var _a$size = _a.size,
6
+ size = _a$size === void 0 ? 21 : _a$size,
7
+ _a$color = _a.color,
8
+ color = _a$color === void 0 ? "#FFB1AF" : _a$color,
9
+ _a$squareColor = _a.squareColor,
10
+ squareColor = _a$squareColor === void 0 ? "#FF5D58" : _a$squareColor,
11
+ other = __rest(_a, ["size", "color", "squareColor"]);
12
+ return jsxs("svg", Object.assign({
13
+ width: size,
14
+ height: size,
15
+ viewBox: "0 0 21 21",
16
+ fill: "none",
17
+ xmlns: "http://www.w3.org/2000/svg"
18
+ }, other, {
19
+ children: [jsx("path", {
20
+ d: "M10.5 1.75C8.17936 1.75 5.95376 2.67187 4.31282 4.31282C2.67187 5.95376 1.75 8.17936 1.75 10.5C1.75 12.8206 2.67187 15.0462 4.31282 16.6872C5.95376 18.3281 8.17936 19.25 10.5 19.25C12.8206 19.25 15.0462 18.3281 16.6872 16.6872C18.3281 15.0462 19.25 12.8206 19.25 10.5C19.25 8.17936 18.3281 5.95376 16.6872 4.31282C15.0462 2.67187 12.8206 1.75 10.5 1.75ZM10.5 18C6.365 18 3 14.635 3 10.5C3 6.365 6.365 3 10.5 3C14.635 3 18 6.365 18 10.5C18 14.635 14.635 18 10.5 18Z",
21
+ fill: color
22
+ }), jsx("rect", {
23
+ x: "6.3335",
24
+ y: "6.33337",
25
+ width: "8.33333",
26
+ height: "8.33333",
27
+ rx: "2",
28
+ fill: squareColor
29
+ })]
30
+ }));
31
+ };
32
+
33
+ export { Recording as default };
@@ -12,3 +12,7 @@ export { default as QuestionBubble } from './QuestionBubble';
12
12
  export { default as SearchIcon } from './SearchIcon';
13
13
  export { default as MoreColumn } from './MoreColumn';
14
14
  export { default as NumbersIcon } from './Numbers';
15
+ export { default as RecordPause } from './RecordPause';
16
+ export { default as Recording } from './Recording';
17
+ export { default as ReadyRecord } from './ReadyRecord';
18
+ export { default as RecordPlay } from './RecordPlay';
package/es/icons/index.js CHANGED
@@ -12,3 +12,7 @@ export { default as QuestionBubble } from './QuestionBubble.js';
12
12
  export { default as SearchIcon } from './SearchIcon.js';
13
13
  export { default as MoreColumn } from './MoreColumn.js';
14
14
  export { default as NumbersIcon } from './Numbers.js';
15
+ export { default as RecordPause } from './RecordPause.js';
16
+ export { default as Recording } from './Recording.js';
17
+ export { default as ReadyRecord } from './ReadyRecord.js';
18
+ export { default as RecordPlay } from './RecordPlay.js';
package/es/index.js CHANGED
@@ -16,6 +16,7 @@ export { default as AIDTTypography } from './components/AIDTTypography/AIDTTypog
16
16
  export { default as EliceImage } from './components/AdaptiveImage/AdaptiveImage.js';
17
17
  export { default as EliceSubButton } from './components/subtitle-button/SubtitleButton.js';
18
18
  export { default as BaseInput } from './components/base-input/BaseInput.js';
19
+ export { default as EliceModal } from './components/Modal/Modal.js';
19
20
  export { default as ArrowLeft } from './icons/ArrowLeft.js';
20
21
  export { default as ArrowRight } from './icons/ArrowRight.js';
21
22
  export { default as Close } from './icons/Close.js';
@@ -30,6 +31,10 @@ export { default as QuestionBubble } from './icons/QuestionBubble.js';
30
31
  export { default as SearchIcon } from './icons/SearchIcon.js';
31
32
  export { default as MoreColumn } from './icons/MoreColumn.js';
32
33
  export { default as NumbersIcon } from './icons/Numbers.js';
34
+ export { default as RecordPause } from './icons/RecordPause.js';
35
+ export { default as Recording } from './icons/Recording.js';
36
+ export { default as ReadyRecord } from './icons/ReadyRecord.js';
37
+ export { default as RecordPlay } from './icons/RecordPlay.js';
33
38
  export { createAIDTTheme } from './theme/createAIDTTheme.js';
34
39
  export { mint } from './tokens/colors/mint.js';
35
40
  export { bluepurple } from './tokens/colors/bluepurple.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elicecontents/content-ui",
3
- "version": "1.0.3",
3
+ "version": "1.0.4",
4
4
  "description": "A set of UI components for creating content of Elice",
5
5
  "author": "Elice <contact@elice.io>",
6
6
  "license": "UNLICENSED",