clapton 0.0.19 → 0.0.21

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.
@@ -386,6 +386,27 @@ var Clapton = (function (exports) {
386
386
  }
387
387
  }
388
388
 
389
+ class Component {
390
+ constructor(state = {}, id = Math.random().toString(36).substring(2, 10), errors = []) {
391
+ this._state = state;
392
+ this.id = id;
393
+ this._errors = errors;
394
+ }
395
+ get render() {
396
+ return new Box({});
397
+ }
398
+ get renderWrapper() {
399
+ const root = this.render;
400
+ if (root.attributes) {
401
+ root.attributes = { ...root.attributes, data: { ...root.attributes.data, component: this.constructor.name, state: JSON.stringify(this._state), id: this.id, errors: this._errors } };
402
+ }
403
+ else {
404
+ root.attributes = { data: { component: this.constructor.name, state: JSON.stringify(this._state), id: this.id, errors: this._errors } };
405
+ }
406
+ return root.renderWrapper;
407
+ }
408
+ }
409
+
389
410
  class TextField {
390
411
  constructor(state, attribute, attributes = {}) {
391
412
  this.state = state;
@@ -427,110 +448,6 @@ var Clapton = (function (exports) {
427
448
  }
428
449
  }
429
450
 
430
- const Clapton = {
431
- Box, Component, Text, TextField, Button, DateTimeField, BlockQuote, Checkbox, Code, Element, Emphasis, Form, Heading, Image, Link, List, ListItem, OrderedList, Paragraph, Quote, RadioButton, Select, Span, Embed, Bold, TextArea
432
- };
433
-
434
- class Presets {
435
- bq(...props) {
436
- return new Clapton.BlockQuote(...props);
437
- }
438
- box(...props) {
439
- return new Clapton.Box(...props);
440
- }
441
- b(...props) {
442
- return new Clapton.Bold(...props);
443
- }
444
- button(...props) {
445
- return new Clapton.Button(...props);
446
- }
447
- check(...props) {
448
- return new Clapton.Checkbox(props[0], props[1], props[2]);
449
- }
450
- code(...props) {
451
- return new Clapton.Code(...props);
452
- }
453
- datetime(...props) {
454
- return new Clapton.DateTimeField(props[0], props[1], props[2]);
455
- }
456
- el(...props) {
457
- return new Clapton.Element(props[0], props[1]);
458
- }
459
- embed(...props) {
460
- return new Clapton.Embed(props[0]);
461
- }
462
- em(...props) {
463
- return new Clapton.Emphasis(...props);
464
- }
465
- form(...props) {
466
- return new Clapton.Form(...props);
467
- }
468
- h(...props) {
469
- return new Clapton.Heading(props[0], props[1]);
470
- }
471
- img(...props) {
472
- return new Clapton.Image(props[0], props[1], props[2]);
473
- }
474
- a(...props) {
475
- return new Clapton.Link(props[0], props[1]);
476
- }
477
- li(...props) {
478
- return new Clapton.ListItem(...props);
479
- }
480
- ul(...props) {
481
- return new Clapton.List(...props);
482
- }
483
- ol(...props) {
484
- return new Clapton.OrderedList(...props);
485
- }
486
- p(...props) {
487
- return new Clapton.Paragraph(...props);
488
- }
489
- q(...props) {
490
- return new Clapton.Quote(...props);
491
- }
492
- radio(...props) {
493
- return new Clapton.RadioButton(props[0], props[1], props[2]);
494
- }
495
- select(...props) {
496
- return new Clapton.Select(props[0], props[1], props[2]);
497
- }
498
- span(...props) {
499
- return new Clapton.Span(...props);
500
- }
501
- textarea(...props) {
502
- return new Clapton.TextArea(props[0], props[1], props[2]);
503
- }
504
- input(...props) {
505
- return new Clapton.TextField(props[0], props[1], props[2]);
506
- }
507
- text(...props) {
508
- return new Clapton.Text(props[0]);
509
- }
510
- }
511
-
512
- class Component {
513
- constructor(state = {}, id = Math.random().toString(36).substring(2, 10), errors = []) {
514
- this._state = state;
515
- this.id = id;
516
- this._errors = errors;
517
- this._c = new Presets();
518
- }
519
- get render() {
520
- return new Box({});
521
- }
522
- get renderWrapper() {
523
- const root = this.render;
524
- if (root.attributes) {
525
- root.attributes = { ...root.attributes, data: { ...root.attributes.data, component: this.constructor.name, state: JSON.stringify(this._state), id: this.id, errors: this._errors } };
526
- }
527
- else {
528
- root.attributes = { data: { component: this.constructor.name, state: JSON.stringify(this._state), id: this.id, errors: this._errors } };
529
- }
530
- return root.renderWrapper;
531
- }
532
- }
533
-
534
451
  exports.BlockQuote = BlockQuote;
535
452
  exports.Bold = Bold;
536
453
  exports.Box = Box;
@@ -383,90 +383,11 @@ class Span {
383
383
  }
384
384
  }
385
385
 
386
- class Presets {
387
- bq(...props) {
388
- return new Clapton.BlockQuote(...props);
389
- }
390
- box(...props) {
391
- return new Clapton.Box(...props);
392
- }
393
- b(...props) {
394
- return new Clapton.Bold(...props);
395
- }
396
- button(...props) {
397
- return new Clapton.Button(...props);
398
- }
399
- check(...props) {
400
- return new Clapton.Checkbox(props[0], props[1], props[2]);
401
- }
402
- code(...props) {
403
- return new Clapton.Code(...props);
404
- }
405
- datetime(...props) {
406
- return new Clapton.DateTimeField(props[0], props[1], props[2]);
407
- }
408
- el(...props) {
409
- return new Clapton.Element(props[0], props[1]);
410
- }
411
- embed(...props) {
412
- return new Clapton.Embed(props[0]);
413
- }
414
- em(...props) {
415
- return new Clapton.Emphasis(...props);
416
- }
417
- form(...props) {
418
- return new Clapton.Form(...props);
419
- }
420
- h(...props) {
421
- return new Clapton.Heading(props[0], props[1]);
422
- }
423
- img(...props) {
424
- return new Clapton.Image(props[0], props[1], props[2]);
425
- }
426
- a(...props) {
427
- return new Clapton.Link(props[0], props[1]);
428
- }
429
- li(...props) {
430
- return new Clapton.ListItem(...props);
431
- }
432
- ul(...props) {
433
- return new Clapton.List(...props);
434
- }
435
- ol(...props) {
436
- return new Clapton.OrderedList(...props);
437
- }
438
- p(...props) {
439
- return new Clapton.Paragraph(...props);
440
- }
441
- q(...props) {
442
- return new Clapton.Quote(...props);
443
- }
444
- radio(...props) {
445
- return new Clapton.RadioButton(props[0], props[1], props[2]);
446
- }
447
- select(...props) {
448
- return new Clapton.Select(props[0], props[1], props[2]);
449
- }
450
- span(...props) {
451
- return new Clapton.Span(...props);
452
- }
453
- textarea(...props) {
454
- return new Clapton.TextArea(props[0], props[1], props[2]);
455
- }
456
- input(...props) {
457
- return new Clapton.TextField(props[0], props[1], props[2]);
458
- }
459
- text(...props) {
460
- return new Clapton.Text(props[0]);
461
- }
462
- }
463
-
464
386
  class Component {
465
387
  constructor(state = {}, id = Math.random().toString(36).substring(2, 10), errors = []) {
466
388
  this._state = state;
467
389
  this.id = id;
468
390
  this._errors = errors;
469
- this._c = new Presets();
470
391
  }
471
392
  get render() {
472
393
  return new Box({});
@@ -34,6 +34,37 @@ export default [
34
34
  })
35
35
  ]
36
36
  },
