@salla.sa/twilight 1.6.15-alpha.9 → 2.0.0

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 (115) hide show
  1. package/README.md +4 -214
  2. package/components/README.md +55 -0
  3. package/components/dist/cjs/index-9441fd8e.js +1554 -0
  4. package/components/dist/cjs/index.cjs.js +2 -0
  5. package/components/dist/cjs/loader.cjs.js +21 -0
  6. package/components/dist/cjs/salla-login_2.cjs.entry.js +131 -0
  7. package/components/dist/cjs/twilight-components.cjs.js +19 -0
  8. package/components/dist/collection/collection-manifest.json +13 -0
  9. package/components/dist/collection/components/generate-summary.js +35 -0
  10. package/components/dist/collection/components/salla-login/salla-login.css +104 -0
  11. package/components/dist/collection/components/salla-login/salla-login.js +113 -0
  12. package/components/dist/collection/components/search-modal/search-modal.css +9 -0
  13. package/components/dist/collection/components/search-modal/search-modal.js +161 -0
  14. package/components/dist/collection/index.js +1 -0
  15. package/components/dist/collection/interfaces/colors.js +1 -0
  16. package/components/dist/collection/interfaces/index.js +2 -0
  17. package/components/dist/collection/interfaces/ratio.js +1 -0
  18. package/components/dist/collection/plugins/tailwind-theme/index.js +32 -0
  19. package/components/dist/collection/plugins/tailwind-theme/scripts/generator.js +51 -0
  20. package/components/dist/collection/utils/utils.js +16 -0
  21. package/components/dist/esm/index-63e5409f.js +1527 -0
  22. package/components/dist/esm/index.js +1 -0
  23. package/components/dist/esm/loader.js +17 -0
  24. package/components/dist/esm/polyfills/core-js.js +11 -0
  25. package/components/dist/esm/polyfills/css-shim.js +1 -0
  26. package/components/dist/esm/polyfills/dom.js +79 -0
  27. package/components/dist/esm/polyfills/es5-html-element.js +1 -0
  28. package/components/dist/esm/polyfills/index.js +34 -0
  29. package/components/dist/esm/polyfills/system.js +6 -0
  30. package/components/dist/esm/salla-login_2.entry.js +126 -0
  31. package/components/dist/esm/twilight-components.js +17 -0
  32. package/components/dist/index.cjs.js +1 -0
  33. package/components/dist/index.js +1 -0
  34. package/components/dist/twilight-components/index.esm.js +0 -0
  35. package/components/dist/twilight-components/p-3d53781c.js +1 -0
  36. package/components/dist/twilight-components/p-fccb89fa.entry.js +1 -0
  37. package/components/dist/twilight-components/twilight-components.esm.js +1 -0
  38. package/components/dist/types/components/salla-login/salla-login.d.ts +14 -0
  39. package/components/dist/types/components/search-modal/search-modal.d.ts +26 -0
  40. package/components/dist/types/components.d.ts +76 -0
  41. package/components/dist/types/index.d.ts +6 -0
  42. package/components/dist/types/interfaces/colors.d.ts +1 -0
  43. package/components/dist/types/interfaces/index.d.ts +2 -0
  44. package/components/dist/types/interfaces/ratio.d.ts +1 -0
  45. package/components/dist/types/stencil-public-runtime.d.ts +1563 -0
  46. package/components/dist/types/utils/utils.d.ts +6 -0
  47. package/components/loader/cdn.js +3 -0
  48. package/components/loader/index.cjs.js +3 -0
  49. package/components/loader/index.d.ts +13 -0
  50. package/components/loader/index.es2017.js +3 -0
  51. package/components/loader/index.js +4 -0
  52. package/components/loader/package.json +10 -0
  53. package/components/package.json +70 -0
  54. package/components/src/plugins/tailwind-theme/index.js +32 -0
  55. package/components/src/plugins/tailwind-theme/package.json +27 -0
  56. package/components/src/plugins/tailwind-theme/readme.md +47 -0
  57. package/components/src/plugins/tailwind-theme/safe-list-css.txt +19 -0
  58. package/components/src/plugins/tailwind-theme/utilities.json +1 -0
  59. package/components.js +1 -0
  60. package/dist/twilight.js +2 -0
  61. package/dist/twilight.js.LICENSE.txt +27 -0
  62. package/package.json +53 -63
  63. package/postInstall.js +2 -0
  64. package/tailwind.js +1 -0
  65. package/tailwind_css_list.js +1 -0
  66. package/watcher.js +20 -62
  67. package/LICENSE.md +0 -674
  68. package/dist/@salla.sa/twilight.min.js +0 -20
  69. package/dist/@salla.sa/twilight.min.js.map +0 -1
  70. package/dist/cjs/index.js +0 -2
  71. package/dist/cjs/index.js.map +0 -1
  72. package/dist/esm/index.js +0 -2
  73. package/dist/esm/index.js.map +0 -1
  74. package/types/actions.d.ts +0 -47
  75. package/types/api/auth/index.d.ts +0 -17
  76. package/types/api/auth/request.d.ts +0 -42
  77. package/types/api/auth/response.d.ts +0 -22
  78. package/types/api/cart/index.d.ts +0 -24
  79. package/types/api/cart/request.d.ts +0 -8
  80. package/types/api/cart/response.d.ts +0 -66
  81. package/types/api/comment.d.ts +0 -18
  82. package/types/api/currency.d.ts +0 -17
  83. package/types/api/document.d.ts +0 -3
  84. package/types/api/index.d.ts +0 -110
  85. package/types/api/loyalty.d.ts +0 -226
  86. package/types/api/order.d.ts +0 -15
  87. package/types/api/product/index.d.ts +0 -17
  88. package/types/api/product/request.d.ts +0 -53
  89. package/types/api/product/response.d.ts +0 -103
  90. package/types/api/profile.d.ts +0 -60
  91. package/types/api/rating.d.ts +0 -49
  92. package/types/api/scope.d.ts +0 -42
  93. package/types/api/wishlist.d.ts +0 -7
  94. package/types/common.d.ts +0 -75
  95. package/types/event/auth.d.ts +0 -18
  96. package/types/event/cart.d.ts +0 -30
  97. package/types/event/comment.d.ts +0 -7
  98. package/types/event/currency.d.ts +0 -9
  99. package/types/event/document.d.ts +0 -29
  100. package/types/event/index.d.ts +0 -48
  101. package/types/event/infiniteScroll.d.ts +0 -12
  102. package/types/event/loyalty.d.ts +0 -14
  103. package/types/event/order.d.ts +0 -11
  104. package/types/event/product.d.ts +0 -30
  105. package/types/event/profile.d.ts +0 -19
  106. package/types/event/rating.d.ts +0 -13
  107. package/types/event/scope.d.ts +0 -15
  108. package/types/event/wishlist.d.ts +0 -8
  109. package/types/helpers/app-helpers.d.ts +0 -29
  110. package/types/index.d.ts +0 -37
  111. package/types/lib/config.ts +0 -14
  112. package/types/lib/form.d.ts +0 -8
  113. package/types/lib/lang.d.ts +0 -14
  114. package/types/lib/notify.d.ts +0 -14
  115. package/types/tiwlight-config.d.ts +0 -74
