add style attributes

This commit is contained in:
Dmitriy Pleshevskiy 2022-12-09 11:24:48 +03:00
parent f279551465
commit 781eb62b37
Signed by: pleshevskiy
GPG key ID: 1B59187B161C0215
5 changed files with 338 additions and 61 deletions

View file

@ -111,12 +111,15 @@ module.exports = grammar({
seq(
$.shape_key,
optional(
choice(
seq($._dot, alias($._style_attribute, $.attribute)),
seq(
optional(seq($._colon, optional($.label))),
optional(seq(alias($._new_shape_block, $.block)))
)
)
)
)
),
shape_key: ($) => choice($.string, seq($._identifier, optional($._dash))),
@ -132,10 +135,7 @@ module.exports = grammar({
// attributes
_new_root_attribute: ($) =>
prec(
PREC.ATTRIBUTE,
seq(alias($._root_attr_key, $.attr_key), $._colon, $.attr_value)
),
seq(alias($._root_attr_key, $.attr_key), $._colon, $.attr_value),
_root_attr_key: ($) =>
choice(
@ -147,6 +147,7 @@ module.exports = grammar({
"label",
"constraint",
"icon",
"style",
$._common_style_attr_key,
$._text_attr_key
),
@ -169,6 +170,36 @@ module.exports = grammar({
)
),
_style_attribute: ($) =>
prec(
PREC.ATTRIBUTE,
seq(
alias("style", $.attr_key),
choice(
seq($._dot, alias($._inner_style_attribute, $.attribute)),
seq($._colon, alias($._style_attribute_block, $.block))
)
)
),
_style_attribute_block: ($) =>
seq(
"{",
repeat(
choice(
$._eol,
seq(alias($._inner_style_attribute, $.attribute), $._end)
)
),
"}"
),
_inner_style_attribute: ($) =>
prec(
PREC.ATTRIBUTE,
seq(alias($._style_attr_key, $.attr_key), $._colon, $.attr_value)
),
_style_attr_key: ($) => choice($._common_style_attr_key, "3d"),
_common_style_attr_key: ($) =>

View file

@ -315,6 +315,27 @@
{
"type": "CHOICE",
"members": [
{
"type": "CHOICE",
"members": [
{
"type": "SEQ",
"members": [
{
"type": "SYMBOL",
"name": "_dot"
},
{
"type": "ALIAS",
"content": {
"type": "SYMBOL",
"name": "_style_attribute"
},
"named": true,
"value": "attribute"
}
]
},
{
"type": "SEQ",
"members": [
@ -370,6 +391,8 @@
]
}
]
}
]
},
{
"type": "BLANK"
@ -458,9 +481,6 @@
}
},
"_new_root_attribute": {
"type": "PREC",
"value": 0,
"content": {
"type": "SEQ",
"members": [
{
@ -481,7 +501,6 @@
"name": "attr_value"
}
]
}
},
"_root_attr_key": {
"type": "CHOICE",
@ -511,6 +530,10 @@
"type": "STRING",
"value": "icon"
},
{
"type": "STRING",
"value": "style"
},
{
"type": "SYMBOL",
"name": "_common_style_attr_key"
@ -559,6 +582,134 @@
]
}
},
"_style_attribute": {
"type": "PREC",
"value": 0,
"content": {
"type": "SEQ",
"members": [
{
"type": "ALIAS",
"content": {
"type": "STRING",
"value": "style"
},
"named": true,
"value": "attr_key"
},
{
"type": "CHOICE",
"members": [
{
"type": "SEQ",
"members": [
{
"type": "SYMBOL",
"name": "_dot"
},
{
"type": "ALIAS",
"content": {
"type": "SYMBOL",
"name": "_inner_style_attribute"
},
"named": true,
"value": "attribute"
}
]
},
{
"type": "SEQ",
"members": [
{
"type": "SYMBOL",
"name": "_colon"
},
{
"type": "ALIAS",
"content": {
"type": "SYMBOL",
"name": "_style_attribute_block"
},
"named": true,
"value": "block"
}
]
}
]
}
]
}
},
"_style_attribute_block": {
"type": "SEQ",
"members": [
{
"type": "STRING",
"value": "{"
},
{
"type": "REPEAT",
"content": {
"type": "CHOICE",
"members": [
{
"type": "SYMBOL",
"name": "_eol"
},
{
"type": "SEQ",
"members": [
{
"type": "ALIAS",
"content": {
"type": "SYMBOL",
"name": "_inner_style_attribute"
},
"named": true,
"value": "attribute"
},
{
"type": "SYMBOL",
"name": "_end"
}
]
}
]
}
},
{
"type": "STRING",
"value": "}"
}
]
},
"_inner_style_attribute": {
"type": "PREC",
"value": 0,
"content": {
"type": "SEQ",
"members": [
{
"type": "ALIAS",
"content": {
"type": "SYMBOL",
"name": "_style_attr_key"
},
"named": true,
"value": "attr_key"
},
{
"type": "SYMBOL",
"name": "_colon"
},
{
"type": "SYMBOL",
"name": "attr_value"
}
]
}
},
"_style_attr_key": {
"type": "CHOICE",
"members": [

View file

@ -44,6 +44,18 @@
{
"type": "attr_value",
"named": true
},
{
"type": "attribute",
"named": true
},
{
"type": "block",
"named": true
},
{
"type": "dot",
"named": true
}
]
}
@ -56,6 +68,10 @@
"multiple": true,
"required": false,
"types": [
{
"type": "attribute",
"named": true
},
{
"type": "connection",
"named": true
@ -180,10 +196,18 @@
"multiple": true,
"required": true,
"types": [
{
"type": "attribute",
"named": true
},
{
"type": "block",
"named": true
},
{
"type": "dot",
"named": true
},
{
"type": "label",
"named": true

Binary file not shown.

View file

@ -43,3 +43,74 @@ near: abc
(attribute (attr_key (reserved)) (attr_value))
)
================================================================================
Style attribute
================================================================================
foo.style.opacity: 5
foo.style.fill: red
foo.style.stroke: red
foo.style.stroke-width: 5
foo.style.stroke-dash: 4
foo.style.border-radius: 1
foo.style.font-color: red
foo.style.shadow: true
foo.style.multiple: true
foo.style.animated: true
foo.style.link: https://to
--------------------------------------------------------------------------------
(source_file
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
(shape (shape_key) (dot) (attribute (attr_key) (dot) (attribute (attr_key) (attr_value))))
)
================================================================================
Block style attributes
================================================================================
foo.style: {
opacity: 5
fill: red
stroke: red
stroke-width: 5
stroke-dash: 4
border-radius: 1
font-color: red
shadow: true
multiple: true
animated: true
link: https://to
}
--------------------------------------------------------------------------------
(source_file
(shape
(shape_key) (dot)
(attribute
(attr_key)
(block
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
(attribute (attr_key) (attr_value))
)
)
)
)