traitify-widgets 1.10.3-alpha.0 → 1.12.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.
package/README.md CHANGED
@@ -22,11 +22,13 @@ The widgets can be installed through our CDN or npm. Usage through the CDN will
22
22
  ### npm
23
23
 
24
24
  #### Installation
25
+
25
26
  ```
26
27
  npm i --save traitify-widgets
27
28
  ```
28
29
 
29
30
  #### Usage
31
+
30
32
  ```
31
33
  import traitify from "traitify-widgets";
32
34
 
@@ -43,26 +45,31 @@ assessment.render();
43
45
  ### All Decks
44
46
 
45
47
  #### SlideDeck
48
+
46
49
  ```
47
50
  assessment.render("SlideDeck"); // Render just the SlideDeck in the target element
48
51
  ```
49
52
 
50
53
  #### Results
54
+
51
55
  ```
52
56
  assessment.render("Results"); // Render just the Results in the target element
53
57
  ```
54
58
 
55
59
  #### Personality Types/Dimensions
60
+
56
61
  ```
57
62
  assessment.render("PersonalityTypes"); // Render just the Type/Dimensions in the target element
58
63
  ```
59
64
 
60
65
  #### Personality Traits
66
+
61
67
  ```
62
68
  assessment.render("PersonalityTraits"); // Render just the Traits in the target element
63
69
  ```
64
70
 
65
71
  #### Personality Details
72
+
66
73
  ```
67
74
  assessment.render("PersonalityDetails"); // Render just the details in the target element
68
75
  ```
@@ -70,6 +77,7 @@ assessment.render("PersonalityDetails"); // Render just the details in the targe
70
77
  ### Type Based Decks (ex. career-deck, core, heroes)
71
78
 
72
79
  #### Personality Blend
80
+
73
81
  ```
74
82
  assessment.render("PersonalityBlend"); // Render just the Blend in the target element
75
83
  ```
@@ -77,6 +85,7 @@ assessment.render("PersonalityBlend"); // Render just the Blend in the target el
77
85
  ### Careers Deck Components (career-deck)
78
86
 
79
87
  #### Render All Career Components
88
+
80
89
  ```
81
90
  assessment.render("Careers"); // Render all the career components
82
91
  ```
@@ -84,16 +93,19 @@ assessment.render("Careers"); // Render all the career components
84
93
  #### Specific Career Components
85
94
 
86
95
  #### Career Filter
96
+
87
97
  ```
88
98
  assessment.render("CareerFilter"); // Render the career filter
89
99
  ```
90
100
 
91
101
  #### Career Results
102
+
92
103
  ```
93
104
  assessment.render("CareerResults"); // Render the career list
94
105
  ```
95
106
 
96
107
  #### Career Modal
108
+
97
109
  ```
98
110
  assessment.render("CareerModal"); // Render the career modal
99
111
  ```
@@ -101,6 +113,7 @@ assessment.render("CareerModal"); // Render the career modal
101
113
  ### Additional Career Component Customizations
102
114
 
103
115
  #### Add content to the Career Filter
116
+
104
117
  ```
105
118
  // Add content to the career filter
