@telia-ace/knowledge-widget-bot-provider 0.0.1-alpha.48 → 0.0.1-alpha.50

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.
@@ -1,9 +1,6 @@
1
- import { Container } from '@webprovisions/platform';
2
1
  import { Message } from '../contract/model/conversation-api-model/message.model';
3
- import EntryInterface from '../interface/entry.interface';
4
2
  export default class ChatClient {
5
- entryInterface: EntryInterface;
6
- constructor(container: Container);
3
+ constructor();
7
4
  static initialize(user: any, agent: any): void;
8
5
  processMessageArrayAndStoreIt(messages: Message[]): Promise<void>;
9
6
  updateMessageArrayAndStoreIt(messages: Message[]): void;
@@ -24,11 +24,12 @@ export declare class ContactMethodClient {
24
24
  entryId: string;
25
25
  contactMethodId: string;
26
26
  }): void;
27
+ private getNewContactMethods;
27
28
  private handleContactMethodList;
28
29
  private handleSingleContactMethod;
29
30
  private submit;
30
31
  private removeForm;
31
32
  private printMessage;
32
- private loadContactMethods;
33
+ loadContactMethods(dataType: string, id?: string | undefined, guideId?: string | undefined): Promise<any>;
33
34
  private updateForm;
34
35
  }
@@ -25,13 +25,19 @@ import { useDispatch } from "@telia-ace/knowledge-widget-ui";
25
25
  const EntryContext = createContext({
26
26
  entryId: null
27
27
  });
