@bagelink/vue 0.0.104 → 0.0.108

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.
package/dist/style.css CHANGED
@@ -530,166 +530,6 @@
530
530
  inset-inline-end: 5%;
531
531
  }
532
532
  }
533
- /* .group-wrap * {
534
- outline: 1px solid red;
535
- } */
536
- .group-wrap[data-v-f7af54ed] {
537
- height: 100%;
538
- display: flex;
539
- align-items: center;
540
- justify-content: center;
541
- flex-wrap: wrap;
542
- gap: 2px;
543
- }
544
- .group-wrap .bar-wrap[data-v-f7af54ed] {
545
- gap: 2px;
546
- }
547
- .group-title[data-v-f7af54ed] {
548
- font-size: 0.6em;
549
- width: 100%;
550
- }
551
- .bar-txt[data-v-f7af54ed] {
552
- font-size: 11px;
553
- font-weight: 200;
554
- /* max-width: 95%; */
555
- width: max-content;
556
- height: 20px;
557
- line-height: 1.2;
558
- margin: 5px auto 0;
559
- position: absolute;
560
- transform: rotate(300deg);
561
- transform-origin: 40px 40px;
562
- }
563
- .graph-wrap[data-v-f7af54ed] {
564
- display: flex;
565
- flex-direction: row;
566
- align-items: flex-end;
567
- padding: 0 10px;
568
- }
569
- .bar-wrap[data-v-f7af54ed] {
570
- text-align: center;
571
- height: 100%;
572
- /* flex: 0 1 16.6%; */
573
- display: flex;
574
- flex-direction: row;
575
- align-items: flex-end;
576
- position: relative;
577
- }
578
- .bar[data-v-f7af54ed] {
579
- background: var(--bgl-blue);
580
- position: relative;
581
- min-width: 10px;
582
- min-height: 5px;
583
- width: 4px;
584
- margin: 0 auto;
585
- transition: all ease-out 0.8s;
586
- }
587
- .bar.compare[data-v-f7af54ed] {
588
- background-color: #cf2135;
589
- }
590
- .bar-chart[data-v-f7af54ed] {
591
- height: calc(100vh - 500px);
592
- width: 90%;
593
- margin: 30px auto;
594
- display: flex;
595
- justify-content: space-between;
596
- position: relative;
597
- }
598
- .graps .bar-chart[data-v-f7af54ed] {
599
- aspect-ratio: 9/5;
600
- height: auto;
601
- max-height: calc(100vh - 500px);
602
- }
603
- .bar-lines[data-v-f7af54ed] {
604
- position: absolute;
605
- /* font-size: 20px; */
606
- display: flex;
607
- flex-direction: column-reverse;
608
- top: -15px;
609
- bottom: -12px;
610
- left: -30px;
611
- justify-content: space-between;
612
- width: calc(100% + 20px);
613
- text-align: start;
614
- }
615
- .bar-lines p[data-v-f7af54ed] {
616
- margin: 0;
617
- position: relative;
618
- }
619
- .bar-lines p[data-v-f7af54ed]::after {
620
- content: "";
621
- background: var(--bgl-blue-tint);
622
- height: 1px;
623
- position: absolute;
624
- width: calc(100% - 20px);
625
- margin: 14px 0 0 10px;
626
- opacity: 0.5;
627
- }
628
- .bar-lines p[data-v-f7af54ed]:first-child:after {
629
- content: "";
630
- background: var(--bgl-blue-tint);
631
- height: 1px;
632
- position: absolute;
633
- width: calc(100% - 10px);
634
- margin: 8px 0 0 10px;
635
- opacity: 0.5;
636
- }
637
- .red-bar[data-v-f7af54ed] {
638
- background: #cf2135;
639
- height: var(--6227cb5e);
640
- width: 100%;
641
- position: absolute;
642
- left: 0px;
643
- bottom: 0;
644
- opacity: 0.6;
645
- transition: all 200ms ease;
646
- }
647
- .red-bar.open-redbar[data-v-f7af54ed] {
648
- height: 7%;
649
- }
650
- .factor[data-v-f7af54ed] {
651
- position: absolute;
652
- transform: rotate(270deg);
653
- height: 0px;
654
- width: 0;
655
- left: -60px;
656
- font-size: 22px;
657
- text-align: center;
658
- white-space: nowrap;
659
- top: 60%;
660
- }
661
- .dash-hor[data-v-f7af54ed] {
662
- /* border-bottom: 1px dashed white; */
663
- position: absolute;
664
- background-image: linear-gradient(to right, #cf2134 53%, transparent 0%);
665
- height: 10px;
666
- bottom: 41.5%;
667
- width: 100%;
668
- animation: 1s linear 0s infinite dash-f7af54ed;
669
- background-position: left;
670
- background-repeat: repeat-x;
671
- background-size: 15px 4px;
672
- }
673
- .dash-hor[data-v-f7af54ed]::after {
674
- content: "Average Speedup = 25x";
675
- position: absolute;
676
- left: 0;
677
- bottom: 10px;
678
- font-size: 22px;
679
- background: #cf2134;
680
- z-index: 2;
681
- padding: 1px 4px;
682
- border-radius: 3px;
683
- }
684
- @keyframes dash-f7af54ed {
685
- 0% {
686
- background-position: 0;
687
- }
688
- 100% {
689
- background-position: 15px;
690
- }
691
- }
692
-
693
533
  .dropdown {
694
534
  position: relative;
695
535
  font-size: calc(var(--input-font-size) * 1.3);
@@ -1048,6 +888,166 @@ th[data-v-5c5ba615] {
1048
888
  width: 100%;
1049
889
  }
1050
890
 
891
+ /* .group-wrap * {
892
+ outline: 1px solid red;
893
+ } */
894
+ .group-wrap[data-v-f7af54ed] {
895
+ height: 100%;
896
+ display: flex;
897
+ align-items: center;
898
+ justify-content: center;
899
+ flex-wrap: wrap;
900
+ gap: 2px;
901
+ }
902
+ .group-wrap .bar-wrap[data-v-f7af54ed] {
903
+ gap: 2px;
904
+ }
905
+ .group-title[data-v-f7af54ed] {
906
+ font-size: 0.6em;
907
+ width: 100%;
908
+ }
909
+ .bar-txt[data-v-f7af54ed] {
910
+ font-size: 11px;
911
+ font-weight: 200;
912
+ /* max-width: 95%; */
913
+ width: max-content;
914
+ height: 20px;
915
+ line-height: 1.2;
916
+ margin: 5px auto 0;
917
+ position: absolute;
918
+ transform: rotate(300deg);
919
+ transform-origin: 40px 40px;
920
+ }
921
+ .graph-wrap[data-v-f7af54ed] {
922
+ display: flex;
923
+ flex-direction: row;
924
+ align-items: flex-end;
925
+ padding: 0 10px;
926
+ }
927
+ .bar-wrap[data-v-f7af54ed] {
928
+ text-align: center;
929
+ height: 100%;
930
+ /* flex: 0 1 16.6%; */
931
+ display: flex;
932
+ flex-direction: row;
933
+ align-items: flex-end;
934
+ position: relative;
935
+ }
936
+ .bar[data-v-f7af54ed] {
937
+ background: var(--bgl-blue);
938
+ position: relative;
939
+ min-width: 10px;
940
+ min-height: 5px;
941
+ width: 4px;
942
+ margin: 0 auto;
943
+ transition: all ease-out 0.8s;
944
+ }
945
+ .bar.compare[data-v-f7af54ed] {
946
+ background-color: #cf2135;
947
+ }
948
+ .bar-chart[data-v-f7af54ed] {
949
+ height: calc(100vh - 500px);
950
+ width: 90%;
951
+ margin: 30px auto;
952
+ display: flex;
953
+ justify-content: space-between;
954
+ position: relative;
955
+ }
956
+ .graps .bar-chart[data-v-f7af54ed] {
957
+ aspect-ratio: 9/5;
958
+ height: auto;
959
+ max-height: calc(100vh - 500px);
960
+ }
961
+ .bar-lines[data-v-f7af54ed] {
962
+ position: absolute;
963
+ /* font-size: 20px; */
964
+ display: flex;
965
+ flex-direction: column-reverse;
966
+ top: -15px;
967
+ bottom: -12px;
968
+ left: -30px;
969
+ justify-content: space-between;
970
+ width: calc(100% + 20px);
971
+ text-align: start;
972
+ }
973
+ .bar-lines p[data-v-f7af54ed] {
974
+ margin: 0;
975
+ position: relative;
976
+ }
977
+ .bar-lines p[data-v-f7af54ed]::after {
978
+ content: "";
979
+ background: var(--bgl-blue-tint);
980
+ height: 1px;
981
+ position: absolute;
982
+ width: calc(100% - 20px);
983
+ margin: 14px 0 0 10px;
984
+ opacity: 0.5;
985
+ }
986
+ .bar-lines p[data-v-f7af54ed]:first-child:after {
987
+ content: "";
988
+ background: var(--bgl-blue-tint);
989
+ height: 1px;
990
+ position: absolute;
991
+ width: calc(100% - 10px);
992
+ margin: 8px 0 0 10px;
993
+ opacity: 0.5;
994
+ }
995
+ .red-bar[data-v-f7af54ed] {
996
+ background: #cf2135;
997
+ height: var(--6227cb5e);
998
+ width: 100%;
999
+ position: absolute;
1000
+ left: 0px;
1001
+ bottom: 0;
1002
+ opacity: 0.6;
1003
+ transition: all 200ms ease;
1004
+ }
1005
+ .red-bar.open-redbar[data-v-f7af54ed] {
1006
+ height: 7%;
1007
+ }
1008
+ .factor[data-v-f7af54ed] {
1009
+ position: absolute;
1010
+ transform: rotate(270deg);
1011
+ height: 0px;
1012
+ width: 0;
1013
+ left: -60px;
1014
+ font-size: 22px;
1015
+ text-align: center;
1016
+ white-space: nowrap;
1017
+ top: 60%;
1018
+ }
1019
+ .dash-hor[data-v-f7af54ed] {
1020
+ /* border-bottom: 1px dashed white; */
1021
+ position: absolute;
1022
+ background-image: linear-gradient(to right, #cf2134 53%, transparent 0%);
1023
+ height: 10px;
1024
+ bottom: 41.5%;
1025
+ width: 100%;
1026
+ animation: 1s linear 0s infinite dash-f7af54ed;
1027
+ background-position: left;
1028
+ background-repeat: repeat-x;
1029
+ background-size: 15px 4px;
1030
+ }
1031
+ .dash-hor[data-v-f7af54ed]::after {
1032
+ content: "Average Speedup = 25x";
1033
+ position: absolute;
1034
+ left: 0;
1035
+ bottom: 10px;
1036
+ font-size: 22px;
1037
+ background: #cf2134;
1038
+ z-index: 2;
1039
+ padding: 1px 4px;
1040
+ border-radius: 3px;
1041
+ }
1042
+ @keyframes dash-f7af54ed {
1043
+ 0% {
1044
+ background-position: 0;
1045
+ }
1046
+ 100% {
1047
+ background-position: 15px;
1048
+ }
1049
+ }
1050
+
1051
1051
  .primary-checkbox input[data-v-5f3ff6ea] {
1052
1052
  display: none;
1053
1053
  }
@@ -2110,3 +2110,111 @@ input[type='email'][data-v-ed81a514] {
2110
2110
  border-radius: 10px;
2111
2111
  box-shadow: 0 0 10px 0 rgb(0 0 0 /20%);
2112
2112
  }
2113
+
2114
+ .chart-line {
2115
+ width: 100%;
2116
+ height: 300px;
2117
+ }
2118
+ [dir='rtl'] .chart-line {
2119
+ direction: ltr;
2120
+ }
2121
+ .chart-line .v-tooltip-content>div {
2122
+ border: none !important;
2123
+ border-radius: 6px !important;
2124
+ background-color: black !important;
2125
+ opacity: 0.7;
2126
+ padding: 0.5rem 1rem !important;
2127
+ box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
2128
+ font-weight: 300;
2129
+ }
2130
+ .chart-line .v-tooltip-content>div b {
2131
+ font-weight: 400;
2132
+ }
2133
+ .layer-grid g:last-child {
2134
+ display: none;
2135
+ }
2136
+ .layer-axis-x .tick:nth-child(2n + 1) {
2137
+ opacity: 0;
2138
+ }
2139
+ @media screen and (max-width: 910px) {
2140
+ .chart-line {
2141
+ height: 140px;
2142
+ }
2143
+ .layer-axis-x .tick {
2144
+ opacity: 0;
2145
+ font-size: 0;
2146
+ }
2147
+ }
2148
+
2149
+ .btn-end[data-v-b1fdb496] {
2150
+ text-align: end;
2151
+ }
2152
+ .whatsapp-preview[data-v-b1fdb496] {
2153
+ direction: ltr;
2154
+ width: 400px;
2155
+ padding: 1rem;
2156
+ height: auto;
2157
+ margin-top: 1rem;
2158
+ /* border-left: 1px solid var(--border-color); */
2159
+ margin-left: 20px;
2160
+ position: sticky;
2161
+ top: 15px;
2162
+ flex: 1 1 40%;
2163
+ }
2164
+ .whatsapp-wrap[data-v-b1fdb496] {
2165
+ display: flex;
2166
+ gap: 1rem;
2167
+ max-width: 1200px;
2168
+ overflow: auto;
2169
+ height: 100%;
2170
+ }
2171
+ .create-template-form[data-v-b1fdb496] {
2172
+ flex: 1 0 50%;
2173
+ min-width: 300px;
2174
+ }
2175
+ .whatsapp-msg[data-v-b1fdb496] {
2176
+ background: var(--whatsapp-green);
2177
+ border-radius: 0.5rem;
2178
+ border-start-start-radius: 0px;
2179
+ padding: 10px;
2180
+ line-height: 1.5;
2181
+ margin-top: 1rem;
2182
+ filter: drop-shadow(0 0px 2px var(--bgl-shadow));
2183
+ position: relative;
2184
+ min-height: 30px;
2185
+ }
2186
+ .whatsapp-msg[data-v-b1fdb496]::after {
2187
+ content: '';
2188
+ inset-inline-start: -5px;
2189
+ border-radius: 0.1rem;
2190
+ transform: skew(45deg);
2191
+ top: 0;
2192
+ height: 8px;
2193
+ width: 8px;
2194
+ background: var(--whatsapp-green);
2195
+ position: absolute;
2196
+ }
2197
+ .whatsapp-body[data-v-b1fdb496] {
2198
+ margin: 2px 0;
2199
+ }
2200
+ .whatsapp-footer[data-v-b1fdb496] {
2201
+ margin: 0;
2202
+ opacity: 0.6;
2203
+ font-size: 0.8rem;
2204
+ }
2205
+ .whatsappHebrew[data-v-b1fdb496] {
2206
+ direction: rtl;
2207
+ }
2208
+ .whatsappHebrew .whatsapp-msg[data-v-b1fdb496]::after {
2209
+ transform: skew(-45deg);
2210
+ }
2211
+ @media screen and (max-width: 1200px) {
2212
+ .whatsapp-preview[data-v-b1fdb496] {
2213
+ width: 300px;
2214
+ }
2215
+ }
2216
+ @media screen and (max-width: 910px) {
2217
+ .whatsapp-preview[data-v-b1fdb496] {
2218
+ display: none;
2219
+ }
2220
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bagelink/vue",
3
3
  "type": "module",
4
- "version": "0.0.104",
4
+ "version": "0.0.108",
5
5
  "description": "Bagel core sdk packages",
6
6
  "author": {
7
7
  "name": "Neveh Allon",
@@ -51,13 +51,14 @@
51
51
  ],
52
52
  "dependencies": {},
53
53
  "devDependencies": {
54
+ "vue": "^3.3.8",
54
55
  "@vue-macros/reactivity-transform": "^0.4.0",
55
- "@bagelink/sdk": "0.0.104"
56
+ "@bagelink/sdk": "0.0.108"
56
57
  },
57
58
  "peerDependencies": {
58
59
  "@bagelink/sdk": "*",
59
- "vue-router": "^4.2.5",
60
- "vue": "^3.3.8",
60
+ "vue-router": "*",
61
+ "vue": "*",
61
62
  "vue3-charts": "^1.1.33",
62
63
  "@formkit/vue": "^1.3.0",
63
64
  "@formkit/core": "1.3.0",
@@ -71,12 +72,6 @@
71
72
  "prosemirror-view": "^1.32.4"
72
73
  },
73
74
  "peerDependenciesMeta": {
74
- "vue-router": {
75
- "optional": true
76
- },
77
- "vue": {
78
- "option": true
79
- },
80
75
  "vue3-charts": {
81
76
  "option": true
82
77
  },
@@ -0,0 +1 @@
1
+ export * as BarChart from './BarChart.vue';
@@ -0,0 +1 @@
1
+ export * as Lineart from './Lineart.vue';
@@ -0,0 +1,4 @@
1
+ export * as ItemRef from './ItemRef.vue';
2
+ export * as MaterialIcon from './MaterialIcon.vue';
3
+ export * as PlainInputField from './PlainInputField.vue';
4
+ export * from './inputs';
@@ -4,7 +4,6 @@ export * as MaterialIcon from './MaterialIcon.vue';
4
4
  export * as NavBar from './NavBar.vue';
5
5
  export * as Btn from './Btn.vue';
6
6
  export * as Modal from './Modal.vue';
7
- export * as BarChart from './charts/BarChart.vue';
8
7
  export * as DropDown from './DropDown.vue';
9
8
  export * as ListView from './ListView.vue';
10
9
  export * as ListItem from './ListItem.vue';
@@ -12,10 +11,15 @@ export * as TabbedLayout from './TabbedLayout.vue';
12
11
  export * as Comments from './Comments.vue';
13
12
  export * as PageTitle from './PageTitle.vue';
14
13
  export * as ModalForm from './ModalForm.vue';
15
- export * as TextInput from './form/inputs/TextInput.vue';
16
14
  export * as DataPreview from './DataPreview.vue';
17
15
  export * as FormSchema from './FormSchema.vue';
18
16
  export * as TableSchema from './TableSchema.vue';
19
17
  export * as TopBar from './TopBar.vue';
20
18
  export * as RouterWrapper from './RouterWrapper.vue';
21
19
  export * as ContactSubmissions from './ContactSubmissions.vue';
20
+
21
+ export * from './charts';
22
+ export * from './formkit';
23
+ export * from './form';
24
+ export * from './dashboard';
25
+ export * from './whatsapp';
@@ -0,0 +1,2 @@
1
+ export * as MsgTemplate from './form/MsgTemplate.vue';
2
+ export * as TextVariableExamples from './form/TextVariableExamples.vue';
package/src/index.ts CHANGED
@@ -3,7 +3,5 @@ export {
3
3
  } from './plugins/bagel';
4
4
  export { ModalPlugin, useModal } from './plugins/modal';
5
5
  export * from './utils';
6
- export * from './components';
7
- export * from './components/formkit';
8
- export * from './components/form/inputs';
9
6
  export * from './types';
7
+ export * from './components';