106
119
  Traitify.ui.on("CareerFilter.updated", function(context){
@@ -109,6 +122,7 @@ Traitify.ui.on("CareerFilter.updated", function(context){
109
122
  ```
110
123
 
111
124
  #### Add content to the Career Modal
125
+
112
126
  ```
113
127
  // Add content to the career modal
114
128
  Traitify.ui.on("CareerModal.updated", function(context){
@@ -118,23 +132,28 @@ Traitify.ui.on("CareerModal.updated", function(context){
118
132
  ```
119
133
 
120
134
  #### Trigger a refresh of the career results with different params
135
+
121
136
  ```
122
137
  // Update parameters and re-request careers
123
138
  Traitify.ui.trigger("Careers.mergeParams", this, {experienceLevels: [4, 5], page: 1});
124
139
  ```
125
140
 
126
141
  #### Get your careers from a different endpoint
142
+
127
143
  This is useful if you want to get the career results server side and modify the data returned or just want to proxy through your own server.
144
+
128
145
  ```
129
146
  Traitify.ui.options.careerOptions.path = "/my-career-endpoint";
130
147
  ```
131
148
 
132
149
  #### Change which experience levels are in the filter
150
+
133
151
  ```
134
152
  Traitify.ui.options.careerOptions.experienceLevels = [4, 5];
135
153
  ```
136
154
 
137
155
  #### Change how many results to show per page
156
+
138
157
  ```
139
158
  Traitify.ui.options.careerOptions.perPage = 10;
140
159
  ```
@@ -142,88 +161,99 @@ Traitify.ui.options.careerOptions.perPage = 10;
142
161
  ### Dimension Based Decks (big-five)
143
162
 
144
163
  #### Radar Graph
164
+
145
165
  ```
146
166
  assessment.render("Radar"); // Render just the Radar graph in the target element
147
167
  ```
148
168
 
149
169
  #### Personality Heading
170
+
150
171
  ```
151
172
  assessment.render("PersonalityHeading"); // Render just the archetype in the target element
152
173
  ```
153
174
 
154
175
  ### Interview Guide
176
+
155
177
  #### Interview questions for big-five assessments
178
+
156
179
  ```
157
180
  assessment.render("Guide"); // Given an assessmentID with results, render just the Interview in the target element
158
181
  ```
159
182
 
160
183
  ### Render multiple components in specific elements
184
+
161
185
  ```
162
- assessment.targets({
163
- "SlideDeck": "#slide-deck",
164
- "PersonalityTypes": "#personality-types",
165
- "PersonalityTraits": "#personality-traits",
166
- "Results": "#results",
167
- "Careers": "#careers",
168
- "Guide": "#guide",
169
- });
186
+ assessment.targets({
187
+ "SlideDeck": "#slide-deck",
188
+ "PersonalityTypes": "#personality-types",
189
+ "PersonalityTraits": "#personality-traits",
190
+ "Results": "#results",
191
+ "Careers": "#careers",
192
+ "Guide": "#guide",
193
+ });
170
194
 
171
- assessment.render();
195
+ assessment.render();
172
196
  ```
173
197
 
174
198
  ## Events
199
+
175
200
  ```
176
- // Event handlers must be set before the render command, or they will not be called.
177
- assessment.on("SlideDeck.Finished", function(){
178
- console.log("SlideDeck.Finished");
179
- });
201
+ // Event handlers must be set before the render command, or they will not be called.
202
+ assessment.on("SlideDeck.Finished", function(){
203
+ console.log("SlideDeck.Finished");
204
+ });
180
205
 
181
- assessment.on("SlideDeck.Initialized", function(){
182
- console.log("SlideDeck.Initialized");
183
- });
206
+ assessment.on("SlideDeck.Initialized", function(){
207
+ console.log("SlideDeck.Initialized");
208
+ });
184
209
 
185
- assessment.on("SlideDeck.IsReady", function(){
186
- console.log("SlideDeck.IsReady");
187
- });
210
+ assessment.on("SlideDeck.IsReady", function(){
211
+ console.log("SlideDeck.IsReady");
212
+ });
188
213
 
189
- assessment.on("SlideDeck.UpdateSlide", function(event, slideResponse){
190
- console.log("SlideDeck.UpdateSlide");
191
- console.log(slideResponse);
192
- });
214
+ assessment.on("SlideDeck.UpdateSlide", function(event, slideResponse){
215
+ console.log("SlideDeck.UpdateSlide");
216
+ console.log(slideResponse);
217
+ });
193
218
 
194
- assessment.on("SlideDeck.BackSlide", function(){
195
- console.log("SlideDeck.BackSlide");
196
- });
219
+ assessment.on("SlideDeck.BackSlide", function(){
220
+ console.log("SlideDeck.BackSlide");
221
+ });
197
222
 
198
- assessment.on("SlideDeck.Fullscreen", function(event, isFullScreen){
199
- console.log("SlideDeck.Fullscreen");
200
- console.log(isFullScreen);
201
- });
223
+ assessment.on("SlideDeck.Fullscreen", function(event, isFullScreen){
224
+ console.log("SlideDeck.Fullscreen");
225
+ console.log(isFullScreen);
226
+ });
202
227
 
203
- assessment.on("Results.Initialized", function(){
204
- console.log("Results.Initialized");
205
- });
228
+ assessment.on("Results.Initialized", function(){
229
+ console.log("Results.Initialized");
230
+ });
206
231
 
207
- assessment.on("PersonalityTypes.Initialized", function(){
208
- console.log("PersonalityTypes.Initialized");
209
- });
232
+ assessment.on("PersonalityTypes.Initialized", function(){
233
+ console.log("PersonalityTypes.Initialized");
234
+ });
210
235
 
211
- assessment.on("PersonalityTraits.Initialized", function(){
212
- console.log("PersonalityTraits.Initialized");
213
- });
236
+ assessment.on("PersonalityTraits.Initialized", function(){
237
+ console.log("PersonalityTraits.Initialized");
238
+ });
214
239
  ```
215
240
 
216
241
  ## Options
242
+
217
243
  ### Internationalization Options
244
+
218
245
  ```
219
246
  // Set globally
220
247
  Traitify.ui.setLocale("es-us");
221
248
  ```
249
+
222
250
  or
251
+
223
252
  ```
224
253
  // Set just for the instance of the widget
225
254
  assessment.locale("nl-nl");
226
255
  ```
256
+
227
257
  Here is a list of the available locales (`en-us` is the default):
228
258
  - Chinese - `zh-cn`
229
259
  - Creole - `ht-us`
@@ -239,28 +269,33 @@ Here is a list of the available locales (`en-us` is the default):
239
269
  - Swedish - `sv-se`
240
270
 
241
271
  ### Render a back button to allow users to change answers during the test
272
+
242
273
  ```
243
- assessment.allowBack();
274
+ assessment.allowBack();
244
275
  ```
245
276
 
246
277
  ### Allow the user to click a button to go full screen
278
+
247
279
  ```
248
- assessment.allowFullscreen();
280
+ assessment.allowFullscreen();
249
281
  ```
250
282
 
251
283
  ### Allow the user to view section results section headers
284
+
252
285
  ```
253
- assessment.allowHeaders();
286
+ assessment.allowHeaders();
254
287
  ```
255
288
 
256
289
  ### Render results using specific perspective
290
+
257
291
  \* currently only the `big-five` assessment has perspective content
292
+
258
293
  ```
259
- assessment.perspective("firstPerson");
294
+ assessment.perspective("firstPerson");
260
295
 
261
- OR
296
+ OR
262
297
 
263
- assessment.perspective("thirdPerson");
298
+ assessment.perspective("thirdPerson");
264
299
  ```
265
300
 
266
301
  ## Reports
@@ -271,7 +306,7 @@ Set the perspective and view options to display our Big Five Personality Reports
271
306
 
272
307
  ```
273
308
  assessment.perspective("thirdPerson");
274
- assessment.view("candidate");
309
+ assessment.view("manager");
275
310
  ```
276
311
 
277
312
  This report also makes use of a benchmark/recommendation. It will default to the benchmark used to create an assessment. To use a different benchmark, you can pass the ID as an option.
@@ -295,6 +330,7 @@ assessment.view("employee");
295
330
  ```
296
331
 
297
332
  ## Traitify Client
333
+
298
334
  We expose our JavaScript api client that you can use to make additional calls to our API from the client side. We make available `get`, `put`, and `post` functions. These methods will use the api key and url you configured when you initialized the Traitify library. Here is an example that returns career matches for a `career-deck` assessment. Further documentation on the API methods available can be found at https://app.traitify.com/developer/documentation.
299
335
 
300
336
  ```