react-restyle-components 0.4.13 → 0.4.14

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 (20) hide show
  1. package/lib/src/core-components/src/components/Accordion/AccordionSection/elements.d.ts.map +1 -1
  2. package/lib/src/core-components/src/components/Accordion/AccordionSection/elements.js +71 -20
  3. package/lib/src/core-components/src/components/Modal/ModalDocxContent/gemini.service.d.ts +4 -0
  4. package/lib/src/core-components/src/components/Modal/ModalDocxContent/gemini.service.d.ts.map +1 -0
  5. package/lib/src/core-components/src/components/Modal/ModalDocxContent/gemini.service.js +70 -0
  6. package/lib/src/core-components/src/components/Modal/ModalDocxContent/modal-docx-content.component.d.ts +43 -0
  7. package/lib/src/core-components/src/components/Modal/ModalDocxContent/modal-docx-content.component.d.ts.map +1 -0
  8. package/lib/src/core-components/src/components/Modal/ModalDocxContent/modal-docx-content.component.js +841 -0
  9. package/lib/src/core-components/src/components/Modal/index.d.ts +1 -0
  10. package/lib/src/core-components/src/components/Modal/index.d.ts.map +1 -1
  11. package/lib/src/core-components/src/components/Modal/index.js +1 -0
  12. package/lib/src/core-components/src/tc.global.css +2 -1
  13. package/lib/src/core-components/src/tc.module.css +1 -1
  14. package/lib/src/core-components/src/utils/index.d.ts +1 -0
  15. package/lib/src/core-components/src/utils/index.d.ts.map +1 -1
  16. package/lib/src/core-components/src/utils/index.js +1 -0
  17. package/lib/src/core-components/src/utils/jodit-editor-config.util.d.ts +189 -0
  18. package/lib/src/core-components/src/utils/jodit-editor-config.util.d.ts.map +1 -0
  19. package/lib/src/core-components/src/utils/jodit-editor-config.util.js +333 -0
  20. package/package.json +3 -1
@@ -1 +1 @@
1
- {"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Accordion/AccordionSection/elements.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,gBAAgB,EAA2B,MAAM,SAAS,CAAC;AAUnE,eAAO,MAAM,gBAAgB;cACjB,gBAAgB,GAAG,QAAQ,GAAG,WAAW;YAepD,CAAC;AAEF,eAAO,MAAM,uBAAuB;cACxB,gBAAgB,GAAG,QAAQ,GAAG,WAAW;aAC1C,OAAO;YAYjB,CAAC;AAEF,eAAO,MAAM,aAAa;;;YAoCzB,CAAC;AAEF,eAAO,MAAM,oBAAoB,6NAUhC,CAAC;AAEF,KAAK,4BAA4B,GAAG;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,mBAAmB,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,aAAa;aACf,OAAO;yBACK,MAAM;+BACA,MAAM;YAQlC,CAAC;AAmBF,eAAO,MAAM,8BAA8B;aAChC,OAAO;yBACK,MAAM;+BACA,MAAM;YAWlC,CAAC;AAEF,eAAO,MAAM,uBAAuB,iQASnC,CAAC;AAEF,eAAO,MAAM,qBAAqB;;YAejC,CAAC;AAEF,eAAO,MAAM,gBAAgB;;mBAE5B,CAAC;AAEF,eAAO,MAAM,YAAY;iBACV,OAAO;oKAMrB,CAAC"}
1
+ {"version":3,"file":"elements.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Accordion/AccordionSection/elements.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAC,gBAAgB,EAA2B,MAAM,SAAS,CAAC;AAUnE,eAAO,MAAM,gBAAgB;cACjB,gBAAgB,GAAG,QAAQ,GAAG,WAAW;YAkBpD,CAAC;AAEF,eAAO,MAAM,uBAAuB;cACxB,gBAAgB,GAAG,QAAQ,GAAG,WAAW;aAC1C,OAAO;YAoBjB,CAAC;AAEF,eAAO,MAAM,aAAa;;;YAiDzB,CAAC;AAEF,eAAO,MAAM,oBAAoB,6NAchC,CAAC;AAEF,KAAK,4BAA4B,GAAG;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,mBAAmB,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,aAAa;aACf,OAAO;yBACK,MAAM;+BACA,MAAM;YAelC,CAAC;AAmBF,eAAO,MAAM,8BAA8B;aAChC,OAAO;yBACK,MAAM;+BACA,MAAM;YAqBlC,CAAC;AAEF,eAAO,MAAM,uBAAuB,iQAWnC,CAAC;AAEF,eAAO,MAAM,qBAAqB;;YAejC,CAAC;AAEF,eAAO,MAAM,gBAAgB;;mBAI5B,CAAC;AAEF,eAAO,MAAM,YAAY;iBACV,OAAO;oKAWrB,CAAC"}
@@ -10,13 +10,16 @@ const Divider = styled.hr `
10
10
  `;
