Commitee8eb53

committed

fix: compactCss on inline styles

1 parent061bb93 commitee8eb53Copy full SHA for ee8eb53

File tree

+19

-7

lines changed

+19

-7

lines changed

Lines changed: 0 additions & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -4,7 +4,6 @@`
`4`	`4`	`declaration for the same prop (unless atomic has important, unless style has`
`5`	`5`	`important)`
`6`	`6`
`7`		`-- compactCss inline style`
`8`	`7`	`- on selector click, show a new panel with the selector and the matching`
`9`	`8`	`elements -> allow editing the selector from there, allow adding styles in that`
`10`	`9`	`selector`

Lines changed: 5 additions & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -26,7 +26,7 @@ interface DeclarationProps`
`26`	`26`	`matchValue:string;`
`27`	`27`	`rule:MatchedStyleRule;`
`28`	`28`	`inspected:InspectResult;`
`29`		`-disabled?:boolean;`
	`29`	`+hasLineThrough?:boolean;`
`30`	`30`	`}`
`31`	`31`
`32`	`32`	`exportconstcheckboxStyles=css.raw({`
`@@ -47,7 +47,7 @@ export const Declaration = (props: DeclarationProps) => {`
`47`	`47`	`inspected,`
`48`	`48`	`override,`
`49`	`49`	`setOverride,`
`50`		`-disabled,`
	`50`	`+hasLineThrough,`
`51`	`51`	`isRemovable,`
`52`	`52`	`refresh,`
`53`	`53`	`}=props;`
`@@ -86,7 +86,9 @@ export const Declaration = (props: DeclarationProps) => {`
`86`	`86`	`mr="2"`
`87`	`87`	`// var(--sys-color-state-hover-on-subtle)`
`88`	`88`	`_hover={{backgroundColor:"rgba(253, 252, 251, 0.1)"}}`
`89`		`-textDecoration={enabled&&!disabled ?"none" :"line-through !important"}`
	`89`	`+textDecoration={`
	`90`	`+!enabled\|\|hasLineThrough ?"line-through !important" :"none"`
	`91`	`+}`
`90`	`92`	`data-declaration={index}`
`91`	`93`	`>`
`92`	`94`	`<input`

Lines changed: 14 additions & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -15,7 +15,9 @@ import { symbols } from "./lib/symbols";`
`15`	`15`	`import{OverrideMap}from"./devtools-types";`
`16`	`16`	`import{Declaration}from"./declaration";`
`17`	`17`	`import{useDevtoolsContext}from"./devtools-context";`
`18`		`-import{dashCase}from"@pandacss/shared";`
	`18`	`+import{camelCaseProperty,dashCase}from"@pandacss/shared";`
	`19`	`+import{compactCSS}from"./lib/compact-css";`
	`20`	`+import{pick}from"./lib/pick";`
`19`	`21`
`20`	`22`	`interfaceInsertInlineRowProps{`
`21`	`23`	`inspected:InspectResult;`
`@@ -300,7 +302,14 @@ export const InsertInlineRow = (props: InsertInlineRowProps) => {`
`300`	`302`	`</Flex>`
`301`	`303`	`);`
`302`	`304`
`303`		`-constapplied=Object.fromEntries(inspected.styleEntries);`
	`305`	`+conststyles=Object.fromEntries(`
	`306`	`+inspected.styleEntries.map(([prop,value])=>[`
	`307`	`+camelCaseProperty(prop),`
	`308`	`+value,`
	`309`	`+])`
	`310`	`+);`
	`311`	`+constkeys=compactCSS(styles);`
	`312`	`+constapplied=pick(styles,keys.pick);`
`304`	`313`
`305`	`314`	`return(`
`306`	`315`	`<Flex`
`@@ -354,7 +363,9 @@ export const InsertInlineRow = (props: InsertInlineRowProps) => {`
`354`	`363`	`source:symbols.inlineStyleSelector,`
`355`	`364`	`},`
`356`	`365`	`inspected,`
`357`		`-disabled:applied[prop]!==value\|\|isAppliedLater,`
	`366`	`+hasLineThrough:`
	`367`	`+applied[camelCaseProperty(prop)]!==value\|\|`
	`368`	`+isAppliedLater,`
`358`	`369`	`isRemovable:true,`
`359`	`370`	`refresh:refresh,`
`360`	`371`	`override:overrides?.[key]??null,`

Comments

(0)