package/README.md CHANGED
@@ -1,222 +1,12 @@
1
+ # Salla Twilight
1
2
 
2
- <div id="top"></div>
3
3
 
4
- <br />
5
- <div align="center">
6
- <a href="https://salla.dev">
7
- <img src="https://salla.dev/wp-content/themes/salla-portal/dist/img/salla-logo.svg" alt="Logo" width="80" height="80">
8
- </a>
9
- <h1 align="center">Twilight JS APIs</h1>
10
- <p align="center">
11
- A JavaScript SDK for the Salla storefront APIs provides helper methods, or REST API endpoints, that allow communication between the frontend and backend.
12
- <br />
13
- <a href="https://salla.dev/"><strong>Explore our blogs »</strong></a>
14
- <br />
15
- <br />
16
- <a href="https://github.com/SallaApp/Salla-CLI/issues/new">Report Bug</a> ·
17
- <a href="https://github.com/SallaApp/Salla-CLI/discussions/new">Request Feature</a> .
18
- <a href="https://t.me/salladev">&lt;/Salla Developers&gt;</a> .
19
- <a href="https://salla.stoplight.io/docs/twilight-themes-documentation/3ac843cae76a2-overview">Official Documentation</a>
20
- </p>
21
- </div>
4
+ ### Events `salla.event` base on [EventEmitter2](https://github.com/EventEmitter2/EventEmitter2)
22
5
 
23
- <!-- TABLE OF CONTENTS -->
24
- <details open>
25
- <summary>Table of Contents</summary>
26
- <ol>
27
- <li>
28
- <a href="#overview">Overview</a>
29
- </li>
30
- <li>
31
- <a href="#getting-started">Getting Started</a>
32
- <ul>
33
- <li><a href="#sdks-main-apis">SDK's main APIs</a></li>
34
- <li><a href="#use-cases">Use cases</a></li>
35
- </ul>
36
- <li><a href="#installation">Installation</a></li>
37
- <ul>
38
- <li><a href="#initialization">Initialization</a></li>
39
- </ul>
40
- <li><a href="#usage">Usage</a></li>
41
- <ul>
42
- <li><a href="#basic-configuration">Basic configuration </a></li>
43
- </ul>
44
- <li><a href="#support">Support</a></li>
45
- <li><a href="#contributing">Contributing</a></li>
46
- <li><a href="#credits">Credits</a></li>
47
- <li><a href="#license">License</a></li>
48
- </li>
49
- </ol>
50
- </details>
51
- <!-- Overview -->
52
6
 