11
11
  export const AccordionElement = styled.div `
12
12
  display: flex;
13
- justify-content: space-evenly;
14
- align-items: center;
13
+ justify-content: flex-start;
14
+ align-items: stretch;
15
15
  flex-direction: column;
16
+ gap: ${tokens.spacing050};
16
17
  ${({ $variant }) => $variant === 'inline' &&
17
18
  css `
18
19
  border: 1px solid ${tokens.outline};
19
20
  border-radius: ${tokens.borderRadius100};
21
+ padding: ${tokens.spacing100};
22
+ background: ${tokens.surface || '#ffffff'};
20
23
  `};
21
24
  overflow: hidden;
22
25
  width: 100%;
@@ -26,8 +29,16 @@ export const AccordionSectionWrapper = styled.div `
26
29
  overflow: hidden;
27
30
  width: 100%;
28
31
  isolation: isolate;
29
- ${({ $variant }) => $variant === 'inline' &&
32
+ transition: all 0.3s ease;
33
+
34
+ ${({ $variant, $isOpen }) => $variant === 'inline' &&
30
35
  css `
36
+ border-radius: ${tokens.borderRadius100};
37
+ margin-bottom: ${$isOpen ? tokens.spacing100 : '0'};
38
+ box-shadow: ${$isOpen
39
+ ? '0 4px 12px rgba(0, 0, 0, 0.15), 0 2px 4px rgba(0, 0, 0, 0.1)'
40
+ : 'none'};
41
+
31
42
  &:last-child ${AccordionDivider} {
32
43
  display: none;
33
44
  }
@@ -42,32 +53,44 @@ export const ButtonElement = styled.button `
42
53
  cursor: pointer;
43
54
  width: 100%;
44
55
 
45
- background-color: ${tokens.darkGray || '#4a4a4a'} !important;
56
+ background: ${({ $isOpen }) => $isOpen
57
+ ? `linear-gradient(135deg, ${tokens.darkGray || '#4a4a4a'} 0%, #3a3a3a 100%)`
58
+ : tokens.darkGray || '#4a4a4a'} !important;
46
59
  color: ${tokens.white || '#ffffff'} !important;
47
60
 
48
61
  display: flex;
49
62
  gap: ${tokens.spacing100};
50
63
  align-items: center;
51
- padding-top: ${tokens.spacing200};
52
- padding-right: ${tokens.spacing200};
53
- padding-bottom: ${tokens.spacing200};
54
- padding-left: ${tokens.spacing200};
64
+ padding: ${tokens.spacing200} ${tokens.spacing200};
55
65
 
56
- ${({ $variant }) => $variant === 'inline' &&
66
+ transition: all 0.25s ease;
67
+
68
+ ${({ $variant, $isOpen }) => $variant === 'inline' &&
57
69
  css `
58
- border-radius: ${tokens.borderRadius100};
70
+ border-radius: ${$isOpen
71
+ ? `${tokens.borderRadius100} ${tokens.borderRadius100} 0 0`
72
+ : tokens.borderRadius100};
59
73
  `}
60
74
 
61
- &:hover:not(:disabled) ${StateLayer} {
62
- opacity: ${tokens.stateLayerHover};
75
+ &:hover:not(:disabled) {
76
+ background: linear-gradient(135deg, #555555 0%, #3f3f3f 100%) !important;
77
+
78
+ ${StateLayer} {
79
+ opacity: ${tokens.stateLayerHover};
80
+ }
63
81
  }
64
82
 
65
83
  &:active:not(:disabled) ${StateLayer} {
66
84
  opacity: ${tokens.stateLayerPress};
67
85
  }
86
+
87
+ &:focus-visible {
88
+ outline: 2px solid ${tokens.primary || '#454cbf'};
89
+ outline-offset: 2px;
90
+ }
68
91
  `;
69
92
  export const AccordionSectionText = styled.div `
70
- line-height: 1.3;
93
+ line-height: 1.4;
71
94
  flex-grow: 1;
72
95
  padding-right: ${tokens.spacing100};
73
96
  position: relative;
@@ -76,14 +99,25 @@ export const AccordionSectionText = styled.div `
76
99
  flex-direction: column;
77
100
  gap: ${tokens.spacing050};
78
101
  color: ${tokens.white};
102
+
103
+ /* Better text rendering */
104
+ -webkit-font-smoothing: antialiased;
105
+ -moz-osx-font-smoothing: grayscale;
79
106
  `;
80
107
  export const AccordionFade = styled.div `
81
108
  z-index: 0;
82
109
  position: relative;
83
- background: linear-gradient(to bottom, transparent, ${tokens.surface});
110
+ background: linear-gradient(
111
+ to bottom,
112
+ transparent,
113
+ ${tokens.surface || '#ffffff'}
114
+ );
84
115
  width: 100%;
85
- height: ${tokens.spacing150};
86
- margin-top: calc(${tokens.spacing150} * -1);
116
+ height: ${tokens.spacing200};
117
+ margin-top: calc(${tokens.spacing200} * -1);
118
+ opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)};
119
+ transition: opacity ${({ $transitionDuration }) => $transitionDuration} ease;
120
+ pointer-events: none;
87
121
  `;
88
122
  const getTransitionTimingFunction = (transitionTimingFunction, isOpen) => {
89
123
  if (transitionTimingFunction !== 'ease-in' &&
@@ -101,13 +135,23 @@ export const AccordionSectionContentWrapper = styled.div `
101
135
  display: grid;
102
136
  grid-template-rows: ${({ $isOpen }) => ($isOpen ? '1fr' : '0fr')};
103
137
  transition: ${({ $transitionDuration, $transitionTimingFunction, $isOpen }) => `grid-template-rows ${$transitionDuration} ${getTransitionTimingFunction($transitionTimingFunction, $isOpen)}`};
138
+ background: ${({ $isOpen }) => $isOpen
139
+ ? `linear-gradient(180deg, rgba(74, 74, 74, 0.05) 0%, transparent 100%)`
140
+ : 'transparent'};
141
+ border-left: ${({ $isOpen }) => $isOpen
142
+ ? `3px solid ${tokens.primary || '#454cbf'}`
143
+ : '3px solid transparent'};
144
+ margin-left: ${({ $isOpen }) => ($isOpen ? tokens.spacing100 : '0')};
145
+ transition: all 0.3s ease;
104
146
  `;
105
147
  export const AccordionSectionContent = styled.div `
106
148
  overflow-y: hidden;
107
- transition: ${({ $transitionDuration }) => `opacity ${$transitionDuration} linear`};
108
- line-height: 1.3;
149
+ transition: ${({ $transitionDuration }) => `opacity ${$transitionDuration} linear, transform ${$transitionDuration} ease`};
150
+ line-height: 1.6;
109
151
  opacity: ${({ $isOpen }) => ($isOpen ? 1 : 0)};
110
- padding-right: ${tokens.spacing150};
152
+ transform: ${({ $isOpen }) => ($isOpen ? 'translateY(0)' : 'translateY(-8px)')};
153
+ padding-top: ${({ $isOpen }) => ($isOpen ? tokens.spacing150 : '0')};
154
+ padding-right: ${tokens.spacing200};
111
155
  padding-left: ${({ $hasLeader }) => $hasLeader ? tokens.spacing600 : tokens.spacing200};
112
156
  `;
113
157
  export const StyledLeadingTrailing = styled.div `
@@ -125,10 +169,17 @@ export const StyledLeadingTrailing = styled.div `
125
169
  `;
126
170
  export const AccordionDivider = styled(Divider) `
127
171
  border-color: ${tokens.outline};
172
+ opacity: 0.5;
173
+ margin: ${tokens.spacing025} 0;
128
174
  `;
129
175
  export const RotatingIcon = styled(Icon.SSR) `
130
176
  overflow: hidden;
131
177
  flex-shrink: 0;
132
- transition: transform 0.4s ease-in-out;
178
+ transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
133
179
  transform: ${({ $rotateIcon }) => `rotate(${$rotateIcon ? -180 : 0}deg)`};
180
+ opacity: 0.9;
181
+
182
+ &:hover {
183
+ opacity: 1;
184
+ }
134
185
  `;
@@ -0,0 +1,4 @@
1
+ export declare const geminiSendMessageService: (prompt: string, gemini_key: string) => Promise<{
2
+ text: string;
3
+ } | null>;
4
+ //# sourceMappingURL=gemini.service.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"gemini.service.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Modal/ModalDocxContent/gemini.service.ts"],"names":[],"mappings":"AA0DA,eAAO,MAAM,wBAAwB,WAC3B,MAAM,cACF,MAAM,KACjB,QAAQ;IAAC,IAAI,EAAE,MAAM,CAAA;CAAC,GAAG,IAAI,CA6B/B,CAAC"}
@@ -0,0 +1,70 @@
1
+ const GEMINI_BASE_URL = 'https://generativelanguage.googleapis.com/v1beta/models';
2
+ // Fallback models - will try each one in order if previous fails
3
+ const GEMINI_MODELS = [
4
+ 'gemini-2.5-flash',
5
+ 'gemini-2.0-flash',
6
+ 'gemini-1.5-flash',
7
+ ];
8
+ // Call API with specific model using fetch
9
+ const callWithModel = async (prompt, model, gemini_key) => {
10
+ const url = `${GEMINI_BASE_URL}/${model}:generateContent`;
11
+ const controller = new AbortController();
12
+ const timeoutId = setTimeout(() => controller.abort(), 30 * 1000); // 30 seconds
13
+ try {
14
+ const response = await fetch(url, {
15
+ method: 'POST',
16
+ headers: {
17
+ 'x-goog-api-key': gemini_key,
18
+ 'Content-Type': 'application/json',
19
+ },
20
+ body: JSON.stringify({
21
+ contents: [
22
+ {
23
+ parts: [
24
+ {
25
+ text: prompt,
26
+ },
27
+ ],
28
+ },
29
+ ],
30
+ }),
31
+ signal: controller.signal,
32
+ });
33
+ clearTimeout(timeoutId);
34
+ if (!response.ok) {
35
+ const errorData = await response.json().catch(() => ({}));
36
+ throw new Error(errorData?.error?.message || `HTTP ${response.status}`);
37
+ }
38
+ const data = await response.json();
39
+ const text = data?.candidates?.[0]?.content?.parts?.[0]?.text;
40
+ return text ? { text } : null;
41
+ }
42
+ catch (error) {
43
+ clearTimeout(timeoutId);
44
+ throw error;
45
+ }
46
+ };
47
+ export const geminiSendMessageService = async (prompt, gemini_key) => {
48
+ let lastError = null;
49
+ // Try each model in order
50
+ for (const model of GEMINI_MODELS) {
51
+ try {
52
+ console.log(`[Gemini] Trying model: ${model}`);
53
+ const result = await callWithModel(prompt, model, gemini_key);
54
+ if (result) {
55
+ console.log(`[Gemini] Success with model: ${model}`);
56
+ return result;
57
+ }
58
+ }
59
+ catch (error) {
60
+ console.warn(`[Gemini] Model ${model} failed:`, error instanceof Error ? error.message : error);
61
+ lastError = error instanceof Error ? error : new Error(String(error));
62
+ // Continue to next model
63
+ }
64
+ }
65
+ // All models failed - show error
66
+ console.error('[Gemini] All models failed:', lastError);
67
+ const errorMessage = lastError?.message || 'Failed to get AI response';
68
+ console.error(`😔 AI Error: ${errorMessage}`);
69
+ return null;
70
+ };
@@ -0,0 +1,43 @@
1
+ import React from 'react';
2
+ import 'jodit/esm/plugins/resizer/resizer';
3
+ export interface ModalDocxContentProps {
4
+ /** Controls the visibility of the modal */
5
+ visible: boolean;
6
+ /** Initial content to display in the editor */
7
+ details?: string;
8
+ /** Callback fired when the user saves the content */
9
+ onSave: (content: string) => void;
10
+ /** Callback fired when the modal is closed */
11
+ onClose: () => void;
12
+ /** Optional title for the modal header */
13
+ title?: string;
14
+ /** Custom AI service function for processing content */
15
+ aiService?: (message: string, gemini_key: string) => Promise<{
16
+ text: string;
17
+ } | null>;
18
+ /** Whether to show AI assistant button */
19
+ showAIButton?: boolean;
20
+ /** Whether to show voice recording buttons */
21
+ showVoiceButtons?: boolean;
22
+ uploaderUrl?: string;
23
+ folder?: string;
24
+ gemini_key?: string;
25
+ /** Custom class names for styling */
26
+ classNames?: {
27
+ overlay?: string;
28
+ container?: string;
29
+ header?: string;
30
+ body?: string;
31
+ footer?: string;
32
+ };
33
+ /** Custom inline styles */
34
+ styles?: {
35
+ overlay?: React.CSSProperties;
36
+ container?: React.CSSProperties;
37
+ header?: React.CSSProperties;
38
+ body?: React.CSSProperties;
39
+ footer?: React.CSSProperties;
40
+ };
41
+ }
42
+ export declare const ModalDocxContent: ({ visible, details, onSave, onClose, title, aiService, showAIButton, showVoiceButtons, uploaderUrl, folder, gemini_key, classNames, styles, }: ModalDocxContentProps) => import("react/jsx-runtime").JSX.Element;
43
+ //# sourceMappingURL=modal-docx-content.component.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"modal-docx-content.component.d.ts","sourceRoot":"","sources":["../../../../../../../src/core-components/src/components/Modal/ModalDocxContent/modal-docx-content.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAStE,OAAO,mCAAmC,CAAC;AAuG3C,MAAM,WAAW,qBAAqB;IACpC,2CAA2C;IAC3C,OAAO,EAAE,OAAO,CAAC;IACjB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qDAAqD;IACrD,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,8CAA8C;IAC9C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,SAAS,CAAC,EAAE,CACV,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,MAAM,KACf,OAAO,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAC,GAAG,IAAI,CAAC,CAAC;IACpC,0CAA0C;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,8CAA8C;IAC9C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qCAAqC;IACrC,UAAU,CAAC,EAAE;QACX,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,2BAA2B;IAC3B,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC9B,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAChC,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC7B,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC3B,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;KAC9B,CAAC;CACH;AAED,eAAO,MAAM,gBAAgB,kJAe1B,qBAAqB,4CAqmCvB,CAAC"}