thanks, I have browsed through this repo but I could not find anything that look like an example of updating a file, maybe it’s there but I don’t see find it, not though search not through browsing. We can see some references to the main API but nothing I can see that is a clear cut example of : here is the change we are applying to a file.
I am attaching at the end the specs of the specific API I am referencing.
The things which are not clear when trying to update a text component are:
- the actual text of the text shape seems to show up in multiple places, both in the
positionData
and in the content
of the text shape. So not clear which need to be changed, or if one if enough.
- The api itself for
update-file
is pretty rich in options but examples for these options or even basic explanation are seemingly left as an exercise for the reader.
So I was wondering if maybe there is some basic code example of calls to this api, or someone who’s using this regulary as part of the dev of penpot could bring some light on how to use this (I mean someone wrote this at some point so I am sure someone probably know how it is supposed to work).
// DOCSTRING:
// Added: on v1.17
// URI: https://design.penpot.app/api/rpc/command/update-file
// PARAMS:
type UpdateFile {
id: uuid,
sessionId: uuid,
revn: int[min=0],
vern: int[min=0],
features?: set,
changes?: [multi Change [dispatch=type] {
SetOptionChange {
},
{
commentThreadId: Uuid,
pageId: Uuid,
frameId: Uuid nullable,
position: Point nullable
},
AddObjChange {
type: == 'add-obj',
id: Uuid,
obj: <untitled>,
pageId?: Uuid,
componentId?: Uuid,
frameId: Uuid,
parentId?: Uuid nullable,
index?: integer nullable,
ignoreTouched?: boolean
},
ModObjChange {
type: == 'mod-obj',
id: Uuid,
pageId?: Uuid,
componentId?: Uuid,
operations: [Operation]
},
DelObjChange {
type: == 'del-obj',
id: Uuid,
pageId?: Uuid,
componentId?: Uuid,
ignoreTouched?: boolean
},
SetGuideChange {
type: == 'set-guide',
pageId: Uuid,
id: Uuid,
params: Guide nullable
},
SetFlowChange {
type: == 'set-flow',
pageId: Uuid,
id: Uuid,
params: Flow nullable
},
multi [dispatch=grid-type] {
<untitled>,
<untitled>,
<untitled>
},
FixObjChange {
type: == 'fix-obj',
id: Uuid,
fix?: keyword,
pageId?: Uuid,
componentId?: Uuid
},
MovObjectsChange {
type: == 'mov-objects',
pageId?: Uuid,
componentId?: Uuid,
ignoreTouched?: boolean,
parentId: Uuid,
shapes: anything,
index?: integer nullable,
afterShape?: anything,
componentSwap?: boolean
},
ReorderChildrenChange {
type: == 'reorder-children',
pageId?: Uuid,
componentId?: Uuid,
ignoreTouched?: boolean,
parentId: Uuid,
shapes: anything
},
AddPageChange {
type: == 'add-page',
id?: Uuid,
name?: string,
page?: anything
},
ModPageChange {
type: == 'mod-page',
id: Uuid,
background?: RgbColor nullable,
name?: string
},
SetPagePluginData, and *,
DelPageChange {
type: == 'del-page',
id: Uuid
},
MovPageChange {
type: == 'mov-page',
id: Uuid,
index: integer
},
RegObjectsChange {
type: == 'reg-objects',
pageId?: Uuid,
componentId?: Uuid,
shapes: [Uuid]
},
AddColorChange {
type: == 'add-color',
color: Color
},
ModColorChange {
type: == 'mod-color',
color: Color
},
DelColorChange {
type: == 'del-color',
id: Uuid
},
AddRecentColorChange {
},
AddMediaChange {
type: == 'add-media',
object: FileMediaObject
},
ModMediaChange {
type: == 'mod-media',
object: FileMediaObject
},
DelMediaChange {
type: == 'del-media',
id: Uuid
},
AddComponentChange {
type: == 'add-component',
id: Uuid,
name: string,
shapes?: [anything],
path?: string
},
ModCompoenentChange {
type: == 'mod-component',
id: Uuid,
shapes?: [anything],
name?: string
},
DelComponentChange {
type: == 'del-component',
id: Uuid,
mainInstance?: anything,
skipUndelete?: boolean
},
RestoreComponentChange {
type: == 'restore-component',
id: Uuid,
pageId: Uuid
},
PurgeComponentChange {
type: == 'purge-component',
id: Uuid
},
AddTypogrphyChange {
type: == 'add-typography',
typography: Typography
},
ModTypogrphyChange {
type: == 'mod-typography',
typography: Typography
},
DelTypogrphyChange {
type: == 'del-typography',
id: Uuid
},
AddTemporaryTokenThemeChange {
type: == 'add-temporary-token-theme',
tokenTheme: TokenTheme
},
UpdateActiveTokenThemes {
type: == 'update-active-token-themes',
themeIds: set[string]
},
DeleteTemporaryTokenThemeChange {
type: == 'delete-temporary-token-theme',
id: Uuid,
name: string
},
AddTokenThemeChange {
type: == 'add-token-theme',
tokenTheme: TokenTheme
},
ModTokenThemeChange {
type: == 'mod-token-theme',
group: string,
name: string,
tokenTheme: TokenTheme
},
DelTokenThemeChange {
type: == 'del-token-theme',
group: string,
name: string
},
AddTokenSetChange {
type: == 'add-token-set',
tokenSet: TokenSet
},
AddTokenSetsChange {
type: == 'add-token-sets',
tokenSets: sequence of TokenSet
},
RenameTokenSetGroup {
type: == 'rename-token-set-group',
setGroupPath: [string],
setGroupFname: string
},
ModTokenSetChange {
type: == 'mod-token-set',
name: string,
tokenSet: TokenSet
},
MoveTokenSetBefore {
type: == 'move-token-set-before',
fromPath: [string],
toPath: [string],
beforePath: [string] nullable,
beforeGroup: boolean nullable
},
MoveTokenSetGroupBefore {
type: == 'move-token-set-group-before',
fromPath: [string],
toPath: [string],
beforePath: [string] nullable,
beforeGroup: boolean nullable
},
DelTokenSetChange {
type: == 'del-token-set',
name: string
},
DelTokenSetPathChange {
type: == 'del-token-set-path',
path: string
},
SetTokensLib {
type: == 'set-tokens-lib',
tokensLib: anything
},
AddTokenChange {
type: == 'add-token',
setName: string,
token: Token
},
ModTokenChange {
type: == 'mod-token',
setName: string,
name: string,
token: Token
},
DelTokenChange {
type: == 'del-token',
setName: string,
name: string
}
}],
changesWithMetadata?: [{
changes: [Change],
hintOrigin?: keyword,
hintEvents?: [string with length >= 250]
}],
skipValidate?: boolean
}
FileMediaObject {
id: Uuid,
createdAt: Inst,
deletedAt?: Inst,
name: string,
width: SafeInt,
height: SafeInt,
mtype: string,
fileId?: Uuid,
mediaId: Uuid,
thumbnailId?: Uuid,
isLocal: boolean
}
Typography {
id: Uuid,
name: string,
fontId: string,
fontFamily: string,
fontVariantId: string,
fontSize: string,
fontWeight: string,
fontStyle: string,
lineHeight: string,
letterSpacing: string,
textTransform: string,
modifiedAt?: Inst,
path?: string nullable,
pluginData?: PluginData
}
TokenTheme {
name: string,
group: string,
description: string nullable,
isSource: boolean,
modifiedAt?: Inst,
sets: anything
}
TokenSet {
name: string,
description?: string nullable,
modifiedAt?: Inst,
tokens: anything
}
Token {
name: string, and regex pattern matching #"^(?!\$)([a-zA-Z0-9-$]+\.?)*(?<!\.)$",
type: OneOf[sizing,rotation,color,numeric,other,string,dimensions,stroke-width,opacity,border-radius,boolean,spacing],
value: anything,
description?: string nullable,
modifiedAt?: Inst
}
// RESPONSE:
[{
changes: [multi Change [dispatch=type] {
SetOptionChange,
<untitled>,
AddObjChange,
ModObjChange,
DelObjChange,
SetGuideChange,
SetFlowChange,
,
FixObjChange,
MovObjectsChange,
ReorderChildrenChange,
AddPageChange,
ModPageChange,
SetPagePluginData, and *,
DelPageChange,
MovPageChange,
RegObjectsChange,
AddColorChange,
ModColorChange,
DelColorChange,
AddRecentColorChange,
AddMediaChange,
ModMediaChange,
DelMediaChange,
AddComponentChange,
ModCompoenentChange,
DelComponentChange,
RestoreComponentChange,
PurgeComponentChange,
AddTypogrphyChange,
ModTypogrphyChange,
DelTypogrphyChange,
AddTemporaryTokenThemeChange,
UpdateActiveTokenThemes,
DeleteTemporaryTokenThemeChange,
AddTokenThemeChange,
ModTokenThemeChange,
DelTokenThemeChange,
AddTokenSetChange,
AddTokenSetsChange,
RenameTokenSetGroup,
ModTokenSetChange,
MoveTokenSetBefore,
MoveTokenSetGroupBefore,
DelTokenSetChange,
DelTokenSetPathChange,
SetTokensLib,
AddTokenChange,
ModTokenChange,
DelTokenChange
}],
fileId: uuid,
id: uuid,
revn: int[min=0],
sessionId: uuid
}]