53
- ## Overview
54
7
 
55
- **Twilight** comes with a **JavaScript SDK** for the Salla storefront APIs. This is to provide the developers with helper methods, or REST API endpoints, that allow communication between the frontend and backend. As a result, developers may use these methods to make merchants' stores dynamic after using the API features and data. In this documentation, we will be referring to it as **Twilight JS SDK** for short.
8
+ # Installing
56
9
 
57
- ## Getting Started
58
- **SDK** stands for "software development kit," and it refers to a library for interacting with a specific REST API using JavaScript.
59
-
60
- ### SDK's main APIs
61
- The main parts of the **Twilight JS SDK** includes REST API endpoints that ease the actions related to the APIs request, such as:
62
- - **Authorization APIs:** Several endpoints for customer logging in, logging out, and many more.
63
- - **Cart APIs:** Customer's cart list of endpoints.
64
- - **Comments APIs:** Group of endpoints related to the customer comments, or feedback, on product or page.
65
- - **Currency APIs:** Group of endpoints related to the store's currencies list.
66
- - **Order APIs:** Customer's orders related endpoints.
67
- - **Product APIs**: Product related endpoints.
68
- - **Profile APIs:** Customer's profile endpoints.
69
- - **Rating APIs:** endpoints related to the store, product, order, shipping rating.
70
- - **Wishlist APIs:** Customer's wishlist endpoints.
71
-
72
- ### Use cases
73
- Following are some of the possible uses of the Twilight JS SDK:
74
- - Authenticating customers and allowing them to edit account details.
75
- - Adding a product directly from the products list to the customer art.
76
- - Returning the price of a product.
77
- - Adding a product to the customer's wishlist.
78
- - Rating the shipping company responsible for delivering orders.
79
- - And many more!
80
-
81
- <p align="right">(<a href="#top">back to top</a>)</p>
82
-
83
- ## Installation
84
- **Twilight JS SDK** can be installed from the `npm` using the following commands:
85
-
86
- ```npm title="NPM Installation Command"
87
- npm install @salla.sa/twilight --save
88
10
  ```
89
-
90
- ```yarn title="Yarn Installation Command"
91
- yarn add @salla.sa/twilight
11
+ npm install @salla.sa/twiglight
92
12
  ```
