Comments (1)
Work plan
Strict class dot prefix
- Any point in the new syntax that takes a class reference will not fallback to the class name with no dot prefix, making reference to both class-selector and type-selector ambiguous.
V0 - #2386
V1
Base styling
- allow declarations and nested rules within
@st
body - transform away any build-time statement syntax keeping the inline declarations
- disallow nested
@st
within@media
and other nested at-rules - lsp: check for native declarations and nested rules
Ambient root
- default import from a stylesheet with
@st
is handled:- import the root class if exist
- import an new
ambient-root
symbol that cannot be used alone in a selector, but can be used as a record-like-selector to access the top level@st .class
selectors (transforms away)
Pseudo-Element inheritance
syntax: @st ::part(Base) => mapped-selector
- register pseudo-element extended reference to
part-symbol[-st-extends]
- error on extends issues
- transform inherited selector (check case for selector intersection between extends and inferred mapped selector)
- lsp:
- suggest extends syntax
(&0)
completion - suggest available references in extends parenthesis
- suggest extends syntax
Syntactical Sugar pseudo-element to class
- decide on the syntax and implement...
V2
Private statements
- filter out from named imports any class that is not defined with
@st
- use
@st-hide ::part
to override inherited API and block it- transformation error
- lsp: should not suggest part
- use top level
@st-hide .class
to prevent it from being named export (maybe@st-private
?) - figure out other symbols private/public modifiers (keyframes, layers, build-vars, custom-properties)
Explicit override statements
- use
@st-override
to explicitly override an extended selector API - add reference override API in the normal
@st
override error
Multiple extends
- allow setting multiple references in extend
V3
Set selector context
- new selector API to get an internal selector
:st-ctx(A::B)::C
=>.c
Top level @st
for non-class
@st type-selector
- support native and custom elements definition@st Interface
- support interface definition
More semantic definitions
@st-theme
@st-variant
from stylable.
Related Issues (20)
- proposal: State declarations HOT 1
- @stylable/jest has no peer dependencies and is broken with jest 28
- proposal: explicit custom-pseudo-element definition HOT 4
- `st-global` utility is not removed from valid @property definitions during transformation
- Imports with side effect HOT 1
- Add runtime validation to the options of our integrations HOT 2
- next.js with disabled JS not working HOT 3
- Unify analyze and transform hooks flow
- Stylesheet does not get applied when using Next.js 13 HOT 1
- Imported custom property false positive analysis
- CSS LSP emits false diagnostics for custom property global syntax
- build stylable without filesystem HOT 4
- question: how to get final css HOT 3
- Cyclic error combines mixin path and var paths
- -st-* declarations on imported class
- stylable build error with storybook 7 HOT 4
- Build errors when running create-stylable-app HOT 1
- Improve runtime injectCSS
- overide css vars in extended class HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from stylable.