37
+ {
38
+ input: 'src/c.ts',
39
+ output: {
40
+ file: 'dist/c.js',
41
+ format: 'esm'
42
+ },
43
+ plugins: [
44
+ resolve(),
45
+ commonjs(),
46
+ typescript({
47
+ tsconfig: './tsconfig.json',
48
+ sourceMap: false
49
+ })
50
+ ]
51
+ },
52
+ {
53
+ input: 'src/c-for-test.ts',
54
+ output: {
55
+ file: 'dist/c-for-test.js',
56
+ format: 'iife',
57
+ name: 'c'
58
+ },
59
+ plugins: [
60
+ resolve(),
61
+ commonjs(),
62
+ typescript({
63
+ tsconfig: './tsconfig.json',
64
+ sourceMap: false
65
+ })
66
+ ]
67
+ },
37
68
  {
38
69
  input: 'src/client.ts',
39
70
  output: {
@@ -0,0 +1,160 @@
1
+ import { Clapton } from "components"
2
+
3
+ const bq = (...props: any[]) => {
4
+ return new Clapton.BlockQuote(...props)
5
+ }
6
+
7
+ const box = (...props: any[]) => {
8
+ return new Clapton.Box(...props)
9
+ }
10
+
11
+ const b = (...props: any[]) => {
12
+ return new Clapton.Bold(...props)
13
+ }
14
+
15
+ const button = (...props: any[]) => {
16
+ return new Clapton.Button(...props)
17
+ }
18
+
19
+ const check = (...props: any[]) => {
20
+ return new Clapton.Checkbox(props[0], props[1], props[2])
21
+ }
22
+
23
+ const code = (...props: any[]) => {
24
+ return new Clapton.Code(...props)
25
+ }
26
+
27
+ const datetime = (...props: any[]) => {
28
+ return new Clapton.DateTimeField(props[0], props[1], props[2])
29
+ }
30
+
31
+ const el = (...props: any[]) => {
32
+ return new Clapton.Element(props[0], props[1])
33
+ }
34
+
35
+ const embed = (...props: any[]) => {
36
+ return new Clapton.Embed(props[0])
37
+ }
38
+
39
+ const em = (...props: any[]) => {
40
+ return new Clapton.Emphasis(...props)
41
+ }
42
+
43
+ const form = (...props: any[]) => {
44
+ return new Clapton.Form(...props)
45
+ }
46
+
47
+ const h = (...props: any[]) => {
48
+ return new Clapton.Heading(props[0], props[1])
49
+ }
50
+
51
+ const img = (...props: any[]) => {
52
+ return new Clapton.Image(props[0], props[1], props[2])
53
+ }
54
+
55
+ const a = (...props: any[]) => {
56
+ return new Clapton.Link(props[0], props[1])
57
+ }
58
+
59
+ const li = (...props: any[]) => {
60
+ return new Clapton.ListItem(...props)
61
+ }
62
+
63
+ const ul = (...props: any[]) => {
64
+ return new Clapton.List(...props)
65
+ }
66
+
67
+ const ol = (...props: any[]) => {
68
+ return new Clapton.OrderedList(...props)
69
+ }
70
+
71
+ const p = (...props: any[]) => {
72
+ return new Clapton.Paragraph(...props)
73
+ }
74
+
75
+ const q = (...props: any[]) => {
76
+ return new Clapton.Quote(...props)
77
+ }
78
+
79
+ const radio = (...props: any[]) => {
80
+ return new Clapton.RadioButton(props[0], props[1], props[2])
81
+ }
82
+
83
+ const select = (...props: any[]) => {
84
+ return new Clapton.Select(props[0], props[1], props[2])
85
+ }
86
+
87
+ const span = (...props: any[]) => {
88
+ return new Clapton.Span(...props)
89
+ }
90
+
91
+ const textarea = (...props: any[]) => {
92
+ return new Clapton.TextArea(props[0], props[1], props[2])
93
+ }
94
+
95
+ const input = (...props: any[]) => {
96
+ return new Clapton.TextField(props[0], props[1], props[2])
97
+ }
98
+
99
+ const text = (...props: any[]) => {
100
+ return new Clapton.Text(props[0])
101
+ }
102
+
103
+ const c = (name: string, ...props: any[]) => {
104
+ switch (name) {
105
+ case "bq":
106
+ return bq(...props)
107
+ case "box":
108
+ return box(...props)
109
+ case "b":
110
+ return b(...props)
111
+ case "button":
112
+ return button(...props)
113
+ case "check":
114
+ return check(...props)
115
+ case "code":
116
+ return code(...props)
117
+ case "datetime":
118
+ return datetime(...props)
119
+ case "el":
120
+ return el(...props)
121
+ case "embed":
122
+ return embed(...props)
123
+ case "em":
124
+ return em(...props)
125
+ case "form":
126
+ return form(...props)
127
+ case "h":
128
+ return h(...props)
129
+ case "img":
130
+ return img(...props)
131
+ case "a":
132
+ return a(...props)
133
+ case "li":
134
+ return li(...props)
135
+ case "ul":
136
+ return ul(...props)
137
+ case "ol":
138
+ return ol(...props)
139
+ case "p":
140
+ return p(...props)
141
+ case "q":
142
+ return q(...props)
143
+ case "radio":
144
+ return radio(...props)
145
+ case "select":
146
+ return select(...props)
147
+ case "span":
148
+ return span(...props)
149
+ case "textarea":
150
+ return textarea(...props)
151
+ case "input":
152
+ return input(...props)
153
+ case "text":
154
+ return text(...props)
155
+ default:
156
+ return new Clapton.Component(...props)
157
+ }
158
+ }
159
+
160
+ export default c
@@ -0,0 +1,160 @@
1
+ import { Clapton } from "components"
2
+
3
+ const bq = (...props: any[]) => {
4
+ return new Clapton.BlockQuote(...props)
5
+ }
6
+
7
+ const box = (...props: any[]) => {
8
+ return new Clapton.Box(...props)
9
+ }
10
+
11
+ const b = (...props: any[]) => {
12
+ return new Clapton.Bold(...props)
13
+ }
14
+
15
+ const button = (...props: any[]) => {
16
+ return new Clapton.Button(...props)
17
+ }
18
+
19
+ const check = (...props: any[]) => {
20
+ return new Clapton.Checkbox(props[0], props[1], props[2])
21
+ }
22
+
23
+ const code = (...props: any[]) => {
24
+ return new Clapton.Code(...props)
25
+ }
26
+
27
+ const datetime = (...props: any[]) => {
28
+ return new Clapton.DateTimeField(props[0], props[1], props[2])
29
+ }
30
+
31
+ const el = (...props: any[]) => {
32
+ return new Clapton.Element(props[0], props[1])
33
+ }
34
+
35
+ const embed = (...props: any[]) => {
36
+ return new Clapton.Embed(props[0])
37
+ }
38
+
39
+ const em = (...props: any[]) => {
40
+ return new Clapton.Emphasis(...props)
41
+ }
42
+
43
+ const form = (...props: any[]) => {
44
+ return new Clapton.Form(...props)
45
+ }
46
+
47
+ const h = (...props: any[]) => {
48
+ return new Clapton.Heading(props[0], props[1])
49
+ }
50
+
51
+ const img = (...props: any[]) => {
52
+ return new Clapton.Image(props[0], props[1], props[2])
53
+ }
54
+
55
+ const a = (...props: any[]) => {
56
+ return new Clapton.Link(props[0], props[1])
57
+ }
58
+
59
+ const li = (...props: any[]) => {
60
+ return new Clapton.ListItem(...props)
61
+ }
62
+
63
+ const ul = (...props: any[]) => {
64
+ return new Clapton.List(...props)
65
+ }
66
+
67
+ const ol = (...props: any[]) => {
68
+ return new Clapton.OrderedList(...props)
69
+ }
70
+
71
+ const p = (...props: any[]) => {
72
+ return new Clapton.Paragraph(...props)
73
+ }
74
+
75
+ const q = (...props: any[]) => {
76
+ return new Clapton.Quote(...props)
77
+ }
78
+
79
+ const radio = (...props: any[]) => {
80
+ return new Clapton.RadioButton(props[0], props[1], props[2])
81
+ }
82
+
83
+ const select = (...props: any[]) => {
84
+ return new Clapton.Select(props[0], props[1], props[2])
85
+ }
86
+
87
+ const span = (...props: any[]) => {
88
+ return new Clapton.Span(...props)
89
+ }
90
+
91
+ const textarea = (...props: any[]) => {
92
+ return new Clapton.TextArea(props[0], props[1], props[2])
93
+ }
94
+
95
+ const input = (...props: any[]) => {
96
+ return new Clapton.TextField(props[0], props[1], props[2])
97
+ }
98
+
99
+ const text = (...props: any[]) => {
100
+ return new Clapton.Text(props[0])
101
+ }
102
+
103
+ const c = (name: string, ...props: any[]) => {
104
+ switch (name) {
105
+ case "bq":
106
+ return bq(...props)
107
+ case "box":
108
+ return box(...props)
109
+ case "b":
110
+ return b(...props)
111
+ case "button":
112
+ return button(...props)
113
+ case "check":
114
+ return check(...props)
115
+ case "code":
116
+ return code(...props)
117
+ case "datetime":
118
+ return datetime(...props)
119
+ case "el":
120
+ return el(...props)
121
+ case "embed":
122
+ return embed(...props)
123
+ case "em":
124
+ return em(...props)
125
+ case "form":
126
+ return form(...props)
127
+ case "h":
128
+ return h(...props)
129
+ case "img":
130
+ return img(...props)
131
+ case "a":
132
+ return a(...props)
133
+ case "li":
134
+ return li(...props)
135
+ case "ul":
136
+ return ul(...props)
137
+ case "ol":
138
+ return ol(...props)
139
+ case "p":
140
+ return p(...props)
141
+ case "q":
142
+ return q(...props)
143
+ case "radio":
144
+ return radio(...props)
145
+ case "select":
146
+ return select(...props)
147
+ case "span":
148
+ return span(...props)
149
+ case "textarea":
150
+ return textarea(...props)
151
+ case "input":
152
+ return input(...props)
153
+ case "text":
154
+ return text(...props)
155
+ default:
156
+ return new Clapton.Component(...props)
157
+ }
158
+ }
159
+
160
+ export { c }
@@ -45,3 +45,14 @@ document.addEventListener("DOMContentLoaded", async () => {
45
45
  const event = new Event('clapton:render');
46
46
  document.dispatchEvent(event);
47
47
  });
48
+
49
+ window.addEventListener('beforeunload', () => {
50
+ sessionStorage.setItem('scrollPosition', window.scrollY.toString());
51
+ });
52
+
53
+ document.addEventListener("clapton:render", () => {
54
+ const scrollPosition = sessionStorage.getItem('scrollPosition');
55
+ if (scrollPosition) {
56
+ window.scrollTo(0, parseInt(scrollPosition));
57
+ }
58
+ });
@@ -1,17 +1,14 @@
1
1
  import { Box } from "./box";
2
- import { Presets } from "./presets";
3
2
 
4
3
  export class Component {
5
4
  id: string;
6
5
  _state: any;
7
6
  _errors: any[];
8
- _c: Presets;
9
7
 
10
8
  constructor(state: any = {}, id: string = Math.random().toString(36).substring(2, 10), errors: any[] = []) {
11
9
  this._state = state;
12
10
  this.id = id;
13
11
  this._errors = errors;
14
- this._c = new Presets()
15
12
  }
16
13
 
17
14
  get render(): any {
@@ -5,10 +5,9 @@ module Clapton
5
5
 
6
6
  def render_component(component, params)
7
7
  js = File.read(File.join(__dir__, "..", "javascripts", "dist", "components-for-test.js"))
8
+ js += File.read(File.join(__dir__, "..", "javascripts", "dist", "c-for-test.js"))
8
9
  Dir.glob(Rails.root.join("app", "components", "**", "*.rb")).each do |file|
9
10
  code = File.read(file)
10
- code = code.gsub(/([^a-zA-Z0-9])c\.(\w+?)\(/, '\1@c.\2(')
11
- code = code.gsub(/([^a-zA-Z0-9])c\.(\w+?)(\.|$)/, '\1@c.\2()\3')
12
11
  js += Ruby2JS.convert(code, preset: true)
13
12
  js += "\n"
14
13
  end
@@ -1,4 +1,3 @@
1
1
  module Clapton
2
- VERSION = '0.0.19'
2
+ VERSION = '0.0.21'
3
3
  end
4
-
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: clapton
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.19
4
+ version: 0.0.21
5
5
  platform: ruby
6
6
  authors:
7
7
  - Moeki Kawakami
@@ -130,6 +130,10 @@ files:
130
130
  - config/routes.rb
131
131
  - lib/clapton.rb
132
132
  - lib/clapton/engine.rb
133
+ - lib/clapton/javascripts/dist/c
134
+ - lib/clapton/javascripts/dist/c-base.js
135
+ - lib/clapton/javascripts/dist/c-for-test.js
136
+ - lib/clapton/javascripts/dist/c.js
133
137
  - lib/clapton/javascripts/dist/client.js
134
138
  - lib/clapton/javascripts/dist/components-for-test.js
135
139
  - lib/clapton/javascripts/dist/components.js
@@ -6702,6 +6706,8 @@ files:
6702
6706
  - lib/clapton/javascripts/src/actions/handle-action.spec.ts
6703
6707
  - lib/clapton/javascripts/src/actions/handle-action.ts
6704
6708
  - lib/clapton/javascripts/src/actions/initialize-actions.ts
6709
+ - lib/clapton/javascripts/src/c-for-test.ts
6710
+ - lib/clapton/javascripts/src/c.ts
6705
6711
  - lib/clapton/javascripts/src/channel/clapton-channel.js
6706
6712
  - lib/clapton/javascripts/src/client.ts
6707
6713
  - lib/clapton/javascripts/src/components-for-test.ts
@@ -6743,7 +6749,6 @@ files:
6743
6749
  - lib/clapton/javascripts/src/components/ordered-list.ts
6744
6750
  - lib/clapton/javascripts/src/components/paragraph.spec.ts
6745
6751
  - lib/clapton/javascripts/src/components/paragraph.ts
6746
- - lib/clapton/javascripts/src/components/presets.ts
6747
6752
  - lib/clapton/javascripts/src/components/quote.spec.ts
6748
6753
  - lib/clapton/javascripts/src/components/quote.ts
6749
6754
  - lib/clapton/javascripts/src/components/radio-button.spec.ts