93
-
94
- ### Initialization
95
-
96
- The following snippet of code will give the basic version of the SDK where the configurations are set to their minimum requirements, for example, store URL. The method `salla.init()` is used to setup and initialize the SDK.
97
-
98
- ```js
99
- <script>
100
- salla.init({
101
- debug: true,
102
- store: {
103
- id: 693312468,
104
- url: "https://my_store.test/"
105
- }
106
- });
107
- </script>
108
- ```
109
- <p align="right">(<a href="#top">back to top</a>)</p>
110
-
111
- ## Usage
112
-
113
- As a result of the SDK initialization, the developer will be able to use any of the SDK's main APIs. For example, the method `addItem` adds an item into the cart, the developer may call the method `addItem` as follows:
114
-
115
- ```js
116
- salla.cart.addItem({
117
- id: 1234,
118
- quantity: 1,
119
- notes: "please i need to get the red color"
120
- }).then((response) => {
121
- /* add your code here */
122
- });
123
- ```
124
- In addition to the above example, the method `addItem` may adds an item with multiple options to the carts as follows:
125
- ```js
126
- salla.cart.addItem({
127
- id: 1234,
128
- quantity: 1,
129
- options: {
130
- 117414452: 11232214, // option value id (select choice)
131
- 117416632: "http://option-value-as-url-of-image.com",
132
- 117411132: "option value as string"
133
- },
134
- notes: "please i need to get the red color"
135
- }).then((response) => {
136
- /* add your code here */
137
- });
138
- ```
139
-
140
- Furthermore, a large number of store events will be available for use. Thus, the developer's theme may be configured to respond automatically to a variety of activities, such as:
141
-
142
- - The user requested an Access Code to perform a login, however, the code was not sent. For this scenario, using the method `salla.event.auth.onCodeNotSent()` can be used.
143
-
144
- - A new item has been added to the cart via the `salla.cart.event.onItemAdded()` method.
145
-
146
- - The user added a new item to the Wishlist using the method `salla.event.wishlist.onAdded()`.
147
-
148
- Full example for that would be the event `onItemAdded` which is triggered when adding an item to the cart is done without having any errors coming back from the backend:
149
- ```js
150
- salla.cart.event.onItemAdded((response) => {
151
- console.log(response)
152
- });
153
- ```
154
- On the over hand, the event `onItemAddedFailed` is triggered when adding an item to the cart is not completed and an error has occurred. For example, the id of the product to be added to the cart was not found.
155
- ```js
156
- salla.cart.event.onItemAddedFailed((errorMessage) => {
157
- console.log(errorMessage)
158
- });
159
- ```
160
-
161
-
162
- ### Basic configuration
163
-
164
- Aside from calling the APIs, the developer has the ability to configure the Twilight engine to meet the needs of his theme. This list of the available configurations can be found in this [article](https://salla.stoplight.io/docs/twilight-themes-documentation/ZG9jOjQ4OTE2NDQ5-configuration). For this purpose, the method `salla.config.get()` is used to retrieve a configuration value, while `salla.config.set()` is used to set a configuration value.
165
-
166
- #### Set configuration value
167
- The developer may set the debug mode to be activated. That is to state, the theme will be run in a debugger. This means that the debugger keeps track of everything that happens while the theme is running.
168
-
169
- ```js
170
- salla.config.set('debug', true)
171
- ```
172
-
173
- #### Get configuration value
174
- Similarly, the developer can use the method'salla.config.get()' to get any value from the configuration file. To retrive simaple value such as the user Id, the following syntax can be followed:
175
-
176
- ```js
177
- salla.config.get('user.id’)
178
- ```
179
-
180
- Furthermore, if the required value is nested inside an inner value, such as a currency code, the following syntax can be followed:
181
-
182
- ```js
183
- salla.config.get('curremcies.SAR.code’)
184
- ```
185
-
186
- <p align="right">(<a href="#top">back to top</a>)</p>
187
-
188
- ## Support
189
-
190
- The team is always here to help you. Happen to face an issue? Want to report a bug? You can submit one here on Github using the [Issue Tracker](https://github.com/SallaApp/twilight-vscode-extension/issues/new). If you still have any questions, please contact us via the [Telegram Bot](https://t.me/SallaSupportBot) or join in the Global Developer Community on [Telegram](https://t.me/salladev).
191
-
192
- <p align="right">(<a href="#top">back to top</a>)</p>
193
-
194
- ## Contributing
195
-
196
- Contributions are what make the open-source community such an amazing place to learn, inspire, and create.
197
- Any contributions you make are **greatly appreciated**.
198
-
199
- If you have a suggestion that would make this better, please fork the repo and create a pull request.
200
- You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!
201
-
202
- 1. Fork the Project
203
- 2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
204
- 3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
205
- 4. Push to the Branch (`git push origin feature/AmazingFeature`)
206
- 5. Open a Pull Request
207
-
208
- <p align="right">(<a href="#top">back to top</a>)</p>
209
-
210
- ## Credits
211
-
212
- - [Salla](https://github.com/sallaApp)
213
- - [All Contributors](../../contributors)
214
-
215
- <p align="right">(<a href="#top">back to top</a>)</p>
216
-
217
- ## License
218
-
219
- The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
220
-
221
- <p align="right">(<a href="#top">back to top</a>)</p>
222
-
@@ -0,0 +1,55 @@
1
+ # Twilight Components
2
+
3
+ Salla web components for building web applications.
4
+
5
+ ## Components
6
+
7
+ - [ ] [blocks](#)
8
+ - [*] [salla-search-modal](src/components/search-modal/readme.md)
9
+ - [ ] [salla-login](src/components/search-modal/readme.md)
10
+
11
+ ## Install
12
+
13
+ ### npm
14
+
15
+ ```
16
+ npm install @salla.sa/twilight-components
17
+ ```
18
+
19
+ ### yarn
20
+
21
+ ```
22
+ yarn add @salla.sa/twilight-components
23
+ ```
24
+
25
+ ## Usage
26
+
27
+ ```
28
+ # npm link
29
+ npm install @salla.sa/twilight-components
30
+ npm install @salla.sa/twilight-tailwind-theme
31
+ // or npm install {full-path-of-folder}
32
+
33
+ // inclued dev
34
+ require('@salla.sa/twilight-components/dist/twilight-components/twilight-components.esm')
35
+ // include prod
36
+ require('@salla.sa/twilight-components')
37
+ ```
38
+
39
+
40
+ ## Publish
41
+
42
+ ### @salla.sa/twilight-components
43
+
44
+ ```
45
+ npm version patch
46
+ npm publish --access private
47
+ ```
48
+
49
+ ### @salla.sa/plugins
50
+
51
+ todo :: finx the publish scripts
52
+
53
+ ```
54
+ node publish.js
55
+ ```