28
- const ContactMethodItem = ({ contactMethod, className }) => {
28
+ const ContactMethodItem = ({ contactMethod, className, entry, embeded }) => {
29
+ console.log(embeded, !embeded && contactMethod.inline);
29
30
  const dispatch = useDispatch();
30
- const { entryId } = useContext(EntryContext);
31
+ let entryId;
32
+ if (!!entry) {
33
+ entryId = entry.entryId;
34
+ } else {
35
+ entryId = useContext(EntryContext).entryId;
36
+ }
31
37
  return /* @__PURE__ */ React.createElement(ContactMethod$1, __spreadProps(__spreadValues({
32
38
  className,
33
39
  onClick: (event) => {
34
- if (contactMethod.inline) {
40
+ if (embeded || contactMethod.inline) {
35
41
  event.preventDefault();
36
42
  dispatch("expand", {
37
43
  entryId,
@@ -48,6 +54,7 @@ const ContactMethodItem = ({ contactMethod, className }) => {
48
54
  };
49
55
  const ContactMethodList = (props) => {
50
56
  return /* @__PURE__ */ React.createElement(Fragment, null, props.contactMethodList.map((contactMethod) => /* @__PURE__ */ React.createElement(StyledContactMethod, {
57
+ embeded: props.embeded,
51
58
  key: contactMethod.id,
52
59
  type: props.type,
53
60
  contactMethod,
@@ -81,13 +88,16 @@ const ContactMethod = (props) => {
81
88
  }
82
89
  if (!methodList.length) {
83
90
  return /* @__PURE__ */ React.createElement(StyledContactMethodItem, {
91
+ embeded: !!props.guideId,
84
92
  type,
85
- contactMethod: methodList
93
+ contactMethod: methodList,
94
+ entry: props.entry
86
95
  });
87
96
  }
88
97
  return /* @__PURE__ */ React.createElement(EntryContext.Provider, {
89
98
  value: props.entry
90
99
  }, /* @__PURE__ */ React.createElement(ContactMethodList, {
100
+ embeded: !!props.guideId,
91
101
  type,
92
102
  contactMethodList: methodList
93
103
  }));
@@ -1 +1 @@
1
- {"version":3,"file":"contact-method.js","sources":["../src/contract/custom-component/entry-context.tsx","../src/contract/custom-component/contact-method-item.tsx","../src/contract/custom-component/contact-method-list.tsx","../src/contract/custom-component/contact-method.tsx"],"sourcesContent":["import { createContext } from 'react';\r\n\r\nexport type IEntryContext = {\r\n entryId: string | null;\r\n};\r\n\r\nexport const EntryContext = createContext<IEntryContext>({\r\n entryId: null,\r\n});\r\n","import { ContactMethod as GenericContactMethod } from '@telia-ace/knowledge-widget-adapters';\r\nimport { useDispatch } from '@telia-ace/knowledge-widget-ui';\r\nimport React, { useContext } from 'react';\r\nimport { EntryContext } from './entry-context';\r\n\r\ninterface PropsType {\r\n contactMethod: any;\r\n type: any;\r\n expanded?: boolean;\r\n className?: any;\r\n}\r\n\r\nconst ContactMethodItem: React.FC<PropsType> = ({ contactMethod, className }) => {\r\n const dispatch = useDispatch();\r\n const { entryId } = useContext(EntryContext);\r\n\r\n return (\r\n <GenericContactMethod\r\n className={className}\r\n onClick={(event: React.MouseEvent) => {\r\n if (contactMethod.inline) {\r\n // preventing default to use a custom expand action\r\n event.preventDefault();\r\n dispatch('expand', {\r\n entryId,\r\n contactMethodId: contactMethod.id,\r\n });\r\n } else {\r\n dispatch(\r\n 'action',\r\n `${contactMethod.id}/contact-methods/${contactMethod.title}`\r\n );\r\n }\r\n }}\r\n dispatch={dispatch}\r\n {...contactMethod}\r\n inline={true}\r\n />\r\n );\r\n};\r\n\r\nexport default ContactMethodItem;\r\n","import React, { Fragment } from 'react';\r\nimport styled from 'styled-components';\r\nimport ContactMethodItem from './contact-method-item';\r\n\r\ninterface PropsType {\r\n contactMethodList: any;\r\n type: any;\r\n}\r\n\r\nconst ContactMethodList: React.FC<PropsType> = (props: PropsType) => {\r\n return (\r\n <Fragment>\r\n {props.contactMethodList.map((contactMethod: any) => (\r\n <StyledContactMethod\r\n key={contactMethod.id}\r\n type={props.type}\r\n contactMethod={contactMethod}\r\n expanded={!!contactMethod.executeImmediately || undefined}\r\n />\r\n ))}\r\n </Fragment>\r\n );\r\n};\r\n\r\nconst StyledContactMethod = styled(ContactMethodItem)`\r\n border-bottom: 1px solid rgb(239, 239, 239);\r\n padding: ${(p) => p.theme.sizes?.medium};\r\n\r\n &:last-child {\r\n border-bottom: none;\r\n }\r\n`;\r\n\r\nexport default ContactMethodList;\r\n","import { DataType } from '@telia-ace/knowledge-widget-types-grid';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport ContactMethodItem from './contact-method-item';\r\nimport ContactMethodList from './contact-method-list';\r\nimport { EntryContext } from './entry-context';\r\nconst ContactMethod: React.FC = (props: any) => {\r\n let type;\r\n let methodList;\r\n\r\n if (props.contactMethods && props.contactMethods.contactMethods?.length > 0) {\r\n type = DataType.ContactMethods;\r\n methodList = props.contactMethods.contactMethods;\r\n } else if (props.contactMethods.categories && props.contactMethods.categories?.length > 0) {\r\n type = DataType.ContactMethodCategories;\r\n methodList = props.contactMethods.categories.filter((o: any) => o.matches > 0);\r\n } else {\r\n type = DataType.ContactMethod;\r\n methodList = props.contactMethods;\r\n }\r\n\r\n if (!methodList.length) {\r\n return <StyledContactMethodItem type={type} contactMethod={methodList} />;\r\n }\r\n\r\n return (\r\n <EntryContext.Provider value={props.entry}>\r\n <ContactMethodList type={type} contactMethodList={methodList} />\r\n </EntryContext.Provider>\r\n );\r\n};\r\n\r\nconst StyledContactMethodItem = styled(ContactMethodItem)`\r\n padding: ${(p) => p.theme.sizes?.medium};\r\n`;\r\n\r\nexport default ContactMethod;\r\n"],"names":["GenericContactMethod"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAMO,MAAM,eAAe,cAA6B;AAAA,EACrD,SAAS;AACb,CAAC;ACID,MAAM,oBAAyC,CAAC,EAAE,eAAe,gBAAgB;AAC7E,QAAM,WAAW;AACX,QAAA,EAAE,YAAY,WAAW,YAAY;AAE3C,SACK,sBAAA,cAAAA,iBAAA;AAAA,IACG;AAAA,IACA,SAAS,CAAC,UAA4B;AAClC,UAAI,cAAc,QAAQ;AAEtB,cAAM,eAAe;AACrB,iBAAS,UAAU;AAAA,UACf;AAAA,UACA,iBAAiB,cAAc;AAAA,QAAA,CAClC;AAAA,MAAA,OACE;AACH,iBACI,UACA,GAAG,cAAc,sBAAsB,cAAc,OACzD;AAAA,MACJ;AAAA,IACJ;AAAA,IACA;AAAA,KACI,gBAlBP;AAAA,IAmBG,QAAQ;AAAA,EAAA,EACZ;AAER;AC9BA,MAAM,oBAAyC,CAAC,UAAqB;AACjE,6CACK,UACI,MAAA,MAAM,kBAAkB,IAAI,CAAC,kBACzB,sBAAA,cAAA,qBAAA;AAAA,IACG,KAAK,cAAc;AAAA,IACnB,MAAM,MAAM;AAAA,IACZ;AAAA,IACA,UAAU,CAAC,CAAC,cAAc,sBAAsB;AAAA,EACpD,CAAA,CACH,CACL;AAER;AAEA,MAAM,sBAAsB,OAAO,iBAAiB;AAAA;AAAA,eAErC,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACpB/B,MAAA,gBAA0B,CAAC,UAAe;;AACxC,MAAA;AACA,MAAA;AAEJ,MAAI,MAAM,kBAAkB,aAAM,eAAe,mBAArB,mBAAqC,UAAS,GAAG;AACzE,WAAO,SAAS;AAChB,iBAAa,MAAM,eAAe;AAAA,EAAA,WAC3B,MAAM,eAAe,cAAc,aAAM,eAAe,eAArB,mBAAiC,UAAS,GAAG;AACvF,WAAO,SAAS;AACH,iBAAA,MAAM,eAAe,WAAW,OAAO,CAAC,MAAW,EAAE,UAAU,CAAC;AAAA,EAAA,OAC1E;AACH,WAAO,SAAS;AAChB,iBAAa,MAAM;AAAA,EACvB;AAEI,MAAA,CAAC,WAAW,QAAQ;AACpB,WAAQ,sBAAA,cAAA,yBAAA;AAAA,MAAwB;AAAA,MAAY,eAAe;AAAA,IAAA,CAAY;AAAA,EAC3E;AAGI,SAAA,sBAAA,cAAC,aAAa,UAAb;AAAA,IAAsB,OAAO,MAAM;AAAA,EAAA,GAC/B,sBAAA,cAAA,mBAAA;AAAA,IAAkB;AAAA,IAAY,mBAAmB;AAAA,EAAY,CAAA,CAClE;AAER;AAEA,MAAM,0BAA0B,OAAO,iBAAiB;AAAA,eACzC,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;;"}
1
+ {"version":3,"file":"contact-method.js","sources":["../src/contract/custom-component/entry-context.tsx","../src/contract/custom-component/contact-method-item.tsx","../src/contract/custom-component/contact-method-list.tsx","../src/contract/custom-component/contact-method.tsx"],"sourcesContent":["import { createContext } from 'react';\r\n\r\nexport type IEntryContext = {\r\n entryId: string | null;\r\n};\r\n\r\nexport const EntryContext = createContext<IEntryContext>({\r\n entryId: null,\r\n});\r\n","import { ContactMethod as GenericContactMethod } from '@telia-ace/knowledge-widget-adapters';\r\nimport { useDispatch } from '@telia-ace/knowledge-widget-ui';\r\nimport React, { useContext } from 'react';\r\nimport { EntryContext } from './entry-context';\r\n\r\ninterface PropsType {\r\n contactMethod: any;\r\n type: any;\r\n expanded?: boolean;\r\n className?: any;\r\n entry?: any;\r\n embeded: boolean;\r\n}\r\n\r\nconst ContactMethodItem: React.FC<PropsType> = ({ contactMethod, className, entry, embeded }) => {\r\n console.log(embeded, !embeded && contactMethod.inline);\r\n const dispatch = useDispatch();\r\n let entryId: string | null;\r\n if (!!entry) {\r\n entryId = entry.entryId;\r\n } else {\r\n entryId = useContext(EntryContext).entryId;\r\n }\r\n\r\n return (\r\n <GenericContactMethod\r\n className={className}\r\n onClick={(event: React.MouseEvent) => {\r\n if (embeded || contactMethod.inline) {\r\n // preventing default to use a custom expand action\r\n event.preventDefault();\r\n dispatch('expand', {\r\n entryId,\r\n contactMethodId: contactMethod.id,\r\n });\r\n } else {\r\n dispatch(\r\n 'action',\r\n `${contactMethod.id}/contact-methods/${contactMethod.title}`\r\n );\r\n }\r\n }}\r\n dispatch={dispatch}\r\n {...contactMethod}\r\n inline={true}\r\n />\r\n );\r\n};\r\n\r\nexport default ContactMethodItem;\r\n","import React, { Fragment } from 'react';\r\nimport styled from 'styled-components';\r\nimport ContactMethodItem from './contact-method-item';\r\n\r\ninterface PropsType {\r\n embeded: boolean;\r\n contactMethodList: any;\r\n type: any;\r\n}\r\n\r\nconst ContactMethodList: React.FC<PropsType> = (props: PropsType) => {\r\n return (\r\n <Fragment>\r\n {props.contactMethodList.map((contactMethod: any) => (\r\n <StyledContactMethod\r\n embeded={props.embeded}\r\n key={contactMethod.id}\r\n type={props.type}\r\n contactMethod={contactMethod}\r\n expanded={!!contactMethod.executeImmediately || undefined}\r\n />\r\n ))}\r\n </Fragment>\r\n );\r\n};\r\n\r\nconst StyledContactMethod = styled(ContactMethodItem)`\r\n border-bottom: 1px solid rgb(239, 239, 239);\r\n padding: ${(p) => p.theme.sizes?.medium};\r\n\r\n &:last-child {\r\n border-bottom: none;\r\n }\r\n`;\r\n\r\nexport default ContactMethodList;\r\n","import { DataType } from '@telia-ace/knowledge-widget-types-grid';\r\nimport React from 'react';\r\nimport styled from 'styled-components';\r\nimport ContactMethodItem from './contact-method-item';\r\nimport ContactMethodList from './contact-method-list';\r\nimport { EntryContext } from './entry-context';\r\nconst ContactMethod: React.FC = (props: any) => {\r\n let type;\r\n let methodList;\r\n\r\n if (props.contactMethods && props.contactMethods.contactMethods?.length > 0) {\r\n type = DataType.ContactMethods;\r\n methodList = props.contactMethods.contactMethods;\r\n } else if (props.contactMethods.categories && props.contactMethods.categories?.length > 0) {\r\n type = DataType.ContactMethodCategories;\r\n methodList = props.contactMethods.categories.filter((o: any) => o.matches > 0);\r\n } else {\r\n type = DataType.ContactMethod;\r\n methodList = props.contactMethods;\r\n }\r\n\r\n if (!methodList.length) {\r\n return (\r\n <StyledContactMethodItem\r\n embeded={!!props.guideId}\r\n type={type}\r\n contactMethod={methodList}\r\n entry={props.entry}\r\n />\r\n );\r\n }\r\n\r\n return (\r\n <EntryContext.Provider value={props.entry}>\r\n <ContactMethodList\r\n embeded={!!props.guideId}\r\n type={type}\r\n contactMethodList={methodList}\r\n />\r\n </EntryContext.Provider>\r\n );\r\n};\r\n\r\nconst StyledContactMethodItem = styled(ContactMethodItem)`\r\n padding: ${(p) => p.theme.sizes?.medium};\r\n`;\r\n\r\nexport default ContactMethod;\r\n"],"names":["GenericContactMethod"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAMO,MAAM,eAAe,cAA6B;AAAA,EACrD,SAAS;AACb,CAAC;ACMD,MAAM,oBAAyC,CAAC,EAAE,eAAe,WAAW,OAAO,cAAc;AAC7F,UAAQ,IAAI,SAAS,CAAC,WAAW,cAAc,MAAM;AACrD,QAAM,WAAW;AACb,MAAA;AACA,MAAA,CAAC,CAAC,OAAO;AACT,cAAU,MAAM;AAAA,EAAA,OACb;AACO,cAAA,WAAW,YAAY,EAAE;AAAA,EACvC;AAEA,SACK,sBAAA,cAAAA,iBAAA;AAAA,IACG;AAAA,IACA,SAAS,CAAC,UAA4B;AAC9B,UAAA,WAAW,cAAc,QAAQ;AAEjC,cAAM,eAAe;AACrB,iBAAS,UAAU;AAAA,UACf;AAAA,UACA,iBAAiB,cAAc;AAAA,QAAA,CAClC;AAAA,MAAA,OACE;AACH,iBACI,UACA,GAAG,cAAc,sBAAsB,cAAc,OACzD;AAAA,MACJ;AAAA,IACJ;AAAA,IACA;AAAA,KACI,gBAlBP;AAAA,IAmBG,QAAQ;AAAA,EAAA,EACZ;AAER;ACrCA,MAAM,oBAAyC,CAAC,UAAqB;AACjE,6CACK,UACI,MAAA,MAAM,kBAAkB,IAAI,CAAC,kBACzB,sBAAA,cAAA,qBAAA;AAAA,IACG,SAAS,MAAM;AAAA,IACf,KAAK,cAAc;AAAA,IACnB,MAAM,MAAM;AAAA,IACZ;AAAA,IACA,UAAU,CAAC,CAAC,cAAc,sBAAsB;AAAA,EACpD,CAAA,CACH,CACL;AAER;AAEA,MAAM,sBAAsB,OAAO,iBAAiB;AAAA;AAAA,eAErC,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACtB/B,MAAA,gBAA0B,CAAC,UAAe;;AACxC,MAAA;AACA,MAAA;AAEJ,MAAI,MAAM,kBAAkB,aAAM,eAAe,mBAArB,mBAAqC,UAAS,GAAG;AACzE,WAAO,SAAS;AAChB,iBAAa,MAAM,eAAe;AAAA,EAAA,WAC3B,MAAM,eAAe,cAAc,aAAM,eAAe,eAArB,mBAAiC,UAAS,GAAG;AACvF,WAAO,SAAS;AACH,iBAAA,MAAM,eAAe,WAAW,OAAO,CAAC,MAAW,EAAE,UAAU,CAAC;AAAA,EAAA,OAC1E;AACH,WAAO,SAAS;AAChB,iBAAa,MAAM;AAAA,EACvB;AAEI,MAAA,CAAC,WAAW,QAAQ;AACpB,WACK,sBAAA,cAAA,yBAAA;AAAA,MACG,SAAS,CAAC,CAAC,MAAM;AAAA,MACjB;AAAA,MACA,eAAe;AAAA,MACf,OAAO,MAAM;AAAA,IAAA,CACjB;AAAA,EAER;AAGI,SAAA,sBAAA,cAAC,aAAa,UAAb;AAAA,IAAsB,OAAO,MAAM;AAAA,EAAA,GAC/B,sBAAA,cAAA,mBAAA;AAAA,IACG,SAAS,CAAC,CAAC,MAAM;AAAA,IACjB;AAAA,IACA,mBAAmB;AAAA,EACvB,CAAA,CACJ;AAER;AAEA,MAAM,0BAA0B,OAAO,iBAAiB;AAAA,eACzC,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;;"}
@@ -4,6 +4,8 @@ interface PropsType {
4
4
  type: any;
5
5
  expanded?: boolean;
6
6
  className?: any;
7
+ entry?: any;
8
+ embeded: boolean;
7
9
  }
8
10
  declare const ContactMethodItem: React.FC<PropsType>;
9
11
  export default ContactMethodItem;
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  interface PropsType {
3
+ embeded: boolean;
3
4
  contactMethodList: any;
4
5
  type: any;
5
6
  }
@@ -0,0 +1,107 @@
1
+ import { useDispatch, Icon, List, invertedHoverButton } from "@telia-ace/knowledge-widget-ui";
2
+ import React from "react";
3
+ import styled, { css } from "styled-components";
4
+ const FeedbackList = ({ actions }) => {
5
+ const dispatch = useDispatch();
6
+ return /* @__PURE__ */ React.createElement(StyledButtonList, {
7
+ items: Object.keys(actions).map((i) => {
8
+ return {
9
+ label: actions[i],
10
+ actionKey: i
11
+ };
12
+ }),
13
+ renderItem: (item) => {
14
+ return /* @__PURE__ */ React.createElement(FeedbackItem, {
15
+ key: item.actionKey
16
+ }, /* @__PURE__ */ React.createElement(FeedbackButton, {
17
+ className: "humany-feedback-button",
18
+ disabled: false,
19
+ "aria-pressed": true,
20
+ "data-selected": true,
21
+ "data-direction": "vertical",
22
+ onClick: () => {
23
+ dispatch("action", item.actionKey);
24
+ }
25
+ }, /* @__PURE__ */ React.createElement(Icon, {
26
+ faIcon: item.actionKey == "yes" ? "smile-o" : "frown-o"
27
+ }), /* @__PURE__ */ React.createElement("span", null, item.label)));
28
+ }
29
+ });
30
+ };
31
+ const StyledButtonList = styled(List)`
32
+ padding: 0 ${(p) => {
33
+ var _a;
34
+ return (_a = p.theme.sizes) == null ? void 0 : _a.medium;
35
+ }};
36
+ list-style: none;
37
+ > li {
38
+ margin: ${(p) => {
39
+ var _a;
40
+ return (_a = p.theme.sizes) == null ? void 0 : _a.small;
41
+ }} ${(p) => {
42
+ var _a;
43
+ return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
44
+ }};
45
+ margin-left: 0;
46
+ display: inline-block;
47
+ }
48
+ `;
49
+ const FeedbackItem = styled.li`
50
+ @media (min-width: 768px) {
51
+ display: list-item !important;
52
+ margin-right: 0 !important;
53
+ margin-top: ${(p) => {
54
+ var _a;
55
+ return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
56
+ }} !important;
57
+ }
58
+ `;
59
+ const FeedbackButton = styled.button`
60
+ @media (min-width: 768px) {
61
+ min-width: 100%;
62
+ margin-right: 0;
63
+ }
64
+ display: inline-block;
65
+ font-size: ${(p) => {
66
+ var _a;
67
+ return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
68
+ }};
69
+ border-color: ${(p) => {
70
+ var _a;
71
+ return (_a = p.theme.colors) == null ? void 0 : _a.primary;
72
+ }} !important;
73
+ font-weight: 300;
74
+ && {
75
+ margin-right: ${(p) => {
76
+ var _a;
77
+ return (_a = p.theme.sizes) == null ? void 0 : _a.small;
78
+ }};
79
+ }
80
+ ${(p) => {
81
+ var _a, _b;
82
+ return p["data-direction"] === "horizontal" && css`
83
+ width: 225px;
84
+ max-width: calc(50% - ${(_a = p.theme.sizes) == null ? void 0 : _a.large} - ${(_b = p.theme.sizes) == null ? void 0 : _b.small});
85
+ `;
86
+ }}
87
+ ${(p) => p["data-direction"] === "vertical" && css`
88
+ min-width: 150px;
89
+ `}
90
+ ${(p) => {
91
+ var _a;
92
+ return invertedHoverButton({
93
+ primaryColor: `${(_a = p.theme.colors) == null ? void 0 : _a.primary}`,
94
+ secondaryColor: "#FFFFFF"
95
+ });
96
+ }}
97
+ i {
98
+ margin: 0 ${(p) => {
99
+ var _a;
100
+ return (_a = p.theme.sizes) == null ? void 0 : _a.small;
101
+ }} 0 0;
102
+ }
103
+ span {
104
+ }
105
+ `;
106
+ export { FeedbackList as default };
107
+ //# sourceMappingURL=feedback-list.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"feedback-list.js","sources":["../src/ui/feedback-list.tsx"],"sourcesContent":["import { Icon, invertedHoverButton, List, useDispatch } from '@telia-ace/knowledge-widget-ui';\r\nimport React from 'react';\r\nimport styled, { css } from 'styled-components';\r\n\r\ntype Props = {\r\n actions: { [key: string]: string };\r\n};\r\nconst FeedbackList: React.FC<Props> = ({ actions }) => {\r\n const dispatch = useDispatch();\r\n return (\r\n <StyledButtonList\r\n items={Object.keys(actions).map((i: any) => {\r\n return {\r\n label: actions[i],\r\n actionKey: i,\r\n };\r\n })}\r\n renderItem={(item: any) => {\r\n return (\r\n <FeedbackItem key={item.actionKey}>\r\n <FeedbackButton\r\n className=\"humany-feedback-button\"\r\n disabled={false}\r\n aria-pressed={true}\r\n data-selected={true}\r\n data-direction={'vertical'}\r\n onClick={() => {\r\n dispatch('action', item.actionKey);\r\n }}\r\n >\r\n <Icon faIcon={item.actionKey == 'yes' ? 'smile-o' : 'frown-o'} />\r\n <span>{item.label}</span>\r\n </FeedbackButton>\r\n </FeedbackItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\n\r\nexport default FeedbackList;\r\n\r\nconst StyledButtonList = styled(List as any)`\r\n padding: 0 ${(p) => p.theme.sizes?.medium};\r\n list-style: none;\r\n > li {\r\n margin: ${(p) => p.theme.sizes?.small} ${(p) => p.theme.sizes?.normal};\r\n margin-left: 0;\r\n display: inline-block;\r\n }\r\n`;\r\n\r\nconst FeedbackItem = styled.li`\r\n @media (min-width: 768px) {\r\n display: list-item !important;\r\n margin-right: 0 !important;\r\n margin-top: ${(p) => p.theme.sizes?.normal} !important;\r\n }\r\n`;\r\n\r\nconst FeedbackButton = styled.button<{\r\n 'data-selected': boolean;\r\n 'data-direction': 'horizontal' | 'vertical';\r\n}>`\r\n @media (min-width: 768px) {\r\n min-width: 100%;\r\n margin-right: 0;\r\n }\r\n display: inline-block;\r\n font-size: ${(p) => p.theme.fonts?.normal};\r\n border-color: ${(p) => p.theme.colors?.primary} !important;\r\n font-weight: 300;\r\n && {\r\n margin-right: ${(p) => p.theme.sizes?.small};\r\n }\r\n ${(p) =>\r\n p['data-direction'] === 'horizontal' &&\r\n css`\r\n width: 225px;\r\n max-width: calc(50% - ${p.theme.sizes?.large} - ${p.theme.sizes?.small});\r\n `}\r\n ${(p) =>\r\n p['data-direction'] === 'vertical' &&\r\n css`\r\n min-width: 150px;\r\n `}\r\n ${(p) =>\r\n invertedHoverButton({\r\n primaryColor: `${p.theme.colors?.primary}`,\r\n secondaryColor: '#FFFFFF',\r\n })}\r\n i {\r\n margin: 0 ${(p) => p.theme.sizes?.small} 0 0;\r\n }\r\n span {\r\n }\r\n`;\r\n"],"names":[],"mappings":";;;AAOM,MAAA,eAAgC,CAAC,EAAE,cAAc;AACnD,QAAM,WAAW;AACjB,SACK,sBAAA,cAAA,kBAAA;AAAA,IACG,OAAO,OAAO,KAAK,OAAO,EAAE,IAAI,CAAC,MAAW;AACjC,aAAA;AAAA,QACH,OAAO,QAAQ;AAAA,QACf,WAAW;AAAA,MAAA;AAAA,IACf,CACH;AAAA,IACD,YAAY,CAAC,SAAc;AACvB,aACK,sBAAA,cAAA,cAAA;AAAA,QAAa,KAAK,KAAK;AAAA,MAAA,GACnB,sBAAA,cAAA,gBAAA;AAAA,QACG,WAAU;AAAA,QACV,UAAU;AAAA,QACV,gBAAc;AAAA,QACd,iBAAe;AAAA,QACf,kBAAgB;AAAA,QAChB,SAAS,MAAM;AACF,mBAAA,UAAU,KAAK,SAAS;AAAA,QACrC;AAAA,MAAA,GAEC,sBAAA,cAAA,MAAA;AAAA,QAAK,QAAQ,KAAK,aAAa,QAAQ,YAAY;AAAA,MAAA,CAAW,GAC9D,sBAAA,cAAA,QAAA,MAAM,KAAK,KAAM,CACtB,CACJ;AAAA,IAER;AAAA,EAAA,CACJ;AAER;AAIA,MAAM,mBAAmB,OAAO,IAAW;AAAA,iBAC1B,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA;AAAA,kBAGrB,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA,KAAS,CAAC,MAAA;;AAAM,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAMvE,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA,sBAIN,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA;AAI5C,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBASb,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA,oBACnB,CAAC,MAAM;;AAAA,iBAAE,MAAM,WAAR,mBAAgB;AAAA;AAAA;AAAA;AAAA,wBAGnB,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA,MAExC,CAAC,MAAA;;AACC,WAAE,sBAAsB,gBACxB;AAAA;AAAA,oCAE4B,QAAE,MAAM,UAAR,mBAAe,WAAW,QAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA,MAEvE,CAAC,MACC,EAAE,sBAAsB,cACxB;AAAA;AAAA;AAAA,IAGJ,CAAC;;AACG,6BAAoB;AAAA,IAChB,cAAc,GAAG,QAAE,MAAM,WAAR,mBAAgB;AAAA,IACjC,gBAAgB;AAAA,EACpB,CAAC;AAAA;AAAA;AAAA,oBAEW,CAAC,MAAM;;AAAA,iBAAE,MAAM,UAAR,mBAAe;AAAA;AAAA;AAAA;AAAA;AAAA;;"}